Maxa Blog

Virgil Dodson from Actuate posted a great tutorial on how to use BIRT and Actuate with JSF. RichFaces is used as well. The tutorial uses jsf4birt library developed by Exadel.

jsf4birt can be downloaded here.

Add BIRT Reporting to JSF Applications using RichFaces recording is available here. You can also download the complete application I showed during the webinar here.

RichFaces team has been working hard and this week they released RichFaces version 3.3.3 RC1 which works with JSF 2. This version doesn’t support the full JSF 2 API. This version was made available for two reasons: 1) make 3.3.x branch very stable, 2) make it easier for companies to migrate to JSF 2. You don’t need to wait for RichFaces 4 which will have full JSF 2 support. If you are migrating to an application server which has JSF 2, you can take your existing RichFaces application and run it there.

Make sure to read this post by Jay and this wiki page on how to setup and limitations. One cool feature you can use from JSF 2 is managed beans annotations, but do read the wiki page before starting.

If you are going to be using JSF 1.2 for a while and just need a very stable RichFaces release, then just download version 3.3.3 and use it in exactly the same way.

I’m pretty sure work will now accelerate on RichFaces 4 (get alpha version here) which will fully support JSF 2.

JavaFX is a new scripting language from Sun (I guess now from Oracle) for building Java-based rich user interfaces for the Web, mobile, desktop and even TV. There are plenty of sources on the Internet the predicted or predict the death of JavaFX. Based on what Oracle said few weeks ago, JavaFX has a bright future. We, at Exadel, after playing with JavaFX for some time (see Flamingo, JavaFX Eclipse plug-in) believe that JavaFX is actually a great language to build rich user interfaces, and not only for Java-based applications. JavaFX script can be extended to be used as a view description language (VDL) for JSF or even HTML5.

What does it mean? Well, you no longer have to mix HTML with JSF tags. The entire page is developed from JavaFX nodes (UI components), using JavaFX’s object-oriented nature. Layout it defined via JavaFX layout controls. It will be now be possible (finally) to create real visual and drag-and-drop editor for JSF.

Another very powerful feature in JavaFX is binding. Any changes in the model are automatically updated in the UI, it’s possible to extend the same to JSF. No longer you have to specify what components to render via Ajax, it will be done automatically by the application. More about this feature from Alex Smirnov’s blog.

We already have a first version of JavaFX as JSF VDL (we are still looking for better name, any suggestions?), and here is a quick example. When a button is clicked, the label Hello X is updated with the number of clicks.

var x = 0;
var bindVal = "Hello";
 
function init(){
   FxPage{
      content : [
         FxForm{
                content : [
                    FxOutputLabel{
                        value : bind bindVal
                    },
                    FxCommandButton{
                        value : "Button"
                        actionListener : function() : String{
                            bindVal = "Hello {x++}";
			    return null;
                        }
                    }
                ]
            }
        ]
    }
}

JavaFX script above is processed and a standard JSF UI component tree is created as with Facelets.

For now the model is created inside the JavaFX file, but we are working on allowing to bind to JSF managed beans or CDI beans.

As you can see JavaFX is a very powerful UI language. We will make this library available soon. It works with JSF 2.

You can read more about JavaFX as JSF VDL for Alex Smirnov’s blog.

Several members of the RichFaces and JBoss Tools teams will be presenting at the Modern Java Technologies Workshop in Minsk, Belarus. From the RichFaces team Nick Belaevski and Ilya Shaikovsky will be discussing Java Server Faces 2.0, and then two topics on RichFaces 3.3.X and 4.0.X.

More information (more information in Russian).

To register, send an email to conference@exadel.com

Today I got a copy of JSF 1.2 Components book (PACKT Publishing) by Ian Hlavats. I’m going to read and write a review for the book on my blog. The book covers various JSF components including RichFaces, MyFaces, IceFaces, Seam, and standard JSF. Read more about the book here.

You can also download a free Facelets Components chapter.

JSF Summit 2009 is starts tomorrow in Orlando, Florida. I’m doing a session on Ajax Applications with RichFaces and JSF2 on Wednesday, at 11:00am. Stop by and say hello.

If you are still interested to attend the conference, I can get you a 50% discount of the registration price.

As an extension to Fiji, we have wrapped JavaFX widgets as JSF components. Here are two screen shots of a chart and video player widgets (note: this is still only an internal project).

Page code:

