We're going to dive down into the rabbit hole, and follow up on Wesley Hales great video on deploying the mobile web optimized RichFaces TweetStream application to Red Hat's new, free PaaS offering OpenShift Express complete with JBoss AS 7 under the hood!

Whats Been Covered

There has already been a lot of coverage on OpenShift, and the mobile web optimized TweetStream app. So I'm not going to cover old ground. Check out these blogs and videos:

• JBoss & OpenShift Launch Page
• Video describing TweetStream presented by Wesley Hales and myself
• My blog explaining TweetStream in more detail
• Lukas's blog on getting tweetstream running on JBoss AS 7
• Wesley's 4 minutes to the cloud video on OpenShift Express, and TweetStream

OpenShift Express Updates

The RichFaces team is in the process of migrating our RichFaces Showcase application from Google App Engine to OpenShift Express, we'll have it ready soon. OpenShift offers a number of benefits over GAE, it is a real Java EE container, supports RichFaces push and has a much less restrictive API

Like many other free PaaS offerings OpenShift Express does have a few limitations that you need to consider. The most important ones for our application are limited threads, and JMS support. Note that all of these go away when you move up to OpenShift Flex!

RichFaces Push streamlined

When RichFaces 4.0.0.Final was released our push component was tied to JMS. This provides excellent enterprise level messaging capabilities, but unfortunately requires some setup to use. Since JMS is not provided by Express out of the box we needed to make some changes. So for 4.1.0 we are adding in a few options!

Starting with RichFaces 4.1.0.M1 RichFace Push can be decoupled from JMS. All that is needed is to set a context param:

<context-param>
    <param-name>org.richfaces.push.jms.disable</param-name>
    <param-value>true</param-value>
</context-param>

This will switch push to using an internal message queue. Look for further blogs, and documentation on this in the future. This is also one step closer to our plan to support CDI events as part of RichFaces Push.

Atmosphere updates on the way

Another change that was needed was moving to a snapshot version of Atmosphere. Atmosphere had a bug where it was creating a new thread for each request - ouch! Since OpenShift Express has limited threads available we needed a way around this.

Thankfully this issue was fixed in the Atmosphere 0.8-SNAPSHOT branch. This version of Atmosphere is due to be released in August, and RichFaces will use it by default once it is (likely in the 4.1.0.M2 release).

For now - if you are working on your own RichFaces push application and deploying to Express you'll need to override the Atmosphere version. This is simple enough with Maven, just add the following to your pom:

<dependency>
  <groupId>org.atmosphere</groupId>
  <artifactId>atmosphere-runtime</artifactId>
  <version>0.8-SNAPSHOT</version>
</dependency>

Infinispan cache LOCAL support

As was discussed in some of the linked blogs, the TweetStream application uses Infinispan under the covers to provide caching for the tweet data that we process. Infinispan in cluster mode uses jGroups to provide advanced communication support.

The problem here is the threading that accompanies this. For TweetStream it is important to make sure that you are using Infinispan in LOCAL mode. The latest TweetStream source has been updated to use the LOCAL cache.

Where to go from here

Now that we've gone over updates that are needed to take advantage of OpenShift Express I encourage you do give it a shot on your own. The source code is in the TweetStream git repo. Just follow the readme to setup and build it. Then deploy following the instructions in Wesley's video.

There will be more JBoss and OpenShift blogs and videos coming out, so stay tuned and check out JBoss and OpenShift page for the latest news.

[OpenShift Express] [JBoss OpenShift News] [OpenShift Twitter] [TweetStream git Repo] [RichFaces Twitter]

The JBoss World opening Keynote featured one of the best keynote demonstrations I've ever seen!! Part of that demonstration included a RichFaces application customized for the mobile web call TweetStream. We are going to talk about that app, why it works so well for mobile web development, and how you can get it running on your machine.

The entire JBoss World demonstration included many JBoss projects; such as JBoss AS, Infinispan, Hibernate OGM, CDI, and Errai. A video of the keynote & demo is available through the image on the left. The demo starts around 35:15 minutes in. And yes that WAS my real iPad/iPhone password :-)

