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

Code Explanation

function init(){

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

drawall();

}

function fire() {

var angle = Number(document.f
.ang.value);

Extract angle from form, convert to number

var outofcannon = Number
(document.f.vo.value);

Extract velocity out of cannon from form,
convert to number

var angleradians = angle*Math
.PI/180;

Convert to radians

horvelocity = outofcannon*Math
.cos(angleradians);

Compute horizontal velocity

verticalvel1 = - outofcannon*Math
.sin(angleradians);

Compute initial vertical velocity

everything[cannonindex][2]=
- angleradians;

Set information to rotate cannon

cball.sx = cannonx +
cannonlength*Math.cos(angleradians);

Set x for cball at mouth of what will be rotated
cannon

cball.sy = cannony+cannonht*.5
- cannonlength*Math.sin(angleradians);

Set y for cball at mouth of what will be rotated
cannon

drawall();

tid = setInterval(change,100);

return false;