A skin is a collection of definitions, that together define the appearance of the user interface. See http://en.wikipedia.org/wiki/Skin_(computing)

There is (currently?) no user interface for creating / editing skins in the TOPICA application. Therefore, the user interface is not freely customizable by the End user. A Configurator may build a handful of skins (by editing CSS and XML files on the server). The End user may only select from the skins built in this way.

The most important part of a skin is the style sheet(s) - i.e. standard CSS-files. But a skin in TOPICA contains a lot of parameters beside the CSS.

The reasons for having a "skin" concept on top of CSS are:

• The ability to give each skin a name, so that users may select skins at run time.

• Not everything in a web user interface may be specified in CSS. For example: width and height of frames in frame sets, frame borders, various settting for 3rd party controls (e.g. skins to use in Telerik controls), etc.

• Most elements in the user interface may be hidden using CSS. But hiding GUI elements using CSS has the consequence, that the framework could spend time (including unnecessary database lookups) to render a lot of HTML, that is not displayed for the end user. It is more efficient to turn some elements in the user interface off using skin-parameters - in this way the framework does not waste time rendering invisible HTML.

• In a few places, the TOPICA framework makes it possible to rearrange elements in the user interface in ways that cannot be done using CSS. For example, the framework supports 2 rather different ways to organize the user interface for organization administration (e.g. how frames are organized in a frameset). This option is controlled by a skin parameter: OrgUnit/SubFrameset/Enabled.

A skin is defined by a folder with a fixed structure - refer to the sample skins delivered as part of the TOPICA framework.

<skin folder>
    Icons
    Print.css
    Screen.css
    SkinDefinition.xml

The name of the folder is displayed in the dropwdowns, that the End user may select from at run time.

The "Icons" folder contain any icons/images used by the stylesheets.

Despite the file name, the Screen.css style sheet is used BOTH on the screen and on print.

The file Print.css is used ONLY on print. Therfore it should ONLY contain definition of styles that should be DIFFERENT on print compared to on screen. It should therefore be used to hide some elements on print, display some other elements on print that are hidden on screen, introduce page breaks, etc.

The file SkinDefinition.xml contains all the parameters, that cannot be controlled by CSS, organized hierarchically.

The TOPICA framework comes with a few built-in skins. In version 4.22, the built in skins are named Black, Default, Empty, Sunshine.

Tip
The skin named "Default" that comes with the framework defines all possible values. So consult the file Skins/Default/SkinDefinition.xml in the framework (web home) folder to get an overview of what may be configured using skins. Note that the file Skins/Default/SkinDefinition.xml contains a lot of comments - the function of each parameter and each option is described in these comments.

The other skins in the framework are only used to test overriding of some of the configuration options - but they are not complete.

E.g. each skin parameter will be specified in the Default skin - but not necessarily in the other skins.

For parameters that are NOT defiend in the currently selected skin, the TOPICA framework uses default values (typically defined in .config files),

Each configuration may contain a number of skins.

To create a new skin in a specific configuration:

• copy an entire skin folder (from the framework, or from some other configuration)

• place the copied folder in the configuration's Skins-folder

• modify the files in the copied folder

• refresh the browser window running the configuration (application)

The end user may select skins.

The system "remembers" skin setting on 2 levels:

• Organizationel unit.

• Employee user.

Per default, the user may select from 2 dropdowns displyed in the main menu:

• The upper dropdown specifies the skin selected for the current employee user.

• The lower dropdown specifies the skin selected for the current employee user's employer (an organizational unit).

  Note
  This dropdown is only visible, when the user har user administration permission!

The skin selected per user takes precedence over the skin specified on the employer (an organizational unit).

Per default, the contents of both dropdowns consist of the framework's skins plus the configuration's skins. It is possible to configure that only the configurations' skins are displayed in the list. This a skin parameter: Skins/Framework.

The selected skins are remembered in the database - and will therefore be in effect on subsequent logins (until explicitly changed).