Here’s another experiment with the Javascript canvas tag:

It’s a canvas tag version of everyone’s favourite old-school demo effect. It obviously requires the canvas tag, so anyone out there still persisting with IE, perhaps quixotically hoping that it will one day turn into a web browser, won’t be able to see it. It works very well in Safari (in OSX, at least), and Firefox does a reasonable job of it. Strangely, it’s faster in Safari on my hackintoshed netbook than it is on my 2.4GHz Thinkpad in Firefox.

The canvas tag code is a port of the latest Woopsi example - a fire demo that uses the SuperBitmap for output.


Canvas Tag Clipping 3, AKA a Javascript Window Manager

Building on yesterday’s code, here’s the latest version:

At this point, the similarities to Woopsi should be apparent. This is a basic but workable window manager for the canvas tag. New things since yesterday include window and button gadgets, a top-level container gadget, event handling (click, release, release outside, focus and blur), focus and blur functionality, and probably some other stuff that I’m forgetting.

In various places I’ve just ported code straight from C++/Woopsi to Javascript, whilst in others I’ve taken advantage of lessons I learned whilst writing Woopsi to come up with better approaches. For example, the list of gadget event handlers is a separate class. I’ll probably update Woopsi to follow the same pattern.

As for why I’m doing this - I haven’t the faintest idea. Seemed like a good idea at the time.