The latest JBoss Assylum also features many of the developers giving behind the scenes perspective and humor. Each project will be providing blogs and code for its own part. You can get the latest at the JBoss World Keynote 2011 landing page, and follow along with the #jbwkeynote2011 twitter hashtag!

RichFaces TweetStream Application

Wesley Hales and I were looking for an application to show RichFaces 4 on mobile devices for our JUDCon presentation: Filling the Gap: Going Mobile With JBoss Technologies Today. We came up with a simple idea that would be instantly recognizable, allow audience participation, and with just enough UI complexity. It was around this time that JBoss Keynote was being planned, and TweetStream just fit right in!

TweetStream uses twitter4j to search and filter a stream of tweets containing a set of hashtags, and displays them to the user. It also keeps track and calculates the top 10 tweeters, and the top 10 hashtags. It then uses RichFaces Push to keep the UI updated with the latest content across devices.

In front of this Wesley and I built a set of RichFaces 4 views that provide advanced support for different mobile devices. We targeted webkit browsers that run on iPhones, iPads, BlackBerry, and Android devices. Each view is served through a single URL with device detection for a one bookmark solution. We achieved near native behavior using advanced HTML5/CSS3 techniques to process orientation layout changes, transitions, and more.

If you just can't wait to check out the demo on your own machine we have a version of it hosted on RedHat's OpenShift just follow this link http://bit.ly/tweetstream2. The Filling The Gap presentation was also recorded and contains Wesley and I discussing some of the apps details.

Source Code, OAuth, and IDE Integration

Instead of just explaining the various parts all up front lets just jump right into getting the source code, building it, deploying to JBoss AS and integrating it into JBoss Tools. We'll discuss some of the internals below, or is follow up blogs.

note: I'm assuming you have git, Maven, Java 1.6, JBoss AS 6 Final, and JBoss Tools 3.2 for IDE integration

The TweetStream source code is part the RichFaces organization on github.com. You can use git to clone the repo with: git clone git@github.com:richfaces/tweetstream.git. We'll talk about the structure after we get it running.

Twitter4j & OAuth

While we would love to let you use our twitter account credentials, that would not be so good. This means that you'll need to go through the steps outlined in the README to get twitter4j setup.

Twitter has a good step by step process for this on there OAuth page. Once you go through that you'll be able to update the twitter4j.properties file with these values:

oauth.consumerKey=**************************
oauth.consumerSecret=**************************
oauth.accessToken=**************************
oauth.accessTokenSecret=**************************

Once that's done all that is left is deploying the application!

JBoss AS 6

In the base /tweetstream directory run mvn package to build the standalone version of the application. You should now have the file /tweetstream/target/tweetstream.war. Copy this file to the $JBOSS_HOME/server/default/deploy directory.

At this point your can start the server, but I would recommend you start with the $JBOSS_HOME/bin/run.sh -b 0.0.0.0 if you want to access the server from external clients, like your mobile phone ;-)

Once the application starts up you can see it at http://localhost:8080/tweetstream. If you want to try out your smartphone or tablet you may need to modify you firewall to allow port 8080 through. Then access using your tablet, or phone at http://your.ip:8080/tweetstream.

Importing into JBoss Tools

Importing this project into JBoss Tools 3.2 is easy because it uses m2eclipse under the covers. All you need to do is choose File-->Import-->Existing Maven Project, and point it to where you cloned the source code. Eclipse will run through it's normal project import, and in a few minutes have the new project ready to go.

A couple of things to note:

• Add your JBoss AS 6 server as normal and you can configure TweetStream to be deployed
• You may see build issues in the /jbw project - I'll explain that in a minute

Structure and Key Files

Now that you have the application running, and hopefully imported into JBoss Tools lets talk about the structure and some of the key areas to look at.

