Rendering

The MVC UI does not restrict to a particular MVC framework, however Blueriq has chosen for KnockoutJS for the implementation of the default themes. Blueriq provides the forms and dashboard theme, which are both fully developed and styled themes. Custom themes can be developed from scratch or the default themes can be extended/customized.

Initial Page

Both default Blueriq themes come with an initial page (forms.stg and dashboard.stg). The purpose of the initial page is to load all the required resources (e.g. JavaScript or CSS files) and to provide a base layout.

The default initial pages are HTML files which are created using the StringTemplate template engine. The main template file is expected to:

• Be a template group file (.stg), meaning multiple templates can be used and referred to.
• Have the context parameter, the name of the main template can be configured.

The context parameter can contain the following properties:

• theme: The name of the current theme
• apiBasePath: The path to the root of the web api
• webResourcePath: The path to the root of the webresources
• extensions: The extension context with the following properties:
  • cssExtensionUrls: List of custom css files
  • jsExtensionUrls: List of custom javascript files
• sessionId: The id of the current session
• currentPage: Content object of the current page
• currentPageJson: Current page serialized in json form
• isDevelopmentMode: Indicator whether the development mode is activated.
• sessionTimeout: session timeout in milliseconds

After the initial page is loaded the MVC UI retrieves its data via the json web api. This data is transformed using the KnockoutJS MVC framework.

Configuration

In Java the MVC UI is configured in the aquima.properties file using the following properties:

mvc.themes=forms,dashboard
mvc.forms.templateGroupFile=UI/mvc/forms.stg
mvc.forms.templateName=main
mvc.dashboard.templateGroupFile=UI/mvc/dashboard.stg
mvc.dashboard.templateName=main
mvc.developmentMode=true

In .NET all configuration is done in the Web.config file as shown in the following code snippet:

<webApplication>
   ...
    <!-- UI -->
    <ui>
 	  ...
      <mvc developmentMode="true">
        <themes>
          <theme name="forms" templateGroupFile="UI/mvc/forms.stg" templateName="main"/>
          <theme name="dashboard" templateGroupFile="UI/mvc/dashboard.stg" templateName="main"/>
        </themes>
      </mvc>
    </ui>
</webApplication>