Thursday Dec 11, 2008

TOTD # 59: Alternative JSF implementations on GlassFish - MyFaces and Tomahawk


GlassFish comes bundled with an industry grade implementation of Java Server Faces codenamed Mojarra. It is the most complete, up-to-date and well-tested JSF implementation and used pretty extensively. GlassFish v2 and v3 Prelude ships with JSF 1.2.x-compliant implementation that is defined as part of Java EE 5. GlassFish v3 trunk contains JSF 2.0-compliant implementation that is getting defined as part of Java EE 6. The latest version of Mojarra can be installed from the Update Center.

But GlassFish does not restrict you to Mojarra and instead it embraces other JSF implementations easily. This blog uses MyFaces, an alternate JavaServer Faces implementation from Apache, to demonstrate that. If you are interested in a brief summary of what it takes to use these alternate implementations on GlassFish then scroll to the end of this entry.

MyFaces also provides several component libraries such as Tomahawk, Trinidad, and Tobago for building web applications. This blog shows how MyFaces Tomahawk samples can be deployed on GlassFish v2 and v3. The basic integration hooks between GlassFish and other JSF implementations remain the same and are independent of the component library.

Lets get started and understand all the glory!

Download MyFaces Tomahawk samples from here. The download consists of 4 WAR files and they are unzipeed in the current directory. So create a new directory and then unzip the bundle if you want to organize it slightly better. The getting Started instructions require you to copy "simple.war" where as the actual WAR filename is "myfaces-example-simple-1.1.8.war". Anyway, we are going to deploy this sample on GlassFish v2, v3 Prelude, and v3 trunk and what needs to be done to use the MyFaces implementation bundled within the WAR.
  1. Deploy using Mojarra on GlassFish v2
    1. Deploying "myfaces-example-simple-1.1.8.war" on GlassFish v2 using "asadmin deploy myfaces-example-simple-1.1.8.war" and it shows the following message:

      [#|2008-12-05T11:00:43.710-0800|INFO|sun-appserver9.1|javax.enterprise.system.tools.deployment|_ThreadID=22;_ThreadName=Thread-43;|
      deployed with moduleid = myfaces-example-simple-1.1.8|#]

      [#|2008-12-05T11:00:44.296-0800|INFO|sun-appserver9.1|javax.enterprise.resource.webcontainer.jsf.config|_ThreadID=21;
      _ThreadName=httpWorkerThread-4848-1;/myfaces-example-simple-1.1.8;|Initializing Sun's JavaServer Faces implementation (1.2_04-b20-p03) for context '/myfaces-example-simple-1.1.8'|#]

      The bold text indicates that Mojarra 1.2 bundled with GlassFish v2 is used as the JSF runtime, the exact version is shown in the bold text. The deployed web application is accessible at "http://localhost:8080/myfaces-example-simple-1.1.8/home.jsf" and looks like:



      The following error message is shown as you click through the samples:

      [#|2008-12-03T16:27:43.935-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=24;_ThreadName=httpSSLWorkerThread-8080-1;|
      2008-12-03 16:27:43,935 [httpSSLWorkerThread-8080-1] INFO  org.apache.myfaces.shared_tomahawk.config.MyfacesConfig - Starting up Tomahawk on the MyFaces-JSF-Implementation
      |#]

      [#|2008-12-03T16:27:43.935-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=24;_ThreadName=httpSSLWorkerThread-8080-1;|
      2008-12-03 16:27:43,935 [httpSSLWorkerThread-8080-1] ERROR org.apache.myfaces.shared_tomahawk.config.MyfacesConfig - Both MyFaces and the RI are on your classpath. Please make sure to use only one of the two JSF-implementations.

      This error message is generated by MyFaces and may be ignored. I think the message should be a WARNING instead of an ERROR.
  2. Deploy using MyFaces on GlassFish v2
    1. Create a directory "simple" and unjar "myfaces-example-simple-1.1.8.war" in there.
    2. Add "WEB-INF/sun-web.xml" and specify the contents as:

      <?xml version="1.0" encoding="UTF-8"?>
      <!DOCTYPE sun-web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Application Server 8.1 Servlet 2.4//EN" "http://www.sun.com/software/appserver/dtds/sun-web-app_2_4-1.dtd">
      <sun-web-app>
      <class-loader delegate="false"/>
      <property name="useMyFaces" value="true"/>
      </sun-web-app>

      The key point to notice is the property name "useMyFaces". The name is slightly mis-leading because the switch essentially tells GlassFish runtime to use the bundled Java Server Faces runtime and is not restricted to MyFaces only. This is fixed in GlassFish v3 and is discussed later.
    3. Create a WAR file in "simple" directory as "jar cvf myfaces-simple-v2.war \*".
    4. Deploy the generated WAR on GlassFish v2 as "asadmin deploy myfaces-simple-v2.war". It shows the following message:

      . . .

      [#|2008-12-05T11:11:25.615-0800|INFO|sun-appserver9.1|javax.enterprise.system.tools.deployment|_ThreadID=24;_ThreadName=Thread-257;|
      deployed with moduleid = myfaces-simple-v2|#]

      [#|2008-12-05T11:11:26.266-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|
      2008-12-05 11:11:26,266 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Reading standard config org/apache/myfaces/resource/standard-faces-config.xml
      |#]

      [#|2008-12-05T11:11:26.290-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|
      2008-12-05 11:11:26,290 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Reading config jar:file:/Users/arungupta/tools/glassfish/v2/ur2/glassfish/domains/domain1/applications/j2ee-modules/myfaces-simple-v2/WEB-INF/lib/tomahawk-1.1.8.jar!/
      META-INF/faces-config.xml
      |#]

      [#|2008-12-05T11:11:26.309-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:26,308 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Reading config /WEB-INF/examples-config.xml
      |#]

      [#|2008-12-05T11:11:26.337-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:26,337 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Reading config /WEB-INF/testSuite-config.xml
      |#]

      [#|2008-12-05T11:11:26.349-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:26,349 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Starting up MyFaces-package : myfaces-api in version : 1.1.6 from path : file:/Users/arungupta/tools/glassfish/v2/ur2/glassfish/domains/domain1/applications/j2ee-modules/myfaces-simple-v2/WEB-INF/lib/myfaces-api-1.1.6.jar
      |#]

      [#|2008-12-05T11:11:26.350-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:26,350 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Starting up MyFaces-package : myfaces-impl in version : 1.1.6 from path : file:/Users/arungupta/tools/glassfish/v2/ur2/glassfish/domains/domain1/applications/j2ee-modules/myfaces-simple-v2/WEB-INF/lib/myfaces-impl-1.1.6.jar
      |#]

      [#|2008-12-05T11:11:26.350-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:26,350 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - MyFaces-package : tomahawk-sandbox not found.
      |#]

      [#|2008-12-05T11:11:26.350-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:26,350 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Starting up MyFaces-package : tomahawk in version : 1.1.8 from path : file:/Users/arungupta/tools/glassfish/v2/ur2/glassfish/domains/domain1/applications/j2ee-modules/myfaces-simple-v2/WEB-INF/lib/tomahawk-1.1.8.jar
      |#]

      . . .

      [#|2008-12-05T11:11:27.069-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:27,069 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.shared_impl.config.MyfacesConfig - Starting up Tomahawk on the RI-JSF-Implementation.
      |#]

      [#|2008-12-05T11:11:27.069-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:27,069 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.shared_impl.config.MyfacesConfig - Starting up Tomahawk on the MyFaces-JSF-Implementation
      |#]

      [#|2008-12-05T11:11:27.070-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:27,070 [httpWorkerThread-4848-1] ERROR org.apache.myfaces.shared_impl.config.MyfacesConfig - Both MyFaces and the RI are on your classpath. Please make sure to use only one of the two JSF-implementations.
      |#]

      [#|2008-12-05T11:11:27.070-0800|INFO|sun-appserver9.1|javax.enterprise.system.stream.out|_ThreadID=21;_ThreadName=httpWorkerThread-4848-1;|2008-12-05 11:11:27,070 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.webapp.StartupServletContextListener - ServletContext '/Users/arungupta/tools/glassfish/v2/ur2/glassfish/domains/domain1/applications/j2ee-modules/myfaces-simple-v2/' initialized.
      |#]

      The first thing to note is that the message "Initializing Sun's JavaServer Faces implementation (1.2_04-b20-p03)" is not shown. That indicates Mojarra is not used as the JSF runtime. Then you can see how MyFaces 1.1.6 API and Implementation are loaded, Tomahaw 1.1.8 is loaded and finally started using MyFaces JSF implementation.

      The main page from this deployed application at "http://localhost:8080/myfaces-simple-v2" is very similar as shown below:

  3. Deploy using Mojarra on GlassFish v3 Prelude - This is very similar experience as with GlassFish v2.
    1. Deploying "myfaces-example-simple-1.1.8.war" on GlassFish v3 shows the following message:

      Dec 5, 2008 11:27:17 AM com.sun.faces.config.ConfigureListener contextInitialized
      INFO: Initializing Mojarra (1.2_10-b01-FCS) for context '/myfaces-example-simple-1.1.8'
      Dec 5, 2008 11:27:18 AM com.sun.enterprise.web.WebApplication start
      INFO: Loading application myfaces-example-simple-1.1.8 at /myfaces-example-simple-1.1.8
      Dec 5, 2008 11:27:18 AM org.glassfish.deployment.admin.DeployCommand execute
      INFO: Deployment of myfaces-example-simple-1.1.8 done is 3470 ms

      The bold text clearly indicates that Mojarra 1.2 bundled, exact version shown in the bold text, with GlassFish v3 is used as the JSF runtime. The deployed web application is accessible at "http://localhost:8080/myfaces-example-simple-1.1.8/home.jsf". Viewing the sample in browser shows:

      Dec 5, 2008 11:54:54 AM  
      INFO: 2008-12-05 11:54:54,083 [httpWorkerThread-8080-0] INFO  org.apache.myfaces.shared_tomahawk.config.MyfacesConfig - Starting up Tomahawk on the RI-JSF-Implementation.

      Dec 5, 2008 11:54:54 AM  
      INFO: 2008-12-05 11:54:54,083 [httpWorkerThread-8080-0] INFO  org.apache.myfaces.shared_tomahawk.config.MyfacesConfig - Starting up Tomahawk on the MyFaces-JSF-Implementation

      Dec 5, 2008 11:54:54 AM  
      INFO: 2008-12-05 11:54:54,083 [httpWorkerThread-8080-0] ERROR org.apache.myfaces.shared_tomahawk.config.MyfacesConfig - Both MyFaces and the RI are on your classpath. Please make sure to use only one of the two JSF-implementations.

      and may be ignored. None of the messages that indicate classloading, as shown for GlassFish v2 above, are displayed. I suspect these are standard messages displayed by MyFaces without taking into consideration that an alternate JSF runtime can be used to run these samples.
  4. Deploy using MyFaces on GlassFish v3 Prelude - There is no way to override JSF implementation with GlassFish v3 Prelude. So even though deploying "myfaces-simple-v2.war" will work fine but viewing the web page at "http://localhost:8080/myfaces-simple-v2/" will show the following exception:



    Basically, a web application cannot use MyFaces implementation on GlassFish v3 Prelude. However Mojarra provides a fully-compliant and feature-rich JSF implementation and is already baked in GlassFish v3 Prelude.
  5. Deploy using Mojarra on GlassFish v3 Trunk
    1. Pick your GlassFish v3 Build Flavor, this blog uses the trunk.
    2. Deploy the original sample as "asadmin deploy myfaces-example-simple-1.1.8.war" and the following log messages are shown:

      Dec 5, 2008 12:35:17 PM com.sun.faces.config.ConfigureListener contextInitialized
      INFO: Initializing Mojarra 2.0.0 (SNAPSHOT b05) for context '/myfaces-example-simple-1.1.8'
      Dec 5, 2008 12:35:18 PM org.apache.catalina.core.ApplicationContext log
      SEVERE: WebModule[/myfaces-example-simple-1.1.8]PWC1275: Exception sending context initialized event to listener instance of class com.sun.faces.config.ConfigureListener
      java.lang.NoClassDefFoundError: com/sun/facelets/tag/jsf/ComponentHandler
              at java.lang.ClassLoader.defineClass1(Native Method)
              at java.lang.ClassLoader.defineClass(ClassLoader.java:675)
              at java.security.SecureClassLoader.defineClass(SecureClassLoader.java:124)
              at org.glassfish.web.loader.WebappClassLoader.findClass(WebappClassLoader.java:974)

      This happens because the application has dependencies on internal classes of Facelets 1.1.x. That makes the application non-compatible with Mojarra 2.x which comes bundled with Facelets 2.0.
    3. Lets instruct the application to disable the Facelets 2.0 baked in Mojarra by adding the following application wide context parameter in "web.xml":

      <context-param>
             <param-name>javax.faces.DISABLE_FACELET_JSF_VIEWHANDLER</param-name>
             <param-value>true</param-value>
       </context-param>

      Now the Facelets 1.1.x classes bundled with the application are used. With this change, the application gets deployed correctly and shows the following log message:

      Dec 5, 2008 2:50:21 PM com.sun.faces.config.ConfigureListener contextInitialized
      INFO: Initializing Mojarra 2.0.0 (SNAPSHOT b05) for context '/myfaces-simple-v3'
      Dec 5, 2008 2:50:21 PM com.sun.enterprise.web.WebApplication start
      INFO: Loading application myfaces-simple-v3 at /myfaces-simple-v3
      Dec 5, 2008 2:50:21 PM org.glassfish.deployment.admin.DeployCommand execute
      INFO: Deployment of myfaces-simple-v3 done is 1513 ms

      The important thing to note here is that Mojarra 2.0.0 implementation (as indicated by the bold text) is used as JSF runtime. This is the newest and the greatest runtime that implements JSF 2.0 specification and baked in GlassFish v3 trunk. The main page from this deployed application at "http://localhost:8080/myfaces-simple-v3/" looks like:

  6. Deploy using MyFaces on GlassFish v3 Trunk
    1. Download the latest GlassFish v3 Nightly.
    2. Lets deploy the WAR file previously created as "asadmin deploy myfaces-simple-v2.war". The main page of the application is accessible at "http://localhost:8080/myfaces-simple-v2".
    3. The "useMyFaces" property, as specified in "sun-web.xml", is expected to work for any bundled JSF implementation. The recommended way to deploy such a web application in GlassFish v3 is to use the property "useBundledJsf". The updated "sun-web.xml" is shown below:

      <?xml version="1.0" encoding="UTF-8"?>
      <!DOCTYPE sun-web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Application Server 8.1 Servlet 2.4//EN" "http://www.sun.com/software/appserver/dtds/sun-web-app_2_4-1.dtd">
      <sun-web-app>
      <class-loader delegate="false"/>
      <property name="useBundledJsf" value="true"/>
      </sun-web-app>
    4. Create a WAR file in "simple" directory as "jar cvf myfaces-simple-v3-usebundled.war \*".
    5. Deploy the generated WAR on GlassFish v3 as "asadmin deploy myfaces-simple-v3-usebundled.war". It shows the following message:

      . . .

      Dec 5, 2008 3:19:54 PM  
      INFO: 2008-12-05 15:19:54,786 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Reading config jar:file:/Users/arungupta/tools/glassfish/v3/snapshot/glassfish/domains/domain1/applications/myfaces-simple-v3-usebundled/WEB-INF/lib/tomahawk-1.1.8.jar!/
      META-INF/faces-config.xml

      Dec 5, 2008 3:19:54 PM  
      INFO: 2008-12-05 15:19:54,806 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Reading config /WEB-INF/examples-config.xml

      Dec 5, 2008 3:19:54 PM  
      INFO: 2008-12-05 15:19:54,828 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Reading config /WEB-INF/testSuite-config.xml

      Dec 5, 2008 3:19:54 PM  
      INFO: 2008-12-05 15:19:54,841 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Starting up MyFaces-package : myfaces-api in version : 1.1.6 from path : file:/Users/arungupta/tools/glassfish/v3/snapshot/glassfish/domains/domain1/applications/myfaces-simple-v3-usebundled/WEB-INF/lib/myfaces-api-1.1.6.jar

      Dec 5, 2008 3:19:54 PM  
      INFO: 2008-12-05 15:19:54,841 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Starting up MyFaces-package : myfaces-impl in version : 1.1.6 from path : file:/Users/arungupta/tools/glassfish/v3/snapshot/glassfish/domains/domain1/applications/myfaces-simple-v3-usebundled/WEB-INF/lib/myfaces-impl-1.1.6.jar

      Dec 5, 2008 3:19:54 PM  
      INFO: 2008-12-05 15:19:54,841 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - MyFaces-package : tomahawk-sandbox not found.

      Dec 5, 2008 3:19:54 PM  
      INFO: 2008-12-05 15:19:54,841 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.config.FacesConfigurator - Starting up MyFaces-package : tomahawk in version : 1.1.8 from path : file:/Users/arungupta/tools/glassfish/v3/snapshot/glassfish/domains/domain1/applications/myfaces-simple-v3-usebundled/WEB-INF/lib/tomahawk-1.1.8.jar

      . . .

      Dec 5, 2008 3:19:55 PM  
      INFO: 2008-12-05 15:19:55,763 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.shared_impl.config.MyfacesConfig - Starting up Tomahawk on the RI-JSF-Implementation.

      Dec 5, 2008 3:19:55 PM  
      INFO: 2008-12-05 15:19:55,764 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.shared_impl.config.MyfacesConfig - Starting up Tomahawk on the MyFaces-JSF-Implementation

      Dec 5, 2008 3:19:55 PM  
      INFO: 2008-12-05 15:19:55,764 [httpWorkerThread-4848-1] ERROR org.apache.myfaces.shared_impl.config.MyfacesConfig - Both MyFaces and the RI are on your classpath. Please make sure to use only one of the two JSF-implementations.

      Dec 5, 2008 3:19:55 PM  
      INFO: 2008-12-05 15:19:55,764 [httpWorkerThread-4848-1] INFO  org.apache.myfaces.webapp.StartupServletContextListener - ServletContext '/Users/arungupta/tools/glassfish/v3/snapshot/glassfish/domains/domain1/applications/myfaces-simple-v3-usebundled/' initialized.

      Dec 5, 2008 3:19:55 PM com.sun.enterprise.web.WebApplication start
      INFO: Loading application myfaces-simple-v3-usebundled at /myfaces-simple-v3-usebundled
      Dec 5, 2008 3:19:55 PM org.glassfish.deployment.admin.DeployCommand execute
      INFO: Deployment of myfaces-simple-v3-usebundled done is 1994 ms

      The first thing to note is that the message "Initializing Sun's JavaServer Faces implementation (1.2_04-b20-p03)" is not shown. That indicates Mojarra is not used as the JSF runtime. Then you can see how MyFaces 1.1.6 API and Implementation are loaded, Tomahawk 1.1.8 is loaded and finally started using MyFaces JSF implementation.

      The main page from this deployed application at "http://localhost:8080/myfaces-simple-v3-usebundled" is very similar as shown below:



Here is a brief summary of how MyFaces/Tomahawk sample is deployed using Mojarra and MyFaces on GlassFish:

JSF Implementations
Mojarra MyFaces
GlassFish v2 Default "useMyFaces" property in "sun-web.xml"
GlassFish v3 Prelude Default Not supported
GlassFish v3 Trunk Disable Facelets 2.0 in "web.xml" "useMyFaces" OR "useBundledJsf" property in "sun-web.xml"
Disable Facelets 2.0 in "web.xml" (only for Facelets 1.1.x dependencies)

The steps described above for MyFaces can be used with alternate JSF implementations as well. Which JSF implementation do you use ?

Just like Tomahawk components, Trinidad and Tobago libraries should work with Mojarra as well. Have you tried them ?

Technorati: glassfish javaserverfaces mojarra apache myfaces tomahawk

Wednesday Nov 19, 2008

TOTD #54: Java Server Faces with Eclipse IDE


Ed pointed me to this excellent tutorial that explains how JavaServer Faces applications can be easily created using Eclipse IDE. The article clearly shows all the steps to create a Java Server Faces application and demonstrates the following JSF concepts:
  • How to register managed beans to a JSF application ?
  • Different templates for creating JSF pages
  • Validators
  • Resource Bundles
  • Navigation rules in faces-config.xml (very intuitive and easy-to-use)
  • Dependency injection
  • Value and Method Binding
Few code/snapshot mismatches but knowing that it's only version 0.3, it's a damn good job!

Couple of differences from the article:

First, I deployed all the samples on GlassFish v3 Prelude which has Mojarra 1.2 baked in. The screencast #28 explains how to configure GlassFish with Eclipse IDE.

Secondly, instead of using WTP, I used Eclipse 3.4 for Java EE developers which has built-in support for JSF 1.1 and 1.2 applications. So there is no need to download/configure JSP/JSTL libraries. Instead the libraries are specified during project creation as shown below:



And then let the server side provide JSF implementation by selecting radio button as shown below:



That's it, now the Mojarra baked in GlassFish v3 Prelude is used for JSF runtime.

The faces-config editor is really cool, intuitive and easy-to-use. Here is a snapshot:



Here is a snapshot of the project explorer window (package names are different from the original article):



And now finally the outputs from 4 JSF applications:












All of this using Mojarra and GlassFish v3 Prelude :)

Let us know your feedback on Mojarra at GlassFish Webtier forum, file bugs in Issue Tracker, and find the latest information about Mojarra at javaserverfaces.dev.java.net.

Technorati: totd javaserverfaces eclipse glassfish v3 mojarra

Thursday Oct 23, 2008

TOTD #51: Embedding Google Maps in Java Server Faces using GMaps4JSF


GMaps4JSF allows Google Maps to be easily integrated with any JSF application. This blog shows how to use this library with Mojarra - JSF implementation delivered from the GlassFish community.

TOTD #50 explains how to create a simple JSF 2.0 application and deploy on GlassFish v3 prelude using Mojarra 2.0 EDR2. The application allows to create a database of cities/country that you like. It uses integrated Facelets and the newly introduced JavaScript APIs to expose Ajax functionality. This blog shows how to extend that application to display a Google Map and Street View of the entered city using this library.
  1. Configure GMapsJSF library in the NetBeans project (created as described in TOTD #50)
    1. Download gmaps4jsf-core-1.1.jar.
    2. In the existing NetBeans project, right-click on the project, select Properties, Libraries, click on "Add JAR/Folder" and point to the recently download JAR.
    3. Configure Facelets support for this library. This is an important step since Facelets are the default viewing technology in JSF 2.0.
  2. In the NetBeans project, create a new Java class "server.CityCoordinates" that will use Google Geocoding APIs to retrieve latitude and longitude of the entered city. It also create a "details" entry by concatenating city and country name. Use the code listed below:

        private float latitude;
        private float longitude;
        private String details;
        @ManagedProperty(value="#{cities}")
        private Cities cities;

        private final String BASE_GEOCODER_URL = "http://maps.google.com/maps/geo?";
        private final String ENCODING = "UTF-8";
        private final String GOOGLE_MAPS_KEY = "GOOGLE_MAPS_API_KEY";
        private final String OUTPUT_FORMAT = "CSV";

        public String getLatLong() throws IOException {
            details = cities.getCityName() + ", " + cities.getCountryName();

            String GEOCODER_REQUEST =
                    BASE_GEOCODER_URL +
                    "q=" + URLEncoder.encode(details, ENCODING) +
                    "&key=" + GOOGLE_MAPS_KEY +
                    "&output=" + OUTPUT_FORMAT;
            BufferedReader reader = new BufferedReader(
                    new InputStreamReader(
                        new URL(GEOCODER_REQUEST).openStream()));
            String line = null;
            int statusCode = -1;
            while ((line = reader.readLine()) != null) {
                // 200,4,37.320052,-121.877636
                // status code,accuracy,latitude,longitude
                statusCode = Integer.parseInt(line.substring(0, 3));
                if (statusCode == 200) {
                    int secondComma = line.indexOf(",", 5);
                    int lastComma = line.lastIndexOf(",");
                    latitude = Float.valueOf(line.substring(secondComma+1, lastComma));
                    longitude = Float.valueOf(line.substring(lastComma+1));
                    System.out.println("Latitude: " + latitude);
                    System.out.println("Longitude: " + longitude);
                }
            }

            return "map";
        }

        // getters and setters

    "getLatLong()" method retrieves geocoding information using HTTP by passing the city and country name, Google Maps API key and CSV output format. The result is then processed to retrieve status code, latitude and longitude. Add the following annotation to this class:

    @ManagedBean(name="coords", scope="request")

    This ensures that "server.CityCoordinates" is injected as a managed bean in the runtime.
  3. Add a new button in "welcome.xhtml" right after "submit" button as:

    <h:commandButton action="#{coords.getLatLong}" value="map"/>
  4. Add a new page "map.xhtml" as:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:m="http://code.google.com/p/gmaps4jsf/">
        <head>
            <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAF9QYjrVEsD9al2QCyg8e-hTwM0brOpm-All5BF6PoaKBxRWWERRHQdtsJnNsqELmKZCKghs54I-0Uw" type="text/javascript"> </script>
        </head>
        <body>
            <m:map
                latitude="#{coords.latitude}"
                longitude="#{coords.longitude}"
                width="500px"
                height="300px"
                zoom="14"
                addStretOverlay="true">
                <m:marker draggable="true">
                    <m:eventListener eventName="dragend" jsFunction="showStreet"/>
                </m:marker>
                <m:htmlInformationWindow htmlText="#{coords.details}"/>
                <m:mapControl name="GLargeMapControl" position="G_ANCHOR_BOTTOM_RIGHT"/>
                <m:mapControl name="GMapTypeControl"/>
            </m:map>
            <br/> <br/>
            <m:streetViewPanorama width="500px" height="200px"
                                  latitude="#{coords.latitude}" longitude="#{coords.longitude}"
                                  jsVariable="pano1" />

            <script type="text/javascript">
                function showStreet(latlng) {
                    pano1.setLocationAndPOV(latlng);
                }

            </script>
            <form jsfc="h:form">
                <input jsfc="h:commandButton" action="back" value="Back"/>
            </form>
        </body>
    </html>

    The code is borrowed and explained in An Introduction to GMaps4JSF. Basically the code displays a Google Map and Street View where the latitude and longitude are bound by "server.CityCoordinates" managed bean. And these attributes are populated using the geocoding information earlier. The Street View corresponds to marker in the Map which is draggable. So if the marker is dropped to a different location in the map then the Street View changes accordingly.
  5. Add new navigation rules to "faces-config.xml" as:

        <navigation-rule>
            <from-view-id>/welcome.xhtml</from-view-id>
            <navigation-case>
                <from-outcome>map</from-outcome>
                <to-view-id>/map.xhtml</to-view-id>
            </navigation-case>
        </navigation-rule>
        <navigation-rule>
            <from-view-id>/map.xhtml</from-view-id>
            <navigation-case>
                <from-outcome>back</from-outcome>
                <to-view-id>/welcome.xhtml</to-view-id>
            </navigation-case>
        </navigation-rule>
That's it, now your application is ready!

Now when a city and country name are entered on "welcome.xhtml" and "map" button is clicked then the corresponding Google Map along with the street view are shown in next page.

If "San Jose" is entered on "http://localhost:8080/Cities/faces/welcome.xhtml" then the following page is shown:



Clicking on "map" button shows the following page:



If the marker is drag/dropped to 280 and 87 junction, then the page looks like:



Some other useful pointers:
Have you tried your JSF 1.2 app on Mojarra 2.0 ? Drop a comment on this blog if you have.

File JSF related bugs here using "2.0.0 EDR2" version and ask your questions on webtier@glassfish.dev.java.net.

Please leave suggestions on other TOTD (Tip Of The Day) that you'd like to see. An archive of all the tips is available here.

Technorati: totd javaserverfaces mojarra glassfish v3 netbeans gmaps4jsf googlemaps

TOTD #50: Mojarra 2.0 EDR2 is now available - Try them with GlassFish v3 and NetBeans 6.5


Yaaay, 50th tip!! The previous 49 tips are available here.

Mojarra EDR2 is now available - download binary and/or source bundle!

GlassFish v2 UR2 ships with Mojarra 1.2.0_04 and v3 prelude comes with 1.2.0_10. The Mojarra binaries in both v2 and v3 can be easily replaced by the new ones as described in Release Notes. Additionally, TOTD# 47 explains how to get started with Mojarra 2.0 on GlassFish v2. This blog will guide you through the steps of installing these bits on GlassFish v3 Prelude and show how to use them with NetBeans IDE.
  1. Download latest GlassFish v3 prelude and unzip.
  2. Start Updatetool from "bin" directory. The first run of the tool downloads and installs the tool. Start the tool by typing the command again to see the screen shown below:


  3. Click on "Update", "Accept" the license and the component is then installed in GlassFish directory. Optionally, you can click on "Installed Components" and then verify that bits are installed correctly.
  4. An EDR2 compliant application can now be directly deployed in these GlassFish v3 bits. There is some work required in order to use code completion, auto-fixing of Imports  and similar features in NetBeans 6.5 RC. The steps below describe that.
    1. In "Tools", "Libraries", click on "New Library ...", enter the name "JSF2.0" as shown:

    2. Click on "OK", "Add JAR/Folder..." and pick "glassfishv3-prelude/glassfish/modules/jsf-api.jar", click on "OK".
    3. Right-click on the NetBeans project, select "Properties", "Libraries" and remove "JSTL1.1" and "JSF1.2" libraries.
    4. Click on "Add Library ...", select the newly created "JSF2.0" library, click "Add Library" and then "OK".
  5. In order to run "Cities" application on these GlassFish bits copy MySQL Connector/J jar in "glassfishv3-prelude/glassfish/lib" directory and then deploy the application.

Here are some pointers to get started:

Have you tried your JSF 1.2 app on Mojarra 2.0 ? Drop a comment on this blog if you have.

File JSF related bugs here using "2.0.0 EDR2" version and ask your questions on webtier@glassfish.dev.java.net.

Please leave suggestions on other TOTD (Tip Of The Day) that you'd like to see. An archive of all the tips is available here.

Technorati: totd javaserverfaces mojarra glassfish v3 netbeans

Friday Oct 17, 2008

TOTD #49: Converting a JSF 1.2 application to JSF 2.0 - @ManagedBean


This is a follow up to TOTD #48 which showed how to convert a JSF 1.2 application to use new features of JSF 2.0. In this blog, we'll talk about a new annotation added to the JSF 2.0 specification - @ManagedBean.

@ManagedBean is a new annotation in the JSF 2.0 specification. The javadocs (bundled with the nightly) clearly defines the purpose of this annotation:

The presence of this annotation on a class automatically registers the class with the runtime as a managed bean class. Classes must be scanned for the presence of this annotation at application startup, before any requests have been serviced.

Essentially this is an alternative to <managed-bean> fragment in "faces-config.xml". This annotation injects a class in the runtime as a managed bean and then can be used accordingly.

Using this annotation, the following "faces-config.xml" fragment from our application:

<managed-bean>
        <managed-bean-name>cities</managed-bean-name>
        <managed-bean-class>server.Cities</managed-bean-class>
        <managed-bean-scope>request</managed-bean-scope>
    </managed-bean>
    <managed-bean>
        <managed-bean-name>dbUtil</managed-bean-name>
        <managed-bean-class>server.DatabaseUtil</managed-bean-class>
        <managed-bean-scope>request</managed-bean-scope>
        <managed-property>
            <property-name>cities</property-name>
            <value>#{cities}</value>
        </managed-property>
    </managed-bean>

is simplified to

@Entity
@Table(name = "cities")
@ManagedBean(name="cities", scope="request")
@NamedQueries({@NamedQuery(...)})
public class Cities implements Serializable {

and

@ManagedBean(name="dbUtil", scope="request")
public class DatabaseUtil {

    @ManagedProperty(value="#{cities}")
    private Cities cities;

The specification defines that managed bean declaration in "faces-config.xml" overrides the annotation.

A worthy addition to this annotation is "eager" attribute. Specifying this attribute on the annotation as @ManagedProperty(..., eager="true") allows the class to be instantiated when the application is started. In JSF 1.2 land, developers write their own ServletContextListeners to perform this kind of task. And this can of course be specified in "faces-config.xml" as <managed-bean eager="true">.

Section 11.5.1 of JSF 2.0 EDR2 specification defines several similar annotations that can be used to simplify "faces-config.xml".

Have you tried your JSF 1.2 app on Mojarra 2.0 ? Drop a comment on this blog if you have.

File JSF related bugs here using "2.0.0 EDR1" version and ask your questions on webtier@glassfish.dev.java.net.

Please leave suggestions on other TOTD (Tip Of The Day) that you'd like to see. An archive of all the tips is available here.

Technorati: totd javaserverfaces glassfish mojarra netbeans

Tuesday Oct 14, 2008

TOTD #48: Converting a JSF 1.2 application to JSF 2.0 - Facelets and Ajax


TOTD #47 showed how to deploy a JSF 1.2 application (using Facelets and Ajax/JSF Extensions) on Mojarra 2.0-enabled GlassFish.  In this blog we'll use new features added in JSF 2.0 to simplify our application:
Let's get started!
  • Re-create the app as defined in TOTD #47. This app is built using JSF 1.2 core components and Facelets. It uses JSF Extensions for adding Ajax capabilities. Lets change this app to use newer features of JSF 2.0.
  • Edit "faces-config.xml" and change the value of faces-config/@version from "1.2" to "2.0".
  • Remove the following fragment from "faces-config.xml":

        <application>
            <view-handler>com.sun.facelets.FaceletViewHandler</view-handler>
        </application>

    This fragment is no longer required because Facelets is the default view technology in JSF 2.0. But it's important to remember that JSF 2.0 Facelets is disabled by default if "WEB-INF/faces-config.xml" is versioned at 1.2 or older.
  • Remove the following code fragment from "web.xml":

            <init-param>
              <param-name>javax.faces.LIFECYCLE_ID</param-name>
              <param-value>com.sun.faces.lifecycle.PARTIAL</param-value>
            </init-param>

    This is only required if JSF Extensions APIs are used.
  • Edit "welcome.xhtml" and replace code with:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
          xmlns:ui="http://java.sun.com/jsf/facelets"
          xmlns:h="http://java.sun.com/jsf/html">
        <ui:composition>
            <h:head>
                <h1><h:outputText value="What city do you like ?" /></h1>
            </h:head>
           
            <h:body>
                <h:form prependId="false">
                    <h:panelGrid columns="2">
                        <h:outputText value="CityName:"/>
                        <h:inputText value="#{cities.cityName}"
                                     title="CityName"
                                     id="cityName"
                                     required="true"
                                     onkeyup="javax.faces.Ajax.ajaxRequest(this, event, { execute: 'cityName', render: 'city_choices'});"/>
                        <h:outputText value="CountryName:"/>
                        <h:inputText value="#{cities.countryName}" title="CountryName" id="countryName" required="true"/>
                    </h:panelGrid>
                   
                    <h:commandButton action="#{dbUtil.saveCity}" value="submit"/>
                    <br/><br/>
                    <h:outputText id="city_choices" value="#{dbUtil.cityChoices}"></h:outputText>
                   
                    <br/><br/>
                    <h:message for="cityName" showSummary="true" showDetail="false" style="color: red"/><br/>
                    <h:message for="countryName" showSummary="true" showDetail="false" style="color: red"/>
                </h:form>
            </h:body>
            <h:outputScript name="ajax.js" library="javax.faces" target="header"/>
        </ui:composition>
       
    </html>

    The differences are highlighted in bold and explained below:
    • "template.xhtml" is no longer required because standard tags are used to identify "head" and "body".
    • <h:head> and <h:body> are new tags defined in JSF 2.0. These tags define where the nested resources need to be rendered.
    • <h:outputScript> is a new tag defined in JSF 2.0 and allows an external JavaScript file to be referenced. In this case, it is referencing "ajax.js" script and is rendered in "head". The script file itself is bundled in "jsf-api.jar" in "META-INF/resources/javax.faces" directory. It adds Ajax functionality to the application.
    • "javax.faces.Ajax.ajaxRequest" function is defined in the JavaScript file "ajax.js". This particular function invocation ensures that "city_choices" is rendered when execute portion of the request lifecycle is executed for "cityName" field. The complete documentation is available in "ajax.js". Read more details about what happens in the background here.

    Notice how the Facelet is so simplified.
  • Refactor "result.xhtml" such that the code looks like as shown below:



    The changes are explained in the previous step, basically a clean Facelet using standard <h:head> and <h:body> tags and everything else remains as is.
And that's it, just hit "Undeploy and Deploy" in NetBeans IDE and your application should now get deployed on Mojarra 2.0-enabled GlassFish. To reiterate, the main things highlighted in this blog are:
  • Facelets are integrated in Mojarra 2.0.
  • New tags for resource re-location allow a simpler and cleaner facelet embedded in a JSF application.
  • JavaScript APIs provide a clean way to expose Ajax functionality in JSF app.
And all of these features are defined in the JSF 2.0 specification. So if you are using Mojarra then be assured that you are developing a standards compliant user interface.

Have you tried your JSF 1.2 app on Mojarra 2.0 ? Drop a comment on this blog if you have.
File JSF related bugs here using "2.0.0 EDR1" version and ask your questions on webtier@glassfish.dev.java.net.

Please leave suggestions on other TOTD (Tip Of The Day) that you'd like to see. An archive of all the tips is available here.

Technorati: totd javaserverfaces glassfish mojarra netbeans

Monday Oct 13, 2008

TOTD #47: Getting Started with Mojarra 2.0 nightly on GlassFish v2


Java Server Faces 2.0 specification (JSR 314, EDR2) and implementation (soon to be EDR2) are brewing. This blog shows how to get started with Mojarra - Sun's implementation of JSF.

GlassFish v2 comes bundled with Mojarra 1.2_04 which allows you to deploy a JSF 1.2 application. This blog explains how you can update GlassFish v2 to use Mojarra 2.0 nightly. And then it deploys a simple JSF 1.2-based application on this updated GlassFish instance, there by showing that your existing JSF 1.2 apps will continue to work with Mojarra 2.0-enabled GlassFish. This is an important step because it ensures no regression, unless it was a compatibility fix :)
  1. Re-create a simple JSF 1.2 application as described in TOTD #42, TOTD #45 and TOTD #46. This application allows to create a list of cities and store them in a backend database. It uses JSF Extensions to show suggestions, using Ajax, based upon the cities already entered and also uses Facelets as the view technology. Alternatively you can use any pre-existing JSF 1.2 application.
  2. Download Mojarra 2.0 latest nightly.
  3. Follow Release Notes to install the binary, the steps are summarized here for convenience (GlassFish installed in GF_HOME):
    1. Backup "GF_HOME/lib/jsf-impl.jar".
    2. Copy the new "jsf-api" and "jsf-impl" JARs from the unzipped Mojarra distribution to "GF_HOME/lib".
    3. Edit "GF_HOME/domains/<domain-name>/config/domain.xml" and add (or update the existing "classpath-prefix") 'classpath-prefix="${com.sun.aas.installRoot}/lib/jsf-api.jar" in the java-config element.
    4. Restart your server.
  4. Deploy the application on Mojarra 2.0-enabled GlassFish, that's it!
The application is accessible at "http://localhost:8080/Cities/faces/welcome.xhtml". Some of the screen captures are shown below.

If only "S" is entered in the city name, then the following output is shown:



Now with "San" ...



And another one with "De" ...



With JSF 2.0, Ajax capabilities and Facelets are now part of the specification and have already been integrated in Mojarra. A follow up blog entry will show how to use that functionality.

The downloaded Mojarra bundle has some samples (in "samples" folder) to get you started, have a look at them as well!

File JSF related bugs here using "2.0.0 EDR1" version and ask your questions on webtier@glassfish.dev.java.net.

Please leave suggestions on other TOTD (Tip Of The Day) that you'd like to see. A complete archive of all tips is available here.

Technorati: totd javaserverfaces glassfish mojarra netbeans
About

profile image
Arun Gupta is a technology enthusiast, a passionate runner, author, and a community guy who works for Oracle Corp.


Java EE 7 Samples

Stay Connected

Search

Archives
« April 2015
SunMonTueWedThuFriSat
   
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
  
       
Today