Flash and JavaScript cross communication p.2

source: http://www.thegoldenmean.com/

The Flash Asset

Because the Flash movie itself has no "real" presence on the page, you can make it very small. I made mine 10 x 10 pixels, and selected a background color that matches the color of the page it will be placed on.

The movie will consist entirely of ActionScript code, and mercifully not much of it. The code in its entirety is presented below. We'll dissect it in a bit.

	import flash.external.ExternalInterface;

	ExternalInterface.addCallback ("playerPlay", null, playerPlay);
	ExternalInterface.addCallback ("playerStop", null, playerStop);

	var myTunes:Sound;

	function playerPlay (track_src:String):Void
	{
	  //if a song is currently playing when this functions is invoked,
	  //stop it and delete it
	  if (myTunes instanceof Sound)
	  {
	    myTunes.stop ();
	    delete myTunes;
	  }
	  //create brand new sound object each time 
	  myTunes = new Sound ();
	  //load MP3 item
	  myTunes.loadSound (track_src, true);
	  myTunes.setVolume (50);
	}

	function playerStop ():Void
	{
	  if (myTunes instanceof Sound)
	  {
	    myTunes.stop ();
	    delete myTunes;
	  }
	}

Summary

Briefly, the Flash movie has to do exactly two things: play a specified MP3 file, and stop the playing of that file. This in response to a prompt that comes from JavaScript in the HTML document.

External Interface

We begin by importing the ExternalInterface package into our project, and then define two callbacks. If you aren’t familiar with that concept, here’s what Flash’s Help file says:

Registers an ActionScript method as callable from the container. After a successful invocation of addCallBack(), the registered function in Flash Player can be called by JavaScript or ActiveX code in the container.

The “container” in our case is the HTML document in which the Flash movie is embedded.

Two functions are written in ActionScript: “playerPlay()” and “playerStop();”. These correspond to similarly named JavaScript functions as we will see on the next page.

The signature for the addCallback method is:

addCallback(methodName:String, instance:Object, method:Function)

An explanation of those arguments follows (quotes are from Flash 8’s Help files):

methodName: “The name by which the ActionScript function can be called from JavaScript. This name does not need to match the actual name of the ActionScript method.” In other words, “methodName” is the string by which JavaScript knows the Flash function.
instance: In our case, “instance” is the current movie itself. Using either “null” or “this” would both work.
method: The actual ActionScript function.

So we have allowed two functions to be accessible to JavaScript, and JavaScript will know them by the strings “playerPlay” and “playerStop”.

Functions

playerPlay

This function accepts one argument or parameter: a string which indicates the location of the MP3 file to play. It first checks to see if an instance of myTunes exists (meaning something is already playing), and if there is it first stops the currently playing sound and then deletes the instance of the myTunes Sound Object.

After that bit of housekeeping a new instance of the myTunes Sound Object is instantiated and it is asked to load the specified MP3 asset in streaming mode.

Note that setting the volume is optional. You can omit that directive and the music will play at whatever volume the user’s computer volume is set to.

playerStop

This function mirrors the first half of the previous one: it checks for the existance of an instance of myTunes and if it finds one it first stops it and then deletes it.

Save the Flash movie (I named mine “playsound.fla”) and compile it to get a .swf file. Now it’s time to deal with JavaScript.

go to page: 1 | 2 | 3 | 4 | 5

--top--