Asteroid Runner on the iPhone!

Earlier this week I was very happy to be able to get my Asteroid Runner game working on the iPhone with minimal fuss. It only took two tries, once using the older “iOSImpact” framework which turned out not to implement the accelerometer events, and once using the newer “Ejecta” framework. Both are made by the creator of the ImpactJS framework and basically provide a Javascript interpreter and a mock HTML5 canvas that has a rich enough API to match the way the game runs in the browser. It might be possible to use just a raw UIWebView, but after a brief foray it seems there’s a bunch of overhead around resource loading for all the images and sounds that isn’t worth re-implementing as far as I can tell.

iPhone 5 screenshot

iPhone 5 live screenshot

One of the things I’ve been happiest with through this porting process is that I built the screen width and height to be flexible early on; the game plays a little differently depending on your browser/device shape, but it avoids any kind of nasty scaling problems. Might need to move away from this for balance reasons, but during functionality testing it’s nice to see the whole spectrum on different devices (even iPhone 4 vs. iPhone 5 with their different screens).

Screen Shot 2013-05-18 at 10.10.48 PM

Relative screen heights are used throughout (with apologies for the abuse of the term ‘consts’ here)

This also required extending the ImpactJS entity class to allow positioning entities relatively instead of absolutely (since we have no idea how many pixels will be in the screen). I created a plugin that injects this into impact.entity here. I think this could be useful for other games as well that share this flexibility of scale.

Leave a Reply