Chapter 4. OpenIDM User Interface

Table of Contents
4.1. Overview of the Default User Interface
4.2. Configuring the Default User Interface
4.3. Managing User Accounts With the User Interface
4.4. Managing Workflows From the User Interface
4.5. Changing the UI Theme
4.6. Using an External System for Password Reset
4.7. Providing a Logout URL to External Applications
4.8. Changing the UI Path
4.9. Disabling the UI

OpenIDM provides a customizable, browser-based user interface. The default user interface enables administrative users to create, modify and delete user accounts. It provides role-based access to tasks based on BPMN2 workflows, and allows users to manage certain aspects of their own accounts, including configurable self-service registration.

4.1. Overview of the Default User Interface

The default user interface is provided as a reference implementation that demonstrates the capabilities of the REST API. You can modify certain aspects of the default user interface according to the requirements of your deployment. Note, however, that the default user interface is still evolving and is not guaranteed to be compatible with the next OpenIDM release.

To access the user interface, install and start OpenIDM, then point your browser to http://localhost:8080/openidmui.

Log in as the default administrative user (Login: openidm-admin, Password: openidm-admin) or as an existing user in the repository. The display differs, depending on the role of the user that has logged in.

For an administrative user (role openidm-admin), two tabs are displayed - Dashboard and Users. The Dashboard tab lists any tasks assigned to the user, processes available to be invoked, and any notifications for that user. The Users tab provides an interface to manage user entries (OpenIDM managed objects under managed/user).

OpenIDM UI Administrator View

The Profile link enables the user to modify elements of his user data. The Change Security Data link enables the user to change his password and, optionally, to select a new security question.

For a regular user (role openidm-authorized), the Users tab is not displayed - so regular users cannot manage user accounts, except for certain aspects of their own accounts.

4.2. Configuring the Default User Interface

The following sections outline the configurable aspects of the default user interface.

4.2.1. Enabling Self-Registration

Self-registration (the ability for new users to create their own accounts) is disabled by default. To enable self-registration, set "selfRegistration" to true in the conf/ui-configuration.json file.

