Super Mario Bros but Goats Spawn Every Second's game

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

No:52546

150

←

Prev Next

→

Super Mario Bros but Goats Spawn Every Second
Developer User21958｜Date and time 24/3/22 18:46:37
Build time 20.148 sec｜Game capacity 2.319KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Goat Mario Bros</title>
</head>
<body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>
    
    <script>
        const canvas = document.getElementById('gameCanvas');
        const ctx = canvas.getContext('2d');
        
        let marioX = 50;
        let marioY = 50;
        let goatX = 500;
        let goatY = 500;
        
        function drawMario() {
            ctx.fillStyle = 'blue';
            ctx.fillRect(marioX, marioY, 50, 50);
        }
        
        function drawGoat() {
            ctx.fillStyle = 'gray';
            ctx.fillRect(goatX, goatY, 50, 50);
        }
        
        function moveMario(event) {
            switch(event.keyCode) {
                case 37:
                    if(marioX > 0) {
                        marioX -= 10;
                    }
                    break;
                case 39:
                    if(marioX < canvas.width - 50) {
                        marioX += 10;
                    }
                    break;
                case 38:
                    if(marioY > 0) {
                        marioY -= 10;
                    }
                    break;
                case 40:
                    if(marioY < canvas.height - 50) {
                        marioY += 10;
                    }
                    break;
            }
        }
        
        function gameLoop() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            drawMario();
            drawGoat();
            
            if(goatX > 0) {
                goatX -= 1;
            } else {
                goatX = canvas.width;
                goatY = Math.floor(Math.random() * canvas.height);
            }
            
            if(marioX < goatX + 50 && marioX + 50 > goatX && marioY < goatY + 50 && marioY + 50 > goatY) {
                alert('Game Over!');
                marioX = 50;
                marioY = 50;
            }
            
            requestAnimationFrame(gameLoop);
        }
        
        window.addEventListener('keydown', moveMario);
        gameLoop();
    </script>
</body>
</html>