This chapter provides solutions to common tasks when developing Adobe AIR applications. The solutions in this chapter illustrate many concepts used in AIR application development, and provide working HTML and JavaScript code that you can leverage within your application.
You have finished your application, have signed and packaged it, and want to distribute it via a web page.
Adobe AIR applications can be easily distributed from a web page using the badge installer included with the SDK.
Adobe AIR application files are largely self-contained entities, and are ready for distribution once they are signed and packaged. The resultant file will have an .air extension. That application file can be distributed via email, CD-ROM, or other traditional forms; however, installing an .air file requires that Adobe AIR is already present on the target machine. Alternatively, a web-page-based "badge installer" can streamline installation by detecting the runtime and installing it if necessary before installing your application.
Though you can customize it in a number of different ways, a sample badge installer is included with the Adobe AIR SDK. The badge takes the form of a small 217x180 area, which is ideal for a blog sidebar or other constrained spaces. The default badge installer runs as a Flash 9.0.115 (Flash Update 3) component in the browser. The Flash source file (FLA) is also included with the SDK for additional customization.
NOTE
You can find the files for the sample badge installer in the samples/badge directory of the SDK.
Deploying with the badge installer requires four files: badge.swf, default_badge.html, AC_RunActiveContent.js, and your AIR application.
Even though the badge installer does appear as Flash content on a web page, you do not need to have any Flash knowledge or software such as Adobe Flash CS3. The badge installer was prebuilt with a number of configurable options that you can set from within the containing HTML page. On line 59 of the default_badge.html file, you will see the flashvars parameter, which is assigned the various initialization properties that are specific to your application. This parameter takes the form of a query string, and has the options outlined in Table 4-1.
Here is an HTML page that displays the badge installer to install an AIR application, as well as the AIR runtime if necessary:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
lang="en">
<head>
<title>Adobe AIR Application Installer Page</title>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8" />
<style type="text/css">
<!--
#AIRDownloadMessageTable {
width: 217px;
height: 180px;
border: 1px solid #999;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
}
#AIRDownloadMessageRuntime {
font-size: 12px;
color: #333;
}
-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
var requiredMajorVersion = 9;
var requiredMinorVersion = 0;
var requiredRevision = 115;
</sc
</head>
<body bgcolor="#ffffff">
<script src="ac_runactivecontent.js" type="text/javascript">
</script>
<script language="JavaScript" type="text/javascript">
<!--
// Version check based upon the values entered above in
"Globals" var hasRequestedVersion = DetectFlashVer(
requiredMajorVersion, requiredMinorVersion,
requiredRevision );
// Check to see if the version meets the requirements
// for playback
if( hasReqestedVersion )
{
AC_FL_RunContent(
'codebase','http://fpdownload.macromedia.com/pub/
shockwave/cabs/flash/swflash.cab',
'width','217',
'height','180',
'id','badge',
'align','middle',
'src','badge',
'quality','high',
'bgcolor','#FFFFFF',
'name','badge',
'allowscriptaccess','all',
'pluginspage','http://www.macromedia.com/
go/getflashplayer',
'flashvars','appname=My%20Application&appurl=
myapp.air&airversion=
1.0&imageurl=test.jpg',
'movie','badge' ); //end AC code
} else {
document.write('<table id="AIRDownloadMessageTable"><tr>
<td>Download <a href="myapp.air">my Application</a>
now.<br /><br /><span id="AIRDownloadMessageRuntime">
This
application requires the <a href="');
var platform = 'unknown';
if( typeof( window.navigator.platform ) != undefined )
{
platform = window.navigator.platform.toLowerCase();
if( platform.indexOf( 'win' ) != -1 )
{
platform = 'win';
} else if( platform.indexOf( 'mac' ) != -1 ) {
platform = 'mac';
}
}
if( platform == 'win' )
{
document.write( 'http://airdownload.adobe.com/air/win/
download/1.0/
AdobeAIRInstaller.exe' );
} else if( platform == 'mac' ) {
document.write( 'http://airdownload.adobe.com/air/
mac/download/1.0/
AdobeAIR.dmg' );
} else {
document.write( 'http://www.adobe.com/go/getair/' );
}
document.write( '">Adobe® AIR™ runtime</a>.
</span></td></tr></table>' );
}
// -->
</script>
<noscript>
<table id="AIRDownloadMessageTable">
<tr>
<td>
Download <a href="myapp.air">my Application</a> now.<br />
<br /><span id="AIRDownloadMessageRuntime">This application
requires Adobe® AIR™ to be installed for
<a href="http://airdownload.adobe.com/air/mac/download/
1.0/AdobeAIR.dmg">Mac OS</a> or <a href="http://
airdownload.adobe.com/air/win/download/1.0/
AdobeAIRInstaller.exe">Windows</a>.</span>
</td>
</tr>
</table>
</noscript>
</body>
</html>