<fiji:javaFx applicationClass="com.exadel.fiji.Chart" 
   archive="/javafx/helloJfx.jar" 
   bgcolor="#FFFFFF" 
   draggable="true" 
   height="420" 
   name="BarChartExample" width="580">
</fiji:javaFx>

Page code:

<fiji:javaFx applicationClass="com.exadel.fiji.VideoPlayer" 
   archive="/javafx/helloJfx.jar" 
   bgcolor="#FFFFFF" 
   draggable="true"  
   height="400" 
   name="JavaFXVideoPlayer" 
   width="640">
       <f:param name="movie" value="#{bean.movie}"/>
</fiji:javaFx>

If you are starting to learn JSF 2, this post by Andy Schwartz is an excellent place to start. It summarises and gives an excellent overview of features in JSF 2.

If you have been using JSF for a while, you know that in some instances, request scope is too short and session scope is too long to store objects. This of course applies to a situation where you need to keep some data for longer than a request but less than session. If you use Seam or Spring, then you get conversation and view scopes which solve this problem. JSF 2.0 also comes with view scope. If you are using JSF 1.2 with just managed beans, and at this point I’m guessing that’s basically everyone (meaning you are not using JSF 2 yet), then you are kind of stuck.

Luckily RichFaces comes with a view scope. View scope means you can keep the object alive as long as you are staying on the view (page). The bean is saved as an attribute of the JSF view. When the JSF view (its state) is saved, the bean is saved as well. When the view is restored, the bean is restored and placed back in request scope.

There are two ways place a bean in view scope. One is using a4j:keepAlive tag, second is to use @KeepAlive annotation. Let’s see how both are used. Our one page application is a list of any random words. Words can added and deleted (more screen shots at the end).

Bean:

package example;
 
import java.util.ArrayList;
import javax.annotation.PostConstruct;
 
public class Bean {
   private ArrayList <String> words;
   private String selectedWord;
   private String newWord;
 
   public void delete (){
	words.remove(selectedWord);
   }
   public void add (){
	words.add(newWord);
   }
   @PostConstruct
   public void create () {
	words = new ArrayList <String>();
	words.add("Hello");
	words.add("World");
	words.add("Peace");
	words.add("Soccer");
	words.add("JSF");    
   }
   public String getNewWord() {
	return newWord;
   }
   public void setNewWord(String newWord) {
	this.newWord = newWord;
   }
   public ArrayList<String> getWords() {
	return words;
   }
   public void setSelectedWord(String selectedWord) {
	this.selectedWord = selectedWord;
   }
}

Registering the bean, placing it in request scope:

<managed-bean>
  <managed-bean-name>bean</managed-bean-name>
  <managed-bean-class>example.Bean</managed-bean-class>
  <managed-bean-scope>request</managed-bean-scope>
 </managed-bean>

JSF page:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<h:form>
   <a4j:keepAlive beanName="bean" />
   <h:panelGrid columns="2">
	<h:inputText value="#{bean.newWord}" size="8" />
	<a4j:commandButton action="#{bean.add}" value="Add" reRender="table" />
   </h:panelGrid>
   <rich:dataTable id="table" value="#{bean.words}" var="_word">
       <h:column>
	   <a4j:commandLink action="#{bean.delete}" value="Delete" 
                  reRender="table">
		<f:setPropertyActionListener value="#{_word}"
			target="#{bean.selectedWord}" />
	   </a4j:commandLink>
	</h:column>
	<h:column>
		<h:outputText value="#{_word}" />
	</h:column>
   </rich:dataTable>
</h:form>

On line 2, a4j:keepAlive tag points to managed bean name that will be saved with the view thus giving us view scope. When this page is restored (as a result of add or delete action), bean managed bean will be re-created and placed in request scope. Without the view scope, after any action add or delete we would always see the original list of values as the bean would be re-created on each request.

Instead of using a4j:keepAlive tag, we can also use @org.ajax4jsf.model.KeepAlive annotation:

package example;
 
import java.util.ArrayList;
import javax.annotation.PostConstruct;
 
@org.ajax4jsf.model.KeepAlive
public class Bean {
   private ArrayList <String> words;
   private String selectedWord;
   private String newWord;
 
   // rest of code...
}

Lastly, a4j:keepAlive tag comes with just one attribute:

<a4j:keepAlive beanName="bean" ajaxOnly="true"/>

When set to true, bean value is restored for AJAX requests only.

Screen shots

Running for the first time:

After entering ‘Flowers’ and clicking Add:

After deleting ‘JSF’: