start blog post

Seamless Application Updates with Adobe AIR 1.5

Providing updates to people who use your AIR apps can be a bit of a hassle. The actual Updater code only takes one or two lines, but you essentially have to write your own framework around it to consider it full-featured (check, compare, download, install). Some have supplied examples in ActionScript and JavaScript, but Adobe made it even easier in AIR 1.5. Here's the way I use the new ApplicationUpdaterUI framework in JavaScript.

    <script type="text/javascript" src="lib/air/AIRAliases.js"></script>
    <script type="application/x-shockwave-flash" src="lib/air/applicationupdater_ui.swf"></script>
    
    <!-- This is the file described below. -->
    <script type="text/javascript" src="_UpdaterUI.js"></script>

    <!-- Include the rest of your application however you normally would. -->
    <script type="text/javascript" src="your-application-files.js"></script>

If you're using the Aptana or Dreamweaver extensions for Adobe AIR, your IDE should be generate applicationupdater_ui.swf as part of a new Adobe AIR project. You may have to check an option to create it.

// _UpdaterUI.js
_UpdaterUI = function() {
    var _ = {
        /**
         * Don't change these directly!
         * Instead, use _UpdaterUI.init("http://your.web.site/path/to/version.xml");
         */
        url     : false, // address of version.xml
        updater : false  // ApplicationUpdaterUI object
    };
    function onUpdate(e) {
        if (_.updater) {
            _.updater.checkNow();
        }
    }
    function onError(e) {
        air.trace(e); // replace this to log or handle as necessary for your app
    }
    return {
        init : function(url) {
            _.url = (typeof url == "string") ? url : false;
            _.updater = (_.url) ? function() {
                try {
                    var u = new runtime.air.update.ApplicationUpdaterUI();
                    u.updateURL = _.url;
                    u.isCheckForUpdateVisible = false; // if true: Ask user before checking
                    u.isFileUpdateVisible = false;     // if true: Ask user where to save .air file
                    u.isInstallUpdateVisible = true;   // if true: Ask user whether to update now or on restart
                    u.addEventListener(runtime.air.update.events.UpdateEvent.INITIALIZED, onUpdate);
                    u.addEventListener(runtime.flash.events.ErrorEvent.ERROR, onError);
                    u.initialize();
                } catch (e) {
                    air.trace(e);
                }
                return u;
            }() : false;
        }
    };
}();

I basically encapsulated and "unobtrusified" (no, that's not really a word) the example from Adobe's AIR Developer Center, so that I could reuse it across multiple projects with minimal effort. You simply include the above file from your initial HTML document, then call _UpdaterUI.init("http://your.web.site/path/to/version.xml").

Your version.xml file should have the same overall format as the Adobe example, reproduced below:

<?xml version="1.0" encoding="utf-8"?>
    <update xmlns="http://ns.adobe.com/air/framework/update/description/1.0">
        <version>1.23</version>
        <url>http://your.web.site/path/to/YourApplication.air</url>
        <description><![CDATA[
            This version has fixes for the
            following known issues:
            *First issue
            *Second issue 
        ]]></description>
    </update> 

Enjoy!

var tags = [, ];

  • share this post:
  • email a friend
  • float this post
  • digg this post
  • share on stumbleupon
  • submit to technorati
  • tweet this post

end blog post

most viewed this week

least viewed this week