Adobe AIR - Connecting Desktop And The Web Developer‘s Day 2008 Niels Drobek

Overview Introducing AIR Why Adobe AIR Existing Examples AIR Technology AIR with HTML and Ajax Map Example Security Model Flex Community App Conclusion

Introducing AIR

Why Adobe AIR

Existing Examples

AIR Technology

AIR with HTML and Ajax

Map Example

Security Model

Flex Community App

Conclusion

Introducing Adobe AIR Adobe Integrated Runtime, after 1 year development first official release 1.0 Ability to build desktop apps using web development technology, like: ActionScript with Flash or Flex (ide) HTML / JavaScript / CSS / Ajax Desktop apps without learning traditional desktop development technologies

Adobe Integrated Runtime, after 1 year development first official release 1.0

Ability to build desktop apps using web development technology, like:

ActionScript with Flash or Flex (ide)

HTML / JavaScript / CSS / Ajax

Desktop apps without learning traditional desktop development technologies

AIR Runtime Apps are installed and run like any other desktop apps Cross-operating system runtime Win, Mac, Lnx Look&Feel of native window system

Apps are installed and run like any other desktop apps

Cross-operating system runtime Win, Mac, Lnx

Look&Feel of native window system

Why connect Desktop and Web? Example Apple iTunes: desktop app that leverages web-based technology (Apple iTunes Music Store) No browser necessary and seamless integration and wildly popular means of media distribution

Example Apple iTunes: desktop app that leverages web-based technology (Apple iTunes Music Store)

No browser necessary and seamless integration and wildly popular means of media distribution

Adobe AIR Examples Desktop ebay: for power sellers to manage their auctions Finetune Desktop: listen to user created playlists or dynamic playlists dedicated to artists and tags

Desktop ebay: for power sellers to manage their auctions

Finetune Desktop: listen to user created playlists or dynamic playlists dedicated to artists and tags

Taking WebKit browser engine (most notably used in Safari), together with Flash and PDF technologies, as a desktop runtime to offer an API that enables common desktop features like: file IO network awareness native drag-and-drop embedded SQLite Adobe AIR Technology webkit.org

Taking WebKit browser engine (most notably used in Safari), together with Flash and PDF technologies, as a desktop runtime to offer an API that enables common desktop features like:

file IO

network awareness

native drag-and-drop

embedded SQLite

AIR and Flash Player API Service Monitor (ServiceMonitor, SocketMonitor, URLMonitor) Data (SQL) Media (Sound and Video Files) HTML (HTMLLoader) Security (XMLSignatureValidator) Utility (Timer) UI (Keyboard, Mouse) Display (NativeMenu, Screen, Loader, Bitmap) Desktop (Clipboard) System (OS) Network (URLRequest, URLLoader, NetConnection) Native window Geometry Events (ProgressEvent, HTTPStatusEvent, IOErrorEvent) File

Service Monitor (ServiceMonitor, SocketMonitor, URLMonitor)

Data (SQL)

Media (Sound and Video Files)

HTML (HTMLLoader)

Security (XMLSignatureValidator)

Utility (Timer)

UI (Keyboard, Mouse)

Display (NativeMenu, Screen, Loader, Bitmap)

Desktop (Clipboard)

System (OS)

Network (URLRequest, URLLoader, NetConnection)

Native window

Geometry

Events (ProgressEvent, HTTPStatusEvent, IOErrorEvent)

File

Hello World Html file XML descriptor file

How to develop? AIR runtime + Software Development Kit (SDK) Tool for testing command line (adl) GUI creation with Editor/Dreamweaver/ Flash/ Flex Tool (adt) for packaging to executable Adobe AIR Files (including all libraries, xml files, databases, images, icons)

AIR runtime + Software Development Kit (SDK)

Tool for testing command line (adl)

GUI creation with Editor/Dreamweaver/ Flash/ Flex

Tool (adt) for packaging to executable Adobe AIR Files (including all libraries, xml files, databases, images, icons)

MapCache Example 1/2 Yahoo Maps on the desktop Getting pixels from screen and save them to desktop Clipboard support from OS Drag & Drop image from app to desktop Provides native file IO

Yahoo Maps on the desktop

Getting pixels from screen and save them to desktop

Clipboard support from OS

Drag & Drop image from app to desktop

Provides native file IO

MapCache Example 2/2 Also additional javascript libraries like Prototype, e.g. to get dimension of a div or position of an element AIR API to extend js‘s functionality and capture pixels on screen

Also additional javascript libraries like Prototype, e.g. to get dimension of a div or position of an element

AIR API to extend js‘s functionality and capture pixels on screen

MapCache Example 2/2 Also additional javascript libraries like Prototype, e.g. to get dimension of a div or position of an element AIR API to extend js‘s functionality and capture pixels on screen ActionScript 3 Core Library by Google Code to offer more functionality to Javascript

Also additional javascript libraries like Prototype, e.g. to get dimension of a div or position of an element

AIR API to extend js‘s functionality and capture pixels on screen

Security Model: Sandboxes Application sandbox: has full access to the Adobe AIR APIs, but places certain restrictions on the JavaScript that can be executed Non-application sandbox: operates just like the browser, and doesn't give access the Adobe AIR APIs

Application sandbox: has full access to the Adobe AIR APIs, but places certain restrictions on the JavaScript that can be executed

Non-application sandbox: operates just like the browser, and doesn't give access the Adobe AIR APIs

Example: SearchCoders Dashboard

Conclusion Suitable for app that are often used and require a lot of data from the web, like intensive community activities Adobe AIR blurs the line between Flash and HTML technologies by making them virtually interchangeable (as3 + js)

Suitable for app that are often used and require a lot of data from the web, like intensive community activities

Adobe AIR blurs the line between Flash and HTML technologies by making them virtually interchangeable (as3 + js)

Thank you for your attention!