Jogo da cobrinha com mods diferentes's game | AI game creator

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

No:52065

237

Jogo da cobrinha com mods diferentes
Developer User19080｜Date and time 24/3/17 13:55:27
Build time 6.569 sec｜Game capacity 2.31KB｜

→ 　

0　

0　

　

　
　
　

[PR]現在のゲームギフトランキング

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

(C)2023 HisashiApp

<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<title>Jogo da Cobrinha</title>
<style>
    canvas {
        border: 1px solid black;
        display: block;
        margin: 0 auto;
    }
</style>
</head>
<body>
<canvas id="snakeCanvas" width="400" height="400"></canvas>

<script type="text/javascript">
    const canvas = document.getElementById('snakeCanvas');
    const ctx = canvas.getContext('2d');
    
    const box = 20;
    
    let snake = [
        {x: 10 * box, y: 10 * box},
        {x: 10 * box, y: 9 * box},
        {x: 10 * box, y: 8 * box}
    ];
    
    let direction = 'DOWN';
    
    function drawSnake() {
        ctx.fillStyle = 'green';
        snake.forEach(segment => {
            ctx.fillRect(segment.x, segment.y, box, box);
        });
    }
    
    function updateSnake() {
        const head = {x: snake[0].x, y: snake[0].y};
        
        if(direction === 'UP') head.y -= box;
        if(direction === 'DOWN') head.y += box;
        if(direction === 'LEFT') head.x -= box;
        if(direction === 'RIGHT') head.x += box;
        
        snake.unshift(head);
        
        if(snake[0].x !== food.x || snake[0].y !== food.y) {
            snake.pop();
        } else {
            generateFood();
        }
    }
    
    function drawFood() {
        ctx.fillStyle = 'red';
        ctx.fillRect(food.x, food.y, box, box);
    }
    
    function generateFood() {
        const randomX = Math.floor(Math.random() * 20) * box;
        const randomY = Math.floor(Math.random() * 20) * box;
        
        food = {x: randomX, y: randomY};
    }
    
    function updateGame() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        
        updateSnake();
        drawSnake();
        drawFood();
        
        setTimeout(updateGame, 100);
    }
    
    document.addEventListener('keydown', event => {
        const key = event.key.replace('Arrow', '');
        
        if(key === 'UP' && direction !== 'DOWN') direction = 'UP';
        else if(key === 'DOWN' && direction !== 'UP') direction = 'DOWN';
        else if(key === 'LEFT' && direction !== 'RIGHT') direction = 'LEFT';
        else if(key === 'RIGHT' && direction !== 'LEFT') direction = 'RIGHT';
    });
    
    generateFood();
    updateGame();
</script>
</body>
</html>