[qooxdoo-devel] DOM issues on Internet Explorer when using multimedia tag

Tue, 20 Jan 2009 09:26:42 -0800

Hi all,

At the moment I am trying to create a custom widget (latest stable Qooxdoo
0.8.1) which encapsulates VLC media player's browser control. I overrode
_createContentElement to add to following HTML structure:
<object ...>
  <param ... />
  ...
  <param ... />
  <embed ... />
</object>

In Firefox this is working and the movie is playing - pretty cool. However in
Internet Explorer (6 & 7) my code breaks and I get a JavaScript error "invalid
argument". Ok, <embed ... /> is not part of HTML 4.0 or XHTML 1.0 standards,
so I removed it. However the problem still exists.

The funny thing is: if I remove all <param ... /> tags but two the DOM
structure is built correctly. The issue seems to be connected to the
combination of object and param tags. When I replace "object" by "a" and
"param" by "img", I get some hyperlinked images as expected.

I also don't think it is a bug in IE because manually creating this DOM
structure (using low level JavaScript's createElement() function) works.

After some investigation I also discovered that the error occurs in
qx.html.Element._insertChildren() in line 527:
  this.__element.appendChild(domElement);

So param tags cannot be batch added to object ... aha. Please see my code (note
that this is not related to qx.ui.core.Widget - adding obj directly to
this.getRoot() in Application.js gives the same result) - ok, you don't get any
visual feedback because width and height are not set correctly at this time but
you should at least see a note that the page contains errors:

_createContentElement : function()
{
        var el = this.base(arguments);

        var obj = new qx.html.Element("object");
        obj.setAttributes({
          classid : "clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921",
          codebase : 
          
"http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab";,
          width : "400",
          height : "300",
          id : "vlcCtrl",
          events : "True"
        });
        
        
        obj.add(new qx.html.Element("param").setAttributes(
        { name : "MRL", value : "" }));
        obj.add(new qx.html.Element("param").setAttributes(
        { name : "ShowDisplay", value : "True" }));
        obj.add(new qx.html.Element("param").setAttributes(
        { name : "AutoLoop", value : "False" }));
        obj.add(new qx.html.Element("param").setAttributes(
        { name : "AutoPlay", value : "False" }));
        obj.add(new qx.html.Element("param").setAttributes(
        { name : "Volume", value : "50" }));
        obj.add(new qx.html.Element("param").setAttributes(
        { name : "StartTime", value : "0" }));

        var emb = new qx.html.Element("embed");
        emb.setAttributes({
                pluginspage : "http://www.videolan.org";,
                type : "application/x-vlc-plugin",
                progid : "VideoLAN.VLCPlugin.2",
                width : "400",
                height : "300",
                name : "vlcCtrl"
        });
        //obj.add(emb);
        
        el.add(obj);
        
        return el;
}

Now change <qooxdoo-sdk>/framework/source/class/qx/html/Element.js
line 516 (inside _insertChildren : function()) from
      if (length > 2)
to
      if (length > 2 && this.getNodeName() != "object")
and the error is gone. Set width and height and you will even see the black
background of the ActiveX control.

This is weird ... I'm out of clues. Hoping you can provide some feedback.

TIA & Rgds,
Sebastian



------------------------------------------------------------------------------
This SF.net email is sponsored by:
SourcForge Community
SourceForge wants to tell your story.
http://p.sf.net/sfu/sf-spreadtheword
_______________________________________________
qooxdoo-devel mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel

Reply via email to