Skip to main content

Modify JavaScript behavior

This section explains how to configure various JavaScript options for the Bravura Security Fabric user interface.

Default JavaScript options are described in the config.js file in the \<instance>\design\src\js\ directory. Do not edit this file, as it is overridden during upgrades.

To modify which scripts are enabled for all skins, copy the config.js file from \<instance>\design\src\js\ into \<instance>\design\custom\js\ and modify accordingly. Note that when the custom config.js is present, it is used instead of \<instance>\design\src\js\config.js. Script modifications are not inherited as they are with m4 customizations.

To modify which scripts are enabled for a specific skin, copy the config.js file from \<instance>\design\src\js\ into \<instance>\design\custom\<skin>\js\. Note that if this skin-specific config.js exists, it completely overrides both the installed defaults in \<instance>\design\src\js\ and those in the \<instance>\design\custom\js\.

Once you have made changes, generate and install the skins . This compiles all of the Bravura Security Fabric JavaScript into the scripts.js file in wwwdocs\<skin>\js\.

The scripts.js file is minimized; that is, stripped of all of its comments and extra white space. The scripts.js file is not considered human readable. When debugging JavaScript in a test environment, use the debug flag to prevent minimization. Never use debug skins in a production environment. Building in debug enables some JavaScript debugging console messages and errors, that may show as browser errors. These messages and errors can confuse users, and interfere with the smooth operation of the product.

When defining an arbitrary custom JavaScript file, that is, one without an equivalent JavaScript file in \<instance>\design\src\js\, add it to the \<instance>\design\custom\js\ or \<instance>\design\custom\<skin>\js\ directory. The make.bat batch file will include this file in the scripts.js file and minimize it.

If you do not want the custom JavaScript file to be combined with scripts.js, place the custom file in \<instance>\design\custom\js\copy-only\. The make.bat batch file will copy this file to wwwdocs\default\js as its own file, and it will not be combined with the scripts.js file.

In order to use a custom JavaScript file (for example custom.js) you need to reference it in index.html (\design\src\ui\src\index.html).

Add:

<script type="text/javascript" data-src="docs/default/js/custom.js"></script> before: <!-- End Script -->

and then rebuild the skins.

Note

The browser limits the number of connections to the server. The more files a page has to download, the longer it can take to load the page. It is generally better to include custom JavaScript files in scripts.js. However, if the custom JavaScript file is of a substantial size, for example, over 250K, and only used on a few pages, it may be more desirable to keep that file separate from scripts.js.

The following JavaScript options are enabled by default:

Option

Description

Config.AutoGrowField

Automatically increase the size of text areas while typing, to fit content. The default setting is true.

Config.AutoRemoveQuestions

Remove already-used questions from remaining drop down boxes in security questions. The default setting is true.

Config.AutoCompletePslang

Display auto-complete help when editing PSLang fields. When the page loads, the initiallyOff setting turns off auto completion by default, while allowing it to be turned on by the user. The default setting for Config.AutoCompletePslang is true; for initiallyOff the default is false.

Config.CheckAll

Add a checkbox to the header cell of some tables to check/un-check all. The default setting is true.

Config.CheckPasswordRules

Displays live password validation as a password is typed. The default setting is true.

Config.ConfirmSelection

Display confirmation dialog when preforming certain actions like delete. The default setting is true.

Config.FocusField

Bring user focus to the primary text input when the page loads. The default setting is true.

Config.PopupCalendar

Display a pop-up calendar when date fields are focused. The default setting is true.

Config.PopupNote

Display additional information when hovering over info icons. The default setting is true.

Config.RelativeDates

Display dates in the Front-end (psf) and in the applications, using relative timestamps. For example, the date you last logged in will display as 3 days ago. Hovering over the text reveals the real date as a tool tip. Any element with a "date-date" attribute set to a valid date will be replaced by the relative date, with additional tool tip. The default is setting is true. When set to false, the actual date and time is shown.

Config.ReplaceImagesWithHiRes

If a Hi-Res display is detected, replace images with hi-res equivalents. The default setting is true.

Config.ResizeText

Add resize text controls to the page footer. The default setting is false.

Config.ScrollToElement

Scroll down to an object when the page loads (certain pages only). The default setting is true.

Config.SearchActions

Enables the search actions box in the page header. The default setting is true; the shortcut is [’f’].

Config.SearchTable

Defines the keyboard shortcut to focus the search actions field. The default is [s].

Config.Selectlist

Enables the Chosen jQuery plugin for:

  • multi-selects with more than X options (default 0)

  • single-selects with more than X options (default 0)

When either is enabled, the <select> list elements (dropdown lists) will be native and fully accessible if fewer than the configured number of items are present in the list. Otherwise, it will still use the Chosen jQuery plugin, which enhances them with a search.

Config.SortTable

Expand the clickable region on sortable tables from an icon to the whole header cell. The default setting is true.

Config.UseSuggestedPassword

Populate password fields with a suggested password when selected. The default setting is false.

Config.ZoomImage

Zoom profile image thumbnails to fill more of screen during mouse over. The default setting is true.