As I alluded to above this application was originally just going to be for Wesley and my JUDCon talk. When it became part of the JBoss World Keynote demo we needed to support two different back-ends. We did this by using the power of CDI, and Maven to create two profiles. A standard profile for JUDCon, and a keynote version. Below is a brief explanation of the various modules:

/tweetstream  #Core application and views
/shared       #Classes files needed across the other two modules
/jbw          #Keynote specific source files to hook into the different backend

The build errors you get in eclipse for the /jbw directory is because of missing dependencies related to the keynote demo. At some point in the near future we'll be releasing the whole keynote demo, but for now Tweetstream is moduler enough to run on its own.

The way we were easily able to shift our backend so easily is a testament to not only JBoss, but to the Java EE as a whole. The pieces fit together well, and with CDI, and JSF we were able to swap in a completely different backend with very little effort.

As I said we'll be following up this blog with deep-dives into the various details, but for now, here are some things to take a look at:

Device detection

We use a great little project called mobileESP to help us with device detection. It is a basic user-agent sniffer that we wrapped in a CDI bean to do our bidding in a class called UserAgentProcess.java. This could be swapped out for any of the other device detection libraries such as the WURLF API.

We take advantage of JSF 2.0 and facelets templating to provide a single point of access per view to act as a dispatcher for different devices. This provides a single bookmark and URL no matter what device you are accessing it from. You can review that in the home.xhtml

Orientations detection and updates

Using CSS 3 @media selectors makes this a breeze. We use this to great effect in for the tablet view. Always keeping the top tweeters, and top hashtags in the best location.

• tabletHome.xhtml
• ipad.css - should be named tablet.css ;-)

SmartPhone transitions

Making the page handle the page transitions on smartphones was also easier than you'd think. You can review the details in the phoneHome.xhtml file.

Misc

• Page templates
• HornetQ config files
• TweetStreamListener.java and Twitter4j property files

Improvements That Can Be Made

TweetStream was developed quickly and with a singular goal in mind. There are some great opportunities for improvements, future RichFaces components, and more. I would like to encourage anyone who is interested to take look in more detail. Here are some possible ideas for improvements

• Streamline device detection
• Customizable search filters
• Layout components to support transitions
• RichFaces Mobile Skins
• Combine, and compress CSS
• Performance analysis and update
• Drill-downs on tweets and tags
• Flush out the desktop version

There are a lot more possibilities, fork it, play, and lets see what you can come up with!! We'll be standardizing and integrating some of these things into RichFaces, and other parts of JBoss so stay tuned!!

Where to go from here

Wesley and I are going to post additional blogs and dig into some of the features just touched on above. All of this should give you a good starting point for your own mobile web application using RichFaces 4 and JBoss! Also, as I mentioned above there are going to be several more blogs related to the JBoss World Keynote demo that will detail Infinispan, Hibernate OGM, the plug computers and more!!

[JBW Keynote Page] [JBW Keynote Twitter] [JBW Asylum] [TweetStream Online] [TweetStream Git Repo] [RichFaces Twitter]

The RichFaces team and community are happy to announce that RichFaces 4.0.0.Final has been released!! This was a huge effort, but the end result was well worth it. Without further ado, you can download the distribution from our project's download page, and check out our collection of getting started guides including Maven, non-Maven, Ant/Ivy, and GAE. Plus you can now give our components a test drive anytime at our Online Component Showcase demo.

For all the details of what went into this final release please review the jira release notes. We also have the final project release notes for the project available for review.

Why RichFaces?

RichFaces Component Showcase

RichFaces 4 goes beyond simply supporting JavaServer Faces (JSF) 2. It has extended multiple areas of JSF, including usability, performance tuning, dynamic resources, skinning, and component development. This allows users to take full advantage of all the productivity enhancements of JSF 2. Some notable highlights include:

• A full set of Ajax enabled UI components ( Tables, trees, inputs, panels, etc… )
• Client-side validation, expanding JSR 303 Bean Validation all the way to the browser.
• Advanced queueing to match the high performance requirements of real world applications.
• Push component upgrades including Java Message Service (JMS) integrations, and various transport mechanisms based on browser support, including Comet & Web Sockets
• Our own Component Development Kit (CDK).
• Comprehensive documentation covering development best practices, and component details.
• Detailed and automated testing facilities for components, actions, listeners, and pages.
• Broad cross-browser support
• Run anywhere on JBoss AS 6/7, Tomcat 6/7, Glassfish 3.X, GAE, Amazon's Elastic Beanstalk, Cloudbees, on MyFaces or Mojarra
• Tooling support through JBoss Tools, Intellij, NetBeans
• Our awesome and active community at its foundation!!

Our Community

In previous blogs I've talk about about how open source communities really thrive on their community. I've talk about how CR releases can stand for "Community Required" because of how important it is to get that feedback. All I can say is that our community stepped up, and continue to impress! We've seen a huge increase in the feedback, and both veterans and new users giving RichFaces 4 a try and helping us to make it to this point.

There are too many to list out here, but you are all appreciated!! Although, I would like to remind everyone that the JBoss Community Recognition voting ends April 2nd. Please check out the candidates from our community and give them a vote!

Our Quality

Closely related to our community and the feedback we get from them, is our focus on testing. At RichFaces we have prided ourselves on the level of testing, and stability that we have achieved. A big part of that is because of the effort our guys put into it.

Test framework development highlights:

• Metamer - Framework that makes it easy to add new components and test each attribute under different UI templates
• Ajocado now part of Arquillian which allows type safe Ajax with Selenium
• Rush Eye now part of Arquillian helps test regressions by doing a visual comparison of results.
• Partial Google Page Speed and Selenium Integration for client side performance testing

Total Number of Automated Tests: 2350. Multiply this by environment variables like JSF implementation, Application Server, and UI containers and the total number of complete automated tests go to : 2350 x 4 x 2 = 18, 800!! Plus we are adding to it all the time...

Our Documentation

We really wanted to have a focus on complete and quality documentation that would be available to everyone. One of the guys on our team (Sean), really did a great job and focused on the documentation. We have also had some informative additions to our wiki page, and knowledge base from our community, and team.

• Developer Guide: PDF, single HTML, multiple HMTL
• Component Reference: PDF, single HTML, multiple HMTL
• Getting started guides: Maven, non-Maven, Ant/Ivy, and GAE
• Migration Guide 3.3 --> 4.0
• Generated javadoc and vdldoc as well

Want Even More Information

We've got a whole stack of blogs, conference talks, and upcoming publications to keep you busy :-)

• Getting started with RichFaces Push
• RichFaces Showcase on Google App Engine
• RichFaces 4 Client-side Validation
• RichFaces 4 Object Validation
• RichFaces 4 Overview - Input Components
• Talks at JUDCon, and JBoss World in May, plus JSFSummit in June
• Revised Practical RichFaces for 4.0
• RichFaces 4.0 DZone RefCard coming soon!

What's next

That is a wide open question. We're planning to start on a 4.1 version soon with shorter time-boxed release schedules. We'll be discussing this more on the developer forums and team meetings. This release will likely include a variety of new features such as; Mobile/Tablet specific components, HTML5 extensions, new components like the rich:editor and rich:growl and more. Please join in the discussion, and be part of the future of RichFaces!

In other areas of the project:

• Series of how-to articles for development with and on the project
• Mobile development series on how to build for the mobile web with RichFaces 4
• Add examples, and more details the Migration Guide 3.3 --> 4.0
• Component Sandbox rules, and wiki page updates to help everyone become a component developer guru
• Jira reviews from the past, and future

None of this is possible without you though! We want to hear from you, and if you find an issue, have comments or ideas please let us know through our forums, or our project jira. See our Project Calendar and the Meeting Information page for more details, agendas, and minutes if you want to get involved more!

[Project Site] [Downloads] [JIRA] [User Forums] [Design Forums] [RichFaces Twitter]

