SlideShare una empresa de Scribd logo
1 de 17
Descargar para leer sin conexión
Building Desktop RIAs with
PHP, HTML & Javascript
in AIR
Ed Finkler, php|tek 2008, May 22 2008
funkatron.com / funkatron@gmail.com
What is AIR?

For the desktop
Not a browser plugin
Build desktop apps with web technologies
AIR architecture
   A flash player + special AIR-specific APIs
      HTMLLoader control
         Uses WebKit – like Safari 3


                         Flash
                                              Zee Cloud
    OS                                         web server
Win/Mac/Linux            Webkit
                      (HTMLLoader)
Building apps

Flex (XML + Actionscript → SWF)
Flash (the authoring tool → SWF)
HTML (HTML + JS + CSS)
  open standards!
  just like regular web pages
The bare essentials

 Application descriptor (.xml)
 Initial content (.swf or .html)
   If .html detected, auto-creates Flash wrapper with
   HTMLLoader control
App descriptor
 <?xml version=quot;1.0quot; encoding=quot;UTF-8quot;?>
 <application xmlns=quot;http://ns.adobe.com/air/application/1.0quot;>
     <id>book.csv</id>
     <filename>Book-CSV</filename>
     <version>1.0.0</version>
     <initialWindow>
         <content>example-csv.html</content>
         <visible>true</visible>
         <width>400</width>
         <height>600</height>
         <x>100</x>
         <y>100</y>
     </initialWindow>
 </application>
Initial content
<!DOCTYPE html PUBLIC quot;-//W3C//DTD XHTML 1.0 Transitional//ENquot;
  quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdquot;>

<html xmlns=quot;http://www.w3.org/1999/xhtmlquot; xml:lang=quot;enquot; lang=quot;enquot;>
<head>
  <meta http-equiv=quot;Content-Typequot; content=quot;text/html; charset=utf-8quot;/>

  <title>csv-example</title>
  <script src=quot;assets/AIRAliases.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script>
  <script src=quot;assets/AIRIntrospector.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script>
  <script src=quot;assets/jquery-1.2.3.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script>
  <script src=quot;assets/json2.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script>

  <script src=quot;assets/dojo/dojo/dojo.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script>
  <script type=quot;text/javascriptquot; charset=quot;utf-8quot;>
    $().ready( function() {
       var csvstring = '';
       csvstring += '1997,Ford,E350,quot;ac, abs, moonquot;,3000.00n';
       csvstring += '1999,Chevy,quot;Venture quot;quot;Extended Editionquot;quot;quot;,,4900.00n';
       csvstring += '1996,Jeep,Grand Cherokee,quot;MUST SELL! air, moon roof, loadedquot;,4799.00n';
       $('#name').text(csvstring);
    });
  </script>
</head>
<body>
  <textarea name=quot;Namequot; rows=quot;8quot; cols=quot;80quot; id=quot;namequot;></textarea>
</body>
</html>
JavaScript in AIR
 Can use (almost) any available JS libs/frameworks
   No cross-domain restrictions
   security restrictions in app sandbox ( eval() )
 Access AIR APIs
 Access standard Flash APIs
 Use compiled AS3 libs
PHP vs JavaScript
JavaScript is fundamentally different
JS is a functional language
  functions are objects
  anon functions
  define functions inside functions
Object model is totally different
  Prototype model – not “classic” Java/PHP5 model
PHP vs JavaScript
Everything in JS is an object
Arrays are not associative – objects serve as
associative array equivalents
No include/require statements available
Event-driven model/asynchronous actions

     Further reading:
      – JavaScript: The Definitive Guide, David Flanagan
      – JavaScript: The Good Parts, Douglas Crockford
JavaScript frameworks

Some stuff is a huge pain without the help of a
framework
Lots of choices
Must play well with AIR
  eval usage
jQuery pwnz yoo

jQuery is teh awesome
lightweight, powerful, terse (esp DOM)
plays well with others
easily extensible
large dev community
decent docs

              but you really can use almost anything…
PHP is your server-side buddy

        PHP
    tubby jedi master




                  AIR
              hyper frontman



 Use 5.2 at least
   adds native JSON encoding/decoding
 Framework choices
Example 1:
PHP duz yer math
Async calls using jQuery AJAX methods
Communicate via JSON



            Flash
                                   Zee Cloud
                                    web server

            Webkit
