JavaServer Faces Overview

Module Objectives

At the end of this module you will be able to:Describe JavaServer Faces ArchitectureDescribe the features of using JSF Chordiant support for JSF

Road Map

JavaServer FacesArchitectureJSF Lifecycle PhasesAdditional learning resources

Chordiant Support for JSF

What is JavaServer Faces?

JavaServer Faces (JSF) is a server side user interface component framework for Java™technology-based web applicationsAims to simplify J2EE web application developmentA comprehensive standard API for J2EE web applicationsBased on a standard specification

JavaServer Faces

Simplifies development of sophisticated web application user interfaces by allowing

Java programmers to develop the application backend without worrying about HTTP detailsPage Authors to work on the user interface “look and feel” without any programming knowledgeVendors to develop tools for frontend and backend development

BenefitsLess code in the user interface templateMore modular design

JSP and Java Bean Architecture

JSP/HTML -- Page Bean (Java Bean , getter /setter methodsCustom tag, xml like tags having some java fnInfo abt the java fn is provided by the prefix

Input type=“text”Name=“custno”

Input type=submit<jsp:usebean id=x Classname=“C.X”>

Private String custno;

C.X

DB

JavaServer Faces Architecture

JSF is both A Java Web user-interface standard A framework that follows the Model-View-Controller (MVC) design pattern

User interactions are handled by a front-end "Faces" servlet (Controller)

WML

HTML

XMLRender kit decides the o/p

Property files for Static text MLS

MVC in JSF

ControllerDecide the format of the o/p –RenderkitDecide the language of the o/p—Property filesRequestDispatching-which view/page to display on what action

ViewXML Based so that o/p can be WML/HTML- RenderkitDisplay static text from property Files (Internationalization)Retrive/Set data in the Page bean

ModelPage Bean/backing bean having getter/setter methods and can talk to middleware/database or any third party application` and Managed by controller via config.xml

Modular Design

JSF brings web development more inline with MVC through cleaner separations

Controller

Component

Listener

Model

Model

Renderer

View

Model

Represented by Java BeansDo not extend any specific classDo not implement any specific interface

Provide the mechanism by which information is passed between UI components and the back-end applicationModel behavior is separate from controller behavior

Model

Model

View

Called Renderers in JSFUsually constructed using

JSP/HTML Tag Libraries

Specified to support JSPBut is not required to use it

Comes with two JSP base component libraries

Core - For application tasksHTML - For rendering basic HTML

Could also use other technologies such as SVG, WML etc

Renderer

View

UI Components

With JSF applications are built from collections of components that can render themselves in different waysThe specification provides a set of base UI Components in its Reference Implementation

Core - For application tasksHTML - For rendering basic HTML

Additional UI Component Librariesare available

Apache Trinidad

Controller

Composed ofFacesServlet - receives all request and creates (or recreates) component treeComponents - fires events to registered listenersListener Classes - invoke Model beans using Change and Action Listeners

Controller

Component

Listener

JSF Technology

A basic JSF application consists of the following:

JSF UI components - encapsulated in JSF tag libraries(.xhtml)Navigation Model - defines rules for navigation(faces-config.xml) controller uses thisManaged Beans - facilitate the UI logic of the application (Java beans)Helper Objects - for validation and conversion

JSF Lifecycle

A JSF page is represented by a tree of UI components, called a ViewWhen a client makes a request for the page, the lifecycle startsDuring the lifecycle, JSF implementation must manage the View while preserving state saved from a previous request

JSF Lifecycle

BP

CA

JSF Specification

The Specification for JSF can be found at http://java.sun.comIncludes details of downloading the specification and implementationsGo to:

http://java.sun.com/javaee/javaserverfaces/download.html

Section Review

In this section you learned:About JSF architecture.

Road Map

JavaServer FacesChordiant Support for JSF

FeaturesChordiant JSF FlowChordiant JSF and CAFEInstallation and set-up

Chordiant JSF Framework

Uses the standard JSF Framework to listen to and process lifecycle events

Nothing is created outside the JSF standardUses Trinidad to avoid creating Chordiant specific UI components

Open source project formerly known as ADF (Application Development Framework)Includes high quality components, a dialog framework, as well as personalization and skinning capabilities See http://myfaces.apache.org/

Chordiant JSF v CAFE

Use of JSF tags in JSP pagesUse of Interaction flows run by Interaction ControllerJSF handles many of the functions previous handled by the CAFE framework:

JavaWorkDispatcherXmlHttpServiceField formatting and validationPage navigation

MVC

FSBPS

BS/SS

AdvisorMVC

Chordiant JSF and CAFE

Chordiant JSF framework co-exists with Chordiant CAFE frameworkJSF is independent of CAFEJSF will continue to use the desktop environment provided by CAFE

Offerings are used as entry point to start a business process

Most new offerings and features will use a combination of JSF framework and Interaction Controller

Chordiant JSF Applications

Chordiant JSF Applications are constructed using the following

Process flow to implement the business process .jxw(client tasks and system tasks—Business service)Implement client task using Chrd_JSF

Managed beans for interaction between front and back end (UI and workflow tasks)JSPs for user interface(instead of xhtml, use jspx)JSF Navigation rules

Process Flow

Represent business processesComposed of

Client tasks - representing user interaction System tasks - execute without user interaction

Client Tasks

System Taskic String enterAccountnumber()

{}

Public Integer displayAccountEntries(Vector accentr

Backing Beans (Model from MVC)

Used to drive process interactionActs as a caller to Interaction ControllerComposed of an Interface and Default implementationInterface specifies methods associated with values displayed or entered on the UI

set/get methodsUnlike ‘standard’ JSF beans typically do not have to hold data directly

Class attributes need not be definedInstead se/get methods act as facade to the back-end

Registered in a configuration file

Example Backing Bean

public class MovieIdPageBean extends IcFacesBackingBeanImpl {// value passed from process to be displayed on UIpublic String getMovieId(){

String movieId = (String)IcFacesContext.getObjectFromIoMap(“movieId" , false) ;

return movieId ;}

// value entered on UI to be passed back to processpublic void setMovieId(String movieId){

IcFacesContext.putObjectInIoMap("enterMovieIdReturn" ,movieId) ;

}

}

JSPs for UI Screens

…<ui:composition><f:loadBundle basename="bundles.viewmovietitle.msgs.msgs“

var="movie_msgs" /><f:view locale="#{preferLocale.locale}">

<tr:document> <tr:form>

<tr:inputText label="#{movie_msgs.enterMovieId_label}“value="#{enterMovieId.movieId}" required="true" shortDesc="#{prompts.values.Id_prompt}"/>

</tr:form></tr:document>

</f:view></ui:composition>…

Navigation Rules

Associates tasks with JSF pagesDefined in a configuration fileChrd JSF Navigation file given to ChrdJSF Controller (interaction controller)

<navigation-rule>…

<navigation-case><from-outcome>ic$viewmovietitle_enterMovieId</from-outcome><to-view-id>

/xAdvisorWeb/bundles/viewmovietitle/jsf/enterMovieId.jspx</to-view-id>

</navigation-case><navigation-case>

<from-outcome>ic$viewmovietitle_showMovieTitle</from-outcome><to-view-id>

/xAdvisorWeb/bundles/viewmovietitle/jsf/showmovietitle.jspx</to-view-id>

</navigation-case>…

Interaction Controller (IC)

Set of APIs to enable the UI layer to drive process flow

Independent of the UI framework, process engine and channelPure JavaUses no XML and object conversion

Chordiant JSF depends on ICThe IC Service is part of Chordiant Foundation Business Process Server (BPS)Also IC service is exposed as webservice

Interaction Controller Architecture

CardsDivisionCustLocateCustVerifySelectAccount

Call-CentreCustLocateCustVerify

SelectAccount

InternetBanking

CustLocateCustVerify

SelectAccount

…

Struts JSF RequestHandler

xml/webservices

InteractionController

JxwInteractionController

…ClientTask:

SelectAccount… …

.Net

start next() cancel reassign next(qItem)

InteractionControllerService

JXW Flow&

JXW Context

ClientAgent

Service

PFlowService executes BP

PFlowserviceCallIC

When client task

Frontend app Communicates to BP

ViaIC

webservice

JSF and IC Interaction

IcFacesBackingBeanImpl

AbcPageBean extends IcFacesBackingBeanImpl

556677* Account Number:

NextPrev

public String getAccountNumber()public void setAccountNumber( String input )

Please enter your account number

ClientTask ioMapString entrAccNoRetrn = “556677”;Vector accEntries;

public String next()

2

3

IcFacesDispatcher

public String next() {

nextClientTask = ic.next( clientTask );

return ic$ + clientTask.getProcessName()+"_" + clientTask.getName() ;

}

InteractionController

54

6 7

9

Service Tier

<navigation-case><from-outcome>

ic$MyFlow_displayAccEntries</from-outcome><to-view-id>

/displayAccEntries.jsp</to-view-id>

</navigation-case>

Account Entries for 556677:

8

1

ID Amount Description

15

27

31

$21.50 Deposit

($76.50) Debit Card Withdrawal

$1.89 Interest

Ic$MyFlow.enterAccoutnnumberenterAccountno.jspx

Setup and Configuration

JSF components are set-up in a CAFE Bundles project

Foxberry bundles need to be selectedCopied to the Advisor application

Advisor/WebRoot/iAdvisorWebAdvisor/WebRoot/xAdvisorWeb

Web.xmlDefines JSF configuration elementsBean definition filesNavigation rule definition files

Build Scripts for the Lab Environment

The following Ant scripts have been created specifically for the lab environment:

_CHRD-401_BusinessObjects/build.xmlPackage Business Objects into a jar

_CHRD-401_BusinessServices/build.xmlPackage Business Services into a jar

_CHRD-401_Bundles/build.xmlPackage Client-side and Server-side application classes into a jarCopy bundle folders to Advisor application

_CHRD-401_Processes/build.xmlPackage Process flows into jar

Exercise

Running a JSF ApplicationRefer to your Lab Guide and instructor for specifics about this exercise.

Review of Exercise

JSF Application Walk ThroughThis session will investigate the various components used to construct the application executed in the last exerciseWe will look at the following:

OfferingProcess FlowBacking BeanNavigation RulesJSPs

Section Review

In this section you learned:About Chordiant support for JSF

Module Review

In this module you learned about:JavaServer Faces ArchitectureThe benefits of using JSF Chordiant support for JSF