Cannonball and Slingshot - The Essential Guide to HTML5 - page 135

Code Explanation

ctx.drawImage(this.img,this.sx,this.
sy,this.swidth,this.sheight);

}

var target = new Picture(700,210,209,
179,chicken);

Build new Picture object and assign it to
target

var ground = new myrectangle(0,370,
1200,30,"rgb(10,250,0)");

everything.push(target);

everything.push(ground); Put the ground on top of the chickens feet

everything.push(mysling);

everything.push(cball);

function init(){

ctx = document.getElementById
('canvas').getContext('2d');

canvas1 = document.getElementById
('canvas');

canvas1.addEventListener('mousedown',
findball,false);

Set up event handling for the mousedown event

canvas1.addEventListener('mousemove',
moveit,false);

Set up event handling for the mousemove event

Set up event handling for the mouseup event

canvas1.addEventListener('mouseup',
finish,false);

drawall();

}

function findball(ev) {

Function header for mousedown event

var mx;

Variable to hold mouse x