1. OpenEdge Mobile
An Introduction
Shelley Chase
Progress OpenEdge

2. Turn your cell phones on!
BYOD – Bring Your Own Device
Reminder:
Turn your cell phones on!

3. Mobility Is Top-of-mind for Customers & ISVs
Allow customers to submit and track their claims using mobile and web devices
Insurance
Put iPads in the hands of customer service reps to deliver the next-gen retail experience
Retail
Provide real-time tracking and optimization of the supply chain
Manufacturing
Move their applications to SaaS in order to increase competitiveness, thus requiring web and mobile UIs
Technology
Allow customers to self-service their bookings, manage passes, submit claims, and provide feedback through mobile devices
Travel and Transportation
“I want to enable my customers to self-service using their phones or via the web”
“I need to provide mobile capabilities in order to compete for new business”
“I am moving to the cloud and require new, modern UIs”
“I can leverage mobility to gain more information about my customer”
“I can deliver a better customer experience if I can always reach them”
Key Messages

4. Mobile is Moving – 3x in 2 years (and Growing)

5. Online Retailers Are Already Seeing Shoppers Buying via Mobility

6. And They are Fast Adopting It Themselves for Efficiency

7. Insurance and Banking Are Being Redefined by the Request to Self-Service

8. UI Options for OpenEdge Applications
Desktop
Richest user experience
User productivity is key
Powerful features working with complex data
Internal/back office power users
Web Browser
Location and machine independence
Target features made available
Internal and external users
Mobile Device
Access from anywhere, at any time
Ability to sense location and user environment
And to push information
Internal and external users - wider user base

9. Can’t I Just Use My Rich Internet Application (RIA) and Display It On a Mobile Device…?
Different user experience and user expectations
Apps can be installed
Home screen with no menus/toolbars
Portrait and landscape display modes
Integration with social sites
Limited real estate
Focus is on user needs: maximum productivity for least effort
Normally a subset of features of a Desktop Web App
Device-specific features
Touch screen
Contact list, calendar
Camera, microphone
Accelerometer, Geo-location

10. Can’t I Just Use My Rich Internet Application (RIA) and Display It On a Mobile Device…?
Physical resource limitations
Fluctuations in bandwidth - need to minimize data transfer
Unreliable connection, battery power
Additional security challenges
Data storage on device (off-line)
User access, authentication, authorization across open networks

11. Three Types of Mobile Applications
Build app for each platform one by one
Full capabilities and integration with device
AppStore presence, restricted distribution
Native App (Device specific)
Write app code once run on many devices
Native container provides access to device capabilities
Hybrid App (Device specific + HTML5/CSS/JavaScript)
Write app once, runs in web browser on device
Limited access to device capabilities
No AppStore, unrestricted distribution
Internet connection required
Mobile Web App (HTML5/CSS/JavaScript)

12. OpenEdge Mobile
The Product

13. OpenEdge Mobile Value Proposition: Benefits:
Write Once, Run Anywhere Portability with the Benefits of Native Applications. The Easiest Way to Build an OpenEdge Application Supporting Mobile Devices, End-to-end
Benefits:
A comprehensive and integrated tool set with support for a wide variety of devices
Mobile UI development is Cloud-based, so collaboration among the development team, business analysts and with end users is fully supported
Leverage existing business logic, the OpenEdge AppServer and database

14. OpenEdge Mobile = “The Best Of Both Worlds”
Standards-based solution
Write the UI code once, deploy to multiple devices
Native container provides support for App Store and HTML5 limitations
Flexible deployment options of both Web App and Hybrid App
No need to learn device-specific languages or development environments
Hybrid App (Native Wrapper + Web App)
By 2015, 80% of all mobile web applications developed will be hybrid or mobile web.
Gartner 2012: Magic Quadrant for Mobile Consumer Application Platforms

15. Development: Integrated Development Environment
Mobile App Builder
Drag-n-drop UI designer
Integrated emulator
Tight data binding to OE
Packages mobile apps for deployment
Developer Studio for OE
Define and build mobile services
Deploy Mobile services and Mobile Web Apps
Test App from browser
Let’s start with description that sums up OpenEdge Mobile.
OpenEdge Mobile provides support to write applications designed to run on mobile devices
that can access business logic and data on OpenEdge AppServers.
We’ll dive deep taking a look at how to develop and deploy OpenEdge Mobile applications,
and to gain a full appreciation of why OpenEdge Mobile is a compelling product in the market place today.