Example 2:
PHP shops yer pics
Uploading via Flash APIs
JSON based communication



             Flash
                           Zee Cloud
                            web server

             Webkit
Additional resources

 Developing Adobe® AIR™ Applications with HTML and
 Ajax – http://livedocs.adobe.com/air/1/devappshtml/
 Adobe AIR Developer Center for HTML and Ajax Quick
 Starts – http://www.adobe.com/devnet/air/ajax/
 quickstart/
 Spaz source code – http://code.google.com/p/spaz/
Questions?

Más contenido relacionado

La actualidad más candente

HTML5 and the dawn of rich mobile web applications
HTML5 and the dawn of rich mobile web applicationsHTML5 and the dawn of rich mobile web applications
HTML5 and the dawn of rich mobile web applicationsJames Pearce
 
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDee Sadler
 
Flex vs. HTML5 for RIAS
Flex vs. HTML5 for RIASFlex vs. HTML5 for RIAS
Flex vs. HTML5 for RIASPamela Fox
 
"Native" Apps with APEX and PhoneGap
"Native" Apps with APEX and PhoneGap"Native" Apps with APEX and PhoneGap
"Native" Apps with APEX and PhoneGapChristian Rokitta
 
jQuery Conference Boston 2011 CouchApps
jQuery Conference Boston 2011 CouchAppsjQuery Conference Boston 2011 CouchApps
jQuery Conference Boston 2011 CouchAppsBradley Holt
 
Mobile app development using PhoneGap - A comprehensive walkthrough - Touch T...
Mobile app development using PhoneGap - A comprehensive walkthrough - Touch T...Mobile app development using PhoneGap - A comprehensive walkthrough - Touch T...
Mobile app development using PhoneGap - A comprehensive walkthrough - Touch T...RIA RUI Society
 
Cordova and PhoneGap Insights
Cordova and PhoneGap InsightsCordova and PhoneGap Insights
Cordova and PhoneGap InsightsMonaca
 
Joomla REST API - JoomlaDay Bangkok 2014
Joomla REST API - JoomlaDay Bangkok 2014Joomla REST API - JoomlaDay Bangkok 2014
Joomla REST API - JoomlaDay Bangkok 2014Ashwin Date
 
Modern Web Development
Modern Web DevelopmentModern Web Development
Modern Web DevelopmentRobert Nyman
 
Single page application and Framework
Single page application and FrameworkSingle page application and Framework
Single page application and FrameworkChandrasekar G
 
Introduction to web development
Introduction to web developmentIntroduction to web development
Introduction to web developmentMohammed Safwat
 
State of jQuery June 2013 - Portland
State of jQuery June 2013 - PortlandState of jQuery June 2013 - Portland
State of jQuery June 2013 - Portlanddmethvin
 
How To be a Backend developer
How To be a Backend developer    How To be a Backend developer
How To be a Backend developer Ramy Hakam
 
Back to the Basics - 1 - Introduction to Web Development
Back to the Basics - 1 - Introduction to Web DevelopmentBack to the Basics - 1 - Introduction to Web Development
Back to the Basics - 1 - Introduction to Web DevelopmentClint LaForest
 
PhoneGap: Building Mobile Applications with HTML/JS
PhoneGap: Building Mobile Applications with HTML/JSPhoneGap: Building Mobile Applications with HTML/JS
PhoneGap: Building Mobile Applications with HTML/JSRyan Stewart
 
Web Application Development Fundamentals
Web Application Development FundamentalsWeb Application Development Fundamentals
Web Application Development FundamentalsMohammed Makhlouf
 
API Technical Writing
API Technical WritingAPI Technical Writing
API Technical WritingSarah Maddox
 

La actualidad más candente (20)

HTML5 and the dawn of rich mobile web applications
HTML5 and the dawn of rich mobile web applicationsHTML5 and the dawn of rich mobile web applications
HTML5 and the dawn of rich mobile web applications
 
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile design
 
Browser Developer Tools
Browser Developer ToolsBrowser Developer Tools
Browser Developer Tools
 
Flex vs. HTML5 for RIAS
Flex vs. HTML5 for RIASFlex vs. HTML5 for RIAS
Flex vs. HTML5 for RIAS
 
"Native" Apps with APEX and PhoneGap
"Native" Apps with APEX and PhoneGap"Native" Apps with APEX and PhoneGap
"Native" Apps with APEX and PhoneGap
 
