1. ARCH-4: The Presentation Layer in the OpenEdge® Reference Architecture Frank Beusenberg Senior Technical Consultant

2. © 2006 Progress Software Corporation2 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Agenda  Introduction  Separation of the user interface  Client-side options  Design using MVC pattern  Connecting to the Business Servicing Layer  Looking ahead  Q&A The Presentation Layer in the OpenEdge RA

3. © 2006 Progress Software Corporation3 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture What’s this? Presentation Business Services Data Access Data Sources Common Infrastructure Enterprise Services

4. © 2006 Progress Software Corporation4 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Problems  User Interface Options Implications Contracts Considerations What? How? When?

5. © 2006 Progress Software Corporation5 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Agenda  Introduction  Separation of the user interface  Client-side options  Design using MVC pattern  Connecting to the Business Servicing Layer  Looking ahead  Q&A The Presentation Layer in the OpenEdge RA

6. © 2006 Progress Software Corporation6 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Separation of the user interface  Market Pressure Technology Look and Feel (‘sizzle’)  Change ‘way of working’ E.g. Form-based to Task-based  Extending Application Reach E.g. “Webify” a rich client application What are the business drivers?

7. © 2006 Progress Software Corporation7 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Separation of the user interface  Presentation Layer Platform changes often  Business Logic Platform does not What are the business drivers?

8. © 2006 Progress Software Corporation8 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Separation of the user interface  Business Logic often assumes knowledge of the UI E.g. coloring a field when given a value  Different Presentation Layers have different inherent capabilities E.g. can we still color a field when given a value  UI Performance can influence implementation E.g. gather more data before sending The problems involved

9. © 2006 Progress Software Corporation9 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Separation of the user interface  The user experience remains critical! About Face 2.0 – The Essentials of Interaction Design – Alan Cooper The problems involved

10. © 2006 Progress Software Corporation10 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Separation of the user interface  Decouple presentation from business logic Define service interface & data requirements  Integrate local and remote data sources prior to display  Enable connected and disconnected use Requirements for a new presentation layer

11. © 2006 Progress Software Corporation11 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Agenda  Introduction  Separation of the user interface  Client-side options  Design using MVC pattern  Connecting to the Business Servicing Layer  Looking ahead  Q&A The Presentation Layer in the OpenEdge RA

12. © 2006 Progress Software Corporation12 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Client-side options  Rich client  Thin client  Smart client  Special devices Types of clients

13. © 2006 Progress Software Corporation13 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Client-side options Client Type Comparison Rich ClientThin ClientSmart Client Advantage  Performance  Offline availability  High integration  Rich UI  Deployment  OS independent  Reach  Performance  Offline availability  High integration  Rich UI  Deployment Disadvantage  Deployment  OS dependent  Online availability  Simple UI  Limited integration  Performance  OS dependent Service Interface  Client based  Proxy  Late vs Early binding  Server based  Proxy or direct  Late vs Early binding  Client based  Proxy  Late vs Early binding Client Technology  Progress 4GL GUI  Microsoft.NET GUI  Java™ GUI  Progress WebSpeed®  Microsoft ASP.NET  Java™ JSP  Progress WebClient™  Microsoft.NET  Java™ WebStart

14. © 2006 Progress Software Corporation14 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Agenda  Introduction  Separation of the user interface  Client-side options  Design using MVC pattern  Connecting to the Business Servicing Layer  Looking ahead  Q&A The Presentation Layer in the OpenEdge RA

15. © 2006 Progress Software Corporation15 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Design of the Presentation Layer  Separate modeling of domain, presentation and actions based on user input into three classes [Burbeck92] Model –Manages behavior and data of application domain Control –Processes user input and informs model and/or view of change if appropriate View –Manages display of information MVC (Model View Controller) Pattern

16. © 2006 Progress Software Corporation16 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Design of the Presentation Layer  Passive Model Model does not report state changes  Active Model Model reports state changes to view(s) –Observer pattern (Publish/Subscribe) MVC (Model View Controller) Pattern

17. © 2006 Progress Software Corporation17 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Design of the Presentation Layer MVC (Model View Controller) Pattern – Passive Model

18. © 2006 Progress Software Corporation18 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Design of the Presentation Layer MVC (Model View Controller) Pattern – Passive Model

19. © 2006 Progress Software Corporation19 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Design of the Presentation Layer MVC (Model View Controller) Pattern – Active Model

20. © 2006 Progress Software Corporation20 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Design of the Presentation Layer MVC (Model View Controller) Pattern – Active Model

21. © 2006 Progress Software Corporation21 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Demonstration

