AI game creator

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

No:42837

←

Prev Next

→

PAC man
Developer User18914｜Date and time 24/2/13 0:46:42
Build time 9.217 sec｜Game capacity 2.142KB｜

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 black;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="480" height="320"></canvas>

// Load assets
      const pacManImage = new Image();
      pacManImage.src = "pacman.png";

// Game objects
      const pacMan = {
        x: 0,
        y: 0,
        speed: 2,
        direction: "right",
      };

// Keyboard input handling
      const keyState = {};
      document.addEventListener("keydown", (event) => {
        keyState[event.keyCode] = true;
      });
      document.addEventListener("keyup", (event) => {
        delete keyState[event.keyCode];
      });

// Update game objects
      function update() {
        if (keyState[37] && pacMan.direction !== "right") {
          pacMan.direction = "left";
        }
        if (keyState[38] && pacMan.direction !== "down") {
          pacMan.direction = "up";
        }
        if (keyState[39] && pacMan.direction !== "left") {
          pacMan.direction = "right";
        }
        if (keyState[40] && pacMan.direction !== "up") {
          pacMan.direction = "down";
        }

if (pacMan.direction === "right") {
          pacMan.x += pacMan.speed;
        }
        if (pacMan.direction === "left") {
          pacMan.x -= pacMan.speed;
        }
        if (pacMan.direction === "up") {
          pacMan.y -= pacMan.speed;
        }
        if (pacMan.direction === "down") {
          pacMan.y += pacMan.speed;
        }
      }

// Render game objects
      function render() {
        context.clearRect(0, 0, canvas.width, canvas.height);
        context.drawImage(pacManImage, pacMan.x, pacMan.y, 32, 32);
      }

// Game loop
      function gameLoop() {
        update();
        render();
        requestAnimationFrame(gameLoop);
      }

// Start the game loop
      pacManImage.onload = function () {
        gameLoop();
      };
    </script>
  </body>
</html>