AI game creator

Click here for free DL of the app version that can save data.

No:51930

121

←

Prev Next

→

Shooting Game
Developer Kason Lucas｜Date and time 24/3/17 1:29:10
Build time 8.446 sec｜Game capacity 2.336KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
<style>
    canvas {
      border: 1px solid black;
    }
</style>
</head>
<body>
<canvas id="gameCanvas" width="400" height="400"></canvas>

const player = {
    x: canvas.width / 2,
    y: canvas.height - 30,
    width: 20,
    height: 20,
    speed: 5
};

const bullet = {
    x: player.x,
    y: player.y,
    width: 5,
    height: 10,
    speed: 5,
    visible: false
};

const enemy = {
    x: Math.random() * canvas.width,
    y: 0,
    width: 20,
    height: 20,
    speed: 2
};

const checkCollision = () => {
    if (bullet.visible &&
        bullet.x < enemy.x + enemy.width &&
        bullet.x + bullet.width > enemy.x &&
        bullet.y < enemy.y + enemy.height &&
        bullet.y + bullet.height > enemy.y) {
        enemy.x = Math.random() * canvas.width;
        enemy.y = 0;
        bullet.visible = false;
    }

if (enemy.y + enemy.height > canvas.height) {
        alert("Game Over! Your Score: " + score);
        window.location.reload();
    }
};

let score = 0;
const drawScore = () => {
    ctx.font = "20px Arial";
    ctx.fillStyle = "#000";
    ctx.fillText("Score: " + score, 10, 20);
};

const drawGame = () => {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

ctx.fillStyle = "#000";
    ctx.fillRect(player.x, player.y, player.width, player.height);

if (bullet.visible) {
        ctx.fillRect(bullet.x, bullet.y, bullet.width, bullet.height);
        bullet.y -= bullet.speed;
        if (bullet.y < 0) {
            bullet.visible = false;
        }
    }

ctx.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
    enemy.y += enemy.speed;

checkCollision();
    drawScore();
};

document.addEventListener("keydown", handlePlayerMove);

setInterval(drawGame, 10);
</script>
</body>
</html>