Hey, Game On 2010 contest participants — how are those HTML 5 games coming along? I can’t wait for January 2010 when I can finally see what you’ve made.
I’ve been doing some HTML 5 experimentation of my own. What I’m working on is not a game, but it is a graphical HTML 5 webapp that uses several tricks that may be of interest to game developers. It’s easier to show it in action than to tell you about it, so watch this video (hosted on Vimeo since WordPress won’t let me embed) for a preview of Pencilbox and an explanation of how it works.
Note: this is not a Mozilla project — this is a personal project I’ve been hacking on in my free time.
I’m not yet ready to put the app itself on a public webserver where you can play with it, nor have I set up a public code repository yet. (Like I said, it’s a side project, so I haven’t had time to work on the infrastructure stuff.) When I do have it set up properly, I’ll let you know. In the meantime, here’s a tarball of the source code, which is under a Mozilla tri-license. It may be of some interest if you wish to achieve a similar effect in your Game On 2010 submission and you want to see how I did it.
Happy hacking!
December 11, 2010 at 6:15 am
That’s pretty cool. It does seem like using a server-side script to composite the final image is a bit of a hack. Couldn’t you use drawWindow to draw the composited stack of canvas elements into yet another canvas, and then save the content of that?
December 11, 2010 at 9:46 am
Very nice tool, but you can composite on the client-side using drawImage (which is _much_ easier):
http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#images
Just create a hidden canvas and call drawImage(canvasLayer1, 0, 0) etc. for each layer.
January 12, 2011 at 11:00 pm
The link to the source code is dead.