A platformer game where the player is represented by a hockey mask and you k○ll enemies with a machete's game

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

No:21044

←

Prev Next

→

A platformer game where the player is represented ..ALL
Developer User9092｜Date and time 23/10/13 3:38:02
Build time 74.877 sec｜Game capacity 3.047KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Hockey Mask Man - Platformer Game</title>
  <style>
    body {
      background-color: #000;
      color: #fff;
      text-align: center;
      margin: 0;
      padding: 0;
    }
    canvas {
      display: block;
      margin: auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="800" height="600"></canvas>

// Player object
    const player = {
      x: 0,
      y: 0,
      width: 50,
      height: 50,
      color: '#FF0000',
      speed: 5
    };

// Enemy object
    const enemy = {
      x: canvas.width - 50,
      y: canvas.height - 100,
      width: 50,
      height: 50,
      color: '#00FF00',
      speed: 2
    };

// Keyboard control object
    const keys = {
      ArrowUp: false,
      ArrowDown: false,
      ArrowRight: false,
      ArrowLeft: false
    };

// Event listeners for key presses
    document.addEventListener('keydown', (event) => {
      event.preventDefault();
      if (event.key in keys) {
        keys[event.key] = true;
      }
    });

document.addEventListener('keyup', (event) => {
      event.preventDefault();
      if (event.key in keys) {
        keys[event.key] = false;
      }
    });

// Update function - update player/enemy positions and check for collision
    function update() {
      if (keys['ArrowUp'] && player.y > 0) {
        player.y -= player.speed;
      }
      if (keys['ArrowDown'] && player.y + player.height < canvas.height) {
        player.y += player.speed;
      }
      if (keys['ArrowRight'] && player.x + player.width < canvas.width) {
        player.x += player.speed;
      }
      if (keys['ArrowLeft'] && player.x > 0) {
        player.x -= player.speed;
      }

// Check for collision
      if (player.x < enemy.x + enemy.width &&
          player.x + player.width > enemy.x &&
          player.y < enemy.y + enemy.height &&
          player.y + player.height > enemy.y) {
        // Collision detected, player wins!
        alert('You killed the enemy with a machete! You win!');
        resetGame();
      }
    }

// Render function - draw player and enemy on the canvas
    function render() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw player
      ctx.fillStyle = player.color;
      ctx.fillRect(player.x, player.y, player.width, player.height);

// Draw enemy
      ctx.fillStyle = enemy.color;
      ctx.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
    }

// Game loop - continuously updates and renders the game
    function gameLoop() {
      update();
      render();
      requestAnimationFrame(gameLoop);
    }

// Function to reset the game
    function resetGame() {
      player.x = 0;
      player.y = 0;
    }

// Start the game loop when the page is loaded
    window.onload = function() {
      gameLoop();
    };
  </script>
</body>
</html>