FRESH AIR: Developing AIR
          applications with Aptana Studio
                                   Mark Drew
         ...
What’s this about then?
                      •   Getting a “breath” of AIR (Adobe’s Integrated
                          ...
What’s this not about?

                      •   Using FlexBuilder or CFEclipse

                      •   Writing ColdFu...
Who is Mark Drew?
              •       CFEclipse’s Lead Developer

              •       Product Manager at Design UK
   ...
Top Secret

                      • Don’t tell anyone but....
                      • This is only my second AIR
         ...
What is AIR?
                      •   Bringing Rich Internet Applications
                          (RIAs) to the desktop...
Flex, Flash or HTML?




Friday, 6 June 2008                          7
Use what you know

                      • As a web developer you can leverage your
                        current knowle...
Enter: Aptana Studio
                      • HTML, JavaScript, SQL, CSS,
                        XML, etc IDE
            ...
Before we go, JQuery!
                      •   JavaScript framework with a difference

                      •   Its a fa...
JQuery Demo




                      Paperclip and chewing gum not required
Friday, 6 June 2008                          ...
Back on topic with AIR

                      • Will be building an
                        application from
             ...
What are we going to
                             build?
                             • YafTc
                            ...
Installation
          •       Install Aptana Studio
                  (http://www.aptana.com/studio)

          •       I...
Building our Application

              • Create a new AIR Application
              • Choose the window options
         ...
Getting the UI ready
       • Copy over all the images/
               styles
       • Changing the Chrome in
            ...
Adding Window
                                   Controls
       • Move:              nativeWindow.startMove();


       •...
Checking Network
                              Status
                      • Add servicemonitor.swf
                     ...
Get external data

                      • JavaScript is sandboxed in browsers
                      • AIR has a different...
Send External Data

                      • Send messages to twitter, update them of
                        our status!
 ...
Saving to the file
                                system
                      • Messages need to be stored when you are
 ...
And its that easy!




Friday, 6 June 2008                        22
Finally...

                      • You know how to get the tools to develop
                        AIR Applications
    ...
Q&A

                      • mark.drew@gmail.com
                      • Mark Drew http://www.markdrew.co.uk
             ...
Upcoming SlideShare
Loading in...5
×

FreshAir2008

409

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
409
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

FreshAir2008

  1. 1. FRESH AIR: Developing AIR applications with Aptana Studio Mark Drew 4th-6th June 2008 Edinburgh, Scotland Friday, 6 June 2008 1
  2. 2. What’s this about then? • Getting a “breath” of AIR (Adobe’s Integrated Runtime) • Getting Aptana Studio up and running for AIR development • Writing a real application using technologies ColdFusion developers already know: JavaScript (JQuery) and HTML • Mainly a coding demo (so you might want to move closer rather than going blind) Friday, 6 June 2008 2
  3. 3. What’s this not about? • Using FlexBuilder or CFEclipse • Writing ColdFusion • Open Sourcing a CFML Engine • A JQuery tutorial (although I shall show you some of what it can do) • A slide rich environment. (sorry if you like looking at pretty slides) Friday, 6 June 2008 3
  4. 4. Who is Mark Drew? • CFEclipse’s Lead Developer • Product Manager at Design UK http://www.designuk.com • LavaSuite Content Management System • UK ColdFusion User Group’s Co-Manager • A ColdFusion Developer since ‘97 and Web developer since ‘94 • An occasional presenter on topics such as CFEclipse, ColdFusion, Ajax, ColdSpring and ModelGlue • A guy with very little ‘air Friday, 6 June 2008 4
  5. 5. Top Secret • Don’t tell anyone but.... • This is only my second AIR application. • So don’t laugh. • Be kind. Friday, 6 June 2008 5
  6. 6. What is AIR? • Bringing Rich Internet Applications (RIAs) to the desktop • Flex/Flash and HTML/JavaScript on the Desktop • Mac/PC and soon Linux • Provides access to the filesystem, SQL light database, network functions, custom chrome, drag and drop and more... • How can we build these applications? Friday, 6 June 2008 6
  7. 7. Flex, Flash or HTML? Friday, 6 June 2008 7
  8. 8. Use what you know • As a web developer you can leverage your current knowledge • HTML, JavaScript, JavaScript libraries • Use your weapons of choice Friday, 6 June 2008 8
  9. 9. Enter: Aptana Studio • HTML, JavaScript, SQL, CSS, XML, etc IDE • AutoMagically handles *most* JavaScript libraries • Develop iPhone, PHP and RoR Applications • ... and of course, HTML AIR applications Friday, 6 June 2008 9
  10. 10. Before we go, JQuery! • JavaScript framework with a difference • Its a fast, concise way to access the DOM and perform manipulations, transformations, animations and Ajax • Uses the CSS selector syntax to get objects • E.g. $(“.someclass #withID”).text(); $("p.surprise").addClass("ohmy").show("slow"); Friday, 6 June 2008 10
  11. 11. JQuery Demo Paperclip and chewing gum not required Friday, 6 June 2008 11
  12. 12. Back on topic with AIR • Will be building an application from scratch... • Well no, there will be one I prepared earlier Friday, 6 June 2008 12
  13. 13. What are we going to build? • YafTc • (Yet another funky Twitter client) • Uses Twitter’s JSON API to get and send messages • Uses features of AIR as a client • Stores and Sends offline messages Friday, 6 June 2008 13
  14. 14. Installation • Install Aptana Studio (http://www.aptana.com/studio) • Install AIR and AIR SDK (http://www.adobe.com/ products/air/) • Install Aptana’s AIR Plugin using the IDE’s Homepage Friday, 6 June 2008 14
  15. 15. Building our Application • Create a new AIR Application • Choose the window options • Add application icons • Choose the JavaScript library Friday, 6 June 2008 15
  16. 16. Getting the UI ready • Copy over all the images/ styles • Changing the Chrome in Application.xml • Custom • Sizes • Changing the Transparency Friday, 6 June 2008 16
  17. 17. Adding Window Controls • Move: nativeWindow.startMove(); • Minimize: window.nativeWindow.minimize(); • Close:var closing = new air.Event(air.Event.CLOSING, true, true); window.nativeWindow.dispatchEvent(closing); if(!closing.isDefaultPrevented()){ nativeWindow.close(); } • Resize: window.nativeWindow.startResize(air.NativeWindowResize.BOTTOM_RIGHT); Friday, 6 June 2008 17
  18. 18. Checking Network Status • Add servicemonitor.swf • setup our request • add a monitor • add a listener to air.Event.NETWORK_CHANGE • Respond to changes Friday, 6 June 2008 18
  19. 19. Get external data • JavaScript is sandboxed in browsers • AIR has a different set of sandbox rules. • Main change is that we can access external websites via AJAX • Lets do that! Friday, 6 June 2008 19
  20. 20. Send External Data • Send messages to twitter, update them of our status! • Posting AJAX(AJAJ really) to a remote server Friday, 6 June 2008 20
  21. 21. Saving to the file system • Messages need to be stored when you are not online • When you go back online, we need to send the messages • Lets add some File IO Functionality Friday, 6 June 2008 21
  22. 22. And its that easy! Friday, 6 June 2008 22
  23. 23. Finally... • You know how to get the tools to develop AIR Applications • You can leverage your existing knowledge to build desktop apps • You saw how to create a fairly complex AIR application Friday, 6 June 2008 23
  24. 24. Q&A • mark.drew@gmail.com • Mark Drew http://www.markdrew.co.uk • Aptana http://www.aptana.com • Adobe AIR http://www.adobe.com/air/ Friday, 6 June 2008 24
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×