22. © 2006 Progress Software Corporation22 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Design of the Presentation Layer Components UI Elements UI Controllers Users Service/Data Access Mgr Fn() Business Servicing Layer Request Bus Task Bus EntityService DB Application Features Application Functionality

23. © 2006 Progress Software Corporation23 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Design of the Presentation Layer Update Customer Save Order Validate Order Check Inventory Navigation Look and Feel Personalization Security Abstract your Functions Be Consistent with Your Features

24. © 2006 Progress Software Corporation24 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Design of the Presentation Layer Session/Context Management Security Localization Customization/Productization Personalization Rights and accessibility attributes are determined Context is determined and made accessible to the presentation layer Language and cultural features are applied/enabled Company or product features are applied/enabled User-specific attributes are applied/enabled Think in terms of layers Managing the Presentation Layer

25. © 2006 Progress Software Corporation25 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Agenda  Introduction  Separation of the user interface  Client-side options  Design using MVC pattern  Connecting to the Business Servicing Layer  Looking ahead  Q&A The Presentation Layer in the OpenEdge RA

26. © 2006 Progress Software Corporation26 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Connecting to the Business Servicing Layer  Early Binding  Late Binding Presentation Layer/s Integration Layer/s Data Access Layers Managed Unmanaged In Out Service Interface Business Workflow Business Tasks Business Entities Alert STOP Service Interface

27. © 2006 Progress Software Corporation27 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Connecting to the Business Servicing Layer Define input parameter pcParam1 as character. Define input parameter pcParam2 as character. Define output parameter piResult as integer. Define variable hEntity as handle. hEntity = dynamic-function( ‘getEntityHandle’, input ‘theBE’ ). Run internalproc in hEntity ( input pcParam1, input pcParam2, output piResult ). Early Binding Service Interface example

28. © 2006 Progress Software Corporation28 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Connecting to the Business Servicing Layer Define input parameter pcEntity as character. Define input parameter pcOperation as character. Define input-output parameter table-handle phContext. Define output parameter dataset-handle phOutDataset. Define input-output parameter dataset-handle phIODataset. Define variable hEntity as handle. hEntity = dynamic-function(‘getEntityHandle’, input pcEntity). Case pcOperation: when “fetchWhere” then run fetchWhere in hEntity ( input phContext, output phOutDataset ). when … End case. Return. Late Binding Service Interface example

29. © 2006 Progress Software Corporation29 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Agenda  Introduction  Separation of the user interface  Client-side and user interface logic  Design using MVC pattern  Connecting to the Business Servicing Layer  Looking ahead  Q&A The Presentation Layer in the OpenEdge RA

30. © 2006 Progress Software Corporation30 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Looking Ahead  Design for flexibility (MVC)  UI technology will change! Easy replacement of graphical specifics (View) Be prepared!

31. © 2006 Progress Software Corporation31 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Summary  OpenEdge Reference Architecture provides flexibility for alternative UIs  Architect the presentation layer and business layer appropriately  Target your business logic to the most appropriate device and user  Design for change!

32. © 2006 Progress Software Corporation32 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Presentation Layer Resources  About Face 2.0: The Essentials of Interaction Design By Alan Cooper ISBN: 0764526413  Java and MVC http://java.sun.com/blueprints/patterns/MVC-detailed.html .NET and MVC http://www.devx.com/dotnet/Article/10186/0/page/1  Interface Hall of Fame/Shame http://homepage.mac.com/bradster/iarchitect/shame.htm  UI Patterns & Techniques http://time-tripper.com/uipatterns/Introduction

33. © 2006 Progress Software Corporation33 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture For More Information, go to…  OpenEdge Reference Architecture  Enhancing the OpenEdge GUI PSDN

34. © 2006 Progress Software Corporation34 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture For More Information, go to…  ARCH-5: Service Interfaces in Practice  ARCH-9: Systems that Don't Work and Why  ARCH-13: Multiple "Views" with WebSpeed  DEV-13: Super Resize Me!!  MOVE-5: Improving the Look and Feel of Your Application  INNOV-2: Build a Better Web Interface using AJAX  INNOV-8: Demystifying Windows Vista  INNOV-9: OpenEdge Development Products Roadmap  INNOV-14: A Look Inside the OpenEdge UI Research Lab  INNOV-16: Rich User Interface for the Web? AJAX to the Rescue Relevant Exchange Sessions

35. © 2006 Progress Software Corporation35 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Questions?

36. © 2006 Progress Software Corporation36 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture Thank you for your time

37. © 2006 Progress Software Corporation37 ARCH-4: Presentation Layer in the OpenEdge Reference Architecture