16. Developing a Mobile App Methodology
Step 1
Step 2
Step 3
Step 4
Build UI
Build OE services
Bind data and UI
Build and deploy

17. Build the UI (Step 1) - Demo

18. “WYSIWYG” Designer

19. Add Events for UI Logic

20. Emulator

21. Define Mobile Service (Step 2) - Demo

22. Create Mobile Project

23. Business Entity

24. Business Entity

25. Build and Deploy Mobile Service

26. Deployed Mobile Service

27. Bind Data and UI (Step 3) Options to access OE AppServer
JavaScript Data Object (JSDO)
Simplifies interaction with OE AppServer
Client-side “prodataset”
Support for CRUD and invoke operations
Handles connection and communication
Session management built-in
Call OE REST Service
Understand URL space
Manage connections and session lifecycle
Build HTTP Request and decompose HTTP response
Parse JSON data and handle errors
JSDO
Customer
Order

28. Use JSDO Service for Visual Data Mapping - Demo

29. Create JSDO Service from Catalog

30. Add JSDO Services to UI

31. Drag-n-drop Data mapping

32. Build and Deploy (Step 4)

33. Build and Deploy (Step 4) – Mobile Web App
Generate files for App
Run in cloud or copy files local to PDSOE
In PDSOE:
Package Mobile Web App
Deploy App to a Web Server

34. Build and Deploy (Step 4) – Native App
Generate files for App
Create PhoneGap project
Build binary file

35. Build and Deploy (Step 4) – Native App
Generate files for App
Create PhoneGap project
Build binary file
Test on local device or deploy to App Store

36. OpenEdge Mobile
The Architecture

37. Runtime Architecture for OE Mobile
Client-side
App resides on device
OE DB
*.html
*.js
Internet
Server-side
n-tier architecture with
Business Logic and data
HTTP (REST / JSON)
Business Entity
JSDO
JSDO-BE Mapping
ABL

38. Runtime Architecture of a Mobile Web App
HTTP Web Server
Device OS
Authentication
Mobile device browser
HTTP
Session Manager
Web application
Mobile App
Mobile Service
URL
HTTPS
Web App HTML, CSS, JS
Progress JSDO
Web App HTML, CSS, JS
Progress JSDO
URL-to-ABL mapping
JSDO
Catalog.json

39. Runtime Architecture of a Mobile Web App
HTTP Web Server
Device OS
Authentication
Mobile device browser
HTTP
Session Manager
Web application
Mobile App
Mobile Service
Web App HTML, CSS, JS
HTTPS
Web App HTML, CSS, JS
Progress JSDO
Web App HTML, CSS, JS
Progress JSDO
URL-to-ABL mapping
Progress JSDO
JSDO
Catalog.json
JSDO
Catalog.json

40. Runtime Architecture of a Native App
HTTP Web Server
Device OS
Authentication
Native App
HTTP
Session Manager
PhoneGap
Web application
Webkit browser
Mobile Service
Web App HTML, CSS, JS
No need for Mobile App – deployed as Native App
HTTPS
URL-to-ABL mapping
Progress JSDO
JSDO
Catalog.json
JSDO
Catalog.json

41. Utilize OpenEdge Backend Services
App
JSDO
Mobile Application
Based on HTML5 (HTML5, CSS, JavaScript) and can be run in a web browser, as a web app or as a hybrid app.
Web Server
REST Manager
JSDO (JavaScript Data Object)
Provides access to OpenEdge data available via the AppServer REST Adapter.
App Server
App Server
REST Manager
Allows execution of business logic on an AppServer via HTTP (internet) calls, which in turn could access the DB.
OpenEdge DB
OpenEdge DB

