ICEfaces Component Suite

The ICEfaces Component Suite provides all the building blocks you require to effectively develop sophisticated, rich user interface pages for your JSF application. The entire JSF component suite leverages a common Ajax Bridge and a technique known as Direct-to-DOM (D2D) rendering to enable the page with Easy Ajax. This means that UI's developed with the ICEfaces Ajax JSF Components will exhibit Rich Internet Application (RIA) features enabled through Ajax techniques, but without the need for you to do any low-level Ajax programming. You simply write a pure JSF application and the ICEfaces Framwork and JSF Component Suite delivers the rest.

The Components

The extensive suite of ICEfaces components can be viewed in action in the ICEfacesComponent Showcase . This online demo allows you to interact and evaluated all the rich Ajax JSF Components included with ICEfaces. This JSF Component showcase also allows you to view documentation, and examine source code examples and tutorials for every component. You will find the showcase to be invaluable from initial technology evaluation right through to full-scale Rich Internet Application development.

Easy Ajax

The beauty of Easy Ajax is that it is completely transparent during the development process. You can rely on the RIA features it delivers, but focus on your application development. Having said that, most engineers prefer to understand how things work under the hood, so we will describe the two key techniques used in ICEfaces to enable Easy Ajax.

• D2D rendering involves rendering the page to a server-side DOM in the JSF Render Response phase of the JSF lifecycle. In order to update the page precisely with the minumum set of changes, the previous DOM and the new DOM are compared, and only that minimum set of DOM updates is transmitted over the Ajax Bridge for assembly in the browser DOM. This ensures a smooth page update, but required no special consideration at page design time to achieve it. The diagram below illustrates how D2D rendering works.
  
  
  

• Automatic Partial Submit is a technique that utilizes the Ajax Bridge to automatically submit back to the server for JSF component lifecycle processing, based on user interaction with the JSF components in the page. For instance, expanding a tree node would cause a submission resulting in a state change in the tree control's model and subsequent presentation changes to be applied incrementally through the D2D rendering mechanism. The technique can also be leveraged by the developer to cause application business logic to execute as the user interacts with components on the page. For instance, you might perform intelligent processing of a form as the user fills in the fields - a technique that is well illustrated in theICEfaces Address Demo .
  

Component Styling

The ICEfaces Component Suite adheres to standard use of Cascading Style Sheets (CSS) to seperate style from markup. This makes it straightforward to customize the visual theme of an application. ICEfaces ships with several themes, which can be viewed in theICEfaces Component Showcase . You can use these themes as is or customize one to your liking. ICEfaces also includes anoutputStyle component that simplifies the use of CSS resources in your application. It automatically performs necessary resource loading, and supports inclusion of browser-specific CSS overriding of the theme to manage browser ideosyncracies related to CSS. Additionally, it supports dynamic theme changes at run time through a standard JSF value binding in the component.

Drag and Drop

Drag and drop is a common and effective UI mechanism from the desktop application world that has migrated into web applications thanks to Ajax techniques. ICEfaces supports full drag and drop capabilities within its JSF Ajax components, but again, does so in a manner that does not expose you to low-level Ajax programming. Any instance of an ICEfaces JSF component can be configured to act as a drag or drop target as illustrated below.


Draggable panels include optional effects such as reverting to their orginal position when dropped, or ghosting a copy of the orignal panel during the drag function. When a draggable panel is moved over or dropped on a drop target panel, a number of events, including Drag, Hover, and Drop events, can be fired to the server-side application beans. This allows you to build server-side business logic to handle drag and drop features in your application easily, using pure Java techiques. For more a more detailed examination of drag and drop capabilities in ICEfaces refer to theonline tutorial .

Animation Effects

The full spectrum ofscript.aculo.us effects can be applied to most JSF Ajax components provided by ICEfaces. You simply need to define theeffect attribute in the component to enable it. You can also use browser events likeonmouseover to cause animation effects to occur on a component. This makes it simple for you to build Rich Internet Applications (RIA) that exhibit sophisticated animation effects, but again, doing so without having to write any JavaScript.

Single Page Interfaces

Many Rich Internet Applications (RIA) leverage single page interfaces where the basic structure of the page is maintained in a set of divs, and those divs are populated with different kinds of information depending on what the user is doing. The ICEfaces Framework and corresponding JSF Ajax Components naturally support single page interfaces through a number of mechanisms. To begin with, dynamic include mechanisms for JSP and Facelets facilitate dynamic run time inclusion of all container components, making it straightforward to adjust the content displayed on the page as the user interacts with it. Furthermore rendered andvisible attributes associated with many of the JSF components provides fine-grain control over what is displayed in the page at any given time, making single page interfaces easily achievable.

Role-based Security

Security within the ICEfaces Framework has always been a fundemental consideration. The server-centric nature of the framework ensures that the Java EE security architecture is preserved so ICEfaces applications are inherently secure. Role-based security at the presentation layer is typically used to ensure that specific user credentials are required to access certain features of the application. The ICEfaces Component Suite providesenableOnUserRole andrenderOnUserRole attributes that gives you fine-grain control over how pages are rendered based on user credentials, enabling you to extend your application security architecture seamlessly up to the presentation layer.

Accessibility

Current accessibility standards have not yet caught up will modern Ajax techniques, but it is possible to develop accessible Rich Internet Applications (RIA) with ICEfaces. Because JSF and ICEfaces utilize declarative page definitions, well-established accessibility best practices can be applied to page design that will support tab-based navigation and use of screen reader technologies - two primary pillars of accessibility in web applications. That being said, not all advanced ICEfaces JSF Ajax components are accessible, so it is necessary to restrict your page design to ensure an accessible result. For more information on accessibility of the ICEfaces JSF components, refer to theICEfaces Accessibility Spreadsheet .