Ugly jump monster escape mystery's game

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

No:46490

←

Prev Next

→

Ugly jump monster escape mystery
Developer User20087｜Date and time 24/2/24 23:44:02
Build time 6.635 sec｜Game capacity 1.954KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Ugly Jump Monster Escape Mystery</title>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>

let playerX = 50;
    let playerY = 350;
    let playerWidth = 50;
    let playerHeight = 50;
    let playerSpeed = 5;

let monsterX = 300;
    let monsterY = 50;
    let monsterWidth = 50;
    let monsterHeight = 50;

let isJumping = false;
    let jumpHeight = 100;
    let jumpSpeed = 5;

let gameOver = false;

function drawPlayer() {
      ctx.fillStyle = "blue";
      ctx.fillRect(playerX, playerY, playerWidth, playerHeight);
    }

function drawMonster() {
      ctx.fillStyle = "red";
      ctx.fillRect(monsterX, monsterY, monsterWidth, monsterHeight);
    }

function draw() {
      if (gameOver) {
        ctx.fillStyle = "black";
        ctx.font = "30px Arial";
        ctx.fillText("Game Over", 150, 200);
        return;
      }

ctx.clearRect(0, 0, canvas.width, canvas.height);

drawPlayer();
      drawMonster();

if (isJumping) {
        playerY -= jumpSpeed;
        jumpHeight -= jumpSpeed;
        if (jumpHeight <= 0) {
          isJumping = false;
        }
      } else {
        if (playerY < 350) {
          playerY += jumpSpeed;
        }
        jumpHeight = 100;
      }

if (playerX + playerWidth > canvas.width) {
        gameOver = true;
      }

if (playerX < monsterX + monsterWidth &&
          playerX + playerWidth > monsterX &&
          playerY < monsterY + monsterHeight &&
          playerY + playerHeight > monsterY) {
        gameOver = true;
      }

requestAnimationFrame(draw);
    }

draw();

document.addEventListener("keydown", function(event) {
      if (event.key === " " && !isJumping) {
        isJumping = true;
      }
    });

</script>
</body>
</html>