Customizing About Page

Infrastructure

About Dialog is a custom Tapestry component based on dojo Dialog. It has a defined look & feel (dialog css class in layout.css)

It contains a div layer that contains a velocity output and a Close button (to close the dialog)

The velocity parsing mechanism consists of:

  1. about.vm (velocity template)
  2. AboutContext (spring bean responsible for putting variables into the template and generate the output)
  3. New Classpath velocity engine (used by the AboutContext to find about.vm in classpath)
  4. AboutBean (spring bean used as a variable in the velocity template that has access to the contained Tapestry Page) variable name: defaultAbout
  5. Generic bean (a spring bean defined in a potential plugin, also used as a variable template) variable name: about

Benefits

No static text displayed

If a different, more complicated AboutPage needs to be implemented, simply only the about.vm template and AboutBean has to be changed to get new wanted data (dynamically)

Plugin capabilities
  1. create plugin specific about.vm template that simply overwrites the original about.vm (overwrite the about.vm path in the sipxplugin.beans.xml spring configuration file - can be automatically picked up by the newly created velocity engine that reads resources from classpath) 
  2. create a plugin specific About Bean (it is automatically added as a variable in the about.vm by the AboutContext) that should have properties to retrieve any dynamic data needed
  3. localization support (IPage object is available in the about.vm - can be retrieved from the default AboutBean
Look & Feel

Specific dialog look & feel kept in a css class (in layout.css - can be easily overwritten in a potential plugin)

Example

about.vm

<table width="100%" align="left">
    <tr>

        <td><H3>${defaultAbout.title}</H3></td>
        <td align="right"><img src="/sipxconfig/skin/logoEzuce.png"/></td>
    </tr>
    <tr>

        <td colspan="2">${defaultAbout.name}${defaultAbout.details}</td>
    </tr>
    <tr>

        <td colspan="2">${defaultAbout.copyright}</td>
    </tr>
</table>

plugin: sipxplugin.beans.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN//EN"
    "http://www.springframework.org/dtd/spring-beans-2.0.dtd">
<beans>

  <bean id="ezuceOverrider">
    <property name="ignoreInvalidKeys" value="true"/>
    <property name="properties">
      <props>
        <prop key="aboutContext.aboutPluginBeanId">aboutObject</prop>
        <prop key="aboutContext.configurationFile">../../../com/ezuce/about/about.vm</prop>
        <prop key="skin.messageSourceBeanId">scsI18n</prop>
      </props>
    </property>
  </bean>
  <bean id="scsI18n">
    <property name="basename" value="resources/plugin"/>
  </bean> 
  <bean id="skinProperties">
    <property name="properties">
      <props>
        <prop key="logoEzuce.png">images/logoEzuce.png</prop>     
      </props>
    </property>
  </bean>
  <bean id="aboutObject" scope="prototype">
  </bean>    
</beans>

Please note the overriden property: <prop key="aboutContext.aboutPluginBeanId">aboutObject</prop>

This injects the plugin about bean id to the about context. Based on it, the About Context retrieves the bean and adds the "about" velocity variable