Now that RichFaces 4.0.0.Final is just a couple weeks away, we've had time to finalize our RichFaces Showcase and get it hosted up on Google App Engine (GAE)! Now you have a great way to explore all of the great RichFaces 4.0 components, and give them a try yourself (no login required). Plus we have all the instructions you need to get your own application running up on GAE. You can even host your own version of the RichFaces Showcase application!

Overview of the showcase

The showcase application is a gallery of RichFaces components that our project put together in order to demonstrate how to use the various tags available. This includes basic use cases, but also some more complex examples that have been asked about on our user forums. We've added enough information and source code to get you started quickly and you can access it anytime, so it is a great way to reference components.

The primary link to the hosted demo is http://richfaces.org/showcase, so go check it out today!

Quota's

Anyone familiar with Google App Engine will know about quota's. We've configured the application with additional quota allowances and we'll see how it handles under load. We've run it through its paces, but nothing tests like the real world :-) If for some reason it is not accessible, or you get unexpected errors please let us know over at our user forums.

What's next for the showcase

Once RichFaces 4.0.0.Final is released we have many plans for the showcase application. These include contextual linking to JavaDocs, components guide articles, etc…. We also want to add support for more devices such as phones, and tablets! We'll also be adding additional use-cases based on your feedback, and questions. The list could certainly keep going, but we would appreciate any ideas you have.

Hosting your own

As I said we have put together all of the information needed to get started with RichFaces 4 and JSF 2 on GAE. It can be found at our wiki page How to use RichFaces 4.0 with Google App Engine. In there you will find:

• Updates required for any JSF 2 application on GAE
• Information on RichFaces maven-resources-plugin to statically generate skinning resources
• How to upload and deploy your application
• Detailed steps and links to get your own version of the RichFaces Showcase running
• Information on our RichFaces GAE archetype so you don't have to start from scratch on a new application

[Project Site] [Downloads] [JIRA] [User Forums] [Design Forums] [RichFaces Twitter]

RichFaces 4.0.0.CR1 is here!! You can get the 4.0 candidate release distribution at our project site's download page, or if you are using maven you can follow our: How to add RichFaces 4.X to Maven Based Project wiki page.

We are excited about this release as it looks like the only CR release that will be needed before we release 4.0.0.Final. We still need your feedback, to help run it through its paces. As I've said before CR can also stand for Community Required when you are talking about an open source projects. If you have any problems, or run into any issues with the release please let us know over on the User Forums.

If all goes according to plan look for the final release at the end of this month!! It has been a long haul, but the project team, and community have just been fantastic!! We are almost there and to give back to our community please remember to vote for the RichFaces contributors for the JBoss Recognition Awards!!

Updates in CR1

This has been a busy phase of stabilization, clean up, and fixing. We are obviously not adding new components in this phase, but we have piled on the polish. Many of the issues found were from the community and that is greatly appreciated! I've included a summary below of the major items addressed in CR1. As usual you can checkout all the details in the Jira Release Notes.

• Greatly stabilized the Client Side Validation (CSV) feature, and message components.
• MyFaces support was also improved, and switched to it for some of our demo applications
• Our RichFaces Showcase demo got a new design and added new demos! Check out the readme.txt in the distribution for more.
• Dependencies were updated to use latest versions: JQuery 1.5.1, MyFaces 2.0.4, Mojara 2.0.4, Atmosphere 0.6.4.
• The Push component was polished. Look for a blog on this soon
• Our RichFaces 3.X - 4.X migration guide has moved to the wiki for quicker updates, and with new information!
• All of our components had work done on them, but specifically our switchable panels, and panels menus are much improved.
• Our IDE support via our taglib files is also nearly complete!

Next Up 4.0.0.Final!!

We should be less than a month away from the release of RichFaces 4.0.0.Final!! We're working on minor clean up jira's and reviewing any issues you guys bring up, but CR1 is basically it.

It is more critical than ever that if you find an issue, have any comments or ideas please let us know through our forums, or our project jira. See our Project Calendar and the Meeting Information page for more details, agendas, and minutes.

[Project Site] [Downloads] [JIRA] [User Forums] [Design Forums] [RichFaces Twitter]