Mobile Chess
Posted by Scato Eggen on 18 November 2011
Tag(s): Webapplicaties, Hobbyprojecten, Mobiele applicaties
Once a year I get to spend a week doing something cool and new. Last week, I made a chess game using the all new jQuery Mobile framework.
A year and a half ago, I made a chess server with the aid of unit tests (dutch). The idea was that by implementing all the rules on the server, it should be a walk in the park to create a client using JavaScript, Flash or whatever suits you. I never got around to putting it to the test, until now...
My server implemented JSON-RPC and, with a little tweaking, a JSONP-variant. Client-side I first used jQuery.zend.jsonrpc until I was sure the basic stuff worked, which I then tweaked to use JSONP. So far it was like playing with LEGO. However, after a while my code got all tangled. Thank you jQuery...
I started rewriting my code to use (pseudo-)classes and ordering them into model, view and controller layers. I was out of the woods and into jQuery Mobile. Apart from some bugs (buttons are flakey in IE: clicking on the text doesn't trigger a click-event on the button, but clicking next to it does) and some lesser documented features (you can set the value of a radio input, but then you have to call checkboxradio("refresh") to update the widget) I really like it.
I put all my pages in one single HTML file. It reminded me somehow of mobl. jQuery Mobile took care of the fancy transitions. The Chess Board itself has nothing to do with Mobile Widgets. If the browser window resizes, I update the height of the board to match the width (so it doesn't turn rectangled). You can do this the same way you would using only jQuery.
Building Apps using jQuery Mobile is just like building Mobile Apps using jQuery.
Try the app at chess.demo.infi.nl. Warning: there's no way to invite someone, so ask someone nearby to sign in as well.
