Doodle.js v0.1 web examples

gistfile1.js

var cx = oo.canvas().width/2;
var cy = oo.canvas().height/2;
var img_w = 271;
var img_h = 365;
var img = oo.image({src:'./img/face_271x365.png',
                    x:cx - img_w/2,
                    y:cy - img_h/2,
                    axis:{x:img_w/2,
                          y:img_h/2,
                          coord:'local',
                          visible:true }
                   }).loop({rotate:2}, 0, '24fps');

gistfile2.js

//shape is a function called at draw time
var heart_shape = function() {
    oo.gfx.fillStyle = random_color();
    oo.gfx.beginPath();
    oo.gfx.moveTo(75,40);
    oo.gfx.bezierCurveTo(75,37,70,25,50,25);
    oo.gfx.bezierCurveTo(20,25,20,62.5,20,62.5);
    oo.gfx.bezierCurveTo(20,80,40,102,75,120);
    oo.gfx.bezierCurveTo(110,102,130,80,130,62.5);
    oo.gfx.bezierCurveTo(130,62.5,130,25,100,25);
    oo.gfx.bezierCurveTo(85,25,75,37,75,40);
    oo.gfx.fill();
};
var heart = oo.sprite({x:i*75,
                       y:j*65,
                       shape:heart_shape,
                       scale:0.5});

gistfile3.js

var mouse_x, mouse_y;

$('#my_canvas').mousemove(function(e) {
    //store mouse positions from jquery event
    mouse_x = e.pageX - this.offsetLeft;
    mouse_y = e.pageY - this.offsetTop;
});

oo.animate(function() {
    //and use
    angle_x = (mouse_y - vp_y) * .001;
    angle_y = (mouse_x - vp_x) * .001;
    //...
    for(i = 0; i < length; ++i) {
        balls[i].draw();
    }
}, '24fps');