AI game creator

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

No:45348

←

Prev Next

→

0>Ghost jumpscare
Developer WinnerWiener1332｜Date and time 24/2/20 12:21:42
Build time 6.953 sec｜Game capacity 2.201KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Ghost Jumpscare Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

let playerX = 200;
        let playerY = 350;
        let ghostX = Math.random() * 400;
        let ghostY = -50;
        let playerWidth = 20;
        let playerHeight = 20;
        let ghostWidth = 50;
        let ghostHeight = 50;
        let score = 0;

function drawPlayer() {
            ctx.fillStyle = 'blue';
            ctx.fillRect(playerX, playerY, playerWidth, playerHeight);
        }

function drawGhost() {
            ctx.fillStyle = 'red';
            ctx.fillRect(ghostX, ghostY, ghostWidth, ghostHeight);
        }

function drawScore() {
            ctx.font = '20px Arial';
            ctx.fillStyle = 'black';
            ctx.fillText('Score: ' + score, 10, 30);
        }

function update() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

playerX = Math.min(Math.max(0, playerX), canvas.width - playerWidth);
            drawPlayer();

ghostY += 2;
            if (ghostY > canvas.height) {
                ghostX = Math.random() * 400;
                ghostY = -50;
            }
            drawGhost();

if (playerX < ghostX + ghostWidth &&
                playerX + playerWidth > ghostX &&
                playerY < ghostY + ghostHeight &&
                playerY + playerHeight > ghostY) {
                alert('Game Over! Your score was: ' + score);
                score = 0;
            }

if (ghostY >= canvas.height) {
                score++;
            }

drawScore();

requestAnimationFrame(update);
        }

window.addEventListener('keydown', function (e) {
            switch (e.key) {
                case 'ArrowLeft':
                    playerX -= 5;
                    break;
                case 'ArrowRight':
                    playerX += 5;
                    break;
            }
        });

update();
    </script>
</body>
</html>