Two new technologies
XPages and Themes are two new technologies that allow Lotus Domino Web application developers to quickly and easily control their Rapid Application Development (RAD) projects, while also allowing developers to extend and completely control the rendered output to the Web browser client. This section provides an introduction to both XPages and Themes specific to the requirements for this tutorial's example project.
XPages are a new and extremely powerful design element to IBM Lotus Domino 8.5, and they will be fully used to render the Web client user interface to your example project. Let's review the functional capabilities of XPages specific to your needs for this tutorial.
There are many built-in capabilities provided to the Lotus Domino Web application developer by XPages, but for the purposes of this tutorial you will focus on the following:
- Inline XHTML in XPages
- The XPage repeat control
- The XPage computed field control
Figure 1 shows the addition of simple HTML markup in combination with an XPage repeat control, as viewed from the XPage source pane.
Figure 1. XPage repeat control
You will use the XPage repeat control in combination with a defined view data source to render XHTML tables rows, so you should have at least an elemental understanding of the XPage repeat control.
The XPage repeat control can be compared to a For All in LotusScript, as the contents within the repeat control will be displayed For All items whose condition is met in the defined data source. For the purposes of this tutorial, you will use two repeat controls to render the XHTML generated from the people and locations views.
You will use the XPage computed text control in combination with the repeat control to create the XHTML table rows per NotesDocument from your view data sources. This, combined with the surrounding inline XHTML markup, allows you to render what will appear as embedded views in your Web browser client-user interface.
You will use Themes, another new and equally powerful design element in Lotus Domino 8.5, to control the rendered CSS and HTML markup generated by your XPages. Let's review Theme development in Lotus Domino Web application development specific to your needs for this tutorial.
XPages (as well as classic Lotus Domino Designer elements such as forms and views) when rendered through the HTTP Task and delivered to a Web browser client will use Lotus Domino-generated markup. In prior releases, you had no ultimate control over what markup was delivered to the browser while using Lotus Domino RAD techniques for Web application development. With Lotus Domino 8.5, you can now use Themes to control various characteristics, and thus the resultant rendered markup, of defined design elements and design element objects.
Simply put, Themes allow you to control exactly what you want to render to the Web browser client. When they are used in combination with XPage design elements, you get a combination of Lotus Domino Web RAD and better control over the on-screen application.
Those familiar with the XML DTD (Document Type Definition) will immediately see the correlation to Themes in Lotus Domino Web development. In fact, Themes are even written in XML, which is interpreted at runtime to modify rendered content in the Lotus Domino HTTP task.
Listing 1 shows a simple example of Theme markup for adding a custom
styleClass to a computed text control.
Listing 1. Theme markup for adding custom
styleClassto a computed text control
<control target="xsp" override="true"> <name>Text.ComputedField</name> <property mode='override'> <name>styleClass</name> <value>tablerow</value> </property> </control>
This Theme markup will affect all computed text controls (
Text.ComputedField) on XPages (
target='xsp'), setting the
styleClass property to
You can alternately modify an individual or group of defined control objects by creating a ThemeID and applying that ThemeID to the control objects you want to modify.
For example, let's say you want all submit buttons to render with a specific
styleClass, as you have CSS applying a unique look to your submit buttons across your application (see listing 2).
Listing 2. All submit buttons render with a specific
<control target="xsp" override="true"> <name>button.action.submit</name> <property mode='override'> <name>styleClass</name> <value>submitbutton</value> </property> </control>
Now, in your XPage source, you simply add the ThemeID to the
ThemeID property for your control objects (see listing 3).
Listing 3. Add the ThemeID to the ThemeID property
<xp:button value="Save Changes" id="button1" themeId="button.action.submit"> <xp:eventHandler event="onclick" submit="true" refreshMode="complete" immediate="false" save="true"> </xp:eventHandler> </xp:button>
When rendered, you now have the following markup sent to the Web browser client (see listing 4).
Listing 4. New markup for the client
No ThemeID applied: <button id="view:button1" name="view:button1" type="button">Save Changes</button> "button.action.submit" ThemeID applied: <button id="view:button1" class="submitbutton" name="view:button1" type="button">Save Changes</button>
The ability to access global control objects through type or alternately to define a ThemeID gives you the ability to create MetaThemes for your Lotus Domino Web applications and will also greatly assist you in good development standards practices when used properly. Consider this: With a thoroughly defined set of control objects and ThemeIDs, you can easily skin your enterprise applications both for functionality as well as visual standardization.
For a complete list of all XPage control objects try the following:
- Using Microsoft Windows Explorer, navigate to your <Lotus Notes Client "Notes" directory>\xsp\nsf\themes.
- Create an Operating System (OS) copy of the webstandard.theme file.
- Rename your OS copy file to webstandard.xml.
- Open webstandard.xml in your preferred XML editor (Notepad, Textpad, Aptana, Eclipse, for example)
The webstandard.theme file contains a list of all XPage control objects, which will enable you to start manipulating the control objects at the global and individual level.
Themes also allow you to control which resources are added to specified design elements. The following Theme markup in listing 5, for example, will add the main.css style sheet to your XPage design elements.
Listing 5. Adding the main.css style sheet to your XPage design elements
Unlike the Theme control objects, which are defined explicitly through control object type or ThemeID, resources can be conditionally rendered through defined logic using the rendered attribute of the resource object. In listing 5, the main.css style sheet will always be rendered as a resource in the design elements using this Theme because the
Now that you have a better understanding of both XPages and Themes technologies available to the Lotus Domino Web application developer with the IBM Lotus Notes and Lotus Domino 8.5 Release, it's time to start building the Big Brother example project.