{
    "configuration" : {
        "selfRegistration" : true,
...    
    

With "selfRegistration" : true, the following capabilities are provided on the right-hand pane of the user interface:

Register my account
Reset my password

User objects created using self-registration automatically have the role openidm-authorized.

4.2.2. Configuring Security Questions

Security questions are disabled by default. To guard against unauthorized access, you can specify that users be prompted with security questions if they request a password reset. A default set of questions is provided, but you can add to these, or overwrite them. To enable security questions, set "securityQuestions" to true in the conf/ui-configuration.json file.

{
    "configuration" : {
        "securityQuestions" : true,
...    
    

Specify the list of questions to be asked in the conf/ui-secquestions.json file.

Refresh your browser after this configuration change for the change to be picked up by the UI.

4.2.3. Enabling Site Identification

To ensure that users are entering their details onto the correct site, you can enable site identification. Site identification provides a preventative measure against phishing.

With site identification enabled, users are presented with a range of images from which they can select. To enable site identification, set "siteIdentification" to true in the conf/ui-configuration.json file.

{
    "configuration" : {
        "siteIdentification" : true,
...    
    

Refresh your browser after this configuration change for the change to be picked up by the UI.

A default list of four images is presented for site identification. The images are defined in the siteImages property in the conf/ui-configuration.json file:

"siteImages" : [
"images/passphrase/mail.png",
"images/passphrase/user.png",
"images/passphrase/report.png",
"images/passphrase/twitter.png"
],
...    
    

The user selects one of these images, which is displayed on login. In addition, the user enters a Site Phrase, which is displayed beneath the site image on login. If either the site image, or site phrase is incorrect or absent when the user logs in, the user is aware that he is not logging in to the correct site.

You can change the default images, and include additional images, by placing image files in the ui/extension/images folder and modifying the siteImages property in the ui-configuration.json file to point to the new images. The following example assumes a file named my-new-image.jpg, located in ui/extension/images.

"siteImages" : [
"images/passphrase/mail.png",
"images/passphrase/user.png",
"images/passphrase/report.png",
"images/passphrase/twitter.png",
"images/my-new-image.jpg"
],
...
      

Note that the default image files are located in ui/default/admin/public/images/passphrase.

4.2.4. Configuring the Country List

The default user profile includes the ability to specify the user's country and state or province. To specify the countries that appear in this drop down list, and their associated states or provinces, edit the conf/ui-countries.json file. For example, to add Norway to the list of countries, you would add the following to the conf/ui-countries.json file:

        {
            "key" : "norway",
            "value" : "Norway",
            "states" : [
                {
                    "key" : "akershus",
                    "value" : "Akershus"
                },
                {
                    "key" : "aust-agder",
                    "value" : "Aust-Agder"
                },
                {
                    "key" : "buskerud",
                    "value" : "Buskerud"
                },
...
    

Refresh your browser after this configuration change for the change to be picked up by the UI.

4.3. Managing User Accounts With the User Interface

Only administrative users (with the role openidm-admin) can add, modify, and delete user accounts. Regular users can modify certain aspects of their own accounts.

Procedure 4.1. To Add a User Account
  1. Log into the user interface as an administrative user.

  2. Select the Users tab.

  3. Click Add User.

  4. Complete the fields on the Create new account page.

    Most of these fields are self-explanatory. Be aware that the user interface is subject to policy validation, as described in Using Policies to Validate Data. So, for example, the Email address must be of valid email address format, and the Password must comply with the password validation settings that are indicated in the panel to the right.

    The Admin Role field reflects the roles that are defined in the ui-configuration.json file. The roles are mapped as follows:

    "roles" : {
        "openidm-admin" : "Administrator",
        "openidm-authorized" : "User",
        "tasks-manager" : "Tasks Manager"
    },     
         

    By default, a user can be assigned more than one role. Only users with the tasks-manager role can assign tasks to any candidate user for that task.

Procedure 4.2. To Update a User Account
  1. Log into the user interface as an administrative user.

  2. Select the Users tab.

  3. Click the Username of the user that you want to update.

  4. On the user's profile page, modify the fields you want to change and click Update.

    The user account is updated in the internal repository.

Procedure 4.3. To Reset a User's Password

Users can change their own passwords by following the Change Security Data link in their profiles. This process requires that users know their existing passwords.

In a situation where a user forgets his password, an administrator can reset the password of that user without knowing the user's existing password.

  1. Follow steps 1-3 in Procedure 4.2, “To Update a User Account”.

  2. On the user's profile page, click Change password.

  3. Enter a new password that conforms to the password policy and click Update.

    The user password is updated in the repository.

Procedure 4.4. To Delete a User Account
  1. Log into the user interface as an administrative user.

  2. Select the Users tab.

  3. Click the Username of the user that you want to delete.

  4. On the user's profile page, click Delete.

  5. Click OK to confirm the deletion.

    The user is deleted from the internal repository.

4.4. Managing Workflows From the User Interface

The user interface is integrated with the embedded Activiti worfklow engine, enabling users to interact with workflows. Available workflows are displayed under the Processes item on the Dashboard. In order for a workflow to be displayed here, the workflow definition file must be present in the openidm/workflow directory.

A sample workflow integration with the user interface is provided in openidm/samples/workflow, and documented in Sample Workflow - Provisioning User Accounts. Follow the steps in that sample for an understanding of how the workflow integration works.

Access to workflows is based on OpenIDM roles, and is configured in the file conf/process-access.json. By default all users with the role openidm-authorized or openidm-admin can invoke any available workflow. The default process-access.json file is as follows:

{
    "workflowAccess" : [
        {
            "propertiesCheck" : {
                "property" : "_id",
                "matches" : ".*",
                "requiresRole" : "openidm-authorized"
            }
        },
        {
            "propertiesCheck" : {
                "property" : "_id",
                "matches" : ".*",
                "requiresRole" : "openidm-admin"
            }
        }
    ]
}  
  

4.5. Changing the UI Theme

You can customize the theme of the default user interface to apply your own branding. Note that at this stage, the default user interface is still evolving. Customizations that you make to the functionality of the UI, are therefore not guaranteed to work in the next OpenIDM release.

By default the user interface reads the stylesheets and images from the openidm/ui/default directory. Modifications to the default theme should be made in the openidm/ui/extension directory. If you modify the files in the default directory, there is no guarantee that your changes will not be overwritten in the next OpenIDM release. The UI searches the extension directory first and applies any styles or images located in this directory.

4.5.1. Changing the Default Stylesheet

The default stylesheets are located in the openidm/ui/default/admin/public/css directory. To customize the stylesheets, copy them to openidm/ui/extension/css, and edit them according to your requirements.

The following example changes the background color of the input forms to green.

  1. Copy the default stylesheets to openidm/ui/extension/css:

    $ cd /path/to/openidm/ui/default/admin/public/
    $ cp -r css ../../../extension/
  2. Edit the openidm/ui/extension/css/user/config.less file as follows:

    @content-background: #99CC66;
  3. Refresh your browser window for the change to appear.

4.5.2. Changing the Default Logo

The default logo is located in the openidm/ui/default/admin/public/images directory. To customize the logo:

  1. Add your own logo image file, named logo.png, to the directory openidm/ui/extension/images.

  2. Refresh your browser window for the new logo to appear.

4.5.3. Changing the Language of the UI

Currently, the UI is provided only in US English. You can translate the UI and specify that your own locale is used. The following example shows how to translate the UI into French.

  1. Copy the default locale to openidm/ui/extension/locales:

    $ cd /path/to/openidm/ui/default/admin/public/
    $ cp -r locales ../../../extension/

    The extension/locales folder now contains one locale, en-US.

  2. Create a copy of the en-US locale, in a new folder named fr-FR.

    $ cd /path/to/openidm/ui/extension/locales
    $ cp -r en-US fr-FR 
  3. Translate the values of the properties in the fr-FR/translate.json file. Do not translate the property names. For example:

    ...
    "user" : {
        "user" : "Utilisateur"
        "login" : "Login",
        "profile" : "Profil",
    ....
  4. Change the UI configuration to use the new locale by setting the value of the language property in the openidm/conf/ui-configuration.json file, as follows:

    "language" : "fr-FR",
                    
  5. Refresh your browser window for the modification to be applied.

4.5.4. Creating a Project-Specific UI Theme

You can create specific UI themes for different projects and then point a particular UI instance to use a defined theme on startup. To create a complete custom theme, follow these steps:

  1. Shut down the OpenIDM instance, if it is running. In the Felix administration console, type:

    shutdown
    ->
  2. Clear the felix-cache directory.

    $ rm -rf felix-cache
  3. Copy the entire default UI theme to an accessible location. For example:

    $ cd /path/to/openidm/ui
    $ cp -r default ../new-project-theme
  4. In the copied theme, modify the required elements, as described in the previous sections. Note that nothing is copied to the extension folder in this case - changes are made in the copied theme.

  5. In the openidm/conf/boot/boot.properties file, add the following line, specifying the location of the new theme. The path is relative to the installation root of the OpenIDM instance.

    openidm.ui.fileinstall.dir=new-project-theme
  6. Restart OpenIDM.

    $ cd /path/to/openidm
    $ ./startup.sh
  7. Relaunch the UI in your browser. The UI is displayed with the new custom theme.

4.6. Using an External System for Password Reset

By default, the password reset mechanism is handled internally, in OpenIDM. You can reroute password reset in the event that a user has forgotten his password, by specifying an external URL to which password reset requests are sent. Note that this URL applies to the password reset link on the login page only, not to the security data change facility that is available after a user has logged in.

To set an external URL to handle password reset, set the passwordResetLink parameter in the conf/ui-configuration.json file. The following example sets the passwordResetLink to https://accounts.example.com/account/reset-password.

passwordResetLink: "https://accounts.example.com/reset-password"

The passwordResetLink parameter takes either an empty string as a value (which indicates that no external link is used) or a full URL to the external system that handles password reset requests.

Note

External password reset and security questions for internal password reset are mutually exclusive. Therefore, if you set a value for the passwordResetLink parameter, users will not be prompted with any security questions, regardless of the setting of the securityQuestions parameter.

4.7. Providing a Logout URL to External Applications

By default, a UI session is invalidated when a user clicks on the Log out link. In certain situations your external applications might require a distinct logout URL to which users can be routed, to terminate their UI session.

The logout URL is #logout, appended to the UI URL, for example, http://localhost:8080/openidmui/index.html#logout/.

The logout URL effectively performs the same action as clicking on the Log out link of the UI.

4.8. Changing the UI Path

By default, the UI is registered at a specific URL (base-context/openidmui). To override the default URL and specify your own path, edit the openidm/conf/ui.context-enduser.json file, setting the urlContextRoot property to the new URL. For example, to change the path to base-context/exampleui, edit the file as follows:

"urlContextRoot" : "/exampleui",

4.9. Disabling the UI

The UI is packaged as a separate bundle that can be disabled in the configuration before server startup. To disable the registration of the UI servlet, edit the openidm/conf/ui.context-enduser.json file, setting the enabled property to false:

"enabled" : false,