BOUNCING BALL
Code Explanation
moveandcheck(); Do the check and the move the ball
ctx.beginPath(); Start path
ctx.arc(ballx, bally,
ballrad,0,Math.PI*2,true);
Set up to draw of circle at current location of ballctx.fill(); Fill in the path; that is, draw a filled circle
ctx.strokeRect(boxx,boxy,
boxwidth,boxheight);
Draw rectangle outline} Close moveball
function moveandcheck() { Start of moveandcheck
var nballx = ballx + ballvx; Set tentative next x position
var nbally = bally +ballvy; Set tentative next y position
if (nballx > boxboundx) { Is this x value beyond the right wall?
ballvx =-ballvx; If so, change vertical displacement
nballx = boxboundx; Set the next x to be exactly at this boundary.
} Close clause
if (nballx < inboxboundx) { Is this x value less than the right boundary?
nballx = inboxboundx If so, set the x value to be exactly at the boundary
ballvx = -ballvx; Change the vertical displacement
} Close clause
if (nbally > boxboundy) { Is the y value beyond the bottom boundary?
nbally = boxboundy; If so, set the y value to be exactly at the boundary
ballvy =-ballvy; Change the horizontal displacement