jQuery Conference Boston 2011 CouchApps
jQuery Conference Boston 2011 CouchAppsjQuery Conference Boston 2011 CouchApps
jQuery Conference Boston 2011 CouchApps
 
Ionic
IonicIonic
Ionic
 
Mobile app development using PhoneGap - A comprehensive walkthrough - Touch T...
Mobile app development using PhoneGap - A comprehensive walkthrough - Touch T...Mobile app development using PhoneGap - A comprehensive walkthrough - Touch T...
Mobile app development using PhoneGap - A comprehensive walkthrough - Touch T...
 
Cordova and PhoneGap Insights
Cordova and PhoneGap InsightsCordova and PhoneGap Insights
Cordova and PhoneGap Insights
 
Frontend State of the union
Frontend State of the unionFrontend State of the union
Frontend State of the union
 
Joomla REST API - JoomlaDay Bangkok 2014
Joomla REST API - JoomlaDay Bangkok 2014Joomla REST API - JoomlaDay Bangkok 2014
Joomla REST API - JoomlaDay Bangkok 2014
 
Modern Web Development
Modern Web DevelopmentModern Web Development
Modern Web Development
 
Single page application and Framework
Single page application and FrameworkSingle page application and Framework
Single page application and Framework
 
Introduction to web development
Introduction to web developmentIntroduction to web development
Introduction to web development
 
State of jQuery June 2013 - Portland
State of jQuery June 2013 - PortlandState of jQuery June 2013 - Portland
State of jQuery June 2013 - Portland
 
How To be a Backend developer
How To be a Backend developer    How To be a Backend developer
How To be a Backend developer
 
Back to the Basics - 1 - Introduction to Web Development
Back to the Basics - 1 - Introduction to Web DevelopmentBack to the Basics - 1 - Introduction to Web Development
Back to the Basics - 1 - Introduction to Web Development
 
PhoneGap: Building Mobile Applications with HTML/JS
PhoneGap: Building Mobile Applications with HTML/JSPhoneGap: Building Mobile Applications with HTML/JS
PhoneGap: Building Mobile Applications with HTML/JS
 
Web Application Development Fundamentals
Web Application Development FundamentalsWeb Application Development Fundamentals
Web Application Development Fundamentals
 
API Technical Writing
API Technical WritingAPI Technical Writing
API Technical Writing
 

Destacado

Securing the PHP Environment with PHPSecInfo
Securing the PHP Environment with PHPSecInfoSecuring the PHP Environment with PHPSecInfo
Securing the PHP Environment with PHPSecInfofunkatron
 
馬桶修好了!
馬桶修好了!馬桶修好了!
馬桶修好了!Visit1992
 
Billandtedpowerpoint
BillandtedpowerpointBillandtedpowerpoint
Billandtedpowerpointdklm09
 
Joomla gran
Joomla granJoomla gran
Joomla grancarlesr
 
Bunnysharerevised
BunnysharerevisedBunnysharerevised
BunnysharerevisedCarla Lopes
 

Destacado (7)

InglêS
InglêSInglêS
InglêS
 
Securing the PHP Environment with PHPSecInfo
Securing the PHP Environment with PHPSecInfoSecuring the PHP Environment with PHPSecInfo
Securing the PHP Environment with PHPSecInfo
 
Animals
AnimalsAnimals
Animals
 
馬桶修好了!
馬桶修好了!馬桶修好了!
馬桶修好了!
 
Billandtedpowerpoint
BillandtedpowerpointBillandtedpowerpoint
Billandtedpowerpoint
 
Joomla gran
Joomla granJoomla gran
Joomla gran
 
Bunnysharerevised
BunnysharerevisedBunnysharerevised
Bunnysharerevised
 

Similar a Building Desktop RIAs with PHP, HTML & Javascript in AIR

Building Desktop RIAs with PHP, HTML & Javascript in AIR
Building Desktop RIAs with  PHP, HTML & Javascript  in AIRBuilding Desktop RIAs with  PHP, HTML & Javascript  in AIR
Building Desktop RIAs with PHP, HTML & Javascript in AIRfunkatron
 
Building Desktop RIAs With PHP And JavaScript
Building Desktop RIAs With PHP And JavaScriptBuilding Desktop RIAs With PHP And JavaScript
Building Desktop RIAs With PHP And JavaScriptfunkatron
 
Building Desktop RIAs with JavaScript and PHP - ZendCon09
Building Desktop RIAs with JavaScript and PHP - ZendCon09Building Desktop RIAs with JavaScript and PHP - ZendCon09
Building Desktop RIAs with JavaScript and PHP - ZendCon09funkatron
 
