If you’re unfamiliar with MooCanvas then you might know excanvas, Google’s canvas emulation on IE. For sake of prosperity you should know that I had ported excanvas once before (about 8 months ago). I trashed that port (too many errors), however, and immediately worked on a Test page so that I can assure myself that I’m not going to propagate bugs that I may inject in the porting process or bugs that were in excanvas.

As described in the MooCanvas site, the current MooCanvas is not just excanvas any more. There’s a second body of work which I stumbled across which is also incorporated into the port/mix. Ralph Sommerer was the first person to work on the idea of using VML to emulate <canvas>. His contribution is better pattern and gradient support (although still limited).

Emulating <canvas>

So what is MooCanvas/excanvas exactly doing? Simply put: it takes instructions and properties to accordingly make a new VML Element which is then inserted into the DOM. Say you wanted to draw a circle on the canvas. Typically with canvas you getContext('2d') and with the returned interface you beginPath and functionally call arcTo from a starting point to another. After all the magic is done, you then closePath and stroke or fill depending on your needs. In the background, there’s a lot of things that get allocated/recorded so that MooCanvas can properly create the VML Element on the fly.

Updates

The MooCanvas page has more information on the changes made since the last revision (at olmo-maldonado.com). You’ll have to update your code to reflect the new syntax change but be assured that there’s more speed improvements and readability of the source code for those souce code fanatics. Most importantly, MooCanvas has a few fixes in gradients that were not apparent before as well a tricky lineTo issue.

Future Work

There’s a lot of planning right now on my behalf. First order of business is to incorporate the old design into the current Hemingway template that I got from Overture21 so you’ll likely see a new “projects” section with the necessary components and controllers so that the project pages are standardized for your convenience and for my productivity to increase.

Release

Here’s a bit of trivia: even though the MooCanvas is on the net, I am still hesitant to claim that it is released. Right now the version is 0.00 for the simple reason that I’m going to fix a lot of discrepancies from the getContext (ie. globalComposition) before I am comfortable for release.

I suppose we can treat this stage as alpha/beta/gamma release so that I can get contributions to the Canvas Test Page.

Expect

You can expect that the next revision would include:

• Bug fixes
  • ctx.scale(1,-1)
• More context support
  • globalComposition

Wishlist

If there’s anything in particular that you’d like leave a comment. I’ll add it to the list of things that I should work on.