One of the few shortcomings of the current XUL toolkit is that there is
no easy way to gain pixel-level painting control within your
application.  I've heard many people talking about this potential
feature for quite a while, and I think it's time to go ahead and get it
working.

I recently hacked something together that works pretty well.  I
added a new <canvas/> tag to XUL which exposes an RGB pixel buffer that
is accessible as a scriptable component.  You can get and set pixels in 
the buffer from javascript and then invalidate regions of the image to
repaint them.  This is quite simple, and could eventually grow to 
provide a wider array of convenient drawing functions. So, in the end 
this basically makes it really easy to do custom painting from 
javascript (or C++ if more speed is required).

I've written two demos: one is a little paint program written entirely
in javascript, and the other is a color-blending animation written with
javascript and C++, which re-paints every pixel of an image
continuously at about 60 frames per second.

I've posted my patch and the demos to the following bug:
http://bugzilla.mozilla.org/show_bug.cgi?id=102285

I have also created a test build (windows only) for those of you who 
would like to see this in action. Read my comments in bug 102285 for 
information on where to download the build and how to run the canvas demos.

Feedback from interested parties would be much appreciated.

- Joe


Reply via email to