Question

Here’s the challenge: I have a Flash movie which will be embedded in a page using an unknown DOM ID that I want to be able to identify/store for callback in a JS function.

My ideal user flow would be:

1. User clicks button in Flash.
2. Flash pauses any animations / video / sounds / etc.
3. Flash calls an injected JS function to display a page-covering overlay experience.
4. When user closes overlay experience, a callback method on the Flash object is called.
5. Flash resumes playback.

The problem is, when AS3 uses the ExternalInterface.call(“functionName”, args…) method, there doesn’t seem to be a DOM event triggered, and thus it is impossible to tell which object called a JS function, so having a “registerMe()” function doesn’t seem to work. Basically, the injected JS function has no way to determine which DOM object to call, because the ID of the Flash object is unknown.

[UPDATE]
It turns out, a SWF can determine its own url using loaderInfo.url. I’m passing that information to the script that launches the overlay experience so it can be stored for a future comparison against all application/x-shockwave-flash DOM objects. When a match is found, that is the calling SWF. Does anyone see a flaw in this logic? (I’m not nearly as proficient with JS as I am with AS)

Answer 1

The JavaScript function you are calling is being called manually, not as an event. It’s just like if you used the call or apply methods in JS.

What you can do is pass the DOM name/ID of the active flash video as a parameter to the function you’re calling, so that it knows which DOM element to refer back to:

ExternalInterface.call( 'functionName', arg1, arg2, ..., ExternalInterface.objectID );

One “gotcha” with this method is that you need to make sure the object and/or embed elements have both their [id] and [name] attributes set, because ExternalInterface.objectID will be registered inconsistently across browsers.

If I remember right, IE reads the [name] and ff/chrome/opera/safari read the [id], although I believe a couple browsers would fallback successfully to the [name]. I will need to do a test to confirm this.

In any event, give an identical name and id and it should work fine (you’ll be able to select the element in the DOM just based on the ID).