Extract the static vector shapes in .swf to JavaScript Canvas code of HTML5. Designed for HTML5 Canvas programmers, so the basic understanding of HTML5 Canvas is required.

Important Notes:
Only static vector shapes are supported so far, which means:
1. Any shape filled by bitmapped image is not supported yet.(You’ll get an empty image)
2. Morphing shapes are not supported yet.

Features:
1. Generate the canvas drawing objects directly from the .swf file.
2. Preview the generated object drawing in Webkit.
3. WYSWYG authoring.
4. Export/Import the objects to/from .js

Generated object sample:

F2CCast = {
F2CActor3 : {
width : 95,
height : 95,
shapeOriginX : 0,
shapeOriginY : 0,
draw : function (ctx, anchorX, anchorY) {

if (!anchorX) anchorX = 0;
if (!anchorY) anchorY = 0;
with(ctx) { /* ---- Canvas Drawing Start ---- */
save();
translate(this.shapeOriginX - anchorX, this.shapeOriginY - anchorY);
beginPath();
moveTo(0.000, 0.000);
quadraticCurveTo(47.750, 0.000, 95.500, 0.000);
quadraticCurveTo(95.500, 47.750, 95.500, 95.500);
quadraticCurveTo(47.750, 95.500, 0.000, 95.500);
quadraticCurveTo(0.000, 47.750, 0.000, 0.000);
fillStyle = "rgb(0, 0, 255)";
fill();
restore();
} /* ---- Canvas Drawing End ---- */

return this;
}
} /* End of F2CActor3 */
} /* End Of F2CCast */

Simple Usage:

F2CCast['F2CActor3'].draw(context);

Easy to be used in a scene graph engine to create the animations or games fully powered by HTML5 Canvas.

Support:
http://rintarou.dyndns.org/f2c/

Tutorial:
http://rintarou.dyndns.org/download/f2c/F2CTutorial.html