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

ARCH-4: The Presentation Layer in the OpenEdge® Reference Architecture

Frank BeusenbergSenior Technical Consultant

© 2006 Progress Software Corporation2ARCH-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


What’s this?

PresentationPresentation

Business ServicesBusiness Services

Data AccessData Access

Data SourcesData Sources

Co

mm

on

Infrastru

cture

Co

mm

on

Infrastru

cture

Enterprise ServicesEnterprise Services


Problems

User Interface• Options• Implications• Contracts• Considerations

What? How? When?


Agenda




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?



Presentation Layer Platform changes often

Business Logic Platform does not

What are the business drivers?



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



The user experience remains critical!

About Face 2.0 – The Essentials of Interaction Design – Alan Cooper

The problems involved



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


Agenda




Client-side options

Rich client Thin client Smart client Special devices

Types of clients


Client-side options

Client Type Comparison

Rich Client Thin Client Smart 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


Agenda




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



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



MVC (Model View Controller) Pattern – Passive Model



MVC (Model View Controller) Pattern – Passive Model



MVC (Model View Controller) Pattern – Active Model



MVC (Model View Controller) Pattern – Active Model


Demonstration



Components

UI Elements

UI Controllers

Users Users

Service/Data Access

Mgr Fn()Fn()

Business

Servicing

Layer

Request

Bus Task

Bus Entity Service

DB

Ap

plic

atio

n F

eatu

res

Ap

plic

atio

n F

un

ctio

nal

ity



Update Customer

Save Order

Validate Order

Check Inventory

Nav

igat

ion

Lo

ok

and

Fee

l

Per

son

aliz

atio

n

Sec

uri

ty

Abstract your Functions

Be Consistent with Your Features



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/enabledThink in terms of layers

Managing the Presentation Layer


Agenda




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

BusinessWorkflow

Business Tasks

BusinessEntities

Alert

STOP

Service Interface



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



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


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



Looking Ahead

Design for flexibility (MVC)

UI technology will change!• Easy replacement of graphical specifics (View)

Be prepared!


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!


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


For More Information, go to…

OpenEdge Reference Architecture

Enhancing the OpenEdge GUI

PSDN


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


Questions?


Thank you foryour time


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

Documents

progress software corporation

user interfaceclient

new presentation layer

user interfacebusiness

openedge ra

business drivers

mvc patternconnecting

remote data sources