Previous Page
Next Page

Recipe 22.2. Calling ActionScript Functions

Problem

You want to call an ActionScript function from JavaScript.

Solution

Use ExternalInterface.addCallback( ) to register the ActionScript function, and then call the function from the JavaScript reference to the Flash Player object.

Discussion

The ExternalInterface API allows you to register ActionScript functions, which makes them accessible to JavaScript. Use the static addCallback( ) method to register the ActionScript functions. The addCallback( ) method requires two parameters: the name by which you want to be able to reference the function from JavaScript and a reference to the function. The following example registers a function called displayMessage using an identifier (the name by which the function can be called from JavaScript) of showMessage:

ExternalInterface.addCallback("showMessage", displayMessage);

From JavaScript, you need to get a reference to the Flash Player object. There are two basic Flash Player versions that run in the browser: ActiveX and the plug-in version. The ActiveX version runs natively in Internet Explorer, while the plug-in version is used by the rest of the browsers.

The ActiveX player is controlled by the <object> tag in an HTML page, and you can retrieve a JavaScript reference using window. objectId where objectId is the value of the id attribute of the <object> tag. For example, if the <object> tag's id attribute is example, then the reference to the ActiveX player would be window.example.

The plug-in player is controlled by the <embed> tag in an HTML page, and you can retrieve a JavaScript reference by using window.document. embedName, where embedName is the value of the name attribute of the <embed> tag. For example, if the <embed> tag's name attribute is example, then the reference to the plug-in player would be window.document.example.

In most cases, you probably won't know which Flash Player version the user will have. You can use navigator.appName in JavaScript to determine which browser the user has:

  • If navigator.appName contains the string Microsoft, then the user is running Internet Explorer, which means they have the ActiveX player.

  • If navigator.appName doesn't contain the string Microsoft, then the user is using the plug-in version of the player.

Use the following JavaScript to detect which version of the player the user has and retrieve the correct reference:

<script language="JavaScript">
var flashPlayer;
function detectFlashPlayer(  ) {
    if(navigator.appName.indexOf("Microsoft") != -1) {
        flashPlayer = window.objectId;
    }
    else {
        flashPlayer = window.document.embedName;
    }
}
</script>

Next, use the onLoad attribute in the <body> tag to call detectFlashPlayer( ) when the page loads, for example:

<body onLoad="detectFlashPlayer">

The flashPlayer variable contains the correct reference to the Flash Player the user has on his system.

You can call any registered ActionScript function directly from the Flash Player reference. For example, if a function has been registered with the identifier showMessage, the following calls that function from JavaScript (assuming flashPlayer is a variable referencing the Flash Player):

flashPlayer.showMessage(  );

You can pass parameters to the functions, as well. If the ActionScript function with the ExternalInterface identifier of showMessage accepts a string parameter, then you can call it from JavaScript as follows:

flashPlayer.showMessage("example message");

See Also

Recipe 22.1


Previous Page
Next Page
Converted from CHM to HTML with chm2web Pro 2.85 (unicode)