AI game creator

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

No:45922

←

Prev Next

→

A snake game
Developer User19755｜Date and time 24/2/22 3:49:24
Build time 10.007 sec｜Game capacity 2.772KB｜

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 Cobra</title>
    <style>
        canvas {
            border: 1px solid black;
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
<canvas id="gameCanvas" width="400" height="400"></canvas>
<script>
    const canvas = document.getElementById('gameCanvas');
    const ctx = canvas.getContext('2d');

const blockSize = 10;
    const canvasSize = canvas.width / blockSize;
    
    let snake = [{x: 10, y: 10}];
    let food = {x: 15, y: 15};
    let direction = 'right';

function drawBlock(position, color) {
        ctx.fillStyle = color;
        ctx.fillRect(position.x * blockSize, position.y * blockSize, blockSize, blockSize);
    }

function update() {
        let newHead = {x: snake[0].x, y: snake[0].y};
        
        switch(direction) {
            case 'up':
                newHead.y--;
                break;
            case 'down':
                newHead.y++;
                break;
            case 'left':
                newHead.x--;
                break;
            case 'right':
                newHead.x++;
                break;
        }

if (newHead.x < 0 || newHead.x >= canvasSize || newHead.y < 0 || newHead.y >= canvasSize) {
            alert('Game Over!');
            snake = [{x: 10, y: 10}];
            direction = 'right';
            return;
        }

if (snake.some(part => part.x === newHead.x && part.y === newHead.y)) {
            alert('Game Over!');
            snake = [{x: 10, y: 10}];
            direction = 'right';
            return;
        }

snake.unshift(newHead);

if (newHead.x === food.x && newHead.y === food.y) {
            generateFood();
        } else {
            snake.pop();
        }
    }

function generateFood() {
        food.x = Math.floor(Math.random() * canvasSize);
        food.y = Math.floor(Math.random() * canvasSize);
    }

function draw() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        
        drawBlock(food, 'red');

snake.forEach((part, index) => {
            drawBlock(part, index === 0 ? 'green' : 'black');
        });
    }

function gameLoop() {
        update();
        draw();
    }

window.addEventListener('keydown', event => {
        switch(event.key) {
            case 'ArrowUp':
                direction = 'up';
                break;
            case 'ArrowDown':
                direction = 'down';
                break;
            case 'ArrowLeft':
                direction = 'left';
                break;
            case 'ArrowRight':
                direction = 'right';
                break;
        }
    });

setInterval(gameLoop, 100);

</script>
</body>
</html>