AI game creator

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

No:42429

←

Prev Next

→

Pac-Man
Developer User18876｜Date and time 24/2/11 18:22:39
Build time 9.216 sec｜Game capacity 2.748KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Pac-Man</title>
    <style>
        canvas {
            border: 1px solid #000;
            background-color: #000;
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <canvas id="pacmanCanvas" width="400" height="400"></canvas>

// Define Pac-Man properties
        var pacmanRadius = 20;
        var pacmanPosition = { x: canvas.width / 2, y: canvas.height / 2 };
        var pacmanDirection = 0; // 0: right, 1: down, 2: left, 3: up

// Start the game processing
        window.onload = function () {
            setInterval(updateGame, 100); // Update game every 100 milliseconds
        };

// Function to update the game state
        function updateGame() {
            context.clearRect(0, 0, canvas.width, canvas.height);
            drawPacman();
            movePacman();
        }

// Function to draw Pac-Man on the canvas
        function drawPacman() {
            context.beginPath();
            context.arc(
                pacmanPosition.x,
                pacmanPosition.y,
                pacmanRadius,
                pacmanDirection * Math.PI / 2 - Math.PI / 4,
                pacmanDirection * Math.PI / 2 + Math.PI / 4
            );
            context.lineTo(pacmanPosition.x, pacmanPosition.y);
            context.fillStyle = "#ffd700"; // Yellow color
            context.fill();
            context.closePath();
        }

// Function to handle Pac-Man movement
        function movePacman() {
            // Detect arrow key press
            document.addEventListener("keydown", function (event) {
                if (event.keyCode === 37) { // Left arrow key
                    pacmanDirection = 2;
                } else if (event.keyCode === 38) { // Up arrow key
                    pacmanDirection = 3;
                } else if (event.keyCode === 39) { // Right arrow key
                    pacmanDirection = 0;
                } else if (event.keyCode === 40) { // Down arrow key
                    pacmanDirection = 1;
                }
            });

// Update Pac-Man position based on the current direction
            if (pacmanDirection === 0) {
                pacmanPosition.x += 5;
            } else if (pacmanDirection === 1) {
                pacmanPosition.y += 5;
            } else if (pacmanDirection === 2) {
                pacmanPosition.x -= 5;
            } else if (pacmanDirection === 3) {
                pacmanPosition.y -= 5;
            }
        }
    </script>
</body>
</html>