Implementing Flash Player Express Install

The following tutorial describes how to implement the Flash Player Express Install mechanism.

Note: Because users who have not installed the Flash 8 plug-in cannot see Flash 8 content, another SWF is used in place of your actual Flash content to handle the upgrade process. This SWF is named playerProductInstall.swf and is published for Flash plug-in version 6r65. Following these steps, you’ll see how to modify the source file for this SWF and provide alternate content if the upgrade fails or is cancelled.

This tutorial assumes that you have already added the Flash 8 detection scripts to a web page (as explained in the synopsis of the implementation process) and have already downloaded the Flash Player Detection Kit:

1. Extract the Flash Player Detection Kit files from the ZIP file you downloaded and locate the “Express Installation” directory.
2. Copy the following files from “Express Installation” into a new folder on your hard drive: playerProductInstall.fla, playerProductInstall.html, playerProductInstall.as, and playerProductInstallCallback.as.

3. Open playerProductInstall.fla in the Flash authoring tool. This file creates the SWF that users see if they do not have Flash Player 8 but do have Flash Player 6r65 or higher. Change the dimensions and background color to something that works with your web page. Generally, it’s best to use the same dimensions as your own Flash content so that page rendering isn’t affected as a result of displaying playerProductInstall.swf.

   Note: The dimensions of playerProductInstall.swf must be at least 215 x 138 pixels, which is the minimum space required to display the Express Install prompt properly. Use the AutoUpdater symbol instance on the Stage as a guide.

4. In playerProductInstall.fla, delete the instructions text from the Stage. If you like, change the color of the AutoUpdater symbol—for example, to blend in with the background color.

5. Open playerProductInstallCallback.as. This file determines what the users see if the upgrade fails or is cancelled. The code in this ActionScript file looks like this:

   

   function installStatus(statusValue) {
         if (statusValue == "Download.Complete") {
              // Installation is complete. In most cases the browser 
             //   window that this SWF 
              // is hosted in will be closed by the installer or manually 
             //   by the end user.
         }     else if (statusValue == "Download.Cancelled") { 
                // The end user chose "NO" when prompted to install the new player
                 // by default no User Interface is presented 
                // in this case. It is left up to
                 // the developer to provide an alternate experience in this case.
         }     else if (statusValue == "Download.Failed") {
                 // The end user failed to download the installer 
                // due to a network failure
                 // by default no User Interface is presented in this case. 
                //It is left up to
                  // the developer to provide an alternate experience in this case.
         }
     }
    

6. Replace the comments within each part of the if/else statement with your ActionScript that determines what happens in each event. For example, if statusvalue (the variable that is tested in each part of the statement) is equal to Download.Cancelled, you might use a getURL() call to send the user to a different page on your site.

   Save your work when you’re done.

7. Republish playerProductInstall.fla to create your newer version of playerProductInstall.swf. Save playerProductInstall.fla, close both files, and then move playerProductInstall.swf into the same directory as your web page.

8. Open playerProductInstall.html in a text editor (such as Macromedia Dreamweaver 8) and locate the JavaScript within the BODY element of the page.

   This script is similar to the one you added to your own web page earlier, but it also checks to see whether the user’s machine has Flash Player version 6r65 or higher installed. If so, it displays playerProductInstall.swf in place of your Flash content.

   Copy the entire script (excluding the NOSCRIPT element, which does not need to change). In a moment, you’ll paste this script into your own page.

9. Open your own web page in a text editor (for the sake of the tutorial, we’ll call it index.html). Highlight the script in the BODY element of index.html and paste the script you copied from playerProductInstall.html in its place.

   This script runs if the correct Flash plug-in version is found, so replace the highlighted values with the dimensions and name of the Flash movie you’d like to display.

10. Open index.html in a web browser and test it out. You’ll need to uninstall Flash Player and install an older version to test it accurately.

If you followed the preceding steps, index.html should now show you the Express Install upgrade prompt when you come to the page using an older version of Flash Player.

Where to Go from Here

To learn how to leverage Flash Player Express Install, refer to the Flash Player Detection Kit. It also describes the other detection strategies mentioned in this article in more detail, including server-side and script-less approaches. You can see first-hand how the Flash 8 detection script works by creating a new Flash document in Flash 8, opening the Publish Settings, selecting the HTML tab, and selecting the Detect Flash Version check box. Click the Publish button and open the resulting HTML file in your favorite editor (such as Dreamweaver 8).