1. Creative Commons Attribution- NonCommercial-ShareAlike 2.5 License Sakai Programmer's Café Introduction to Reasonable Server Faces Aaron Zeckoski azeckoski@gmail.com

2. 2 Reasonable Server Faces RSF is a Java web programming framework –Roughly the same scope as Sun’s JSF –Includes the following Navigation and View rendering Server-side and client-side state management Request cycle handling and abstraction APIs for UI components and view producers Pure HTML templating Lightweight Expression Language (EL) Based on the Spring Framework

3. 3 Theory vs. Practice

4. 4 In theory Web applications that are as easy to create as PHP but still well structured –Easier to program –Standard HTTP request cycle, zero server state Better scoping and separation –Application/Session/Request Component bindings from UI to model True separation of the logic and presentation –Wireframe is the view definition (easy design) Easy to configure for different environments

5. 5 In practice Harder to work with than PHP but easier than most Java based frameworks –Basic understanding of the request cycle needed Especially if using Session beans –No in-code dependence on Servlets Can use all of the capability of HTML –Truly pure HTML templating (excellent for designers) –Complete separation of UI and logic Knowledge of Spring important –Does provide flexibility and configurability via Spring –Full support for IoC and AOP for backing beans and producers –Adds support for request scope IoC No globally visible state maintainers (stateless)

6. 6 RSF structure and code

7. 7 RSF structure The template (always html) defines the interface The producer (java or xml) defines the view, populates the template, and handles navigation ViewParams define the values passed between views (get) The requestContext defines producer and backing beans The applicationContext defines app scope beans and handles rsf app config (via spring) Backing beans handle action processing Logic layer beans can be injected as defined in the context xml files Model is basic data POJO Template (html) Backing Bean (java) Logic Layer (rest of app) requestContext (xml) model (java) Producer (java) applicationContext (xml) ViewParams (java)

8. 8 RSF templates XHTML files –Must be valid XML or runtime error will occur No custom tags used or needed –Truly is a pure XHTML template Only uses one custom attribute –rsf:id - identifies this component for the producer Template (html)

9. 9 Sample template RSF Items Hello, Current User Non updateable item New item title Sep 15, 2006 1:26 AM

10. 10 RSF producer Controls displays logic and populates the template with dynamic information Defines a view uniquely –By setting a ViewID Recommend you create a public static VIEW_ID Implements ViewComponentProducer –Define start page by implementing DefaultView –Implement NavigationCaseReporter to control “submit” navigation –Implement ViewParamsReporter to receive query parameters from http request Producer (java)

