Google snake but its 2 player mode with ai bot's game

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

No:37490

←

Prev Next

→

Google snake but its 2 player mode with ai bot
Developer User17064｜Date and time 24/1/21 4:28:18
Build time 24.734 sec｜Game capacity 7.733KB｜

Script

Sure, here is an implementation of a 2-player mode snake game with an AI bot using JavaScript, enclosed in script tags within a single HTML file:

This game implements a simple snake game where you control one snake and compete against an AI-controlled snake. The player snake is controlled using the arrow keys, while the AI bot follows an AI logic to navigate and compete with the player. The game uses pictograms for representing the snakes and food items. You can copy and save the above code in a single HTML file and open it in a web browser to play the game.

←

Prev　Next

→ 　

Back　

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

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

Sure, here is an implementation of a 2-player mode snake game with an AI bot using JavaScript, enclosed in script tags within a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Snake Game</title>
    <style>
        #game-board {
            position: relative;
            width: 400px;
            height: 400px;
            border: 1px solid black;
        }
        .cell {
            width: 20px;
            height: 20px;
            position: absolute;
        }
        .snake-body {
            background-color: green;
        }
        .food {
            background-color: red;
        }
        .bot-snake-body {
            background-color: blue;
        }
    </style>
</head>
<body>
    <div id="game-board"></div>

// Pictograms for snake and food
        const snakeIcon = "🐍";
        const foodIcon = "🍎";
        const botSnakeIcon = "🤖";

// Game variables
        let gameBoard;
        let playerSnake = [{ x: 10, y: 10 }];
        let botSnake = [{ x: 8, y: 8 }];
        let food = { x: 5, y: 5 };
        let direction = { x: 0, y: 0 };
        let botDirection = { x: 0, y: 0 };

function initializeGame() {
            // Create game board
            gameBoard = document.getElementById("game-board");
            gameBoard.style.gridTemplateColumns = `repeat(${width}, 1fr)`;
            gameBoard.style.gridTemplateRows = `repeat(${height}, 1fr)`;

// Add snake and food to the board
            renderSnake(playerSnake, "snake-body");
            renderCell(food.x, food.y, "food");

// Start the game
            document.addEventListener("keydown", handleKeyPress);
            setInterval(updateGame, 100);
        }

function updateGame() {
            // Update snake position
            const newPlayerHead = { x: playerSnake[0].x + direction.x, y: playerSnake[0].y + direction.y };
            playerSnake.unshift(newPlayerHead);

// Check if snake ate the food
            if (newPlayerHead.x === food.x && newPlayerHead.y === food.y) {
                // Generate new food
                generateNewFood();

// Render new food on the board
                renderCell(food.x, food.y, "food");
            }
            else {
                // Remove the tail if didn't eat the food
                playerSnake.pop();
            }

// Render updated player snake on the board
            renderSnake(playerSnake, "snake-body");

// Check if player snake collided with walls or itself
            if (checkCollision(newPlayerHead) || checkSelfCollision()) {
                // Game over
                alert("Game Over!");
                resetGame();
                return;
            }

// Simulate bot movement
            simulateBotMovement();

// Render updated bot snake on the board
            renderSnake(botSnake, "bot-snake-body");

// Check if bot snake collided with walls or itself
            if (checkCollision(botSnake[0]) || checkBotCollision(newPlayerHead)) {
                // Game over
                alert("Game Over!");
                resetGame();
                return;
            }
        }

function generateNewFood() {
            const newX = Math.floor(Math.random() * width);
            const newY = Math.floor(Math.random() * height);

// Check if new food position overlaps with the snake
            if (
                playerSnake.some(segment => segment.x === newX && segment.y === newY) ||
                botSnake.some(segment => segment.x === newX && segment.y === newY)
            ) {
                return generateNewFood(); // Recursively generate new position
            }

food = { x: newX, y: newY };
        }

function simulateBotMovement() {
            const botHead = botSnake[0];
            const playerHead = playerSnake[0];

// AI Bot Logic
            if (botHead.x < playerHead.x && botDirection.x !== -1) {
                botDirection = { x: 1, y: 0 };
            }
            else if (botHead.x > playerHead.x && botDirection.x !== 1) {
                botDirection = { x: -1, y: 0 };
            }
            else if (botHead.y < playerHead.y && botDirection.y !== -1) {
                botDirection = { x: 0, y: 1 };
            }
            else if (botHead.y > playerHead.y && botDirection.y !== 1) {
                botDirection = { x: 0, y: -1 };
            }

const newBotHead = {
                x: botHead.x + botDirection.x,
                y: botHead.y + botDirection.y
            };

botSnake.unshift(newBotHead);
            botSnake.pop();
        }

function renderSnake(snake, className) {
            // Clear the board
            gameBoard.innerHTML = "";

// Render each segment of the snake on the board
            snake.forEach(segment => {
                renderCell(segment.x, segment.y, className);
            });
        }

function renderCell(x, y, className) {
            const cell = document.createElement("div");
            cell.classList.add("cell");
            cell.classList.add(className);
            cell.innerText = className === "food" ? foodIcon : (className === "bot-snake-body" ? botSnakeIcon : snakeIcon);
            cell.style.gridColumn = x + 1;
            cell.style.gridRow = y + 1;
            gameBoard.appendChild(cell);
        }

function checkCollision(position) {
            return (
                position.x >= width ||
                position.y >= height ||
                position.x < 0 ||
                position.y < 0
            );
        }

function checkSelfCollision() {
            return playerSnake.slice(1).some(segment => segment.x === playerSnake[0].x && segment.y === playerSnake[0].y);
        }

function checkBotCollision(playerHead) {
            return botSnake.slice(1).some(segment => segment.x === playerHead.x && segment.y === playerHead.y);
        }

// Start the game
        initializeGame();
    </script>
</body>
</html>
```