Problem:
You need to have a SWF file do something, based on something else that happened within a different SWF file.
Restrictions:
Must be Actionscript 2 (for example, because of banner ads, or to support older plug-ins)
Why?
Well, you might not want your site to be a giant Flash movie (thank you). You might have a small control, and want it to change a different interface or content element. You might have custom “rich-media” banner ads that need to interact with each other for a campaign (for some reason, I keep imagining a pong game, with a left paddle that’s controlled by the user, a page of blog content, and a right paddle controlled by Flash…as if the blog is blocking the path of the ball. Probably too hard to play though…
Regardless, the solution is using a local connection object!
Here’s a quick example (download source files here):
The following spheres are two separate SWF files:
(this text is pure HTML — view the source to prove it to yourself) |
The left sphere is the “sender” and the right sphere is the “receiver”. Click the left hand sphere to see how it sends a command to the right one (in this case it tells it to change color).
In the first movie (the sender or caller), we’re going to have a sphere with a Play/Pause button. When you click it, it will change the button image, and send a command (via LocalConnection) to the listener (or receiver) movie.
// start by initializing a local connection var outgoing_lc:LocalConnection = new LocalConnection(); // global variable to keep track of whether we're in the // "play" state or the "pause" state var flagPlay:Boolean = true; // starting out, set the Pause image to be hidden theSphere.thePause._visible = false; // mouse event when the user clicks on this Flash movie this.onMouseUp = function () { if (flagPlay) { // the following executes if we're in the Pause state // (i.e. the Play image is visible) flagPlay = false; // hide the Play image, show the Pause image theSphere.thePause._visible = true; theSphere.thePlay._visible = false; // send the command to the other movie (the one "listening" for events // sent to "lc_sphere_receiver" outgoing_lc.send("lc_sphere_receiver", "methodToExecute", "play"); } else { // do the opposite of the above flagPlay = true; theSphere.thePause._visible = false; theSphere.thePlay._visible = true; outgoing_lc.send("lc_sphere_receiver", "methodToExecute", "pause"); } }
Pretty simple… all we really had to do was initialize the connection, and then send it a command (in this case “play” or “pause”). Make sure that the connection name (i.e. “lc_sphere_receiver”) is the same in both movies!
Now, for the listener (aka receiver or destination) movie:
// start by initializing the local connection var incoming_lc:LocalConnection = new LocalConnection(); // hide the green sphere (start this movie from a "stopped" state) theSphere.theGreen._visible = false; // listen for an incoming command incoming_lc.connect("lc_sphere_receiver"); // set up the instructions for when the proper command is sent incoming_lc.methodToExecute = function(param:String):Void { if (param == "play") { // show the green sphere theSphere.theGreen._visible = true; theSphere.theRed._visible = false; } else { // assume "pause" (i.e. "stop") // show the red sphere theSphere.theRed._visible = true; theSphere.theGreen._visible = false; } };
Basically, all we’re doing is initializing the LocalConnection for this movie, and then creating a function that should be executed whenever it “hears” a command. We could create multiple methods as needed, or just use the one (as I have done) with passed parameters that tell it what to do.
Download the source files here!