42. Mobile App Accessing AppServer Business Logic and Data
Web Server
OpenEdge AppServer
Mobile Web App
Customers JSDO
Customers.cls
(Mobile Interface)
OrderEntry Mobile Service
Customers Resource
fill( )
Read operation
ReadCustomers( )
remove( )
save Changes( )
Delete operation
DeleteCustomers( )
add( )
saveChanges( )
Create operation
CreateCustomers( )
Now we’re going a little deeper to see the JSDO methods that are called in a Mobile App to do specific operations on the AppServer.
We have the familiar architectural structure, but using Customers to give it a more realistic flavor dealing with a specific set of operations.
Thus we have a Customers JSDO, an OrderEntry Mobile service, and an ABL Customers.cls.
<CLICK>
In this case we want get the data for a set of customers from the AppServer to the Mobile App.
We are working with the Customers JSDO, and calling the JSDO fill( ) method, which is used to request data.
OpenEdge Mobile provides a set of built-in definitions for a set of CRUD operations. One of these operations is the READ operation, and that is represent here as one of the methods that is available in the Customers Resource, of the OrderEntry Mobile service.
The JSDO fill( ) operation causes an HTTP Request to be sent to the Customer Resource, Read operation.
The Read operation on the Web server - calls the ReadCustomers( ) method - in the Customers.cls class on the AppServer.
The ReadCustomers( ) method is an ABL method that was written by a developer to implement the Read operation.
In the session on the AppServer business entities we’ll see how the ReadCustomers.cls class is coded.
In our example the ReadCustomers( ) method reads the customers from an OpenEdge database, using any filter that may have been provided in the call from the Mobile App. This data is returned back travelling by the same route. The Mobile App handles the returned data in the HTTP Response that was sent by the Read operation.
I’ve expanded the display to show all of the built-in operations. This work the same way. We can see the methods that are called in the JSDO for each one. We’ll go into more detail on these methods in the session on the JSDO.
The CURD operations for remove( ), add( ) and assign( ) – all operate on the local store, client side only. The saveChanges( ) sends the updates to the server.
This completes the set of operations that have been defined. The last two operations are called using Invoke, which provides support for calling all singleton ABL routines, that are not built-in operations.
Although getOrderHistory is the same name on both sides, the INVOKE in the JSDO is done by calling the method name in JavaScript. The name of the method in JavaScript does not need to be the same as the business entity name, since the catalog is the one that does the mapping.
Note: remove( ) was selected for the JSDO operation since delete is a reserve word in the JSDO.
Summary: The Mobile resource maps to an ABL class singleton object, which provides the ABL routines (methods, in this case) that implement the Mobile operations of that resource.
assign( )
saveChanges( )
UpdateCustomers( )
Update operation
GetCreditHistory( )
getCreditHistory( )
Invoke operation
GetOrderHistory( )
getOrderHistory( )
Invoke operation

43. REST Adapter Handling of HTTP Requests
GET
deployment time end point information
design time REST resource information
runtime time client information
REST Adapter
HTTP headers & body
IDL & mapping
HTTP header & body handler
Resource to procedure mapping
Procedure parameter handler
AppServer client

44. OE Mobile
Product Availability

45. Devices Supported and Pricing Considerations
Supported Devices in OpenEdge 11.2 Release1:
iPhone – iOS 5 or later
iPad – iOS 5 or later
Android 4.0 or later (Ice Cream Sandwich, Jelly Bean)
Web browser (HTML5/CSS3/JavaScipt) – latest versions
Pricing Highlights:
Development Licenses for Mobile App Builder: Annual Subscription per Developer
Runtime JSDO Adapter license (Like AppServer)
1 A detailed supported platform list will be provided with the OpenEdge 11.2 supporting documentation

46. Summary OpenEdge Mobile
A Complete End-to-end Solution For Supporting Mobile Devices With OpenEdge Applications
Develop with the premier OpenEdge development environment, Progress Developer Studio for OpenEdge
Mobile App Builder in the cloud
Ease-of-use features to simplify interaction with OpenEdge applications
JavaScript Data Objects easily connect UI screens to the supporting data
REST Manager to make it easy to execute OpenEdge business logic and access data on the AppServer

47. www.progress.com/exchange-pug October 6–9, 2013 • Boston #PRGS13
Special low rate of $495 for PUG Challenge attendees with the code PUGAM
And visit the Progress booth to learn more about the Progress App Dev Challenge!

48. Change color