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

No:38512

←

Prev Next

→

Pac-Man
Developer User17405｜Date and time 24/1/25 0:02:03
Build time 19.173 sec｜Game capacity 4.601KB｜

Script

Pac-Man

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html lang="de">

<head>
    <meta charset="UTF-8">
    <title>Pac-Man</title>
    <style>
        canvas {
            background-color: black;
            display: block;
            margin: 20px auto;
        }
    </style>
</head>

// Pictograms for Pac-Man and Ghosts
            const pacManImg = new Image();
            pacManImg.src = "https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/240/apple/232/pacman_1f47b.png";

const ghostImg = new Image();
            ghostImg.src = "https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/240/apple/232/ghost_1f47b.png";

// Game variables
            const blockSize = 20; // Size of each block in the game grid
            const width = canvas.width / blockSize; // Number of blocks horizontally
            const height = canvas.height / blockSize; // Number of blocks vertically

const pacMan = {
                x: 3, // Initial x-coordinate for Pac-Man
                y: 2, // Initial y-coordinate for Pac-Man
                speed: 1 // Speed of Pac-Man
            };

const ghosts = [
                { x: 9, y: 6, speed: 1 }, // Ghost 1
                { x: 12, y: 6, speed: 1 } // Ghost 2
            ];

function drawBlock(x, y, color) {
                context.fillStyle = color;
                context.fillRect(x * blockSize, y * blockSize, blockSize, blockSize);
            }

function drawPacMan() {
                context.drawImage(pacManImg, pacMan.x * blockSize, pacMan.y * blockSize, blockSize, blockSize);
            }

function drawGhost(ghost) {
                context.drawImage(ghostImg, ghost.x * blockSize, ghost.y * blockSize, blockSize, blockSize);
            }

function draw() {
                // Clear canvas
                context.clearRect(0, 0, canvas.width, canvas.height);

// Draw Pac-Man
                drawPacMan();

// Draw Ghosts
                ghosts.forEach(ghost => drawGhost(ghost));

// Prompt to move Pac-Man
                const moveDirection = prompt("Welche Richtung möchtest du Pac-Man bewegen? (W/A/S/D)");

// Update Pac-Man's position based on input
                switch (moveDirection.toUpperCase()) {
                    case "W":
                        pacMan.y -= pacMan.speed;
                        break;
                    case "A":
                        pacMan.x -= pacMan.speed;
                        break;
                    case "S":
                        pacMan.y += pacMan.speed;
                        break;
                    case "D":
                        pacMan.x += pacMan.speed;
                        break;
                    default:
                        break;
                }

// Move Ghosts randomly
                ghosts.forEach(ghost => {
                    const randomDirection = Math.floor(Math.random() * 4);

switch (randomDirection) {
                        case 0:
                            ghost.y -= ghost.speed;
                            break;
                        case 1:
                            ghost.x -= ghost.speed;
                            break;
                        case 2:
                            ghost.y += ghost.speed;
                            break;
                        case 3:
                            ghost.x += ghost.speed;
                            break;
                        default:
                            break;
                    }
                });

// Check if Pac-Man collided with Ghosts
                ghosts.forEach(ghost => {
                    if (pacMan.x === ghost.x && pacMan.y === ghost.y) {
                        alert("Game Over!");
                    }
                });

// Draw game grid
                for (let x = 0; x < width; x++) {
                    for (let y = 0; y < height; y++) {
                        drawBlock(x, y, "blue");
                    }
                }

// Request animation frame
                requestAnimationFrame(draw);
            }

draw();
        });
    </script>
</body>

</html>