JSF Central - Trinidad in Action - Part 1: An introduction
JSF Central

 
 Home 
 
 Products 
 
 Articles & Books 
 
 Resources 
Trinidad in Action
 
Trinidad in Action - Part 1: An introduction
by Matthias Wessendorf
03 Nov 2008 2:45 EDT

This is the first in a series of articles by Matthias Wessendorf about the Apache MyFaces Trinidad JSF component suite.


The Apache MyFaces Trinidad project, donated to the Apache Software Foundation by Oracle in 2006, offers you a pretty large JSF component library. After graduating from the Apache Incubator-the entry point for new projects at Apache-the Trinidad team became part of the large Apache MyFaces community. Since February 2007 the project has been an official Apache MyFaces subproject.

Trinidad - JSF components and more

Trinidad is not only a JSF library that contains over 100 Ajax-based components-it also provides tools and various framework features, which are used by other JSF libraries such as Oracle ADF Faces Rich Client. Some of the additional offerings are:

  • CSS Skinning Framework
  • Ajax API (client-side and server-side)
  • Dialog support
  • Maven 2 plugins
  • Testing framework

The library offers support for both major JSF standards: JSF 1.1 and JSF 1.2. You can find the latest download of all Trinidad versions (including a demo application) on the Trinidad website. There is also an online demo of all components.

Getting started with Trinidad - A hello world example

Apache MyFaces Trinidad supports multiple view technologies, such as JSP(X) or Facelets. The examples in this article are written with the Facelets syntax. The best way to introduce a new component set is to show a canonical "Hello World" example:

<tr:document xmlns:tr="http://myfaces.apache.org/trinidad" title="Hello World"...> <:facet name="metaContainer"> <script src="myOwn.js"/> ... </f:facet> ... <tr:outputText value="Hello Apache Trinidad!"/> ... <tr:inputText label="Enter your name" value="#{bean.name}" /> ... </tr:document>

The root component in this example is the <tr:document> component, which abstracts from the HTML markup. Internally the component renders the <html>, <body>, and <head> elements for you. You specify the actual page title using the title attribute of the component. Through a facet, called metaContainer, it is possible to integrate 3rd party JavaScript libraries, such as the Dojo Toolkit, or even custom JavaScript code. The metaContainer facet will be inserted into the <head> section of the rendered page.

It is important to note that the <tr:document> component also sends down the CSS and JavaScript resources, which are needed by the Trinidad library. You can customize the CSS that's used by the components. This will be be discussed when we introduce the CSS Skinning Framework feature in a later article.

Advanced components

Trinidad offers many components that are not part of the regular JSF standard, such as the <> and a pageable table. It also provides richer input components like <tr:inputDate>, <tr:selectManyShuttle> and <tr:inputNumberSpinbox> (shown in figure 1).

  Figure 1. The inputNumberSpinbox component
Figure 1. The inputNumberSpinbox component

Here's the source code for the spinbox example:

<tr:inputNumberSpinbox label="Number: " value="#{bean.numberValue}" minimum="1000" maximum="5000" />

Resources



RSS feed(all feeds)

The Editor's Desk
Podcasts
Inside Facelets
In the Trenches

Site version 1.83  Report web site problems

Copyright (C) 2003-2015 Virtua, Inc. All Rights Reserved. Java, JavaServer Faces, and all Java-based marks are trademarks or registered trademarks of Oracle Corporation. in the United States and other countries. Virtua, Inc. is independent of Oracle Corporation. All other trademarks are the sole property of their respective owners.