1. DEV-04 Building OpenEdge® Reference Architecture Applications with WebSpeed® Chris Skeldon Principal Consultant

2. 2© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Agenda n OpenEdge Reference Architecture n WebSpeed architecture n Writing your 4GL program n Creating the user-interface

3. 3© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed The browser has arrived? “Increasingly ITTs require browser access” “Nearly everbody wants access through a browser”

4. 4© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed OpenEdge Reference Architecture Users Presentation Layer Business Servicing Layer Data Access Layer Managed Data Stores Unmanaged Data Stores Enterprise Services Integration Layer Environment Managers and Utilities

5. 5© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed WebSpeed Architecture User AgentWebSpeed Transaction Server WebServer WebSpeed Messenger WebSpeed Broker WebSpeed Agent NameServer

6. 6© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Running a WebSpeed program http://localhost computer /scripts/ directory on web server /cgiip.exe/ WebSpeed Messenger /wsSportsPro/ WebSpeed Broker /main/splogin.p Your 4GL program

7. 7© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Your 4GL Program sends HTML {&OUT} " Hello World "

8. 8© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Writing your 4GL program n Embedded SpeedScript n CGI Wrapping n Mapped WebObjects n eScript WebObject All compile to Progress 4GL statements sending out HTML

9. 9© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Embedded SpeedScript n Embeds 4GL inside HTML n Allows use of HTML editors n Script tags start and end 4GL blocks Expression escapes: ` n Turned inside-out and compiled FOR EACH Customer NO-LOCK: {&OUT} " ". FOR EACH Customer NO-LOCK:

10. 10© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Example of Embedded SpeedScript FOR EACH Customer NO-LOCK WHERE … : `Customer.CustNum` `Customer.Name` END.

11. 11© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed CGI Wrapping n Insert HTML into 4GL procedures n Standard coding structure n Can generate non-HTML content

12. 12© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Example of CGI Wrapping {&OUT} " ":U. FOR EACH Customer NO-LOCK WHERE … : {&OUT} " ":U Customer.CustNum " ":U Customer.NAME " ":U. END. {&OUT} " ":U.

13. 13© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Mapped WebObjects n Separates HTML from 4GL n Allows use of HTML editors n 4GL code manipulates widgets n Integrates with SmartDataObjects n Good for forms n Uses offset file to link 4GL and HTML n Can manipulate HTML in 4GL n Standard coding structure

14. 14© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Mapped WebObjects

15. 15© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed eScript WebObject n WebObject at the heart of ps:eScript n Absolute separation of 4GL from HTML n HTML can be changed without recompiling n One 4GL program can support many HTML ‘views’ n Will be on PSDN n Not supported http://outletservice.mmbox.co.uk/outlet.asmx?WSDL

16. 16© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Adding sizzle Creating the user-interface

17. 17© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed 4GL is not enough n Poor UI can hide a great 4GL application n Great UI attracts people to application/site n Great UI needs: –design – presentation & usability –technical - XHTML, CSS, JavaScript Got all these skills?

18. 18© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Delivering the UI n 4GL developers need some XHTML, CSS and JavaScript n Design experts create templates n 4GL developers apply across application

19. 19© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed 4GL developer v. designer

20. 20© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed 4GL developer v. designer

21. 21© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed UI implementation n Standards based approach recommended –Quicker and more consistent rendering –Make re-skinning easier n HTML is dead. Long live XHTML! –HTML 4.01 December 1999 –XHTML 1.0 January 2000 –XHTML 1.1 May 2001 –XHTML 2.0 ?

22. 22© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Standards n XHTML –Valid XML –Defines structure of a page –Use ‘standards mode’ n Cascading style sheets (CSS) –Presentation for structured documents n ECMAScript –Makes pages more dynamic

23. 23© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Valid XHTML n Must conform to a DTD n Correctly nested n Lower case element and attribute names n End tags n Quoted attribute values n No attribute minimisation n Terminated empty elements

24. 24© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Writing invalid XHTML Old Style Name Phone Adolphs Sporting Co (617) 964-6633 Show all No DTD Upper case elements Missing end tags Missing quotes Minimisation Empty elements

25. 25© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Writing valid XHTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> Name Phone Adolphs Sporting Co (617) 964-6633 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> New Style Name Phone Adolphs Sporting Co (617) 964-33 Show all DTD Lower case End tags …

26. 26© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed In Summary n Have an architecture n Programming model – 4 to choose from n Great UI –design –standards

27. 27© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Questions?

28. 28© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed Thank you for your time!

29. 29© 2005 Progress Software Corporation DEV-04 Building OpenEdge RA Applications with WebSpeed