An made generation, and every time you collides with the exit,the level restarts and a new maze is generated Wall:⬛ Player:🙂 Enemy:😡 Exit:🚪's game

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

No:30822

←

Prev Next

→

An made generation, and every time you collides wi..ALL
Developer User14891｜Date and time 23/12/24 7:01:32
Build time 12.77 sec｜Game capacity 3.53KB｜

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 name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Maze Game</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            font-size: 30px;
            background-color: rgba(0, 0, 0, 0.9);
            color: #fff;
        }
    </style>
</head>

<body>
    <script>
        // Define the pictograms
        const wall = "⬛";
        const player = "🙂";
        const enemy = "😡";
        const exit = "🚪";

// Set up the maze parameters
        const mazeWidth = 10;
        const mazeHeight = 10;
        let maze = generateMaze(mazeWidth, mazeHeight);
        let playerX = 0;
        let playerY = 0;

// Initialize the maze and player position
        function generateMaze(width, height) {
            const maze = new Array(height);
            for (let i = 0; i < height; i++) {
                maze[i] = new Array(width).fill(" ");
            }
            maze[0][0] = player;
            maze[height - 1][width - 1] = exit;
            return maze;
        }

// Update the maze display
        function displayMaze() {
            const container = document.createElement("div");
            for (let row of maze) {
                const rowElement = document.createElement("div");
                rowElement.textContent = row.join("");
                container.appendChild(rowElement);
            }
            document.body.appendChild(container);
        }

// Move the player based on user input
        function movePlayer(event) {
            const key = event.key;
            let newX = playerX;
            let newY = playerY;

switch (key) {
                case "ArrowUp":
                    newY -= 1;
                    break;
                case "ArrowDown":
                    newY += 1;
                    break;
                case "ArrowLeft":
                    newX -= 1;
                    break;
                case "ArrowRight":
                    newX += 1;
                    break;
            }

if (isValidMove(newX, newY)) {
                // Clear the previous player position
                maze[playerY][playerX] = " ";
                // Set the new player position
                maze[newY][newX] = player;
                // Update the player position variables
                playerX = newX;
                playerY = newY;
                // Check if player reached the exit
                if (newX === mazeWidth - 1 && newY === mazeHeight - 1) {
                    alert("Congratulations! You completed the maze!");
                    resetGame();
                } else {
                    displayMaze();
                }
            }
        }

// Check if a move is valid (within bounds and not a wall)
        function isValidMove(x, y) {
            if (x >= 0 && x < mazeWidth && y >= 0 && y < mazeHeight) {
                return maze[y][x] !== wall;
            }
            return false;
        }

// Reset the game to generate a new maze
        function resetGame() {
            maze = generateMaze(mazeWidth, mazeHeight);
            playerX = 0;
            playerY = 0;
            displayMaze();
        }

// Start the game
        displayMaze();
        window.addEventListener("keydown", movePlayer);
    </script>
</body>

</html>