NJDesktop update 0.8

NJDesktop 0.8 is available!

This new version adds theme support to NJDesktop, together with some cosmetic changes.

NJDesktop comes now with two themes preinstalled:

  • Redmond (the original Aero-like theme);
  • BWSLight (A sleek and all-light colored theme).

You can use the Themes widget on the demo page to see the difference between the themes. Or just use the links above.

New themes will be added later.

You will be able to create new themes based on the existing themes.

The themes will have to be preloaded (theme changing on the fly is not supported).

Other updates

  • The original theme has been tweaked a little bit, to have better looking forms and menu.
  • The active window got a new class (activeWindow), which can be used to distinguish between active and inactive windows.
    • This can be seen as inactive windows being alpha-blended.

How to create a theme?

Copy one of the existing themes into a new, empty directory. The name of the new directory will be the name of your newly created theme.

Edit style.css to change the look and feel of your windows, toolbars, taskbar, menus, and dialog buttons.

Edit jdesktop.forms.css to change the look and feel of common form elements.

Edit jdesktop.text.css to add your typography.

Edit theme.js to match the values inside with the values from your css files (taskbar height, top menu height, window padding and other settings). If you make changes here, make sure, you have these values set in the CSS file as well (the style.css file will contain comments where you can find the related setting).

If you wish to use jQuery UI widgets in your forms, create a custom UI theme for them on the JQuery UI ThemeRoller page.

I don’t wish to use some of the things from nJDesktop dependencies!

Some of NJDesktop dependencies can be decoupled:

  • Most of the JQuery UI library. The only things you need from jQuery UI are the UI Core and Interaction parts (in this case, you will lose support for some advanced form widgets).
    • Get a custom download from jQuery UI site, where you only select the UI core and Interactions sections
    • In this case, you don’t need to load the jQuery UI structure and jQuery UI theme css files either
  • jdesktop.forms.css: form elements – If you have your own form library, don’t load the form element css file from the theme.
  • jdesktop.text.css: typography – If you have your own typography css, don’t load this file from the theme

3 thoughts on “NJDesktop update 0.8

  1. Great job. But I want to load a different page within njdesktop, by example slickgrid. It seems njdesktop uses the same HTML headers for all the pages. The intended app is http://www.libresoft.ec/e/
    Thanks for your help. I wish to continue using njdesktop but I can’t launch distinct pages with distinct contents each one

    • Hi Ricardo,

      Sorry for my late response, but your message has been catched by the spam filter.

      You can use iframes in the windows to load different pages.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.