JavaScript Presentation Frameworks and Libraries
JavaScript Presentation Frameworks and LibrariesJavaScript Presentation Frameworks and Libraries
JavaScript Presentation Frameworks and LibrariesOleksii Prohonnyi
 
echo-o & Adobe Air App Dev - BarCamp Saigon 1
echo-o & Adobe Air App Dev - BarCamp Saigon 1echo-o & Adobe Air App Dev - BarCamp Saigon 1
echo-o & Adobe Air App Dev - BarCamp Saigon 1huyzing
 
A I R Presentation Dev Camp Feb 08
A I R  Presentation  Dev Camp  Feb 08A I R  Presentation  Dev Camp  Feb 08
A I R Presentation Dev Camp Feb 08Abdul Qabiz
 
Yes, you can do that with AIR 2.0
Yes, you can do that with AIR 2.0Yes, you can do that with AIR 2.0
Yes, you can do that with AIR 2.0Peter Elst
 
Introduction To Adobe Flex And Semantic Resources
Introduction To Adobe Flex And Semantic ResourcesIntroduction To Adobe Flex And Semantic Resources
Introduction To Adobe Flex And Semantic Resourceskeith_sutton100
 
A Microsoft primer for PHP devs
A Microsoft primer for PHP devsA Microsoft primer for PHP devs
A Microsoft primer for PHP devsguest0a62e8
 
Re-use Your Skills and Code to Expand the Reach of Your Apps with Silverlight
Re-use Your Skills and Code to Expand the Reach of Your Apps with SilverlightRe-use Your Skills and Code to Expand the Reach of Your Apps with Silverlight
Re-use Your Skills and Code to Expand the Reach of Your Apps with SilverlightFrank La Vigne
 
Adobe AIR Programming to Desktop and Mobile
Adobe AIR Programming to Desktop and MobileAdobe AIR Programming to Desktop and Mobile
Adobe AIR Programming to Desktop and MobilePasi Manninen
 

Similar a Building Desktop RIAs with PHP, HTML & Javascript in AIR (20)

Building Desktop RIAs with PHP, HTML & Javascript in AIR
Building Desktop RIAs with  PHP, HTML & Javascript  in AIRBuilding Desktop RIAs with  PHP, HTML & Javascript  in AIR
Building Desktop RIAs with PHP, HTML & Javascript in AIR
 
Building Desktop RIAs With PHP And JavaScript
Building Desktop RIAs With PHP And JavaScriptBuilding Desktop RIAs With PHP And JavaScript
Building Desktop RIAs With PHP And JavaScript
 
Building Desktop RIAs with JavaScript and PHP - ZendCon09
Building Desktop RIAs with JavaScript and PHP - ZendCon09Building Desktop RIAs with JavaScript and PHP - ZendCon09
Building Desktop RIAs with JavaScript and PHP - ZendCon09
 
Adobe® Flex™
Adobe® Flex™Adobe® Flex™
Adobe® Flex™
 
What is Adobe Flex ?
What is Adobe Flex  ?What is Adobe Flex  ?
What is Adobe Flex ?
 
orcreatehappyusers
orcreatehappyusersorcreatehappyusers
orcreatehappyusers
 
orcreatehappyusers
orcreatehappyusersorcreatehappyusers
orcreatehappyusers
 
JavaScript Presentation Frameworks and Libraries
JavaScript Presentation Frameworks and LibrariesJavaScript Presentation Frameworks and Libraries
JavaScript Presentation Frameworks and Libraries
 
echo-o & Adobe Air App Dev - BarCamp Saigon 1
echo-o & Adobe Air App Dev - BarCamp Saigon 1echo-o & Adobe Air App Dev - BarCamp Saigon 1
echo-o & Adobe Air App Dev - BarCamp Saigon 1
 
Adobe Air
Adobe AirAdobe Air
Adobe Air
 
A I R Presentation Dev Camp Feb 08
A I R  Presentation  Dev Camp  Feb 08A I R  Presentation  Dev Camp  Feb 08
A I R Presentation Dev Camp Feb 08
 
Yes, you can do that with AIR 2.0
Yes, you can do that with AIR 2.0Yes, you can do that with AIR 2.0
Yes, you can do that with AIR 2.0
 
Adobe Flex
Adobe FlexAdobe Flex
Adobe Flex
 
