If you’ve written at least once the OBJECT and EMBED tags, without copy/paste you may have been noticed that the place of the EMBED tag is a bit strange. Actually after the OBJECT tag, comes the PARAM sequence, that simply defines different parameters for the flash movie.

And what looks strange?

The strange thing in all this is that the EMBED tag, which in fact is only one, instead of the case with all the parameters of the OBJECT, is displayed just before the closing of the OJBECT tag.

Experimenting …

What if the embed tag is outside of the OBJECT opening and closing tags. Actually only IE understands this as a problem. Than it displays the move twice!

That’s why the place of the EMBED is just before closing the OBJECT tag. In that case MSIE doesn’t “see” the EMBED and displays everything correctly!

The most simple way to describe the case is as if you have the ExternalInterface addCallback in the Flex application like that:

flex.mxml

ExternalInterface.addCallback("jsFunc", flexFunc);

public flexFunc() : void
{ ... }

and in the javascript code you’ve something like that:

file.js

function getSwf(movieName) {
    if (navigator.appName.indexOf("Microsoft") != -1) {
         return window[movieName];
    } else{
         return document[movieName];
    }
}

getSwf('movie').jsFunc();

that will execute the flexFunc in the flex app.

Important!

is very important to have the object/embed tag correct:

<object classid="clsid:d27cdb6 ....
<param name="name" value="movie" />
<param name="allowFullScreen" value="true" />
<param name="AllowScriptAccess" value="always" />
<param name="wmode" value="transparent" />
<param name="flashVars" />
<param name="src" value="movie.swf" />
<embed ... name="movie"></embed>
</object>

That doesn’t work? Where’s the bug?

Even it’s not so clear the bug is present. The getSwf function gets the window[moviename], or document[moviename] depending of which browser is used. But the problem is that both object and embed tags have same name and the selected object is not one but two.

So there’s a simple patch

Name the object embed tags with different names, i.e.

<object classid="clsid:d27cdb6e-ae6d-11 ...>
<param name="name" value="movieie" />
<param name="allowFullScreen" value="true" />
<param name="AllowScriptAccess" value="always" />
<param name="wmode" value="transparent" />
<param name="flashVars" />
<param name="src" value="movie.swf" />
<embed ... name="movieie"></embed>
</object>

now they are named movieie (for IE) and movieff (for Firefox) and we must to change a bit the getSwf function like that:

function getSwf(movieName) {
    if (navigator.appName.indexOf("Microsoft") != -1) {
         return window[movieName + 'ie'];
    } else{
         return document[movieName + 'ff'];
    }
}

getSwf('movie').jsFunc();

<param name=”allowFullScreen” value=”true”>

parameter of the object tag. You may also set allowFullScreen=”true” of embed tag.

Make the .swf sample file with both symbols inside. In general it’s not that hard, just put this into your Flex application code:

[Embed(source="embed.swf", symbol="blue")]
private var blue:Class;

[Embed(source=”embed.swf, symbol=”red”)]
private var red:Class

Note that you’ve embed.swf file, which has to be in the same folder as the main .swf of the Flex app, and two symbols named red and blue for the sample. Be very careful when exporting the symbols from the .swf file. Do not forget to export them for actionscript.

If not exported like that, you’ll have trouble accessing them from the Flex app, and that’s the first problem you can have here.

The rest you have to do is to add this two lines of code in Flex:

var mc:MovieClip = new blue();
this.addChild(mc);

Note that the last line can have something else than ‘this’ if there’s other element to become parent of the imported MovieClip symbol. Here comes the first major problem. As www.airtightinteractive.com describes this technique does not work every time:

Sometimes when you do this you will get the following error:

TypeError: Error #1034: Type Coercion failed: cannot convert app_red@12510d1 to flash.display.MovieClip.

And the author shares his solution which is to add at least 2 keyframes for both movie clips, so that they can be visible as movie clips, if not they will remain visible only as Sprites.

I’m not as conviced this is the right answer of the question and the right solution. I’ve experimented with 1 or 2 keyframes and still have the same problem in Flex even if i cast the symbols as Sprite, not MovieClip:

var mc:MovieClip = new blue();
var mc:Sprite = new blue();

The solution from Adobes for me is not suficient, cause the movie clips we import (embed) does not serve as images but more like movie clips, which was the task from the beggining. And that’s what Adobe says:

Flex fully supports embedding Flash SWF files. You can embed different types of SWF files.
…
To reference a symbol, you specify the symbol parameter:
[Embed(source=’SWFFileName.swf’, symbol=’symbolName’)]

And again read carefully the note in the Adobe’s site:

Note: Flash defines three types of
symbols: Button, MovieClip, and Graphic. You can embed Button and
MovieClip symbols in a Flex application, but you cannot embed a Graphic symbol because it cannot be exported for ActionScript.

Here you can be sure that lack of exported for actionscript symbol is not accessible in Flex.

One of the main solutions is to embed the .swf as octet-stream:

[Embed(source="embed.swf", mimeType="application/octet-stream")]
private var blue:Class;

followed by:

var loader:Loader = new Loader()
loader.loadBytes(new blue());

And the key point of this will be the lines:

var red:Class = loader.contentLoaderInfo.applicationDomain.getDefinition("blue");
var mc:MovieClip = new red() as MovieClip;

I hope this can help