I have a half-hearted plan to write a work-a-like of Bebo‘s whiteboard drawing feature. I think it would be an interesting addition to Soylent Red’s comments if people were able to use drawing as well as text.
Bebo’s whiteboard is a simple Flash drawing program. I decided that my work-a-like would be a good excuse to learn about the HTML5 canvas element. I realise that this would exclude Internet Explorer users from the fun, but when have I ever cared about that? Current versions of Safari and anything based on a recent Gecko (Firefox, Camino, Seamonkey) would be able to handle it. Oddly enough (because Ian Hickson, the author of the HTML5 draft, worked for Opera Software until recently) the most recent Opera release (8.5) doesn’t support canvas, although the previews of the Opera 9 apparently have support.
Having decided that browser support was sufficient for what was essentially to be a fun addition and not a necessary part of the site I set about coding the whiteboard. I have to say that the canvas drawing API is a joy to work with. It’s very simple, and very easy to pick up. It has a great deal of flexibility without having to resort to providing a host of specific methods. It took me less than an hour from starting to read the spec to having a working prototype, with a choice of five colours and three brush sizes. By this stage there were some browser inconsistencies to work around. For example, my method of finding the correct coordinates of a mouse event is still buggy, particularly in Safari.
Thankfully I didn’t invest any more time in fixing and working around bugs before I discovered the real show-stopper (and I’m not talking about the Heart-Break Kid Shawn Michaels). It turns out that no current browser supports the toDataURI() method of canvas. That means it’s impossible to submit the image data back to a server. So I have a nice little drawing applet that has no way to save your drawings. Crud.