Introduction To Adobe Flex And Semantic Resources
Introduction To Adobe Flex And Semantic ResourcesIntroduction To Adobe Flex And Semantic Resources
Introduction To Adobe Flex And Semantic Resources
 
DIY Flex
DIY FlexDIY Flex
DIY Flex
 
DIY Flex
DIY FlexDIY Flex
DIY Flex
 
A Microsoft primer for PHP devs
A Microsoft primer for PHP devsA Microsoft primer for PHP devs
A Microsoft primer for PHP devs
 
Re-use Your Skills and Code to Expand the Reach of Your Apps with Silverlight
Re-use Your Skills and Code to Expand the Reach of Your Apps with SilverlightRe-use Your Skills and Code to Expand the Reach of Your Apps with Silverlight
Re-use Your Skills and Code to Expand the Reach of Your Apps with Silverlight
 
Html5
Html5Html5
Html5
 
Adobe AIR Programming to Desktop and Mobile
Adobe AIR Programming to Desktop and MobileAdobe AIR Programming to Desktop and Mobile
Adobe AIR Programming to Desktop and Mobile
 

Más de funkatron

Building mobile apps with JavaScript and PHP
Building mobile apps with JavaScript and PHPBuilding mobile apps with JavaScript and PHP
Building mobile apps with JavaScript and PHPfunkatron
 
JavaScript for PHP Developers
JavaScript for PHP DevelopersJavaScript for PHP Developers
JavaScript for PHP Developersfunkatron
 
Building RIAs with CodeIgniter and JavaScript
Building RIAs with CodeIgniter and JavaScriptBuilding RIAs with CodeIgniter and JavaScript
Building RIAs with CodeIgniter and JavaScriptfunkatron
 
Secure PHP Development with Inspekt
Secure PHP Development with InspektSecure PHP Development with Inspekt
Secure PHP Development with Inspektfunkatron
 
JavaScript for PHP Developers
JavaScript for PHP DevelopersJavaScript for PHP Developers
JavaScript for PHP Developersfunkatron
 
Intro To Mvc Development In Php
Intro To Mvc Development In PhpIntro To Mvc Development In Php
Intro To Mvc Development In Phpfunkatron
 
Securing the PHP Environment with PHPSecInfo - OSCON 2008
Securing the PHP Environment with PHPSecInfo - OSCON 2008Securing the PHP Environment with PHPSecInfo - OSCON 2008
Securing the PHP Environment with PHPSecInfo - OSCON 2008funkatron
 

Más de funkatron (7)

Building mobile apps with JavaScript and PHP
Building mobile apps with JavaScript and PHPBuilding mobile apps with JavaScript and PHP
Building mobile apps with JavaScript and PHP
 
JavaScript for PHP Developers
JavaScript for PHP DevelopersJavaScript for PHP Developers
JavaScript for PHP Developers
 
Building RIAs with CodeIgniter and JavaScript
Building RIAs with CodeIgniter and JavaScriptBuilding RIAs with CodeIgniter and JavaScript
Building RIAs with CodeIgniter and JavaScript
 
Secure PHP Development with Inspekt
Secure PHP Development with InspektSecure PHP Development with Inspekt
Secure PHP Development with Inspekt
 
JavaScript for PHP Developers
JavaScript for PHP DevelopersJavaScript for PHP Developers
JavaScript for PHP Developers
 
Intro To Mvc Development In Php
Intro To Mvc Development In PhpIntro To Mvc Development In Php
Intro To Mvc Development In Php
 
Securing the PHP Environment with PHPSecInfo - OSCON 2008
Securing the PHP Environment with PHPSecInfo - OSCON 2008Securing the PHP Environment with PHPSecInfo - OSCON 2008
Securing the PHP Environment with PHPSecInfo - OSCON 2008
 

Último

Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Angeliki Cooney
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAndrey Devyatkin
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MIND CTI
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Jeffrey Haguewood
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...Zilliz
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Victor Rentea
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...apidays
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxRustici Software
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamUiPathCommunity
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024The Digital Insurer
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistandanishmna97
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingEdi Saputra
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdfSandro Moreira
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyKhushali Kathiriya
 
Spring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUKSpring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUKJago de Vreede
 

Último (20)

Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
Spring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUKSpring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUK
 

