maze with person that you control enemy with closets you hide in's game

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

No:31737

←

Prev Next

→

maze with person that you control enemy with close..ALL
Developer User15107｜Date and time 23/12/28 8:21:07
Build time 39.054 sec｜Game capacity 6.331KB｜

Script

Sure! Here's an example of an HTML file that implements a simple maze game where you control a person trying to avoid enemies and hide in closets. It uses pictograms for visual representation:

To play the game, you can copy the above code into a text editor and save it as an HTML file, for example, `maze_game.html`. Then, you can open the HTML file in a web browser, and the game will start. Use the arrow keys on your smartphone to control the person and try to reach the closet without getting caught by the enemy.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of an HTML file that implements a simple maze game where you control a person trying to avoid enemies and hide in closets. It uses pictograms for visual representation:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Maze Game</title>
    <style>
        body {
            font-family: Arial, sans-serif;
        }
        .container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }
        .maze {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            grid-template-rows: repeat(5, 1fr);
            gap: 10px;
        }
        .cell {
            background-color: #ddd;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 40px;
        }
        .person {
            background-color: #ffcc00;
            color: #fff;
        }
        .enemy {
            background-color: #ff0000;
            color: #fff;
        }
        .closet {
            background-color: #0066ff;
            color: #fff;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="maze"></div>
    </div>

// Game state variables
        let playerPosition = { x: 1, y: 1 };
        let enemyPosition = { x: 3, y: 4 };

// Helper function to render the maze
        function renderMaze() {
            const mazeEl = document.querySelector('.maze');
            mazeEl.innerHTML = '';

for (let row = 0; row < mazeSize; row++) {
                for (let col = 0; col < mazeSize; col++) {
                    const cellEl = document.createElement('div');
                    cellEl.classList.add('cell');

switch (mazeData[row][col]) {
                        case "#":
                            cellEl.textContent = "█";
                            break;
                        case ".":
                            cellEl.textContent = "";
                            break;
                        case "P":
                            cellEl.textContent = "👤";
                            cellEl.classList.add('person');
                            break;
                        case "E":
                            cellEl.textContent = "👾";
                            cellEl.classList.add('enemy');
                            break;
                        case "C":
                            cellEl.textContent = "🚪";
                            cellEl.classList.add('closet');
                            break;
                    }

mazeEl.appendChild(cellEl);
                }
            }
        }

// Helper functions to handle player movement
        function moveUp() {
            if (playerPosition.y > 0 && mazeData[playerPosition.y - 1][playerPosition.x] !== "#") {
                mazeData[playerPosition.y][playerPosition.x] = ".";
                playerPosition.y--;
                mazeData[playerPosition.y][playerPosition.x] = "P";
                renderMaze();
                checkGameState();
            }
        }

function moveDown() {
            if (playerPosition.y < mazeSize - 1 && mazeData[playerPosition.y + 1][playerPosition.x] !== "#") {
                mazeData[playerPosition.y][playerPosition.x] = ".";
                playerPosition.y++;
                mazeData[playerPosition.y][playerPosition.x] = "P";
                renderMaze();
                checkGameState();
            }
        }

function moveLeft() {
            if (playerPosition.x > 0 && mazeData[playerPosition.y][playerPosition.x - 1] !== "#") {
                mazeData[playerPosition.y][playerPosition.x] = ".";
                playerPosition.x--;
                mazeData[playerPosition.y][playerPosition.x] = "P";
                renderMaze();
                checkGameState();
            }
        }

function moveRight() {
            if (playerPosition.x < mazeSize - 1 && mazeData[playerPosition.y][playerPosition.x + 1] !== "#") {
                mazeData[playerPosition.y][playerPosition.x] = ".";
                playerPosition.x++;
                mazeData[playerPosition.y][playerPosition.x] = "P";
                renderMaze();
                checkGameState();
            }
        }

// Handle player movements based on key press
        document.addEventListener('keydown', (event) => {
            event.preventDefault();
            switch (event.key) {
                case 'ArrowUp':
                    moveUp();
                    break;
                case 'ArrowDown':
                    moveDown();
                    break;
                case 'ArrowLeft':
                    moveLeft();
                    break;
                case 'ArrowRight':
                    moveRight();
                    break;
            }
        });

// Check the game state
        function checkGameState() {
            if (playerPosition.x === enemyPosition.x && playerPosition.y === enemyPosition.y) {
                alert("Game Over! You got caught by the enemy.");
                resetGame();
            } else if (mazeData[playerPosition.y][playerPosition.x] === "C") {
                alert("Congratulations! You reached the closet and escaped.");
                resetGame();
            }
        }

// Reset the game state
        function resetGame() {
            playerPosition = { x: 1, y: 1 };
            renderMaze();
        }

// Initialize the game
        renderMaze();
    </script>
</body>
</html>
```