Beyond The Yellow Bubble

I am constantly suprised that no matter how much I learn about Notes Development there seems to be so much more I still don't know.  In the past few days both Nathan Freeman and  Chris Blatnik posted some excellent articles on how to use style sheets to simulate the HTML Fieldset capability on a Notes client.  I had always thought  Style Sheet resources were the domain of Web application development only.  It never occured to me that these could be used to style a Notes client application...

 

So I have already been busy enhancing the UI for a number of forms in the .Domino Framework that utilize the tricks they have shown.  In doing so it also occured to me that it may in fact possible to build a Notes application in such a way that the look/feel can be customized to suit individual preferences.  

 

The .Domino Framework supports a User Preferences form/profile document in which each user can (now) select from a list of available skins.  Each supported skin is represented by a Style Sheet, and an associated subform that contains this style sheet.  Various forms in the .Domino Framework can now include a computed subform that is based upon the user's preferred skin.  And voila the look/feel of the form reflects the user's preferred skin.

 

As best as I can tell a great many Notes Design elements still do not get effected by Style Sheets so this is a at best a partial solution.  The application skinning feature is still needed to apply a base theme to an application (views, embedded outlines etc.) At least now I can provide some flexibility how some aspects of the application look/feel.

A new feature is now ready for the next beta release of the .Domino Framework that will extend the Application Skin feature to assign a consistent look and feel to design components that support the htmlclass element.  This includes tables, table cells, fields, frames, and framesets.  Assigning a class to a design component is traditionally only done with Web applications to assign UI characteristics via a CSS.  Now a .Domino design rule can be added to define the UI characteristics in a similar manner to a CSS.  Using XSLT the design elements themselves are updates so that the UI is rendered to the Notes client.

Here is an example of the XSLT code that is generated by the process to apply to a table assigned the htmlclass DataEntry:-

  <xsl:template match="dxl:table[@htmlclass='DataEntry']/@colorstyle">
    <xsl:attribute name="colorstyle">left</xsl:attribute>
  </xsl:template>

  <xsl:template match="dxl:table[@htmlclass='DataEntry']/@bgcolor">
    <xsl:attribute name="bgcolor">#E0E8F0</xsl:attribute>
  </xsl:template>

  <xsl:template match="dxl:table[@htmlclass='DataEntry']/@altbgcolor">
    <xsl:attribute name="altbgcolor">#FFFFFF</xsl:attribute>
  </xsl:template>

  <xsl:template match="dxl:table[@htmlclass='DataEntry']/@cellbordercolor">
    <xsl:attribute name="cellbordercolor">#8091A5</xsl:attribute>
  </xsl:template>

  <xsl:template match="dxl:table[@htmlclass='DataEntry']/@rowspacing">
    <xsl:attribute name="rowspacing">0.02in</xsl:attribute>
  </xsl:template>

  <xsl:template match="dxl:table[@htmlclass='DataEntry']/@columnspacing">
    <xsl:attribute name="columnspacing">0.05in</xsl:attribute>
  </xsl:template>

  <xsl:template match="dxl:table[@htmlclass='DataEntry']">
    <xsl:copy>
      <xsl:attribute name="colorstyle">left</xsl:attribute>
      <xsl:attribute name="bgcolor">#E0E8F0</xsl:attribute>
      <xsl:attribute name="altbgcolor">#FFFFFF</xsl:attribute>
      <xsl:attribute name="cellbordercolor">#8091A5</xsl:attribute>
      <xsl:attribute name="rowspacing">0.02in</xsl:attribute>
      <xsl:attribute name="columnspacing">0.05in</xsl:attribute>
      <xsl:apply-templates select="@*|node()"/>
    </xsl:copy>
  </xsl:template>

I started work on extending the functionality of the .Domino Framework to provide the ability to "skin" an application for a Notes client based upon a style sheet.  The first challenge has been to develop an approach to take.  I had previously developed a solution for views that used the NotesDOMPaser.  Viewnify also uses this approach.  The downside to this is the lack of a standard way to define the "style".  Importing from a CSS was a possible options but what names should be applied to the classes/ids...

 

I decided to try XSLT.  It is an industry standard and the transformations could be defined as data rather than code.  Notes provides a way to transform DXL using an NotesXSLTTransformer class.  Using the Domino.reflections namespace I have extended the existing DominoDocummentCollectionDesign class to provide a Transform method.  This new method acts upon the selected design elements, exports them to DXL, applies an XSLT before importing the modified design elements back into teh database.  I also developed a debug option that exports the DXL to a file so it can be inspected.