Question: I have the following javascript code and html file. I need help figuring out how to run it. Is there a way I need to
I have the following javascript code and html file. I need help figuring out how to run it. Is there a way I need to save it in order to be able to run it in a browser? It should open in a browser as a pong-like game.
var canv = document.getElementById("myCanvas2D"); var context = canv.getContext("2d"); var radiusOfBall = 10;
//This is actually used to move
var a = canv.width / 2; var b = canv.height - 30; var da = 2; var db = -2; var paddleHeight = 10; var paddleWidth = 75; var paddleA = (canv.width - paddleWidth) / 2; var pressedRight = false; var pressedLeft = false; var bricksRowCount = 3; var bricksColumnCount = 5; var bricksWidth = 75; var bricksHeight = 20; var bricksPadding = 10; var bricksOffsetTop = 30; var bricksOffsetLeft = 30; document.addEventListener("keydown", keyDownHandler, false); document.addEventListener("keyup", keyUpHandler, false);
var bricks = []; for (c = 0; c
function keyDownHandler(e) { if (e.keyCode == 39) {
pressedRight = true;
} else if (e.keyCode == 37) {
pressedLeft = true;
}
}
function keyUpHandler(e) {
if (e.keyCode == 39) {
pressedRight = false; } else if (e.keyCode == 37) {
pressedLeft = false;
} }
function drawBall() { context.beginPath(); context.arc(a, b, radiusOfBall, 0, 2 * Math.PI); context.fillstyle = "#0033FF"; context.fillStroke = "#0033FF"; context.Stroke = "10" context.fill(); context.closePath(); }
function drawPaddle() { context.beginPath(); context.rect(paddleA, canv.height - paddleHeight, paddleWidth, paddleHeight); context.fillstyle = "#0095DD"; context.fill(); context.closePath(); } function drawBricks() { for (c = 0; c
function collisionDetection() { for (c = 0; c l.a && a l.b && b
function draw() { context.clearRect(0, 0, canv.width, canv.height); drawBricks(); drawBall(); drawPaddle(); collisionDetection(); if (a + da > canv.width - radiusOfBall || a + da canv.height - radiusOfBall) { if (a > paddleA && a
paddleA += 7; } else if (pressedLeft && paddleA > 0) { paddleA -= 7;
}
a = a + da; b = b + db; }
setInterval(draw, 10);

title Paddle Ball Hitting Ball titles
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
