Seting up a Facelet template (for ICEfaces)

One advantage of Facelet is its ability to easily set up a template. Easily, yes but not really the first time. After several Google searches, I do not find a complete tutorial that include all the steps to create a facelet template for ICEfaces. That the reason it takes me my afternoon to realize that I wanted.

For PHP developers, the concept is exactly the same and based on include tag and CSS styles.

Here are the steps :

1. Create the layout. With Netbeans, there is the possibility to choose the type of template by adding a ICEfaces Facelet Template and the CSS is created automatically by the IDE !
   In this example, we will create a xhtml page for the menu, the top and the bottom div will not be treated because we can imagine to put an image or a static text. As you can see, the content div only contains an insert tag but no include. The reason is that we want to use a dynamic content.
2. Create the menu.xhtml
   You can see there is no HTML or BODY tag and but an <ui:composition> which contains the template name and also the declarations.
   As we use JSF2, there is not necessary to declare the navigation rule in the faces-config.xml, the just need to enter the name of the page. There is also the possibility to create a dynamic menu with managed-bean.
3. Finally the content page
   The define tag allows the inclusion of content page in the template. The code is inside the <ui:composition> tag, like the menu

I hope this mini tutorial will be usefull and understandable 🙂

Navigation rules drive me crazy !

Before beginning the secure part, I wanted to finish the CRUD with the manager class. I could name this post « How to loose 4 hours ». Let me explain :

As you know there are mainly two ways to get a value from a component. By using a binding in the bean or by using an ActionEvent. I decided to choose the last one and add an actionlistener to a method in a bean, instead of an action. I innocently return a String at the end of my method for the navigation rule.

I test ; my method works but not my navigation rule. I check in my faces-config.xml and everything seems to be OK. So, I remove my rule, and put it again. NOK. I realize different checks, still NOK. I google on the web and I found that the method behind an actionlistener must be void.

After reading posts on several forums, I finally found something coherent : « actionlistener should not be use to navigate but only to realize an action ». To use a navigation rule with an actionlistener, we need to use an action (inside the same component) which match with a « from-outcome » inside the faces-config.xml (without declaring a new method). And it is all !

Example in my component :

<ice:commandLink id= »modifier » action= »toUpdate » actionListener= »#{listManagers.updateManager} »>

In my faces-config.xml

<navigation-rule>

<from-view-id>/listManager.xhtml</from-view-id>

<navigation-case>

<from-outcome>toUpdate</from-outcome>

<to-view-id>/addManager.xhtml</to-view-id>

</navigation-case>

</navigation-rule>

Moreover, with JSF2, there is no need to create a navigation if we use the page name for the « from-outcome ».

How to secure my web app

After several Google searches, I found mainly two propositions ; Spring Security (old ACEGI) and JAAS (Java Authentification and Authorization Service).

This afternoon I saw one of my favorite teacher in my last school. He presented to me a « home made » solution that consists of using a table which contains the ID of the components with its role, meaning if it is visible or not. It means if the username should only display for the administrator, the component ID should be, for example, 1. Behind this system, there is a map to indicate the role and its key. For example, Administrator=1. Then, on each component, we need to user the « rendered » parameter to match with a method that indicates if the user is connected or not. If it is connected, we look for in the table the role of the user and we display, or not, the component.

Let’s try to implement this !

Which technology ?

The JEE world contains several technologies. There are many ways to use them and every person has its preferences.

For this project we are confronted between two choices ; JEE+ and JEE. It means an JEE oriented approach with EJB components and server injections or using Servlets instead of EJB.

We decided to begin by using EJB because it allows to easily separate business and technical code and the goal is to be concentrated on ICEfaces.

Application architecture

The separation of concerns is really important in terms of class responsibilities and reutilization. For this project, we decided to split classes between 3 packages :

• Presentation (contains the beans)
• Service (contains the business methods)
• Model (represents the model and the persistence)

Some of you are thinking that every application should respect the MVC pattern. Yes it is sure, but the MVC will be guaranteed by the framework ICEfaces.

First case

The goal of this blog is to describe the different problems that we are going to occur. To do that, let us go with a simple case :

Managers organize seminars. Customers participate to these seminars.

We decided to use JPA for the manipulations with the DB. We also decided to use the same class for the model layer and persistence layer, as we will use the annotation.

As you know, for using JPA as well, we need to adapt our database to have a join table between « Manager » and « Seminar » and also a join table between « Seminar » and « Customer ». It means we had to customize the JPA annotation. We will not explain the specification of JPA, it is not the subject of this blog. Nevertheless, take care to insert the @annotation above the attributes and not above the accessors. Otherwise, Glassfish will not be happy and will not find the mapped name !

My first ICEfaces page !

With the NetBeans wizard, we created a new web application, and, as we installed, in the framework step, we can choose ICEfaces. As ICEfaces 2.0 is still in beta mode, do not forget to check « 1.8 compatibility mode » !

The page description language indicates if you want to use Facelet, means XHTML pages instead of JSPX. Actually, a specialist told us that JSP begins deprecated and Facelet is a better way to develop with ICEfaces. If you choose to begin with JSPX and after using Facelets, it is possible, but you will have to configure your web.xml and faces-config.xml files.

After validating the framework step, your IDE will open your first ICEfaces page !

ICEfaces installation

First of all, we need to install the framework ICEfaces. I write « install », but there are two ways to use the framework. The first is to start with a JSP web app and to customize different files and to directly add the ICEfaces libraries. The second is « less geek ». It consists of downloading the ICEfaces plugin for your IDE and then, install it. After that, you will be able to create a new ICEfaces web app !

To download one or the other, http://www.icefaces.org/main/downloads/os-downloads.iface. You need to create an account before downloading.

Unfortunately, as we develop with NetBeans 6.9, we had to download the version with the 2.0 beta but there is also the possibility to use the stage 1.8 version.

Our environment

IDE : NetBeans 6.9.1

Computers :

• Thomas : MacBookPro, OS X (10.6.4)
• Julien : Windows Seven

Hello world!

We are two friends, both software engineers, who develop a web platform. We decided to use JEE and, particularly, ICEfaces for the presentation layer. As it is the first experience with this product, this blog will be used to post every problems that we occurred but it is also a way to put our success factors.

We decided to create this blog due to a real lack of complete experience with ICEfaces. We often find specific solutions but we did not find a web site that presents a complete use case.

We are looking forward to enjoying it !