Microsoft has launched its answer to Angry Birds. Will an IE9/HTML5 version of Cut the Rope, starring the green monster called Om Nom, be enough to propel IE9 to dominance?

Announced at CES by Steve Balmer and on more than one Windows Blog, a new game has launched. According to Microsoft Cut the Rope is an IE9 game but we've been playing it with Firefox and Chrome.

However, if you get hooked, as we did, and want to progress beyond the initial  levels then you''ll have to install IE9. According to Ryan Gavin's blog post, if you pin the game to your Windows 7 task bar IE9 takes on the look and feel of the game and unlocks levels not found in any previous versions of a game created by ZeptoLab already popular on iOS.

The story of how the the original objective-C version was ported to JavaScript is quite interesting in itself. The original consisted of about 15,000 lines of  code including the 2D physics engine which gives the game it smooth natural behaviour. 

One of the biggest problems seems to have been using JavaScript objects as structs - it seems easy until you realize that objects are passed by reference and structs are past by value. I can almost feel the anguish caused by trying to track down where an object had been modified by a function that should have used a copy. The obvious thing to do is to make copies on passing, but this is an expensive operation.

Sadly the team admits using a library to mimic objective-C's class based inheritance. It is a shame because JavaScript does objects so much better and any move to adding class to its constructs is a mistake. But, given that this is a port from a class-based language and time was in short supply, I can see why the choice was made.

Encouragingly, the team praise the way the 2D canvas graphics worked. In particular, the auto-antialiasing in Canvas beats the original OpenGL ES approach to the problem. Of course. if the task had been to port a 3D program. the task would have been much more difficult as. unlike Chrome and Firefox, IE9 doesn't support WebGL.

The final code was around 15,000 lines of JavaScript and as you can see the minified code runs at a perfectly acceptable speed.

The current version doesn't support touch, but this is an upgrade planned for the future.

Here its developers, Semyon Voinov and Denis Morozov from Zeptolab, explain how they collaborated with Pixel Lab's Robby Ingebretsen and Joel Fillmore to bring Om Nom to life on the web:

You are also encouraged you to download the Windows 8 Developer Preview and to convert existing HTML5 apps to Windows 8 and submit them to the new Windows 8 app store.

There used to be a time when HTML5 implied that at least an attempt was being made to be browser-independent. There is no particular reason that the higher levels should be specific to IE9 - expect of course to ensure that you upgrade to IE9. Microsoft isn't alone in using this sort of tactic. Google regularly creates demo sites that only work with Chrome.

It seems that the new name of the game is to make use of HTML5's appeal to standards and browser-neutrality while building in specific traps to ensure that your particular browser does it better or is the only one that can run the app.

Update 2019: You can still play Cut The Rope, courtesy of Crazy Games. Thanks to  Emily North, Gamer, Graphics Designer & Creator of Worlds for bringing a broken link and a fix to our attention.

More Information

Play Cut the Rope

Related Articles

2011 - The Year HTML5 Won

Canvas bitmap operations - bitblt in JavaScript

A Programmer's Guide to Canvas

To be informed about new articles on I Programmer, sign up for our weekly newsletter, subscribe to the RSS feed and follow us on Twitter, Facebook or Linkedin.

Comments

Make a Comment or View Existing Comments Using Disqus

or email your comment to: comments@i-programmer.info