Multi-Templating with JSF 2 : The Story

One thing can have several representations but each of the representations means the same thing.
Everything is an object and every object has a virtual representation.
You don't believe me! Well, look at your shadow...
Anonymous

Introduction

When describing a feature, one must always show to his readers the set of contexts in which its use can bring a significant value . If you can't do that, there is no way to convince the users to give it a try . The feature I'm about to present is called "Multi-templating with JSF 2" and to further open the presentation, I'm starting today with a simple question. Does it make sense to have a dynamic templating system inside of the Java Server Faces Framework? What are the set of contexts in which its application can bring a significant value to its users? The answer is self evident for those who are in the right perspective to see the rationale of this idea. For the others, it might be wise to take the time to find it through the story of this web designer. Let's start by reading his profile.

The Profile

name : Jim Job : Web designer Skills : HTML, CSS, Javascript, JSP, Facelets, Photoshop, Illustrator

The Story

Jim is working with a team of 19 web developers and they have the mission to build web applications using the JSF framework. The separation of concerns has been made as easy as to assign to Jim the simple task to design the master page and to define the look and feel of the web user interface. The web developers in the other hand, have the heavy task to build the application logic broken into a set of modules and to create the views that use the master page. Since the release of JSF 2.0 and the advent of its resource handling mechanism, the life of Jim has never been so easy. Where to store the css, the js and the images files was not anymore his question.

And since he has found the right convention with his team about the right place to store the master page (facelets template), their integration process has never been so easy. The root directory has been chosen.

And Jim, like any perfect innocent was living in a perfect world until.........

The Mutation

Until his boss came one day with a new requirement : their JSF applications must now be able to change dynamically their look and feel. And Jim to wonder how he could achieve this miracle without a little bit of programming. He has already understood that changing dynamically the look and feel of an application means only building several themes for this application. And that a theme is nothing more than what he calls a master page or a template. And that for each template, he has only to create a facelets page and the resources (css, js,images) it needs and store them in the right places.

But what Jim didn't know was, the right places he thought , were not in fact the right places to meet a clean separation. The proof is the message he was getting. His IDE was warning him that there is a file that already exists in the selected destination and if he wants to overwrite it

And Jim to exclaim "oh what a bad and monolithic approach!" and Jim to ask "Hey how to be modular? How to avoid resources name collision?". And surprisingly the inspiration which came to him was to create a folder for each template and to surprisingly store the whole thing in a directory named "templates".

But what Jim didn't know was, all he did were just the beginning of a great inspiration. And again he couldn't help asking himself "Hey If a template has a thumbnail, who can stop me to build a template gallery for one to see what it looks like?"

And to complete his work, Jim brought the rule that a template must always have a metadata for one to know its designer.

You want to become famous! wait for the release of JSF 2.2 and its multi- templating system so you can like Jim, design and share your templates with the JSF community. And maybe someday I will blog about you to share your story....

Dynamic Resolution of a template

Selecting a template at startup

The Movie

For a better illustration of this feature, you can watch the video presentation of my project "Metamorfaces". I have created this video with After Effects and some plugins like Trapcode and Knoll Light Factory. The sounds have been composed by my little brother
.

The Prototype

Things are getting long and I'm getting tired. The presentation of the prototype will be the subject of my next blog post. So until then, ladies and gentlemen, have a good night.....