Eat Apples
Bored with no work
by Luis Martin
HTML
Score: <label id="score"></label><br>
<canvas style="border:1px solid #d3d3d3;" id="g" width="200" height="200"></canvas>
<img hidden id="s" width="10" height="10" src="http://home.skku.edu/~mspl/bbs/images/admin1_face.gif" alt="The Scream">
<img hidden id="a" width="10" height="10" src="http://forum.macbidouille.com/style_images/skinmb/nav.gif
">
<br>
Click on the canvas and use the arrows to controll the character
Space bar to pause/unpause and start new game
JavaScript
isPaused = false;
isFinished = false;
points = 0;
lvy = 0;
v = 2;
ax = 0;
ay = 0;
appleEated = 0;
scoreboard = document.getElementById("score");
var canvas = document.getElementById("g");
var ctx = canvas.getContext("2d");
start();
function start() {
points = 0;
v = 2;
appleEated = 0;
sx = sy = (canvas.width / 2) - 5;
svx = v;
svy = 0;
ctx.fillRect(sx, sy, 10, 10);
putApple();
}
setInterval(update, 1000 / 30);
function update() {
if (isFinished) {
ctx.font = "30px Arial";
ctx.fillText("You lost", 50, 80);
ctx.font = "15px Arial";
ctx.fillText("Press space bar to start", 25, 100);
ctx.font = "20px Arial";
ctx.fillText("Points: " + Math.round(points*10), 60, 175);
} else {
if (isPaused) {
ctx.font = "30px Arial";
ctx.fillText("Paused", 50, 100);
} else {
points += 0.1;
ctx.clearRect(0, 0, canvas.width, canvas.height);
sx += svx;
sy += svy;
ctx.drawImage(document.getElementById("s"), sx, sy);
scoreboard.innerHTML= Math.round(points*10);
drawApple();
checkWalls();
checkEat();
}
}
}
document.onkeydown = checkKey;
function checkKey(e) {
e = e || window.event;
if (e.keyCode == '38') {
// up arrow
console.log("up");
svy = -v;
svx = 0;
} else if (e.keyCode == '40') {
// down arrow
console.log("down");
svy = v;
svx = 0;
} else if (e.keyCode == '37') {
// left arrow
console.log("left");
svy = 0;
svx = -v;
} else if (e.keyCode == '39') {
// right arrow
console.log("right");
svy = 0;
svx = v;
} else if (e.keyCode == "32") {
// space bar
if (isPaused) {
console.log("unpause");
svx = lvx;
svy = lvy;
isPaused = false;
} else {
if (isFinished) {
isFinished = false;
start();
} else {
console.log("pause");
lvx = svx;
lvy = svy;
svx = 0;
svy = 0;
isPaused =...