AI game creator

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

No:27908

←

Prev Next

→

Pac-Man
Developer User10392｜Date and time 23/12/10 1:11:23
Build time 61.778 sec｜Game capacity 7.101KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>
<head>
<style>
    body {
        margin: 0;
        padding: 0;
    }

canvas {
        background-color: #000;
    }
</style>
</head>
<body>
<script>
    // Game constants
    const CELL_SIZE = 20; // The size of each cell in pixels
    const MAP_WIDTH = 22; // Number of cells in a row
    const MAP_HEIGHT = 22; // Number of cells in a column
    const CANVAS_WIDTH = MAP_WIDTH * CELL_SIZE; // Total width of the canvas in pixels
    const CANVAS_HEIGHT = MAP_HEIGHT * CELL_SIZE; // Total height of the canvas in pixels
    const PACMAN_RADIUS = 10; // Radius of Pac-Man in pixels
    const PACMAN_SPEED = 3; // Speed at which Pac-Man moves in pixels per frame
    const GHOST_RADIUS = 8; // Radius of the ghosts in pixels
    const GHOST_SPEED = 2; // Speed at which the ghosts move in pixels per frame
    const WALL_COLOR = "#0000ff"; // Color of the walls
    const PACMAN_COLOR = "#ffff00"; // Color of Pac-Man
    const GHOST_COLOR = "#ff0000"; // Color of the ghosts
    const COIN_COLOR = "#ffffff"; // Color of the coins

// Game variables
    let canvas, ctx;
    let pacmanX, pacmanY; // Pac-Man's current position
    let pacmanDir; // Pac-Man's current direction (0 = up, 1 = right, 2 = down, 3 = left)
    let ghostX, ghostY; // Ghost's current position
    let ghostDir; // Ghost's current direction (0 = up, 1 = right, 2 = down, 3 = left)
    let score; // Current score
    let map; // Game map representation
    let coins; // Number of remaining coins

// Initialize the game
    function init() {
        canvas = document.createElement("canvas");
        canvas.width = CANVAS_WIDTH;
        canvas.height = CANVAS_HEIGHT;
        ctx = canvas.getContext("2d");

document.body.appendChild(canvas);

document.addEventListener("keydown", handleKeyDown);

// Initialize game variables
        pacmanX = Math.floor(MAP_WIDTH / 2);
        pacmanY = Math.floor(MAP_HEIGHT / 2);
        pacmanDir = 1; // Start Pac-Man facing right
        ghostX = Math.floor(Math.random() * MAP_WIDTH);
        ghostY = Math.floor(Math.random() * MAP_HEIGHT);
        ghostDir = Math.floor(Math.random() * 4);
        score = 0;

// Initialize game map
        map = [];
        coins = 0;
        for (let i = 0; i < MAP_HEIGHT; i++) {
            map[i] = [];
            for (let j = 0; j < MAP_WIDTH; j++) {
                map[i][j] = Math.random() < 0.7 ? 0 : 1; // Randomly place coins and walls
                if (map[i][j] === 0) coins++; // Count the number of coins
            }
        }

// Start game loop
        setInterval(update, 16);
    }

// Update game state
    function update() {
        movePacman();
        moveGhost();
        draw();
    }

// Move Pac-Man based on input
    function movePacman() {
        let nextX = pacmanX;
        let nextY = pacmanY;
        switch (pacmanDir) {
            case 0:
                nextY--;
                break;
            case 1:
                nextX++;
                break;
            case 2:
                nextY++;
                break;
            case 3:
                nextX--;
                break;
        }

if (isValidMove(nextX, nextY)) {
            pacmanX = nextX;
            pacmanY = nextY;
        }

// Collect coins
        if (map[pacmanY][pacmanX] === 0) {
            map[pacmanY][pacmanX] = -1; // Mark the coin as collected
            coins--;
            score += 10;
        }

// Check for win condition
        if (coins === 0) {
            alert("Congratulations, you won!");
            resetGame();
        }
    }

// Move the ghost randomly
    function moveGhost() {
        let nextX = ghostX;
        let nextY = ghostY;

while (true) {
            ghostDir = Math.floor(Math.random() * 4); // Choose a random direction

switch (ghostDir) {
                case 0:
                    nextY--;
                    break;
                case 1:
                    nextX++;
                    break;
                case 2:
                    nextY++;
                    break;
                case 3:
                    nextX--;
                    break;
            }

if (isValidMove(nextX, nextY)) {
                ghostX = nextX;
                ghostY = nextY;
                return;
            }
        }
    }

// Check if a given move is valid (within map boundaries and not a wall)
    function isValidMove(x, y) {
        return (
            x >= 0 &&
            x < MAP_WIDTH &&
            y >= 0 &&
            y < MAP_HEIGHT &&
            map[y][x] !== 1
        );
    }

// Handle key press events
    function handleKeyDown(e) {
        switch (e.keyCode) {
            case 38:
                pacmanDir = 0; // Up
                break;
            case 39:
                pacmanDir = 1; // Right
                break;
            case 40:
                pacmanDir = 2; // Down
                break;
            case 37:
                pacmanDir = 3; // Left
                break;
        }
    }

// Draw the game state on the canvas
    function draw() {
        ctx.clearRect(0, 0, CANVAS_WIDTH, CANVAS_HEIGHT); // Clear the canvas

// Draw walls
        ctx.fillStyle = WALL_COLOR;
        for (let i = 0; i < MAP_HEIGHT; i++) {
            for (let j = 0; j < MAP_WIDTH; j++) {
                if (map[i][j] === 1) {
                    ctx.fillRect(j * CELL_SIZE, i * CELL_SIZE, CELL_SIZE, CELL_SIZE);
                }
            }
        }

// Draw coins
        ctx.fillStyle = COIN_COLOR;
        for (let i = 0; i < MAP_HEIGHT; i++) {
            for (let j = 0; j < MAP_WIDTH; j++) {
                if (map[i][j] === 0) {
                    ctx.beginPath();
                    ctx.arc(j * CELL_SIZE + CELL_SIZE / 2, i * CELL_SIZE + CELL_SIZE / 2, 2, 0, 2 * Math.PI);
                    ctx.fill();
                }
            }
        }

// Draw Pac-Man
        ctx.fillStyle = PACMAN_COLOR;
        ctx.beginPath();
        ctx.arc(
            pacmanX * CELL_SIZE + CELL_SIZE / 2,
            pacmanY * CELL_SIZE + CELL_SIZE / 2,
            PACMAN_RADIUS,
            (0.25 + pacmanDir * 0.5) * Math.PI,
            (1.75 + pacmanDir * 0.5) * Math.PI
        );
        ctx.lineTo(
            pacmanX * CELL_SIZE + CELL_SIZE / 2,
            pacmanY * CELL_SIZE + CELL_SIZE / 2
        );
        ctx.fill();
        ctx.closePath();

// Draw Ghost
        ctx.fillStyle = GHOST_COLOR;
        ctx.beginPath();
        ctx.arc(
            ghostX * CELL_SIZE + CELL_SIZE / 2,
            ghostY * CELL_SIZE + CELL_SIZE / 2,
            GHOST_RADIUS,
            0,
            2 * Math.PI
        );
        ctx.fill();
        ctx.closePath();

// Draw score
        ctx.fillStyle = "#ffffff";
        ctx.font = "16px Arial";
        ctx.fillText("Score: " + score, 10, 20);
    }

// Reset the game
    function resetGame() {
        init();
    }

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