Red Hat

In Relation To Rich Faces

In Relation To Rich Faces

RichFaces 3.3.1.CR1 Released!

Posted by    |       |    Tagged as Rich Faces

RichFaces 3.3.1.CR1 has been uploaded to the JBoss repository. We are on track for the early May GA release. Then we are on to RichFaces 4.0 more to come shortly.

Highlights of RichFaces 3.3.1

  • Realworld demo [Wiki Page]
  • New layout components <rich:page/>, <rich:layout/>, and <rich:layoutPanel/>
  • New ColorPicker component <rich:colorPicker/>
  • Lots of stabilization and bug fixing - Release Notes

If you find any issues please let us know!

We also need you feedback on some possible RichFaces logos. Please check out RF-6683 to see the current options and comments!!

[Download] [JIRA] [User Forums] [Design Forums]

On Thursday, April 9th I will be presenting an introduction and preview of Java Server Faces 2.0 at the New England Java Users Group (NEJUG). The talk will be given at Sun's Burlington Massachusetts campus.

I will be covering many the major features in JSF 2.0 including:

  • New annotation paradigms
  • Integrated Ajax support
  • Facelets integration
  • Page Parameters
  • Resource Handling
  • and more...

We will wrap up the discussion with some thought on the future of JSF, JSR 299, and RichFaces. Plus I'll have some goodies for the raffle.

Registration is required, and more information can be found at the NEJUG website.

Hope to see you there!!

RichFaces 3.3.1 BETA3 Available

Posted by    |       |    Tagged as Rich Faces

RichFaces 3.3.1.BETA3 has been uploaded to the JBoss repository. We are getting close to the release and continue to stabilize the code base on the way to final release.

Highlights of RichFaces 3.3.1

  • Realworld demo [Wiki Page]
  • New layout components <rich:page/>, <rich:layout/>, and <rich:layoutPanel/>
  • New ColorPicker component <rich:colorPicker/>
  • Lots of stabilization and bug fixing - Release Notes

Give it a try, and please let us know if you run into any issues!

[Download] [JIRA] [User Forums] [Design Forums]

The anticipated conclusion to my two part article on how to improve the performance of your JSF-based Seam application by two orders of magnitude is finally available at JSFCentral. I've also released the source code cited in the article.

The promised gains are achieved primarily by leveraging partial page rendering provided by the RichFaces component library and some extra effort to slim down the size of the response. Partial page rendering is Ajax at its finest. It cuts out the main bottleneck of most traditional web applications, which is the overhead of rendering the entire page and its assets, and instead redraws only what is needed as the user interacts with the application. This technique makes the application feel incredibly responsive.

The best part about RichFaces is that it makes partial page rendering so simple that there's really no reason not to use it. Instead of having to write low-level Ajax network calls, RichFaces provides a declarative approach to Ajax. Using either the supplemental Ajax4jsf component tag set or the fully Ajax-aware components in the RichFaces component tag set, you can specify which areas of the page should be updated and the rest is left up to the framework. The normal JSF postback is sent over an Ajax bridge and the Render Response phase supplies the partial page to update.

There's no question, though, that there has been a dearth of good documentation about how to use the RichFaces tags. Fortunately, both a book and reference card have been published recently which should guide you through the myriad of components and settings in RichFaces and help you wield its potential.

Max Katz addresses just how practical RichFaces is in his book Practical RichFaces, published by Apress. This book sorts out the history of RichFaces, guides you through the myriad of component tags and attributes in RichFaces, and allows you wield its potential. You learn that Ajax and JSF are a good fit for one another and the combination allows you to do Ajax without having to suffer the headache of coding JavaScript and dealing with browser inconsistencies. I recently had a chance to read the book and afterwards posted my review on Amazon. It's my recommendation that if you are using RichFaces, you should definitely take the opportunity to read this book.

If you need a reference to have on the go, then grab a copy of the DZone RichFaces Refcard (PDF), authored by members of the RichFaces project team. This card helps you keep the RichFaces and Ajax4jsf tags sorted and reminds you of the many attributes from which you have to choose.

To see examples of how to use RichFaces and Seam together, then check out chapter 12 of Seam in Action.

If you want to be able to retain the attention of your users in this fast paced world, which has a ever diminishing tolerance for long page loads, you should always consider using Ajax in your application. RichFaces offers a great way to get started. Another excellent JSF component library to consider if you want to add partial page rendering to your application is ICEfaces. In fact, it's arguably simpler to use because it automatically determines which areas of the page to update based on deltas in the component tree. So you have two good options to get started.

