1. Kito D. Mann Principal Consultant Prime Time JSF with PrimeFaces 5

2. Kito D. Mann @kito99 »Principal Consultant at Virtua »http://www.virtua.com »Training, consulting, architecture, mentoring, »Official US PrimeFaces partner »Author, JavaServer Faces in Action »Founder, JSF Central »http://www.jsfcentral.com Copyright (C) 2012 Virtua, Inc. All rights reserved.

3. Kito D. Mann @kito99 »Co-host, Enterprise Java Newscast »http://enterprisejavanews.comhttp://enterprisejavanews.com »Internationally recognized speaker »JavaOne, JavaZone, Devoxx, NFJS, TSSJS, etc. »JCP Member »JSF, WebBeans, JSF Portlet Bridge, Portlets Copyright (C) 2012 Virtua, Inc. All rights reserved.

4. Who uses PrimeFaces?

9. Popularity

10. Global Colombia

11. 100+ UI Components

12. Advanced UIs

13. Form Components

14. Hide Complexity Keep Flexibility //tabs //tabs CSS Override CSS Override JS API JS API Client Callbacks Client Callbacks Ajax Callbacks Ajax Callbacks CSS JS AJAX JSON

15. <p:schedule id="schedule" value="#{scheduleView.eventModel}" widgetVar="myschedule"> <p:schedule id="schedule" value="#{scheduleView.eventModel}" widgetVar="myschedule"> Page … … Markup $(function() {PrimeFaces.cw("Schedule","myschedule", {id:”form:schedule",widgetVar:"myschedule",defaultView:"month", locale:"en”,offset:0,header:{left:'prev,next,today', center:"title",right:"month,agendaWeek,agendaDay”},"schedule");}); $(function() {PrimeFaces.cw("Schedule","myschedule", {id:”form:schedule",widgetVar:"myschedule",defaultView:"month", locale:"en”,offset:0,header:{left:'prev,next,today', center:"title",right:"month,agendaWeek,agendaDay”},"schedule");}); Script Anatomy of a Component

16. HTML5 canvas data-* websockets forms media

17. Server APIs: Standard JSF 2 Client APIs: PrimeFaces Ajax

18. f:ajax onevent onerror PrimeFaces Ajax p:ajax oncomplete onerror onstart async global onsuccess

19. p:ajax f:ajax a4j:ajax (RichFaces 3.x)

20. autoUpdate p:ajax Request Context Callbacks AjaxStatus Selectors partialSubmi t Ajax Extensions

21. Declarative Programmatic Global AjaxStatus

22. public void save() { RequestContext rc = RequestContext.getCurrentInstance(); rc.execute(“PF(‘dialogWidget’).hide()”); } public void save() { RequestContext rc = RequestContext.getCurrentInstance(); rc.execute(“PF(‘dialogWidget’).hide()”); } Page Bean RequestContext - Scripts

23. RequestContext - Update Page public void save() { RequestContext rc = RequestContext.getCurrentInstance(); rc.addPartialUpdateTarget(“val”); } public void save() { RequestContext rc = RequestContext.getCurrentInstance(); rc.addPartialUpdateTarget(“val”); } Bean or <p:commandButton value=”Submit” action=”#{bean.save}” update=”val” /> <p:commandButton value=”Submit” action=”#{bean.save}” update=”val” />

24. RequestContext - Scroll Page public void save() { RequestContext rc = RequestContext.getCurrentInstance(); rc.scrollTo(“val”); } public void save() { RequestContext rc = RequestContext.getCurrentInstance(); rc.scrollTo(“val”); } Bean

25. AutoUpdate

26. PartialSubmit Post Data:javax.faces.partial.ajax=true&javax.faces.source= form%3Aj_idt18&javax.faces.partial.execute=form%3A name&javax.faces.partial.render=form%3Adisplay&for m%3Aj_idt18=form%3Aj_idt18&form=form&form%3An ame=&form%3Aj_idt20=&form%3Aj_idt22=&form%3Aj _idt24=&form%3Aj_idt26=&form%3Aj_idt28=&form%3 Aj_idt30=&form%3Aj_idt32=&form%3Aj_idt34=&form %3Aj_idt36=&form%3Aj_idt38=&form%3Aj_idt40=&for m%3Aj_idt42=&form%3Aj_idt44=&form%3Aj_idt46=&f orm%3Aj_idt48=&form%3Aj_idt50=&form%3Aj_idt52= &form%3Aj_idt66=&form%3Aj_idt68=&form%3Aj_idt70 =&form%3Aj_idt72=&form%3Aj_idt74=&form%3Aj_idt 76=&form%3Aj_idt78=&form%3Aj_idt80=&form%3Aj_i dt82=&form%3Aj_idt84=&form%3Aj_idt86=&form%3Aj _idt88=&form%3Aj_idt90=&form%3Aj_idt92=&form%3 Aj_idt94=&form%3Aj_idt96=&form%3Aj_idt98=&javax. faces.ViewState=7916482521909421983%3A- 2156051337299048496 False Post Data:javax.faces.partial.ajax=true&javax.faces.source=f orm%3Aj_idt18&javax.faces.partial.execute=form%3An ame&javax.faces.partial.render=form%3Adisplay&form %3Aj_idt18=form%3Aj_idt18&form=form&form%3Anam e=&javax.faces.ViewState=7916482521909421983%3 A-2156051337299048496 True

27. Ajax Update Keywords Copyright (C) 2012 Virtua, Inc. All rights reserved. KeywordType @thisStandard @formStandard @noneStandard @namingcontainerPrimeFaces @parentPrimeFaces @compositePrimeFaces @child(n)PrimeFaces @previousPrimeFaces @widgetVar(name)PrimeFaces

28. update=”@(form)” update=”@(form.first)” update=”@(.mystyle)” update=”@(.ui-datatable)” update=”@(:input:not(select))” update=”@(:input:disabled))” update=”@(form)” update=”@(form.first)” update=”@(.mystyle)” update=”@(.ui-datatable)” update=”@(:input:not(select))” update=”@(:input:disabled))” PrimeFaces Selectors (PFS)

