Jogo da cobrinha infinito's game

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

No:52936

514

←

Prev Next

→

Jogo da cobrinha infinito
Developer User19080｜Date and time 24/3/27 0:16:49
Build time 11.354 sec｜Game capacity 2.293KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Jogo da Cobrinha Infinito</title>
</head>
<body>
    <canvas id="snakeGame" width="400" height="400"></canvas>
    <script>
        // Definição de variáveis
        const canvas = document.getElementById("snakeGame");
        const ctx = canvas.getContext("2d");
        const box = 20;
        let snake = [{x: 10, y: 10}];
        let direction = "right";
        let food = {x: Math.floor(Math.random() * 20) * box, y: Math.floor(Math.random() * 20) * box};

// Função de desenhar a cobrinha
        function drawSnake() {
            ctx.fillStyle = "green";
            snake.forEach(segment => {
                ctx.fillRect(segment.x, segment.y, box, box);
            });
        }

// Função de desenhar a comida da cobrinha
        function drawFood() {
            ctx.fillStyle = "red";
            ctx.fillRect(food.x, food.y, box, box);
        }

// Função de movimento da cobrinha
        function moveSnake() {
            let head = {x: snake[0].x, y: snake[0].y};

if (direction === "right") head.x += box;
            if (direction === "left") head.x -= box;
            if (direction === "up") head.y -= box;
            if (direction === "down") head.y += box;

snake.unshift(head);

if (head.x === food.x && head.y === food.y) {
                food = {x: Math.floor(Math.random() * 20) * box, y: Math.floor(Math.random() * 20) * box};
            } else {
                snake.pop();
            }
        }

// Função principal do jogo
        function gameLoop() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

moveSnake();
            drawSnake();
            drawFood();

setTimeout(() => requestAnimationFrame(gameLoop), 100);
        }

document.addEventListener("keydown", event => {
            if (event.key === "ArrowUp" && direction !== "down") direction = "up";
            if (event.key === "ArrowDown" && direction !== "up") direction = "down";
            if (event.key === "ArrowLeft" && direction !== "right") direction = "left";
            if (event.key === "ArrowRight" && direction !== "left") direction = "right";
        });

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