Using the install badge

Adobe provides the Adobe AIR install badge with the Adobe AIR SDK. The badge can be found in the samples/badge folder. The badge has two main functions:

• It verifies whether the user has the required version of Adobe AIR installed. If not, the badge will install the correct version.
• It installs your application on the user's computer.

Changes in the install badge

In the Adobe AIR SDK, some changes have been made to the install badge. The AIR SDK includes the browser API (air.swf) that allows for more secure detection and installation of the Adobe AIR and AIR applications. Previously, the logic for Adobe AIR detection was handled in the actual install badge.swf file. In AIR 1.0, the badge.swf file loads the browser API (a SWF file) from adobe.com that handles the actual core detection and operating system–specific logic. This helps Adobe to respond to any security or operating system changes quickly. It also enables Adobe to update automatically all of the badges that leverage remote loading of the core detection logic. (For more details, refer to the Adobe AIR Developer FAQ.) You can also download the browser API (air.swf) and include it in your custom badge if you like.

Using the example

The Adobe AIR SDK contains a sample implementation of the Adobe AIR install badge. This sample integrates the Flash Player Detection Kit. The first script block in the file defines the version of Flash Player that is required to run the install badge. At the time of writing, the required version is 9.0.115:

// Globals
// Major version of Flash required
var requiredMajorVersion = 9;
// Minor version of Flash required
var requiredMinorVersion = 0;
// Minor version of Flash required
var requiredRevision = 115;  

If this version of Flash Player is not installed, it will display alternate content which allows the user to manually install Adobe AIR and your application. Also, the tag <noscript> is used to define alternate content that will be displayed if the user's browser does not support JavaScript (or if the user has disabled it).

For this implementation to work properly, you need to update three sections of the code with information about your Adobe AIR application.

1. First, you will need to update the flashvars that are sent to the install badge. The following variables are defined in this section of code.

   • appname: The name of your Adobe AIR application (this variable must be URL encoded).
   • appurl: The URL of your Adobe AIR application's .air file. For testing locally, you can substitute the simple file name. However, the installation will fail if the user also needs to install Adobe AIR. For the AIR installation to function properly, it requires the full URL of your Adobe AIR application file.
   • airversion: The version number of Adobe AIR that is required to run your application. (The current version of Adobe AIR is 1.0.M6.)
   • imageurl (optional): The URL of the image that will be placed inside of the Adobe AIR install badge. (If it resides under a different domain than the install badge, a cross-domain policy file must be used.)
   • buttoncolor (optional): The hex color value of the button color, 000000 by default.
   • messagecolor (optional): The hex color value of the text below the button, 000000 by default.

   The corresponding code can be found on line 55 of the default_badge.html file in the Adobe AIR SDK:

   'flashvars','appname=Sample%20Application&appurl=http://www.davidtucker.net/airtips/sampleApplication-1.air'

2. Next, you need to update the alternate content that will be displayed when the user does not have the required version of the Flash Player or if the version cannot be detected:

   var alternateContent = '<table id="messageTable"><tr><td>'
   + 'This application requires the following be installed:<ol>'
   + '<li><a href="http://adobe.com/go/getair/">Adobe&#174; AIR&#8482; Runtime</a></li>'
   + '<li><a href="http://www.davidtucker.net/airtips/sampleApplication-1.air">Sample Application</a></li>'
   + '</ol>Please click on each link in the order above to complete the installation process.</td></tr></table>';

3. Finally, you will need to update the <noscript> block that is used when the browser does not support JavaScript (or has it disabled):

   <noscript>
   …
   <li><a href="http://www.davidtucker.net/airtips/sampleApplication-1.air">Sample Application</a></li>
   …
   </noscript>

Testing the example

If you have the latest version of Flash Player and the correct version of Adobe AIR, you should see the install badge (shown in Figure 1).

Figure 1. The Adobe AIR install badge

If you have the latest version of Flash Player, but you do not have the correct version of the AIR runtime, you should see the sequence of screens illustrated in Figure 2. The first screen demonstrates that the install badge has detected that the user does not have the required version of AIR installed.

Figure 2. Adobe AIR detection with the install badge

If users choose to install Adobe AIR, they will be directed to install both the AIR runtime as well as your application (see Figure 3).

Figure 3. Installing Adobe AIR with the install badge

If you do not have the latest version of the Flash Player installed (or if JavaScript is disabled in your browser), you should see the content shown in Figure 4. This will allow the user to install the needed items manually.

Figure 4. Alternate content when the latest version of Flash Player is not installed

Some browsers will present a warning when you try to run the sample files from your local machine. If you allow your browser to run the active content locally, the sample should display correctly.

Setting the proper mime type

If the user has to install your AIR application manually, you will need to verify that your server is properly configured to serve .air files. This configuration is made at the web server configuration level, so if you in a shared hosting environment, you may need to contact their system administrator and have it added manually.

The mime type declaration tells the server how to deliver files with a certain extension. If you are using Apache, this change will be included in the httpd.conf file. You will need to add the following line of code below the other AddType declarations:

AddType application/vnd.adobe.air-application-installer-package+zip .air

This will tell Apache to handle all files with a .air extension as an Adobe AIR installer package. This could easily be modified to work with other web servers as long as .air is mapped to the mime type application/vnd.adobe.air-application-installer-package+zip.

Page 2 of 3

Previous Page

Next Page