WebGL/GWT Fundamentals/Elemental, tiny update, texture loading works on firefox

Just after the publication of our  first post on Elemental and WebGL  (here) we found that the first two  examples we wrote for the post were running on firefox but not the remaining three.
The sample that uses a video as background image requires WebRTC so it is not a surprise, but
the sample that just loads an image and draws it in a canvas and the one with a small rotating cube were supposed to be 'portable'.

Quite surprisingly the problem was with  the image loading code.

Actually if you write

        final ImageElement imgElement = Browser.getDocument().

createImageElement();
            Browser.getDocument().getBody().appendChild(imgElement);
            imgElement.setSrc(uri.asString());
            imgElement.setOnload( new EventListener() {
                @Override
                public void handleEvent(elemental.events.Event evt) {
                    ...
                }
            });

on firefox the EventListener is never called. :(

Well, Elemental is not targeted to firefox right now so a strange behavior was expected but being experimenting we did some test and replacing the ImageElement with a 'plain old' Image with RootLayoutPanel does the trick:
           
            final Image image = new Image();
            image.setUrl(uri);
            RootLayoutPanel.get().add(image);
            image.addLoadHandler(new LoadHandler() {
                @Override
                public void onLoad(LoadEvent event) {
                    image.setVisible(false);
                    RootLayoutPanel.get().remove(image);
                    //image loaded
                    Element e = image.getElement();
                    ImageElement kludged = JSNICastImageElementToImageElement(e);
                    run_afterSetup(kludged);
                }
            });

this requites to use jsni to 'cast' from com.google.gwt.user.client.Element to elemental element that is not so clean but ... well, it works for this small demo. ;)

The content of this post is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the Apache 2.0 License.