HTML5 Snake Game with source code walkthrough

This is nice; I like how the background updates to show the level-state.<p>I recently started porting my native iOS game to HTML5. After Xcode/Objective-C, HTML5 development is just so refreshing for the 1) instant reload, 2) succinctness of Javascript. I'm kicking myself for not starting sooner.<p>Here's a link to my HTML5 game: <a href="http://noisytyping.com/NCT6745/index.html" rel="nofollow">http://noisytyping.com/NCT6745/index.html</a> (work in progress!)<p>edit: I just realized I haven't put in a tutorial yet. It's an Arukone implementation: connect all number-pairs, and fill the grid.

I like it! I really relate to the childhood dream of making games. I've been dipping my toes HTML5 gamedev myself, but thus far have done everything with DOM nodes. Have you thought of putting it up on some app stores? Or at least the chrome store? That one is pretty easy and free. No clue how much traffic to expect from it, though.

Maybe it's just me, but the requestAnimationFrame code fails in Firefox unless they're all prefixed with 'window.'<p>It probably works straight away in Chrome because requestAnimationFrame is defined.

So Cool. Thanks for the detailed, specific &#38; well-designed contextual explanations!<p>I am honing my HTML5 skills, and this was very useful. I started playing with your code...

Screen moves with the snake. Chrome 25.0.1364.152.

You have used path to draw the boxes instead of drawRect() function. Is there any particular reason/advantage behind that?

Funny how even after years of Vim-ing, using "hjkl" in a video game still trips me up.