RichFaces 3.3.1 BETA2 Available

Posted by    |       |    Tagged as Rich Faces

RichFaces 3.3.1.BETA2 has been uploaded to the JBoss repository. We continue to stabilize the code base on the way to final release.

Highlights of RichFaces 3.3.1

  • New layout components <rich:page/>, <rich:layout/>, and <rich:layoutPanel/>
  • New ColorPicker component <rich:colorPicker/>
  • Maven Resource Dependency Plugin
  • Queue mechanism updated RF-5788
  • Context menu improvements RF-3532
  • rich.isUserInRole() added for security integrations Acegi and etc..). RF-6551
  • Modal Panel DOM reposition made configurable. RF-5588 (released in 3.3.0 but not announced)
  • JQuery script updated to 1.3.2 version
  • Lots of stabilization and bug fixing - Release Notes

Give it a try, and please let us know if you run into any issues!

[Download] [JIRA] [User Forums] [Design Forums]

RichFaces 3.3.1 BETA1 Available

Posted by    |       |    Tagged as JSF Rich Faces

RichFaces 3.3.1.BETA1 has been deployed to: jboss repository and ready for community preview.

New components:

There are several new components in 3.3.1, There are the much anticipated set of layout components and a color picker component that are new for this release.

<rich:page/>

Provides a an easy way to format and break up you page structure. You can set facets for header, footer, and even sidebar. We're also introducing a Theme mechanism that can help to setup and precofigure page layouts and skinning interactions.

<rich:layout/> and <rich:layoutPanel/>

Allows nestable page layouts using Yahoo's UI CSS Grid under the hood to providing lots of flexibility.

For more information see Layouts design wiki page.

<rich:colorPicker/>

Often requested Color picker component,

New features

Here are some new features too.

Stability Improvements

Out selenium based automation suite keeps growing, and numerous issues fixed.

Please let know if you find any issues, or have any comments.

[JIRA] [User Forums] [Design Forums]

JBoss Tools 3 is here!

Posted by    |       |    Tagged as Eclipse JBoss Tools Rich Faces

After an alpha, a beta, 2 CR's and countless nightly builds I'm proud to present the JBoss Tools 3 release!

Installation

Don't forget to read the installation instructions for JBoss Tools if this is the first time installing JBoss Tools (it is not so hard, you just need as a minimum Eclipse JEE bundle).

It is not recommended to update from Eclipse 3.3 to 3.4 via Eclipse updatesite - we recommend to do a fresh install.

Starting JBoss Tools 3 with a workspace created/used with JBoss Tools 2 is supported, but do take a backup just in case - let us know if you have issues upgrading.

Features

This release has fixes for 250+ issues, a new logo, an updated website and a couple of new features/improvements.

You can see the improvements made since JBoss Tools 2 and up to this release here.

The major highlights since JBoss Tools 3 are:

  • Seam pages.xml editor
  • Improved code completion and better EL warnings
  • Configure values for EL in Visual Editor
  • Faster Visual Page Editor with updates for Richfaces 3.3
  • Portlet Wizards
  • Project Examples for easy access to sample projects
  • Drools is back
  • JBoss ESB projects and deployment
  • JMX perspective
  • Hibernate runtime support in Eclipse JPA projects
  • Hibernate configuration can now use DTP and JPA configured connections
  • Hibernate Birt integration
  • ESB support in jBPM graphical editor
  • TPTP profiling mode for JBoss servers
  • Experimental Smooks editor
  • Based on Eclipse 3.4 (Ganymede)
  • ...and more

Thanks

This is a major release and I dare not mention every individual that participated in this release from memory since I would most definitely forget some. Thus I'll list everyone who is listed in the commit logs in alphabetical order, without them nothing would have been done :

Alexey Kazakov, Aliaksey Nis, Anastasiya Bogachuk, Anton Klimkovich, Daniel Azarov, Dart Peng, Denis Golovin, Denis Maliarevich, Denny Xu, Dmitry Geraskov, Grid Qian, Igor Zhukov, John Graham, Koen Aers, Kris Verlaenen, Lex Dmitriev, Maksim Areshkau, Mikhail Sorokin, Nick Boldt, Olga Chikvina, Rob Stryker, Sean Flanigan, Sergey Dzmitrovich, Slava Kabanovich, Snjezana Peco, Svetlana Mukhina, Victor Rubezhny, Vitali Yemialyanchyk, Yagor Radtsevich, Yura Zhishko!