29. Resource Handling Compress Minify On The Fly Loading Merge and Optimization s

30. Themes

31. Install a Theme Add primefaces-{themename}.jar Configure primefaces.THEME {themename} primefaces.THEME {themename}

32. Roll Your Own

33. Advanced Themes

34. Demo:Showcase

35. Client-side Validation Copyright (C) 2012 Virtua, Inc. All rights reserved. <p:commandButton value="Save" validateClient="true" ajax="false"/>

36. Instant Validation with Events Copyright (C) 2012 Virtua, Inc. All rights reserved. <p:commandButton value="Save" ajax="false" icon="ui-icon-check" validateClient="true"/>

37. Client-side Validation Messages are fully integrated API for writing custom client-side validators and converters Locale object available in JavaScript Copyright (C) 2012 Virtua, Inc. All rights reserved.

38. Bean Validation Integration Copyright (C) 2012 Virtua, Inc. All rights reserved. public class Bean { @NotNull @Max(30) private String name; … }

39. Other Features JavaScript API Accessibility Right-to-left support Exception handler Dialog framework Page authorization PrimeFaces Extensions … Copyright (C) 2012 Virtua, Inc. All rights reserved.

40. PrimeFaces Mobile

41. Mobile navigation 8 Core Components Gestures 20+ PrimeFaces Components

42. PrimeFaces Mobile …. … …. …

43. PrimeFaces Mobile

44. Demo: Mobile

45. PrimeFaces Push JSF APP PrimeFaces PushServlet

46. PrimeFaces Push Atmosphere

47. public void increment() { count++; EventBus eventBus = EventBusFactory.getDefault().eventBus(); eventBus.publish("/counter", String.valueOf(count)); } public void increment() { count++; EventBus eventBus = EventBusFactory.getDefault().eventBus(); eventBus.publish("/counter", String.valueOf(count)); } Bean PrimeFaces Push Page <p:commandButton value="Click" actionListener="#{counterView.increment}" /> <p:commandButton value="Click" actionListener="#{counterView.increment}" />

48. function handleMessage(data) { $('.display').html(data); } function handleMessage(data) { $('.display').html(data); } Callback PrimeFaces Push Endpoint @PushEndpoint("/counter") public class CounterResource { @OnMessage(encoders = {JSONEncoder.class}) public String onMessage(String count) { return count; } @PushEndpoint("/counter") public class CounterResource { @OnMessage(encoders = {JSONEncoder.class}) public String onMessage(String count) { return count; }

49. Demo: Push

50. Portlets

51. 550+ Pages Documentation

52. Books Copyright (C) 2012 Virtua, Inc. All rights reserved.

53. Community

54. Bundled with NetBeans

55. Training Support Consulting Enterprise PrimeTek Informatics