Exadel Fiji: new forum, issue tracker, JavaFX support, open source soon

Exadel Fiji extends JSF by allowing the use of Flex with JSF components and within a JSF page. It comes with ready-to-use charting components based on Flash as well as universal wrapper which allows to wrap any Flash component as JSF component.

We are working on Fiji version 2.0 which is going to be open source and also include a new tag to wrap any JavaFX applet as JSF component. We are going to host Fiji on exadel.org site. Work is still in progress but we have already made some changes to make it simpler for you to get involved. We now have a new Fiji forum on exadel.org (moved from Google Groups) and an issue tracker (Jira). This will enable you to request new features and enter any bugs you find. Once your register on exadel.org, you will be able to post on the forum and Jira.

JavaFX as JSF components

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).

screenshot_069

Page code:



screenshot_070

Page code:


       

Quick start with Fiji – RichFaces project for Flex template

I created a Fiji template project which you import into Eclipse, deploy and run. The applications demonstrates a number of Fiji charts and as well fiji:swf component which lets you import any Flash component into your JSF page.

What you need to do:
1. Download Fiji template.
2. In Eclipse, select File/Import/General/Existing Project Into Workspace
3. Click Next
4. Check Select archive file radio button and browse to the downloaded file.
5. Download Fiji from http://www.exadel.com/web/portal/download/fiji and add fiji-api-1.x.x..jar and fiji-ui-1.x.x to WEB-INF/lib directory in the template.
6. One last step is to deploy, I’m sure you know how to do it

A few notes:
– I’m using RichFaces 3.3.1 RC1, you can download a newer version if available.
– I tested the application with Tomcat 6

Fiji: RichFaces project for Flex

Check out Richfaces for Flex project, know as Exadel Fiji. Fiji allows to use JSF and Flex components together on the same page while binding Flex components to standard JSF managed beans. Fiji also provides 7 out-of-the-box Flash-based charting components.

Suppose you need to embed a Flex chart in your JSF page, to deliver richer content. This is all you need to do:

JSF page:


 
   
 

Managed bean:

public class BarChartBean {
  public BarChartBean() {
  }
  private Integer[] data;
  public Integer[] getData() {
	return data;
  }
  @PostConstruct
  public void init () {
	data = new Integer[5];
	data[0] = 5;
	data[1] = 2;
	data[2] = -3;
	data[3] = 10;
	data[4] = 9;
 }
}

You will get this:
screenshot01.png

The most important thing is that you bind these components to standard JSF managed beans (or Seam components).


More Fiji resources

Fiji product page
Fiji demo
Fiji charting components (JSF, Flex and Elections)
Fiji article at dzone.com

Fiji is free until December 31 – JSF and Flex together

Fiji is free until December 31.

Fiji allows to use JSF and Flex components together on the same page while binding Flex components to standard JSF managed beans. Fiji also provides 7 out-of-the-box Flash-based charting components.

Fiji resources:

Fiji product page
Fiji demo
Fiji charting components (JSF, Flex and Elections)
Fiji article at dzone.com

JSF, Flex, and Elections 2008

On the heels of elections this week, let me show you how you can use JSF and Flex to build nice looking Flash-based charts with elections results. To use JSF and Flex together, I will be using Exadel Fiji.

Let’s start with electoral votes and use a column chart. Below is an example using rich:columnChart component. It’s a static image here, but it’s actually a Flash component in a JSF page. As you move the mouse over columns, a tool tip is shown.

screenshot01.png


   
	
  

fiji:columnChart is a JSF component and renders a Flash chart. What’s really neat is that you can use standard JSF managed beans to provide data for the chart. Here is the managed bean (you can also use Seam components):

public class ColumnChart {

   private HashMap data1;
   private ArrayList barColor;

   public ColumnChart() {}

   @PostConstruct
   public void init() {
      data1 = new HashMap();
      data1.put("Obama", 349);
      data1.put("McCain", 163);

      barColor = new ArrayList();
      barColor.add("#003366");
   }
}

Easy, right?

Let’s move to bar chart using fiji:barChart component. This charts shows percentage of vote each candidate received.

screenshot02.png


	

Managed bean for the chart:

public class ColumnChart {

   private HashMap data2;
   private ArrayList barColor;

   public ColumnChart() {}

   @PostConstruct
   public void init() {
      data2 = new HashMap();
      data2.put("Obama", 53);
       data2.put("McCain", 46);

      barColor = new ArrayList();
      barColor.add("#003366");
   }
}

There are other charts in Fiji such as stackedBarChart, stackedColumnChart and lineChart. You can see them all in action here.

These charts come out of the box with Fiji. What if you want to use a Flash component that you built or someone else did? You can use fiji:swf component to wrap any existing Flash module. I’m going to use a pie chart component made by amCharts.com . I will use the pie chart to show popular vote numbers.

screenshot04.png


   
   
   
   

Using fiji:swf it’s possible to wrap any Flash component as JSF component. f:param is then used to provide data for the JSF component and in turn for the Flash module.

If you want to try Fiji, check out this article on dzone.com

Presenting at EclipseWorld 2008, Reston, VA

I will be presenting at EclipseWorld in Reston, VA (October 28-30, 2008). This will be my fourth time presenting at EclipseWorld. I have two sessions:

Wednesday, Oct. 29, 1:15 pm – 2:30 pm
Developing Rich Internet Applications With JBoss RichFaces and JBoss Developer Studio

Thursday, Oct. 30, 2:35 pm – 3:50 pm
Using JSF and Flex components together

Also, when the exhibit hall is open I’m going to be at the JBoss booth.

Herbstcampus conference – summary

Herbscampus is over, it was a great conference. I had a full day session on RichFaces as well as three other talks (RichFaces, RIA tools: RichFaces, Flex, and JavaFX and using JSF and Flex components together). I’m planning to offer public RichFaces training in Europe soon. Drop me a note if you want to find out more.

When you go to a conference like this and talk to people, only then you start to realize how many companies in Europe are using JBoss products and of course RichFaces. I participated in a panel discussion named “Web 2.0 – Dead End” (funny name) with Ed Burns and Jens Schumann. We basically discussed the various Web 2.0 tools and platforms and where we are headed in the near future. We discussed many points that I cover in my talk RIA Tools: JSF/RichFaces, Flex and JavaFX.

Exadel Fiji was well accepted. People are starting to understand that you can only do so much with a browser, and if you need to display rich charts and graphs, then Flex is a better solution. With Fiji, you use JSF and Flex components together, while binding Flex components to standard JSF managed beans. Here is an article I wrote on Fiji.

I guess a little bit surprisingly, but there was quite of interest in JavaFX. No one is using JavaFX to build any applications yet (version 1.0 is not out yet, end of this year), but many people are patiently waiting to see what Sun will offer in this new RIA tool and platform.

Finally, one of the most exciting things is that I got a chance to meet James Gosling and even had lunch with him.

Using JSF and Flex components together

Check out my article on JavaLobby.com on Exadel Fiji. With Fiji, you can easily use JSF and Flex components together while binding Flex components to standard JSF managed beans.

Also, check out all Fiji components in action: http://livedemo.exadel.com/fiji-demo/