Roller Mobile Themes are popping up in your mobile device.!!!

So the new mobile appearance of Roller coming into action.I believe all the Roller users will be please to hear this news.I was able to commit a basic sample mobile theme which is mobile friendly to view and it is supported by newly designed roller mobile rendering platform.You do not have go to additional URLs to view mobile version.Just view in a mobile device it will render the mobile version of templates.

Yes the current mobile theme is at its early childhood, But the platform enables users to add their mobile themes into the system very easily.My theme just an example to illustrate and test the platform. You can edit your mobile templates when you customize your theme or add new templates for shared themes.

Here are some of the screenshot of my theme design.These screenshot were taken using nook color which has android OS. [I am not an expert in theme designing but JQuery was powerful enough to assist me in that task within a very short time.]

1.Home Page

2.Entry Page

3.Search Result page

How to change template codes in Roller template editing page

Nothing major has changed for mobile.But you will be able to edit the template of mobile version by just switching using the tabs in the template editing page.Following is a screenshot of the editor with new changes.

Changes in the theme.xml [New changes]

Earlier we were trying to add another theme for mobile, But with the new roller architecture we have theme packs with templates with different template codes as template contents.

Following is an extract from Theme.xml

  <template action="weblog">
        <name>weblog</name>
        <description>weblog</description>
	<link></link>
        <navbar>false</navbar>
        <hidden>true</hidden>
         <templateCode>
           <templateLanguage>velocity</templateLanguage>
           <contentType>text/html</contentType>
           <contentsFile>weblog.vm</contentsFile>
           <type>standard</type>
       </templateCode>
         <templateCode>
           <templateLanguage>velocity</templateLanguage>
           <contentType>text/html</contentType>
           <contentsFile>weblog-mobile.vm</contentsFile>
           <type>mobile</type>
       </templateCode>
    </template>

One should add template code for a standard template and can leave other types (In here mobile template code) not adding.If there is no templateCode entry for mobile type we are cloning the standard's template code.

Roller WeblogTemplateCode [design]

In our new design we are using WeblogTemplateCode to maintain the information of template content, template language and template type. Following is the complete entry for the database table we are creating make them persistent.


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

This design allow us not to deviate from existing roller architecture.We are simply prepare the template using the WeblogTemplateCode for the detected type (standard, mobile etc.) before rendering it to the user.

Mobile Theme setting up and its Use Cases

Setting Up a Mobile Theme By Weblog admin


An admin can set up a default weblog theme( Desktop theme.) in current weblog creation page.So one additional step with defining a default mobile theme from the available mobile themes collections.(There will be at least one default as i am going to add a  HTML5 mobile Theme for sure.)

So in theme.xml we will be having an additional entry to indicate that the theme is a mobile theme.(Still it is not finalized with the community and will decide soon on the entry.)

How Rendering will pick up the theme.(Changes in the core)


After the recognition of the request coming from a mobile device, in the PageServlet we need to switch from desktop them  to the defined mobile theme for the identified weblog.So in the weblog we will be having a "defaultMobileTheme" attribute which will be set by the weblog admin at the weblog creation.

So we will assign mobile theme using setEditorTheme( ) at the time it looks for the template to render in PageServlet. (So roller will continue same process afterwards , But having a mobile theme is assigned for its editor theme.)

In coming discussions i will be post on the velocity macros we are going to add to Roller to enhance capabilities in Roller mobile themes.

I would like to thank all the users and developers who gave their valuable feedback in Roller dev mailing list and expect further assistance in future.:)

How to render mobile theme. [Discussion]

This will be interesting an decision to make .After discussion with Dave in a weekly project meeting following are the available options we were able to figure out.

• Use different weblog,search ,tags and entry pages for each template. [complex to maintain and handle]
• Use a one default mobile theme for all desktop theme. [ more restricted to a developer]
• Use different mobile theme for each desktop theme. [preferred method for the moment]

So the method we chose is to have different set of mobile themes which can be added separately and specially add a metadata it as a mobile theme.So at the weblog creation user can define one of the mobile themes as the preferred mobile theme to render.I am still evaluating the options and different approaches so the most suitable and maintainable method will be implemented.

Below is a simple view of how rendering is to happen with Roller mobile.

You can find the proposal at Apache Roller wiki : https://cwiki.apache.org/confluence/display/ROLLER/Proposal+HTML5+Mobile+Template+for+Apache+Roller

  

Project Proposal Abstract

Roller is a full-featured, multi-user and group-blog server suitable for blog sites large and small. It has features such as multi-user and group blogging, comment moderation, spam prevention, RSS 2.0 and Atom 1.0 support. In nutshell roller is a blogging engine.

Mobile browsers are starting to eclipse desktop web browsing and, unfortunately, most Roller themes do not work well on small-format mobile devices. This project will address this shortcoming by modifying the Roller blog rendering system to support mobile-ready blog theme templates, and providing one example theme that uses these features in combination with HTML5 to show full-sized pages to desktop browser users and small format pages to mobile users.

You can find the complete proposal at : 

http://socghop.appspot.com/gsoc/proposal/review/google/gsoc2011/shelan/1