Building Desktop RIAs with PHP, HTML & Javascript in AIR

  • 1. Building Desktop RIAs with PHP, HTML & Javascript in AIR Ed Finkler, php|tek 2008, May 22 2008 funkatron.com / funkatron@gmail.com
  • 2. What is AIR? For the desktop Not a browser plugin Build desktop apps with web technologies
  • 3. AIR architecture A flash player + special AIR-specific APIs HTMLLoader control Uses WebKit – like Safari 3 Flash Zee Cloud OS web server Win/Mac/Linux Webkit (HTMLLoader)
  • 4. Building apps Flex (XML + Actionscript → SWF) Flash (the authoring tool → SWF) HTML (HTML + JS + CSS) open standards! just like regular web pages
  • 5. The bare essentials Application descriptor (.xml) Initial content (.swf or .html) If .html detected, auto-creates Flash wrapper with HTMLLoader control
  • 6. App descriptor <?xml version=quot;1.0quot; encoding=quot;UTF-8quot;?> <application xmlns=quot;http://ns.adobe.com/air/application/1.0quot;> <id>book.csv</id> <filename>Book-CSV</filename> <version>1.0.0</version> <initialWindow> <content>example-csv.html</content> <visible>true</visible> <width>400</width> <height>600</height> <x>100</x> <y>100</y> </initialWindow> </application>
  • 7. Initial content <!DOCTYPE html PUBLIC quot;-//W3C//DTD XHTML 1.0 Transitional//ENquot; quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdquot;> <html xmlns=quot;http://www.w3.org/1999/xhtmlquot; xml:lang=quot;enquot; lang=quot;enquot;> <head> <meta http-equiv=quot;Content-Typequot; content=quot;text/html; charset=utf-8quot;/> <title>csv-example</title> <script src=quot;assets/AIRAliases.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script> <script src=quot;assets/AIRIntrospector.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script> <script src=quot;assets/jquery-1.2.3.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script> <script src=quot;assets/json2.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script> <script src=quot;assets/dojo/dojo/dojo.jsquot; type=quot;text/javascriptquot; charset=quot;utf-8quot;></script> <script type=quot;text/javascriptquot; charset=quot;utf-8quot;> $().ready( function() { var csvstring = ''; csvstring += '1997,Ford,E350,quot;ac, abs, moonquot;,3000.00n'; csvstring += '1999,Chevy,quot;Venture quot;quot;Extended Editionquot;quot;quot;,,4900.00n'; csvstring += '1996,Jeep,Grand Cherokee,quot;MUST SELL! air, moon roof, loadedquot;,4799.00n'; $('#name').text(csvstring); }); </script> </head> <body> <textarea name=quot;Namequot; rows=quot;8quot; cols=quot;80quot; id=quot;namequot;></textarea> </body> </html>
  • 8. JavaScript in AIR Can use (almost) any available JS libs/frameworks No cross-domain restrictions security restrictions in app sandbox ( eval() ) Access AIR APIs Access standard Flash APIs Use compiled AS3 libs
  • 9. PHP vs JavaScript JavaScript is fundamentally different JS is a functional language functions are objects anon functions define functions inside functions Object model is totally different Prototype model – not “classic” Java/PHP5 model
  • 10. PHP vs JavaScript Everything in JS is an object Arrays are not associative – objects serve as associative array equivalents No include/require statements available Event-driven model/asynchronous actions Further reading: – JavaScript: The Definitive Guide, David Flanagan – JavaScript: The Good Parts, Douglas Crockford
  • 11. JavaScript frameworks Some stuff is a huge pain without the help of a framework Lots of choices Must play well with AIR eval usage
  • 12. jQuery pwnz yoo jQuery is teh awesome lightweight, powerful, terse (esp DOM) plays well with others easily extensible large dev community decent docs but you really can use almost anything…
  • 13. PHP is your server-side buddy PHP tubby jedi master AIR hyper frontman Use 5.2 at least adds native JSON encoding/decoding Framework choices
  • 14. Example 1: PHP duz yer math Async calls using jQuery AJAX methods Communicate via JSON Flash Zee Cloud web server Webkit
  • 15. Example 2: PHP shops yer pics Uploading via Flash APIs JSON based communication Flash Zee Cloud web server Webkit
  • 16. Additional resources Developing Adobe® AIR™ Applications with HTML and Ajax – http://livedocs.adobe.com/air/1/devappshtml/ Adobe AIR Developer Center for HTML and Ajax Quick Starts – http://www.adobe.com/devnet/air/ajax/ quickstart/ Spaz source code – http://code.google.com/p/spaz/