I have a very puzzling issue...
Since the 2d canvas is too slow to make whole screen realtime pixels shaders, I decided to create a plugin for that, which uses WebGL.
Searching across the web, there's only one lib doing that for the moment : glfx.js
<img src="http://i.imgur.com/pmKUv.png" border="0" />
I tried to integrate it inside a C2 plugin.
The idea is simple : retrieve an image from an <img> tag, pass it as a texture to a "webgl-experimental" <canvas>, applu shader on it, display back the <canvas>.
I manage to draw a Sprite on C2's canvas, extract it to write it in an <img> tag inside the index.html DOM (that tag is going to have "visibility:hidden" set in the future, when everything is bug-free).
glfx.js then load that <img> in his webglcanvas, and apply on it a sepia shader (to start with something).
I then retrieve the content of that <canva> via toDataURL() (in a base64 string), set that string as the .src for a new Image(), and draw that back inside C2's canvas (with ctx.drawImage()).
Here's the good news : it works perfectly in Firefox, as you can see on the top screenshot. But it fails badly in Chrome (same problem for Safari), so I suppose it's a Webkit-wide problem.
I went to #webgl, on freenode, and nobody heard about that problem.
I change the glfx.js source to set "preserveDrawingBuffer" at true.
I scoured the two buglists (chromium & webkit), there's nothing on it.
I didn't even find a demo on the web about that chain of event (namely img -> webglcanvas -> toDataURL - > drawImage(2dcanvas)).
So if somebody has an idea, or has already encountered that bug, don't hesitate !