| ILOG JRules User Guide > Customizing JRules > Tasks > Customizing Rule Team Server > Customizing the Rule Team Server GUI |
Customizing the Rule Team Server GUI |
PREVIOUS NEXT |
Extension points are provided to extend graphical components of Rule Team Server: toolbar, tabs, theme, properties, as well as the Rule Editor itself.
Rule Team Server is based on the Sun JavaServer Faces framework. The entry point for extending the graphical user interface is the class ManagerBean. This class is implemented as a JSF managed bean. As such it can be directly referenced in JSP pages using JSF tags. To use it in one of your own managed beans, retrieve its instance by calling the getInstance() static method.
The resources that you will modify to customize the Rule Team Server GUI are located in jrules-teamserver-web-<appserver>.war in the Rule Team Server EAR.
Only the following resources are used when customizing:
/custom/.* - To modify the toolbars and the standard content pages, as well as registering new tabs.
/WEB-INF/extended-faces-config.xml - To add navigation rules.
/skins/.* - To modify the theme.
/WEB-INF/skin-faces-config.xml - To register custom themes.
/WEB-INF/web.xml - To enable anonymous sign-in.
The recommended approach when customizing the GUI is to create your own web resources directory, for example C:/mydir/mywebresources, and then setting up this directory to contain only the files that you modify from the custom directory and your own pages, for example:
/custom/tableToolbar.jsp /custom/tabs.jsp /mypages/myholderpage.jsp /mypages/mycontentpage.jsp /WEB-INF/extended-faces-config.xml
This way, you can repackage (see Repackaging the Rule Team Server EAR) with the following parameters to overwrite the contents of the current EAR, and, more importantly, any updates to the EAR:
ant repackage-ear -DsourceEar=C:\ILOG\JRulesXX\jrules-teamserver-JBOSS.ear -DtargetEar=C:\mydir\jrules-teamserver-JBOSS.ear -DwebResourceDir=C:/mydir/mywebresources
Rule Team Server provides some JSF tags that allow you to customize the GUI.
The available tags and their attributes are available in /WEB-INF/teamserver.tld, as follows:
teamserver:treeview - A tree component.
teamserver:link - A link.
teamserver:button - A button in the toolbar.
teamserver:tab - A tab.
teamserver:page - A page.
teamserver:breadcrumb - The breadcrumbs.
teamserver:toolbar - A toolbar.
You can add your own custom tabs to Rule Team Server. Adding a tab implies:
To register your tab, add a teamserver:tab tag to /custom/tabs.jsp, which contains by default:
<teamserver:tab name="home" model="#{LinkBean.home}"/>
<teamserver:tab name="explore" model="#{LinkBean.explore}"/>
<teamserver:tab name="query" model="#{LinkBean.query}"/>
<teamserver:tab name="compose" model="#{LinkBean.compose}"/>
<teamserver:tab name="configure" model="#{LinkBean.configure}"/>
<teamserver:tab name="admin" model="#{LinkBean.admin}"/>
<teamserver:tab name="install" model="#{LinkBean.install}"/>
The default tabs use the model attribute to regroup required parameters in a Bean that implements the IlrUICommandModel interface. You can do the same or specify the required title, action, and matches attributes directly in the tag, for example:
<teamserver:tab name="customTab" title="My Tab" action="customAction" matches="/mypages/.*">
where:
title - The title displayed on the tab.
action - A name for the action that is fired when the tab is clicked. You must then declare any custom actions in WEB-INF/extended-faces-config.xml (see Establishing the Navigation Rules).
matches - All pages that match this regular expression will have the custom tab activated when they are displayed. If this attribute is left empty, pages displayed through the action attribute will not activate the tab.
See /WEB-INF/teamserver.tld for the other attributes of teamserver:tab, which include:
icon - To show an icon beside the tab name.
enabled - Lets you gray out the tab.
rendered - Whether the tab is visible. Use this attribute to limit access to a tab, for example to the Administrator:
<teamserver:tab name="customAdminTab" action="customAdminAction" label="My Admin Tab" matches="/mypages/customadmin/.*" rendered="#{ManagerBean.administrator}"/>
tooltip - To show a tooltip when hovering on the tab name.
The action attribute of the teamserver:tab tag in custom/tabs.jsp establishes the page to navigate to when the tab is clicked. This location of the page is described as a navigation case in the navigation rule part of WEB-INF/extended-faces-config.xml, for example:
<navigation-rule>
<from-view-id>/*</from-view-id>
<navigation-case>
<from-outcome>customAction</from-outcome>
<to-view-id>/mypages/myholderpage.jsp</to-view-id>
</navigation-case>
</navigation-rule>
In this example, a click on the tab displays the /mypages/myholderpage.jsp page.
| Reminder |
This page must also match the regular expression of the matches attribute for the tab to be activated when displaying this page.
|
In order to add content to your tab, you must first create the holder page in the location you specified in the navigation rules, as follows:
<%@ taglib uri="http://www.ilog.com/jrules/teamserver" prefix="teamserver" %> <teamserver:page content="/mypages/mycontentpage.jsp"> </teamserver:page>
The teamserver:page tag in the holder page defines the location of another JSP file in which you will place the actual contents, that is, toolbars, links, any HTML/JSF, and so on, as described in Customizing the Content Pages.
The holder page handles the top banner with all the tabs, as well as the footer, so these do not have to be repeated in any of the content pages. The breadcrumbs, which appear just below the tabs, can be placed in the holder page within the teamserver:page tag:
<teamserver:breadcrumb title="Custom Action" action="customAction"/>
All JSP pages under the new tab should match the regular expression pattern /mypages/.* for the tab to be active.
Once completed, these pages will need to be repackaged in the EAR as described in Understanding How to Customize the Rule Team Server GUI.
You can create or modify the pages contained within the Rule Team Server tabs.
The usual working practice is to customize files in your own directory so that they override the existing ones when you repackage the Rule Team Server EAR (see Understanding How to Customize the Rule Team Server GUI).
The /custom directory contains the JSP pages that can be redefined when customizing Rule Team Server. The standard pages include:
/custom/admin.jsp /custom/configure.jsp /custom/home.jsp
For instance, the Configure page contains:
<teamserver:link model="#{LinkBean.manageBaselines}"/>
<teamserver:link model="#{LinkBean.manageRuleApps}"/>
<teamserver:link model="#{LinkBean.generateRuleset}"/>
<teamserver:link model="#{LinkBean.checkProject}"/>
<teamserver:link model="#{LinkBean.generateReport}"/>
<teamserver:link model="#{LinkBean.viewParameters}"/>
<teamserver:link model="#{LinkBean.viewBomPath}"/>
<teamserver:link model="#{LinkBean.editExtractors}"/>
<teamserver:link model="#{LinkBean.editDependencies}"/>
<teamserver:link model="#{LinkBean.editCategories}"/>
<teamserver:link model="#{LinkBean.reloadDynamicDomains}"/>
You can add/remove or redefine links from these pages and also add your own code.
| Note |
| Adding your own code is often done in the Home page, by adding custom HTML to display information about your application. |
You can write your own content pages that are called by the teamserver:page tag in the holder page (see Creating the Holder for Your Page). For example:
<teamserver:page content="/mypages/mycontentpage.jsp"> </teamserver:page>
The teamserver:page tag in the holder page defines the location of another JSP file in which you will place the actual contents, that is, toolbars, links, any HTML/JSF, and so on.
Within your content page you can add JSP code, including Rule Team Server or other JSP tags, and any HTML. Note that any non-JSF code, including HTML tags, must be surrounded by <f:verbatim> </f:verbatim> to be correctly interpreted.
You can redefine the left and right toolbars displayed in the Explore and Query tabs, as well as the toolbar displayed when viewing the details of project elements.
To do so, add a teamserver:button tag to the corresponding toolbar, for example, /custom/tableToolbar.jsp, which contains by default:
<teamserver:button model="#{TableToolbarBean.create}"/>
<teamserver:button model="#{TableToolbarBean.details}"/>
<teamserver:button model="#{TableToolbarBean.edit}"/>
<teamserver:button model="#{TableToolbarBean.delete}"/>
<teamserver:button model="#{TableToolbarBean.copy}"/>
<teamserver:button model="#{TableToolbarBean.lock}"/>
<teamserver:button model="#{TableToolbarBean.unlock}"/>
<teamserver:button model="#{TableToolbarBean.releaseLock}"/>
<teamserver:button model="#{TableToolbarBean.history}"/>
<teamserver:button model="#{TableToolbarBean.refresh}"/>
<teamserver:button model="#{TableToolbarBean.help}"/>
You can add or remove existing links, redefine behaviors such as its visibility, hook the existing action, change it, and so on. You can also add any HTML/JSP to it.
For example, you can redefine the lock button as follows, in order to hide it for basic users:
<teamserver:button model="#{TableToolbarBean.lock}" rendered="#{MyBean.basicUser}"/>
Or you can create your own button:
<teamserver:button action="#{MyBean.dosomething}" icon="mybutton.png" title="Click Me"/>
or redefine TableToolbarBean in order to hook its action:
public class MyTableToolbarBean extends TableToolbarBean {
public MyTableToolbarBean() {
setRefresh(new IlrCommandDelegate(getRefresh()) {
public String action() {
// do something before refreshing
System.err.println("Refresh has been called");
// Then calls the RTS refresh action.
return delegate.action();
}
}
}
}
In this case, you will redefine TableToolbarBean in extended-faces-config.xml. For example:
<managed-bean> <managed-bean-name>TableToolbarBean</managed-bean-name> <managed-bean-class>mypackage.MyTableToolbarBean</managed-bean-class> <managed-bean-scope>session</managed-bean-scope> </managed-bean>
The look & feel (theme, or skin) of the Rule Team Server GUI can be modified, including the logo visible in the top left corner.
The .css files of the classic theme are modifiable in folder /skins/classic/css and its images in folder /skins/classic/images.
Also, a common folder used to share .css files and images across different themes is located in /skins/common.
| Note |
You can also customize the look & feel of the rule editor and decision table editor in Rule Team Server through the file skins/common/css/webcomponents.css.
|
You can add a theme by:
.css files and images from main.css in /skins/myskins/css and, if your theme requires JavaScript, your own .js file from /skins/myskins/js/main.js.
/WEB-INF/skin-faces-config.xml a value of the same name in the list entries under the customSkins managed property, for example:
Permanent links (permalinks) give direct access to projects or project elements by providing the exact URL in Rule Team Server. You can right-click on a permalink to copy the URL.
A permalink appears beside the project name or beside the name of project elements in the Details or Version pages. Permalinks to the baseline used to generate a RuleApp and to its equivalent report are also found in the properties of the RuleApp itself.
If you want to generate permalinks within an external application or when customizing the Rule Team Server GUI, use the IlrPermanentLinkHelper API. The sample How to Trigger Notifications when Elements Change in Rule Team Server demonstrates how they can be used.
The following configuration parameters, used to generate complete URLs in permalinks, will be generated the first time you sign in to Rule Team Server after configuring the database. You can use the Installation Manager to set these beforehand, or change/display them afterwards:
teamserver.server.port - The port number.
teamserver.server.isSecure - True if the connection is secure.
teamserver.server.hostname - The name of the host.
You can allow users to connect anonymously to Rule Team Server, that is, without having to sign in through the Rule Team Server sign-in page.
Once you enable anonymous sign-in, use the following URL to access Rule Team Server without signing in: http://localhost:8080/teamserver/anonymous/faces/home.jsp.
Anonymous sign-in is enabled by adding mappings for anonymous in the WEB-INF/web.xml descriptor (extensionsFilter, accessFilter, Faces Servlet, Controller, and so on). These are already present in the default web.xml so you simply have to uncomment them as indicated in the file and then repackage the EAR (see Understanding How to Customize the Rule Team Server GUI).
A typical use is to then customize the application to have anonymous users connect to a read-only Rule Team Server, where the Edit/Delete buttons are hidden, the controller forbids write access, and so on). This is described in detail in the sample How to Trigger Notifications when Elements Change in Rule Team Server.
| Note |
Changes made to web.xml will have to be re-applied in future updates or versions of Rule Team Server.
|
You can define custom property editors that will be used in the Rule Editing wizard (the Compose tab of Rule Team Server). To define a custom renderer, implement a rendering class and add a reference to it by positioning an annotation on the extension model (see Using Specific Rule Model Annotations).
For instance, this implementation should be a subclass of IlrPropertyEditorRenderer and override the method:
public void encodeValueField (FacesContext context, UIComponent component, boolean checkPermission) throws IOException, IlrApplicationException
To define a custom type validator, implement IlrTypeValidator and add a reference to it by positioning an annotation on the extension model (see Using Specific Rule Model Annotations).
| Copyright © 1987-2008 ILOG S.A. All rights reserved. Legal terms. Documentation homepage. | PREVIOUS NEXT |