Pac-Man's game | AI game creator

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

No:24062

62

Pac-Man
Developer User11201｜Date and time 23/11/5 16:41:26
Build time 82.85 sec｜Game capacity 5.608KB｜

Sure! Here's a simple implementation of the classic game Pac-Man using JavaScript. You can copy and paste the entire code into a single HTML file and open it in a web browser (preferably on a smartphone) to play the game:

You can control Pac-Man's movement using the arrow keys on your smartphone. The objective is to eat all the yellow pac-dots while avoiding the ghosts. Have fun playing Pac-Man!

→ 　

0　

0　

　
　
　
　

[PR]現在のフィギュア売れ筋ランキング

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

(C)2023 HisashiApp

Sure! Here's a simple implementation of the classic game Pac-Man using JavaScript. You can copy and paste the entire code into a single HTML file and open it in a web browser (preferably on a smartphone) to play the game:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Pac-Man</title>
    <style>
        #game-container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: black;
        }
    </style>
</head>
<body>
    <div id="game-container"></div>

<script>
        const gameContainer = document.getElementById("game-container");
        const gridSize = 20;
        const pacDot = "🟡";
        const pacMan = "🙂";
        const ghost = "👻";
        const wall = "⬛";
        const empty = "⬜";
        
        const grid = [
            [wall, wall, wall, wall, wall, wall, wall, wall, wall, wall],
            [wall, pacDot, pacDot, pacDot, pacDot, pacDot, pacDot, pacDot, pacDot, wall],
            [wall, pacDot, wall, wall, wall, wall, wall, pacDot, pacDot, wall],
            [wall, pacDot, wall, pacDot, pacDot, pacDot, wall, pacDot, pacDot, wall],
            [wall, pacDot, wall, pacDot, wall, pacDot, wall, pacDot, pacDot, wall],
            [wall, pacDot, wall, pacDot, wall, pacDot, wall, wall, pacDot, wall],
            [wall, pacDot, wall, pacDot, pacDot, pacDot, pacDot, pacDot, pacDot, wall],
            [wall, pacDot, wall, wall, wall, wall, wall, wall, pacDot, wall],
            [wall, pacDot, pacDot, pacDot, pacDot, pacDot, pacDot, pacDot, pacDot, wall],
            [wall, wall, wall, wall, wall, wall, wall, wall, wall, wall],
        ];
        
        let score = 0;
        let interval;
        
        function createGrid() {
            for (let i = 0; i < grid.length; i++) {
                for (let j = 0; j < grid[i].length; j++) {
                    const cell = document.createElement("div");
                    cell.innerHTML = grid[i][j];
                    cell.style.fontSize = "30px";
                    cell.style.textAlign = "center";
                    cell.style.lineHeight = gridSize + "px";
                    cell.style.width = gridSize + "px";
                    cell.style.height = gridSize + "px";
                    cell.style.display = "inline-block";
                    gameContainer.appendChild(cell);
                }
                const lineBreak = document.createElement("br");
                gameContainer.appendChild(lineBreak);
            }
        }
        
        function updatePacManPosition(x, y) {
            grid[x][y] = pacMan;
            gameContainer.children[x * (grid[0].length + 1) + y].innerHTML = pacMan;
        }
        
        function movePacMan(e) {
            const currentX = Math.floor(score / grid[0].length);
            const currentY = score % grid[0].length;
            let newX = currentX;
            let newY = currentY;
            
            switch (e.keyCode) {
                case 37: // Left arrow key
                    newY--;
                    break;
                case 38: // Up arrow key
                    newX--;
                    break;
                case 39: // Right arrow key
                    newY++;
                    break;
                case 40: // Down arrow key
                    newX++;
                    break;
            }
            
            if (newX >= 0 && newX < grid.length && newY >= 0 && newY < grid[0].length && grid[newX][newY] !== wall) {
                grid[currentX][currentY] = empty;
                gameContainer.children[currentX * (grid[0].length + 1) + currentY].innerHTML = empty;
                updatePacManPosition(newX, newY);
                score = newX * grid[0].length + newY;
                checkCollision();
            }
        }
        
        function checkCollision() {
            if (grid[Math.floor(score / grid[0].length)][score % grid[0].length] === pacDot) {
                grid[Math.floor(score / grid[0].length)][score % grid[0].length] = empty;
                gameContainer.children[score].innerHTML = empty;
                score++;
            }
        }
        
        function moveGhost() {
            const ghostIndex = Math.floor(Math.random() * (grid.length * grid[0].length));
    
            if (grid[Math.floor(ghostIndex / grid[0].length)][ghostIndex % grid[0].length] !== wall) {
                for (let i = 0; i < grid.length; i++) {
                    for (let j = 0; j < grid[i].length; j++) {
                        if (grid[i][j] === ghost) {
                            grid[i][j] = empty;
                            gameContainer.children[i * (grid[0].length + 1) + j].innerHTML = empty;
                        }
                    }
                }
                
                const ghostX = Math.floor(ghostIndex / grid[0].length);
                const ghostY = ghostIndex % grid[0].length;
                
                grid[ghostX][ghostY] = ghost;
                gameContainer.children[ghostIndex].innerHTML = ghost;
            }
        }
        
        function startGame() {
            createGrid();
            updatePacManPosition(1, 1);
            interval = setInterval(moveGhost, 1000);
        }
        
        document.addEventListener("keydown", movePacMan);
        startGame();
    </script>
</body>
</html>
```

You can control Pac-Man's movement using the arrow keys on your smartphone. The objective is to eat all the yellow pac-dots while avoiding the ghosts. Have fun playing Pac-Man!