Math, Physics, and Animation - HTML5 Canvas - page 206

<meta charset="UTF-8">
<title>CH5EX7: Balls With Simple Interactions</title>
<script src="modernizr-1.6.min.js"></script>
<script type="text/javascript">
window.addEventListener('load', eventWindowLoaded, false);
function eventWindowLoaded() {
canvasApp();
}
function canvasSupport () {
return Modernizr.canvas;
}
function canvasApp() {
if (!canvasSupport()) {
return;
}
function drawScreen () {
context.fillStyle = '#EEEEEE';
context.fillRect(0, 0, theCanvas.width, theCanvas.height);
//Box
context.strokeStyle = '#000000';
context.strokeRect(1, 1, theCanvas.width-2, theCanvas.height-2);
update();
testWalls();
collide();
render();
}
function update() {
for (var i = 0; i <balls.length; i++) {
ball = balls[i];
ball.nextx = (ball.x += ball.velocityx);
ball.nexty = (ball.y += ball.velocityy);
}
}
function testWalls() {
var ball;
var testBall;
for (var i = 0; i <balls.length; i++) {
ball = balls[i];
if (ball.nextx+ball.radius > theCanvas.width) {
ball.velocityx = ball.velocityx*−1;
ball.nextx = theCanvas.width - ball.radius;