DOM.createElement - closing elements

[www.gtraffic.info]

I am still playing around with Flex integration. I really want to
embed the Flex canvas holder into the html for the application
programatically.

So I have something like

<!- ------------------------------------------------------------------
-->

<object id='flexApp' classid='clsid:D27CDB6E-
AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/
pub/shockwave/cabs/flash/swflash.cab#version=8,5,0,0' height='400'
width='400'>

<param name='flashvars' value='bridgeName=example'/>

<param name='src' value='dist/samples/app.swf'/>

<embed name='flexApp' pluginspage='http://www.macromedia.com/go/
getflashplayer' src='dist/samples/app.swf' height='400' width='400'
flashvars='bridgeName=example'/>
</object>

<!- ------------------------------------------------------------------
-->

and I want to recreate this in the div for the Flex widget.

I create a function as follows

private Element createElement()
{
Element object = DOM.createElement("object");
DOM.setAttribute(object, "id", "flexApp");
DOM.setAttribute(object, "classid", "clsid:D27CDB6E-
AE6D-11cf-96B8-444553540000");
DOM.setAttribute(object, "codebase", "http://
download.macromedia.com/pub/shockwave/cabs/flash/
swflash.cab#version=8,5,0,0");
DOM.setAttribute(object, "height", "400");
DOM.setAttribute(object, "width", "400");

Element param1 = DOM.createElement("param");
DOM.setAttribute(param1, "name", "flashvars");
DOM.setAttribute(param1, "value", "bridgeName=example");

Element param2 = DOM.createElement("param");
DOM.setAttribute(param2, "name", "src");
DOM.setAttribute(param2, "value", "dist/samples/app.swf");

Element embed = DOM.createElement("embed");
DOM.setAttribute(embed, "name", "flexApp");
//DOM.setAttribute(embed, "pluginspage", "http://
www.macromedia.com/go/getflashplayer");
DOM.setAttribute(embed, "src", "dist/samples/app.swf");
DOM.setAttribute(embed, "height", "400");
DOM.setAttribute(embed, "width", "400");
DOM.setAttribute(embed, "flashvars", "bridgeName=example");

DOM.appendChild(object, param1);
DOM.appendChild(object, param2);
DOM.appendChild(object, embed);

return object;
}

I haven't a clue if approach this will work or not (probably not but
it's worth a try) because I have two dumb problems.

1)

DOM.createElement("param");

creates <param> only. Not <param/> i.e. it isn't closed. I would
settle for <param></param>.

Same for the embed tag as well.

2) The line

DOM.setAttribute(embed, "pluginspage", "http://www.macromedia.com/go/
getflashplayer");

Always throws an error...

[ERROR] Unable to load module entry point class
com.netthreads.test.client.FlexTest
com.google.gwt.core.client.JavaScriptException: JavaScript TypeError
exception: Object doesn't support this action
at
com.google.gwt.dev.shell.ie.ModuleSpaceIE6.invokeNative(ModuleSpaceIE6.java:
435)
at
com.google.gwt.dev.shell.ie.ModuleSpaceIE6.invokeNativeVoid(ModuleSpaceIE6.java:
320)
at
com.google.gwt.dev.shell.JavaScriptHost.invokeNativeVoid(JavaScriptHost.java:
141)
at com.google.gwt.user.client.impl.DOMImpl.setAttribute(DOMImpl.java:
289)
at com.google.gwt.user.client.DOM.setAttribute(DOM.java:782)
at
com.netthreads.test.client.FlexWidget.createElement(FlexWidget.java:
80)
at com.netthreads.test.client.FlexWidget.<init>(FlexWidget.java:44)
at com.netthreads.test.client.FlexTest.onModuleLoad(FlexTest.java:28)
at com.google.gwt.dev.shell.ModuleSpace.onLoad(ModuleSpace.java:138)
at
com.google.gwt.dev.shell.BrowserWidget.attachModuleSpace(BrowserWidget.java:
313)

The weird thing is that I have seen similar code in the flash popup
discussion elsewhere in this group.

Anyone got any ideas?

Al.

[aglaforge]

Al,

Looks pretty reasonable to me, do you know where the code is throwing
the exception?

Cheers,

Anthony

On Feb 8, 7:37 am, "www.gtraffic.info"

> //DOM.setAttribute(embed, "pluginspage", "http://www.macromedia.com/go/getflashplayer");

> com.google.gwt.dev.shell.ie.ModuleSpaceIE6.invokeNativeVoid(ModuleSpaceIE6.­java:
> 320)
> at
> com.google.gwt.dev.shell.JavaScriptHost.invokeNativeVoid(JavaScriptHost.jav­a:

[Sandy McArthur]

Two thoughts:

1. DOM.createElement is going to create a DOM Element and not a HTML
tag. A DOM element doesn't have a open or closed form until it's
serialized to HTML. If you are using HTML or XHTML will affect the
serialized form but that shouldn't matter.

2. The object tag is for IE only right? Embed is for all other
browsers, right? You should probably use GWT's replace-with feature to
only generate the needed object or embed element for the current
brower. The techinque of nesting embed in a object is only needed for
static files that don't know what browser will load them.

From the stack trace it looks like you are running IE and the problem
comes from the embed element which won't be needed in IE.

Create a class for the Embed technique and the subclass it with
another that uses the object technique.

Then in your .gwt.xml have something like:

<!-- Default rule -->
<replace-with class="com.example.PluginImpl">
<when-type-is class="com.example.PluginImpl"/>
</replace-with>

<replace-with class="com.example.PluginImplIE6">
<when-type-is class="com.example.PluginImpl"/>
<when-property-is name="user.agent" value="ie6"/>
</replace-with>

(I've been told the first replace with isn't needed but that is how
GWT does stuff internally so that is what I do.)

Finally do a GWT.create(PluginImpl.class) to let GWT create the right
instance for you in your code.

HTH, let us know if that worked or not?

--
Sandy McArthur

"He who dares not offend cannot be honest."
- Thomas Paine

[www.gtraffic.info]

The exception was being thrown in the lines building the embed. As you
point out Sandy this is not valid for IE which if of course the
default rendering engine in hosted mode on windows!

Sandy thanks for your excellent suggestion to switch class
implementations depending on platform. That is a neat trick which I
have never looked that closely into before.

I have implemented platform specific imps of the createElement()
functions and they are dishing up the html correctly (I just inserted
the html straight into a holder div and didn't bother with
DOM.createElement).

Well I feel a step nearer but not there yet. I need now to defer the
widgets attempt to access the FABridge object before it has been
created properly.

Al.