Cross-browser call of Flash methods from JavaScript

A week ago, in one of my projects, the task arose of replacing an existing slide show implemented in JavaScript with a more beautiful Flash-made one. With a minimal change in the code, it was necessary to insert a flash movie and adjust the data transfer and event handling on the page so that it would continue to work correctly.

Russian-language articles on the topic of data transfer in a bunch of JavaScript — Flash give an overview of the process, but do not take into account one important detail: different browsers should use different objects to select a flash movie. The most frequently proposed solution works in Chrome, but refuses to work in Firefox, and even more so in IE.

Due to the incompleteness of the majority of articles on the topic of data transmission between JavaScript and Flash, I consider it appropriate to consider this issue in more detail.

How it works?

')
In an HTML page, a Flash movie is a regular object, just like a window, a form element or an image (albeit, in Internet Explorer (IE), the Flash object is a COM object or an ActiveX object). Depending on the browser, the Flash object should be referenced in various ways.

window.document[movieName] // (on Mozilla browsers such as Netscape)
window[movieName] // (on Internet Explorer as of ver 5)
document.embeds[movieName] // Mozilla Netscape, Firefox or Opera

Here is the function that returns the Flash movie.

function getFlashMovieObject(movieName)
{
if (window.document[movieName])
{
return window.document[movieName];
}
if (navigator.appName.indexOf("Microsoft Internet")==-1)
{
if (document.embeds && document.embeds[movieName])
return document.embeds[movieName];
}
else // if (navigator.appName.indexOf("Microsoft Internet")!=-1)
{
return document.getElementById(movieName);
}
}

Most modern browsers support the use of the getElementById (movieName) method. But if it works in Internet Explorer, then for other browsers, such as Mozilla Firefox or Opera, this approach will not have the expected effect. The reason is that these browsers must use the <embed> element, while getElementById () will return the <object> element.

Requirements for the elements embed and object

Both embed and object do the same thing, but most people use them at the same time, because the former is recognized only by Mozilla (Netscape, Firefox), and the second by only Internet Explorer.

In order to establish a connection with JavaScript, here are some requirements for the object and embed tags. First, here is an example of how a Flash movie can be inserted into an html page.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="" id="myFlashMovie" width=481 height=86>
<param name=movie value="flips2.swf">
<embed play=false swliveconnect="true" name="myFlashMovie"
src="flips2.swf" quality=high bgcolor=#FFFFFF
width=481 height=86 type="application/x-shockwave-flash">
</embed >
</object >

In this example, the name and ID of the movie is “myFlashMovie”. (This name is chosen randomly, at your discretion. It is advisable to use the same name and ID, but you should also make sure that no other object has the same ID or Name. Also, use only numbers and letters, the name should not begin with numbers). So, here are these requirements.

For the <object> tag:
- Flash movie must have an ID. For example, in our case id = "myFlashMovie".

For the <embed> tag:
- Flash movie must have a name, name parameter. For example, in the example above, name = "myFlashMovie".
- the <embed> tag must contain the attribute swliveconnect = “true” to enable the ability to “establish a connection” with JavaScript.

It is advisable to use the same ID and Name values ​​within the same Flash movie.

UPD:
pixelcube proposed such a function to get a flash object:

function getFlash(name) {
return window.document[name] || window[name] || document.embeds[name];
}