Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 5.3

...

The purpose of the project is to add a mobile theme capability to Roller and at least one mobile theme. The project design was started on the Roller wiki. Here is the proposal:

https://cwiki.apache.org/confluence/display/ROLLER/Proposal+HTML5+Mobile+Template+for+Apache+RollerImage Removed

The design's evolution is documented on the Roller mailing list and via a series of blog entries. Below is a list, with links, of each of the blog entries so far and my summary of the changes discussed.

Blog: Mobile Theme setting up and its Use Cases

http://rollermobile.blogspot.com/2011/05/mobile-theme-setting-up-and-its-use.htmlImage Removed

Changes discussed:

...

Blog: Adding Meta-data in theme.xml

http://rollermobile.blogspot.com/2011/06/adding-meta-data-in-themexml-to.htmlImage Removed

Changes discussed:

  • New theme meta-data value - type in theme.xml

Blog: Tag to define template type in theme.xml

http://rollermobile.blogspot.com/2011/06/tag-to-define-template-type-in-themexml.htmlImage Removed

Changes discussed:

  • Type values: standard, mobile

Blog: Creating custom template

http://rollermobile.blogspot.com/2011/06/creating-custom-template.htmlImage Removed

Changes discussed:

  • Change to template management
      -
      • Each template has a standard and a mobile parts

    Blog: Editing templates

    http://rollermobile.blogspot.com/2011/06/editing-templates.htmlImage Removed

    Changes discussed:

    • Change to template UI

    Blog: Changing Mobile Theme template

    http://rollermobile.blogspot.com/2011/07/changing-mobile-theme-template.htmlImage Removed

    Changes discussed:

    • Design for selecting mobile theme vs. standard theme

    ...

    Implementation started well and made good progress. Below is a list of the changes, grouped into related blocks and with AFTER each block, a comment about the changes.

    Code Block
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/SharedTheme.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/SharedThemeFromDir.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/SharedThemeTemplate.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/WeblogCustomTheme.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/WeblogSharedTheme.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/pojos/StaticTemplate.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/pojos/StaticThemeTemplate.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/pojos/Template.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/pojos/Theme.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/pojos/WeblogTemplate.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/ThemeMetadata.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/ThemeMetadataParser.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/ThemeMetadataTemplate.java
    M /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/sotto/theme.xml
    M /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/basic/theme.xml
    M /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/brushedmetal/theme.xml
    M /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/fauxcoly/theme.xml
    M /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/frontpage/theme.xml
    

    Those changes add a new property named type to themes and to templates. So far so good.

    Code Block

    ...

    
    A /weblogger-web/src/main/java/org/apache/roller/weblogger/ui/rendering/mobile/MobileDeviceRepository.java
    

    That change adds mobile device detection. Good.

    Code Block
    A /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/mobile
    A /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/mobile/_day.vm
    A /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/mobile/basic-custom.css
    A /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/mobile/basic-preview.png
    A /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/mobile/permalink.vm
    A /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/mobile/searchresults.vm
    A /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/mobile/sidebar.vm
    A /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/mobile/theme.xml
    A /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/themes/mobile/weblog.vm
    

    Beginnings of a mobile theme. Good.

    Code Block
    M /roller/branches/roller_mobile/weblogger-business/src/main/resources/sql/createdb.vm
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/pojos/Weblog.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/pojos/wrapper/WeblogWrapper.java
    

    Here we add a new column "mobilethemename" to the table "weblog." This could be viewed as a problem because there may be more types of themes in the future, e.g. touch screen, TV set-top box, etc. and we don't want to have to add a new column to the weblog table every time we add one.

    Code Block
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/ThemeManager.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/themes/ThemeManagerImpl.java
    

    ...

    getEnabledThemeList(String type)

    Code Block
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/WeblogManager.java
    M /roller/branches/roller_mobile/weblogger-business/src/main/java/org/apache/roller/weblogger/business/jpa/JPAWeblogManagerImpl.java
    

    This changes the getPageByLink() to getPagesByLink() which returns multiple pages, because different types of themes share the same link.

    Code Block
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/rendering/servlets/PageServlet.java
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/rendering/servlets/PreviewServlet.java
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/rendering/servlets/SearchServlet.java
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/rendering/util/WeblogPageRequest.java
    

    These changes modify the rendering Servlets to check the incoming request and to determine which type of theme and templates should be used to render the response.

    Code Block
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/struts2/core/CreateWeblog.java
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/struts2/core/CreateWeblogBean.java
    M /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/WEB-INF/jsps/core/CreateWeblog.jsp
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/struts2/editor/ThemeEdit.java
    M /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/WEB-INF/jsps/editor/ThemeEdit.jsp
    M /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/WEB-INF/jsps/editor/ThemeEditSharedThemesOnly.jsp
    

    These changes enable users to pick both a standard and mobile theme at theme creation time. Here are are "hardcoding" knowledge of the mobile theme type into the UI, which is not ideal but is hard to avoid without some serious UI design and dev work.

    Code Block
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/struts2/editor/StylesheetEdit.java
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/struts2/editor/TemplateEdit.java
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/struts2/editor/TemplateEditBean.java
    M /roller/branches/roller_mobile/weblogger-web/src/main/java/org/apache/roller/weblogger/ui/struts2/editor/Templates.java
    M /roller/branches/roller_mobile/weblogger-webapp/src/main/webapp/WEB-INF/jsps/editor/TemplateEdit.jsp
    

    ...

    Implementation has gone well so far, with lots of good progress, but there are two course corrections that I would like to seeshould be made. First, I don't mind having some mobile specific code in the web UI, but I would like to avoid that in the object model and database schema. Second, as we discussed on the mailing list, we should avoid hard-coding mobile-specific fields into the database. Second, the design for storage of different type of templates seems too complex and introduces too many changes to Roller code. There are some recommended new designs below to adjust these problems.

    Recommended design changes

    These are recommended changes to the Roller Mobile design. First, a fix for the mobile-specific field in the Weblog object and corresponding website table. Introduce a new WebpageTemplate class and corresponding table We want to allow each weblog to have a set of themes, each with a name so we introduce a WeblogThemeAssoc class and a corresponding rol_weblogtheme table like this:

    Code Block
    create table rol_weblogtheme (
        id              varchar(48)  not null primary key,
        weblogid varchar(48) not null,    
        name            varchar(255)  not null,
        custom          $db.BOOLEAN_SQL_TYPE_FALSE not null,
        #columnNotNullWithDefault('type' 'varchar(16)' 'standard')
    );
    

    Second, a new design for weblog templates. Instead of creating a WeblogTemplate for each type of template (e.g. standard, mobile, etc.), we allow each WeblogTemplate to have multiple "template code" objects. In effect, each WeblogTemplate object will have two WeblogTemplateCode objects, one for type standard and one for type mobile. With this approach, we shouldn't have to make as many changes to Roller code, especially in the Struts UI actions.

    Code Block
    create table rol_templatecode (
        id                 varchar(48)  not null primary key,
        templateid varchar(48) not null,    
        template     $db.TEXT_SQL_TYPE not null,
        #columnNotNullWithDefault('type' 'varchar(16)' 'standard')
    );