And to the top contributors in jira like Galder Zamarreño, Tom Feenelly, Krasimir Goutcev, Juergen Zimmermann, Francisco Jose Peredo Noguez, Adrian Mitev, Joao Paulo Viragine and everyone else who made contributions by emails, jiras and forum postings - Thank you! Without your feedback, our work would be boring; keep it coming!

Until next time follow us at Twitter and if you are there find us at EclipseCon next week.

Have fun!

The first part of my new article, published today on JSFCentral, explains how you can increase the rendering performance of a data-driven, JSF-based Seam application by two orders of magnitude! The article originated out of a contract job I did over the summer (before joining Red Hat). I worked for a group of scientists to develop a data-driven application using Seam, JSF, and RichFaces. That means it comes straight to you from the real-world ;)

In the article, I point out several easy-to-fall-into traps that can hinder the performance of your application and go on to present several best practices that ensure your JSF-based Seam application can give the responsiveness of a desktop application a run for it's money. Go see for yourself! Sadly, you'll have to wait for part 2 to unfold to discover all the secrets and realize the full benefit.

You might be wondering what else I've been up to lately. JSF2, JSF 2, and more JSF 2. Over the course of the last several weeks I have been working on submitting proposals and implementations to port features from Seam to JSF 2. It's hard work because we're not just throwing the features over the fence, but working with the expert group to improve on them and ensure they integrate well with JSF, rather than just tacked onto the side. If things move along smoothly, I should be rolling out some blog entries about what is changing and how to use the new features.

JSF 2.0. Test Drive PDL. Part 4a. Happy End

Posted by    |       |    Tagged as JSF Rich Faces

In the previous article we spoke about annoying issue of the Mojarra 2.0.0 PR when the empty attributes are rendered to the final html code. The issue was posted to the Mojarra project: https://javaserverfaces.dev.java.net/issues/show_bug.cgi?id=940

Now, it is fixed. Let's take a new version of Mojarra 2.0.0 . It is not a PR release, but the SNAPSHOT dated 01/27/08.

The SNAPSHOT has two more surprises.

First, we can use c:if to have a conditional insert now. We speak about it in the Part 2.

Second, there is no composite:insertChildren any more. This tag was replaced with composite:renderUsingPageChildren. It is more correct semantically, but requires some time to memorize.

Ok, this is code of the component that works:

<!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:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:composite="http://java.sun.com/jsf/composite">
 <head>
  <title>panel</title>
 </head>
<body>
 
<composite:interface>
    <composite:attribute name="style" required="false"/>
    <composite:attribute name="styleClass" required="false"/>
    <composite:attribute name="headerClass" required="false"/>
    <composite:attribute name="bodyClass" required="true"/>
</composite:interface>
 
<composite:implementation>
    <h:outputStylesheet name="rich/css/panel.css" />
 
 <div class="rich-panel #{compositeComponent.attrs.styleClass}"
   style="#{compositeComponent.attrs.style}"
   onclick="#{compositeComponent.attrs.onclick}" 
   ondblclick="#{compositeComponent.attrs.ondblclick}"
   onkeydown="#{compositeComponent.attrs.onkeydown}"
   onkeypress="#{compositeComponent.attrs.onkeypress}"
   onkeyup="#{compositeComponent.attrs.onkeyup}"
   onmousedown="#{compositeComponent.attrs.onmousedown}"
   onmousemove="#{compositeComponent.attrs.onmousemove}"
   onmouseout="#{compositeComponent.attrs.onmouseout}"
   onmouseover="#{compositeComponent.attrs.onmouseover}"
   onmouseup="#{compositeComponent.attrs.onmouseup}">
  <c:if test="#{! empty compositeComponent.facets.header}">
   <div class="rich-panel-header #{compositeComponent.attrs.headerClass}">
    <composite:insertFacet name="header"/>
   </div>
  </c:if>
 
  <div class="rich-panel-body #{compositeComponent.attrs.bodyClass}" > 
   <composite:renderUsingPageChildren />
  </div> 
 
 </div>
</composite:implementation>
</body>
</html>

This is a deployed example: http://livedemo.exadel.com/richfaces4-panel-4a/home.jsf

If you look at the result html code, you can see what no more empty attributes inserted.

JSF 2.0. Test Drive PDL. Part 4. PassThru attributes

