The Essential Guide to HTML5

CHAPTER 4

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;