Shoot
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
">
JavaScript
isPaused = false;
isFinished = false;
points = 0;
lvy = 0;
v = 2;
function Cars(){
this.cx = Math.floor((Math.random() * 190) + 1);
this.cy = 30;
console.log(this.cx, this.cy);
}
cars = [];
pointPerSecond = 1;
scoreboard = document.getElementById("score");
var canvas = document.getElementById("g");
var ctx = canvas.getContext("2d");
start();
function start() {
points = 0;
v = 2;
appleEated = 0;
sx = (canvas.width / 2) - 5;
sy = 170;
svx = v;
svy = 0;
ctx.fillRect(sx, sy, 10, 10);
}
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);
} else {
if (isPaused) {
ctx.font = "30px Arial";
ctx.fillText("Paused", 50, 100);
} else {
points += pointPerSecond / 30;
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 );
if(Math.round(points)%2==0){
cars.push(new Cars());
}
checkWalls();
drawCars();
}
}
}
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
console.log("shot");
//isPaused = true;
}
}
function checkWalls() {
if (sx + 10 >= canvas.width || sx <= 0 || sy + 10 >= canvas.height || sy <= 0) {
console.log("hit");
svx = 0;
svy =...