11. 11 Sample producer public class ItemsProducer implements ViewComponentProducer, DefaultView { public static final String VIEW_ID = "Items"; public String getViewID() { return VIEW_ID; } private CrudPlusLogic logic; public void setLogic(CrudPlusLogic logic) { this.logic = logic; } public void fillComponents(UIContainer tofill, ViewParameters viewparams, ComponentChecker checker) { UIOutput.make(tofill, "current-user-name", logic.getCurrentUserDisplayName()); UIForm listform = UIForm.make(tofill, "listItemsForm"); List l = logic.getAllVisibleItems(); for (Iterator iter = l.iterator(); iter.hasNext();) { CrudPlusItem item = (CrudPlusItem) iter.next(); UIBranchContainer itemrow = UIBranchContainer.make(listform, "item-row:", item.getId().toString() ); if (logic.canWriteItem(item)) { UIInternalLink.make(itemrow, "item-update", item.getTitle(), new AddItemViewParameters(AddItemProducer.VIEW_ID, item.getId()) ); } else { UIOutput.make(itemrow, "item-title", item.getTitle() ); } UIOutput.make(itemrow, "item-dateCreated", item.getDateCreated() ); }

12. 12 RSF ViewParams Controls the passing of data between page views –Uses query parameters (GET) –extends SimpleViewParameters Should be used when data needs to be sent from one view to another –Works like standard web variables should –Can be reused on multiple pages ViewParams (java)

13. 13 Sample ViewParams public class AddItemViewParameters extends SimpleViewParameters { public Long id; // an identifier for an item public AddItemViewParameters() { } public AddItemViewParameters(String viewID, Long id) { this.id = id; this.viewID = viewID; } public String getParseSpec() { // include a comma delimited list of the // public properties in this class return super.getParseSpec() + ",id"; }

14. 14 RSF requestContext Request Scope Context –Often called RSACRSAC All RSAC beans are lazy by default Standard spring bean definition file –Uses the Spring file parser code –Only includes a subset of the standard functionality to increase speedincludes a subset Location of this file is set in the web.xml requestContext (xml)

15. 15 Sample requestContext <!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN//EN" "http://www.springframework.org/dtd/spring-beans.dtd"> <bean id="itemsBean" class="org.sakaiproject.crudplus.tool.ItemsBean" init-method="init"> <property name="logic" ref="org.sakaiproject.crudplus.logic.CrudPlusLogic" /> <property name="logic" ref="org.sakaiproject.crudplus.logic.CrudPlusLogic" /> <property name="logic" ref="org.sakaiproject.crudplus.logic.CrudPlusLogic" />

16. 16 RSF applicationContext A standard Spring bean definition file –Puts the beans in the application context Mostly used for configuring RSF –Define child of requestAddressibleParent to specify beans which can be the target of EL –Define child of beanScopeParent to create a new session scope for session beans –Define a child of CRITemplateResolverStrategy to control the location of templates Location of this file set in web.xml applicationContext (xml)

17. 17 Sample applicationContext <!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN//EN" "http://www.springframework.org/dtd/spring-beans.dtd"> <!-- For security purposes, only beans listed in the comma separated value list may be the target of EL operations coming in over the request -->

18. 18 RSF Backing Bean Typical bean with methods to handle actions and public properties –No RSF dependencies –Store data needed for processing the user actions using public properties –Control data model objects with public properties (using EL from producer) –Process actions using methods Can interact with logic layer –But so can the producers Created and destroyed in the request cycle by default (recommended practice) –Can override this behavior Backing Bean (java)

19. 19 Sample backing bean public class ItemsBean { public CrudPlusItem newItem = new CrudPlusItem(); public Map selectedIds = new HashMap();... private CrudPlusLogic logic; public void setLogic(CrudPlusLogic logic) { this.logic = logic; }... public String processActionAdd() { if (newItem.getHidden() == null) { // null here means that the box was not checked newItem.setHidden( DEFAULT_HIDDEN ); } logic.saveItem(newItem); return "added"; }

20. 20 Web app basics 4 key things you need to do in a webapp 1.Output dynamic text Render data to the screen 2.Loop structures Output collection or render tables 3.Optional rendering of components Render some components based on state 4.Trigger Actions User actions or data transmission In RSF, these all are done using one part in the template and another in the producer (and maybe the backing bean for an action method)

21. 21 Output dynamic text Hello, Current User Uses an rsf:id on an HTML entity to show where to place the dynamic text –Does not have to be a span or div only! UIOutput will send the escaped string to the id location in the component tree –Non-escaped output using UIVerbatim Not recommended though UIOutput.make(tofill, "current-user-name", logic.getCurrentUserDisplayName()); 1

22. 22 Loop structure List l = logic.getAllVisibleItems(); for (Iterator iter = l.iterator(); iter.hasNext();) { Item item = (Item) iter.next(); UIBranchContainer itemrow = UIBranchContainer.make(listform, "item-row:", item.getId().toString() ); if (logic.canWriteItem(item)) { UIInternalLink.make(itemrow, "item-update", item.getTitle(), new AddItemViewParameters(AddItemProducer.VIEW_ID, item.getId()) ); } else { UIOutput.make(itemrow, "item-title", item.getTitle() ); } UIOutput.make(itemrow, "item-dateCreated", item.getDateCreated() ); } Non updateable item New item title Sep 15, 2006 1:26 AM 2

23. 23 Optional rendering HTML entities are rendered if the component is tied via the rsf:id –If there is no UI component for the id then the render skips over it Can do this for single entities or for UIBranchContainers to do a block –Example: a surrounding if (item.getHidden().booleanValue()) { UIOutput.make(itemrow, "item-title", item.getTitle() ); } Hidden item title 3

24. 24 Trigger actions Use a normal submit button with an id –Use UICommand to tie to an action method in a backing bean using EL Return string ties to a navigation case in the producer <input rsf:id="add-update-item" type="submit" value="Add/Update Item" /> UICommand.make(addupdateitem, "add-update-item", "#{itemsBean.processActionAdd}"); public String processActionAdd() { logic.saveItem(updateItem); return "added"; } 4

25. 25 RSF in practice

26. 26 RSF experience RSF has a moderate learning curve –Mostly unlearning poor practices UI components are comprehensive –Cover all HTML entities, fairly flexible AJAX integration easy –Designed to work well with AJAX and JS Works like a webapp should –Normal REST, back button works Easy for UI designers to work with

27. 27 RSF EL A subset of the functionality of JSF Expression Language –No logic in the expression –Sometimes called Value Language (VL) Works with any bean in the request or application context More info on the RSF EL pageRSF EL page #{requestwriteablebean.property1.subproperty2} URL: http://www2.caret.cam.ac.uk/rsfwiki/Wiki.jsp?page=ELhttp://www2.caret.cam.ac.uk/rsfwiki/Wiki.jsp?page=EL

28. 28 RSF component trees Binds the markup to the model –rsf:id in the template –EL in the producer Tree and components created and destroyed during the request cycle –Short lived, frees up resources –Rooted in a view and only kept around long enough to render the view URL: http://www2.caret.cam.ac.uk/rsfwiki/Wiki.jsp?page=Componenthttp://www2.caret.cam.ac.uk/rsfwiki/Wiki.jsp?page=Component

29. 29 RSF structure revisit The template is pure html –Easy for UI designers The producer is simple and cleanly defines a view ViewParams abstract out the passing of values The requestContext and applicationContext are pure spring config –Can be mixed up sometimes Backing beans are really just simple beans Template (html) Backing Bean (java) Logic Layer (rest of app) requestContext (xml) model (java) Producer (java) applicationContext (xml) ViewParams (java)

30. 30 RSF resources RSF Wiki (online documentation) –http://www2.caret.cam.ac.uk/rsfwiki/http://www2.caret.cam.ac.uk/rsfwiki/ RSF forums –http://ponder.org.uk/rsf/http://ponder.org.uk/rsf/ RSF APIs –http://saffron.caret.cam.ac.uk/projects/RSFUtil/apidocs/http://saffron.caret.cam.ac.uk/projects/RSFUtil/apidocs/ RSF SVN –https://saffron.caret.cam.ac.uk/svn/https://saffron.caret.cam.ac.uk/svn/

31. 31 Questions? RSF –http://www2.caret.cam.ac.uk/rsfwiki/http://www2.caret.cam.ac.uk/rsfwiki/