AI game creator

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

No:41528

←

Prev Next

→

Densha
Developer User18611｜Date and time 24/2/8 5:16:38
Build time 11.253 sec｜Game capacity 2.44KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
  <title>Densha Game</title>
</head>
<body>
  <canvas id="gameCanvas" width="480" height="320"></canvas>
  
  <script>
    var canvas = document.getElementById("gameCanvas");
    var ctx = canvas.getContext("2d");
    
    // Defining the player's position and speed
    var playerX = canvas.width/2;
    var playerY = canvas.height - 30;
    var playerSpeed = 2;
    
    // Defining the target position
    var targetX = Math.random() * canvas.width;
    var targetY = 0;
    var targetSpeed = 1;
    
    // Handling player movement
    var rightPressed = false;
    var leftPressed = false;
    
    document.addEventListener("keydown", keyDownHandler, false);
    document.addEventListener("keyup", keyUpHandler, false);
    
    function keyDownHandler(event) {
      if(event.key == "Right" || event.key == "ArrowRight") {
        rightPressed = true;
      }
      else if(event.key == "Left" || event.key == "ArrowLeft") {
        leftPressed = true;
      }
    }
    
    function keyUpHandler(event) {
      if(event.key == "Right" || event.key == "ArrowRight") {
        rightPressed = false;
      }
      else if(event.key == "Left" || event.key == "ArrowLeft") {
        leftPressed = false;
      }
    }
    
    function drawPlayer() {
      ctx.beginPath();
      ctx.rect(playerX, playerY, 30, 30);
      ctx.fillStyle = "#0095DD";
      ctx.fill();
      ctx.closePath();
    }
    
    function drawTarget() {
      ctx.beginPath();
      ctx.rect(targetX, targetY, 30, 30);
      ctx.fillStyle = "#FF0000";
      ctx.fill();
      ctx.closePath();
    }
    
    function draw() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      
      drawPlayer();
      drawTarget();
      
      if(rightPressed) {
        playerX += playerSpeed;
      }
      else if(leftPressed) {
        playerX -= playerSpeed;
      }
      
      targetY += targetSpeed;
      
      if(targetY > canvas.height) {
        targetX = Math.random() * canvas.width;
        targetY = 0;
      }
      
      // Check if the player catches the target
      if(playerX < targetX + 30 && playerX + 30 > targetX &&
         playerY < targetY + 30 && playerY + 30 > targetY) {
        alert("Congratulations! You caught the target!");
        targetX = Math.random() * canvas.width;
        targetY = 0;
      }
      
      requestAnimationFrame(draw);
    }
    
    draw();
  </script>
</body>
</html>