Title: BP1350: Progress Dynamics Applications for the Web
1BP1350Progress Dynamics Applications for the
Web
- Sunil Belgaonkar, Principal Software Engineer
- Doug Adams, Principal Software Engineer
2Objectives
- Introduce Progress Dynamics Web and its benefits
- Explore the new DHTML architecture
- Demonstrate building Progress Dynamics
application and enable it for the Web - Discuss best practices and design considerations
3Agenda
- Progress Dynamics Overview
- Progress Dynamics Web
- Architecture Components
- Building Web Applications
- Writing Business Logic
- Configuration
- Summary
4Progress Dynamics
Component of OpenEdge Studio A better way to
engineer world-class distributed business
applications
5The Better Way
A Switch in Paradigms
6Progress Dynamics Premise
- Define the Application, Dont Code It
- Requires fewer technical resources
- Less prone to technical errors
- Abstraction avoids technology lock-in
- Automate Everything Possible
- Automate the 80
- Concentrate on the 20
- Provide Extensible Common Services
- Provide Consistency
- Concentrate on Business Logic
7Progress Dynamics Architecture
8Progress Dynamics Demo
9Agenda
- Progress Dynamics Overview
- Progress Dynamics Web
- Architecture Components
- Building Web Applications
- Writing Business Logic
- Configuration
- Summary
10What is Progress Dynamics Web?
- Builds on Progress Dynamics framework
- DHTML rendering engine
- supporting server-side managers
- Windows GUI emulated in a web browser
- Rich, interactive UI linked objects, field
state, validation, lookup, find/filter, search
11What is Progress Dynamics Web?
- Stateless enterprise applications in a web
browser - Low network chat
- High performance, client-to-server communication
- Flexible, extensible architecture
12Why Use Dynamics Web?
- No client install
- Need rich, interactive, dynamically generated web
UI - Builds upon Dynamics framework
- Rapid application development environment
- Proven, extensible framework
- Reuse business logic
- Enterprise application deployment
13Progress Dynamics Web Demo
14Agenda
- Progress Dynamics Overview
- Progress Dynamics Web
- Architecture Components
- Building Web Applications
- Writing Business Logic
- Configuration
- Summary
15Progress Dynamics Web Layers
Web browser, HTTP client
WebTools
Request Manager
UI Manager
Session
Security
Profile
General
Local
WebSpeed 4GL Internals
_progres.exe p web-disp.p icfparam
ICFSESSTYPEICFWS
16Web Request Overview
17DHTML Core Technologies
- HTML DOM
- JavaScript Objects
- Replicate ADM2 behaviors
- Expose events, methods, properties
- Cascading Style Sheets (CSS 2)
- Static HTML for layout
- Certified on Internet Explorer 5.5
18Why JavaScript Objects?
Mozilla
Other
Internet Explorer
XBL
???
HTC
19New DHTML Architecture
Mozilla
Other
Internet Explorer
JavaScript Objects
XUL XBL
???
HTC
W3C\DOM
20Benefits of JavaScript Objects
- Cross-browser, cross-platform support
- Object extensibility
- Leverage existing JavaScript code
- Expose methods, events, and parameters to other
objects
21JavaScript Objects
- Generic objects
- ryapph.js, ryinfo.js, ryinithtml.js, rylookup.js,
ryrender.js, ryutil.js - Menu objects
- ryhotkey.js, rymenubar.js, rypopup.js,
rytoolbar.js, rytreeview.js - ADM2 simulation
- rybrowse.js, rydata.js, ryfolder.js, rywbo.js,
rywdo.js
22DHTML Control Structure
23Agenda
- Progress Dynamics overview
- Progress Dynamics Web
- Architecture Components
- Building Web Applications
- Writing Business Logic
- Configuration
- Summary
24Building Web Applications
- Same as GUI, but
- you can change the look-and-feel.
25Tailoring Web Applications
JSobjects
API
CSS, HTML
26Changing The Look - CSS
- Standard stylesheets ryapp.css, rymain.css
- Extend standard stylesheets
_at_import url(../dhtml/ryapp.css) / Tabfolders
/ folder TD.front backgroundurl(../img/tbluef
.gif) folder TD.back backgroundurl(../img/t
blueb.gif)
- Attach CSS using StyleSheetFile attribute
27Web Client Logic API
- Write client logic procedures in JavaScript
- Take advantage of Client Logic API
- consistency across clients
- hides DOM complexity
with(apph.logic) // Hide widget
hideWidget(customerfullo.browse.custnum) //
Disable widget disableWidget(customerviewv.name
)
- Attach CSS using StyleSheetFile attribute
28Custom Event Handling
- Data hooks
- add, cancel, delete, reset, update, validate,
view - UI hooks
- pagechange, refresh, run
function customerfullo_view() with
(apph.logic) if(widgetValue('customerviewv.bala
nce')gt20000) highlightWidget('customerviewv.b
alance,warn) else highlightWidget('custo
merviewv.balance')
29Extending JavaScript Objects
- Create object file with override behavior
- Include object file in default.htm layout file
- Set objects JavaScriptObject property to new
object file
30Extending JavaScript Objects
- // rybrowse2.js
- Browse2.prototypenew Browse()
- function Browse2()
- Browse2.prototype.actionOldBrowse.prototype.actio
n - Browse2.prototype.actionfunction(a,prm)
- with(this)
- switch(a0)
- case 'outline' elem.style.borderWidt
h'4px' - elem.style.borderColor'red'
- break
- default
- actionOld(a,prm) // Call old action()
-
-
31Moving to New Architecture
SP1
SP2
If you changed Re-edit appropriate htm files
Layout Files
If you changed Extend JavaScript Classes
HTC Files
32Build Application Demo
33Agenda
- Progress Dynamics overview
- Progress Dynamics Web
- Architecture Components
- Building Web Applications
- Writing Business Logic
- Configuration
- Summary
34Writing Business Logic
- runOnServer() JavaScript API
- run server-side logic based on DHTML client
request - setClientAction 4GL procedure
- set client actions and/or return data to DHTML
client - 4GL SESSIONCLIENT-TYPE
- include/exclude code based on client type
- Server logic can be in SDO logic procedure or
separate .p or Persistent Library of Internal
Procedures (PLIP)
35Business Logic Demo
36Recommended Practices
- Override framework CSS files using _at_import
- Minimize client-side logic for portability
- Utilize Client Logic API
- Override JavaScript objects to implement your own
behaviors
37Recommended Practices
- Code for cross-browser support
- Take advantage of repository attributes for
- CLASS property HtmlClass
- STYLE property HtmlStyle
- attaching JavaScript files JavaScriptFile
- attaching stylesheet files StyleSheetFile
- overriding objects JavaScriptObject
- Use web server Extension Mapping to shorten URL
38Agenda
- Progress Dynamics overview
- Progress Dynamics Web
- Architecture Components
- Building Web Applications
- Writing Business Logic
- Configuration
- Summary
39Configuration
- Provided out-of-the-box
- ICFWS Session Type (icfconfig.xml)
- Managers pre-started
- ICFDB, your app database
- wsdynamics1 broker
- Agent -icfparam ICFSESSTYPEICFWS
- Environment Variables
- logging, state-aware, compile-on-fly
40Configuration
- To support multiple configurations
- Create multiple WebSpeed brokers
- Create web server virtual directories
- Create an extension mapping for .icf to
c\dlc\bin\cgiip.exe i broker
41Session Type Demo
42Agenda
- Progress Dynamics overview
- Progress Dynamics Web
- Architecture Components
- Building Web Applications
- Writing Business Logic
- Configuration
- Summary
43Summary
- No client install
- Dynamically generated GUI, DHTML applications
from same common, abstract repository - Consistent look-and-feel across GUI and Web
browser clients - Reusable, extensible, dynamic objects
- Standards-based architecture, open browser
readiness using native JS objects
44Products Under Development
- This section includes information about potential
future products and/or product enhancements. - What we are going to say reflects our current
thinking, but some information contained herein
is preliminary and subject to change. Any future
products we ultimately deliver may be materially
different from what is described here. - In other words - you cant believe everything we
are going to say.
45Whats Next?
- Improve GUI Consistency
- Static and dynamic SBO support
- Treeview Object support
- Dynamic Frames
- Certify other popular web browsers across
platforms e.g. Mozilla/ Netscape
46B2C Functionality
- Static / Dynamic Content Mix
- Dynamic Tags
- Layout Flexibility
- New Object Types Catalog Viewer
- Cross-Page Business Transactions
- Flexible Process and Work Flow
- Greater Browser / Platform Flexibility
- Common Tools / Business Logic
47Questions
?