Warning: Use of undefined constant ddsg_language - assumed 'ddsg_language' (this will throw an Error in a future version of PHP) in /home/chin22/domains/flixel-gdx.com/public_html/wp-content/plugins/sitemap-generator/sitemap-generator.php on line 45
HTML5 support - flixel-gdx

HTML5 support

Really it’s done? Yes it is. I worked almost every weekend on this and finally managed to fix (the most) bugs to get it running in the browser. What was the problem? The problem was the no support of reflection in JavaScript. Libgdx wrote a nice API to solve this. While moly was able to run the flixel-gdx animation demo months ago, the Reflection API got changed and things got broken. I haven’t taken a look at it (I was working on something else that time). This time I gave it a try, getting animation demo back into running again. I had to test every demo and for each test more bugs came out. The following demos are on the server:

Note: the demos are compiled for the user agent Safari. You’ll get a warning message if your browser got a different user agent.


All the demos runs at 60 FPS in Chrome and Firefox, although Firefox does have some hiccups. The demos have also been tested on Android Chrome and Firefox browser. It didn’t run well. Like 16-20 fps on TiledMap2 demo. Don’t get high expectations on this.
There is no list which you can select the demos from, because the demos got different resolutions.

Setup UI

This tool doesn’t generate HTML5 project. You need to create a GWT project manually. See here: gwt-project-setup
The GWT setup is not tested. Scream if the wiki got it all wrong.

Reflection and Limitations

If you’re planning to create a HTML5 game, keep in mind of using Reflection and the limitations. You can’t use freetype. It doesn’t run in Internet Explorer 11. Check the wiki for more info.

Broken or Buggy

The controller plugin doesn’t work. I haven’t taken a closer look about the bug. It won’t happen anytime soon that I’ll fix this.
For HTML5 it uses a modified JBox2D. Got some null exceptions on some tests and Continuous Collision Detection is unreliable.


The preloader doesn’t look fancy, it’s just a logo and a loading bar. You can create your own preloader by overriding FlxHTML5Application::getPreloaderCallback()
I’ve created the original flixel preloader in Canvas. Now I’ve to figured out how to get this in GWT. It might take a while before I start with this.

In the end, it was a pain in the butt to get all of this working…I hate you GWT!

Posted in flixel-gdx, HTML5Leave a comment