Posted by    |       |    Tagged as JSF Rich Faces

Every JSF component has some specific attribute set unique for it. At the same time, almost all UI components have attributes that are common for all of them. For example, onclick, ondblclick, onblur, onmouseover, onmouseout, onmousedown and so on. They are named PassThru because they are rendered one-to-one to the final html layout.

RichFaces CDK uses a special meta-attribute x:passThruWithExclusions. Like:

<div x:passThruWithExclusions="id,value,styleClass,class" ....>

This attribute directs to insert all PassThru attributes as attributes to this particular div except ones that are explicitly mentioned. Just one attribute, short and not so hard. Let see how JSF 2.0 PDL might help.

In the first article about PDL, we define only four style kind attributes for the sake of simplicity.

<composite:interface>
    <composite:attribute name="style" required="false"/>
    <composite:attribute name="styleClass" required="false"/>
    <composite:attribute name="headerClass" required="false"/>
    <composite:attribute name="bodyClass" required="false"/>
</composite:interface>

Now, we are going to complete the missing part. According to the rich panel TLD documentation, it has 10 PathThru onxxxxxx attributes. To test how they work let's add the following to the test page:

  <rich4:panel onmouseover="this.style.backgroundColor='#F9F9FF'"
      onmouseout="this.style.backgroundColor='#FFF'">
   <f:facet name="header">
    <h:outputText value="This is a header"/>
   </f:facet>
   <h:outputText value="panel with header"/>
  </rich4:panel>

BTW, the composite:interface above contains explicit declaration for four style attributes. What happen if we remove them like that:

<composite:interface>
</composite:interface>

Actually, nothing is changed. The component and its styling work without any changes. This is because of the Facelets feature when Facelets implicitly pass any attributes defined by the end developer, instead of classic JSP where missing an attribute name in the TLD file is a big deal. Let's consider this Facelets feature as an advantage, at least for the size of the component code.

One drop of poison infects the whole tun of wine - if you have a typo in the attribute name, figuring it out is your personal problem. No any warning. However, declaring the attribute explicitly in the composite:interface, even the required="true" does not help. Still the same silence.

Does the composite:interface make sense at all. Yes!!! Do not forget about the most fabulous keyword of the JSF market - the Tools. The JSF tool, if it is smart enough, prompts you with the list of possible attribute sorting them by priority, helps with signature of the method and so one. According to the pdldoc for composite:attribute, it has a lot of useful (for the tools) attributes.

Let's return to the topic. Does the ability to implicitly declare attributes work for our onmouseover, onmouseout? ...Partly. We do not need to declare them implicitly in the composite:interface section (ok, ok. we still need to be kind to the future tools). However, PDL has no idea where to insert them in the composite:interface section. Thus, the test example does not work yet.

Mojarra implementation of PDL has nothing to shortcut the size of required code. Copy/Paste is a way to go. We will add the following as attributes of the top div:

onclick="r#{compositeComponent.attrs.onclick}"
ondblclick="r#{compositeComponent.attrs.ondblclick}"
onkeydown="r#{compositeComponent.attrs.onkeydown}"
onkeypress="r#{compositeComponent.attrs.onkeypress}"
onkeyup="r#{compositeComponent.attrs.onkeyup}"
onmousedown="r#{compositeComponent.attrs.onmousedown}"
onmousemove="r#{compositeComponent.attrs.onmousemove}"
onmouseout="r#{compositeComponent.attrs.onmouseout}"
onmouseover="r#{compositeComponent.attrs.onmouseover}"
onmouseup="r#{compositeComponent.attrs.onmouseup}"

Now, we can see how it works: http://livedemo.exadel.com/richfaces4-panel-4/home.jsf

Looks like we are all set. However, let's look what is actually rendered:

 <div class="rich-panel " style="" onclick="" ondblclick="" onkeydown="" 
        onkeypress="" onkeyup="" onmousedown="" onmousemove="" 
        onmouseout="this.style.backgroundColor='#FFF'" 
        onmouseover="this.style.backgroundColor='#F9F9FF'" onmouseup="">
   <div class="rich-panel-header ">This is a header
   </div>
 
  <div class="rich-panel-body ">panel with header
  </div> 

 </div>

We have a bunch of empty attributes out. Even the browser can have a deal with that, it is not acceptable result the end application developers will be happy with. The attribute should not appear in the result code if it is empty. So far, I did not find a solution how to avoid it in Mojarra 2.0.0 PR. The issue is posted.

back to top