‘Cut the Rope’ HTML5 JavaScript Preloader

Screenshot of Cut the Rope HTML5 Javascript web appDevelopers from the popular iPhone game Cut the Rope and a crack team of HTML5 gurus from PixelLab, have developed an awesome JavaScript version that runs inside most modern web browsers using JavaScript and a number of powerful HTML5 features such as canvas and media APIs. You can find out how they did it from the behind-the-scenes video they’ve posted.

One of the interesting snippets from the dev blog is that the group behind the creation of the app have released an open-source preloader for JavaScript apps called PxLoader. It supports some extremely useful features such as being able to load in your canvas images in groups, use progress bars, get callbacks when various groups have loaded and supports a plug-in architecture so you can load in sounds too. It’s released under a fairly liberal MIT license and the PxLoader source is available on GitHub.

Image loading in Groups

A good example is using it in an HTML5 game to load menu sprites before actual game sprites since you would want the menu to display and load first. PxLoader can also provide progress updates to many listeners and will scope the updates and statistics to only the set of “tags” a listener is interested in, a tag being the text name of that group.

You can play with a working example of the group image loading on the PxLoader homepage (Sample 3).

Impressive JavaScript PC Emulator

Fabrice Bellard has written an impressive PC emulator that actually emulates a PC with a 32 bit x86 compatible CPU. This is some really imaginative use of pure JavaScript which I’m sure no-one would have every dreamed of as it allows you to run a virtual instance of Linux inside a browser window!

It currently only works in Google Chrome 11 or Firefox 4 as it uses part of the WebGL HTML5 spec that Safari hasn’t implemented yet but is definitely worth playing around with. You can even compile C files!