Person with gun vs zombies's game

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

No:50714

←

Prev Next

→

Person with gun vs zombies
Developer User21392｜Date and time 24/3/9 12:53:56
Build time 8.497 sec｜Game capacity 2.273KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html lang="pt">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Jogo: Pessoa com arma vs Zumbis</title>
</head>
<body>
<canvas id="gameCanvas" width="400" height="400"></canvas>

const player = {
  x: canvas.width / 2,
  y: canvas.height / 2,
  speed: 5,
  width: 20,
  height: 30,
  color: 'blue'
};

const zombies = [
  { x: 100, y: 100, speed: 3, width: 20, height: 20, color: 'green' },
  { x: 200, y: 300, speed: 3, width: 20, height: 20, color: 'green' },
  { x: 300, y: 200, speed: 3, width: 20, height: 20, color: 'green' }
];

function drawPlayer() {
  ctx.fillStyle = player.color;
  ctx.fillRect(player.x, player.y, player.width, player.height);
}

function drawZombies() {
  zombies.forEach(zombie => {
    ctx.fillStyle = zombie.color;
    ctx.fillRect(zombie.x, zombie.y, zombie.width, zombie.height);
  });
}

function movePlayer(event) {
  switch(event.key) {
    case 'ArrowUp':
      player.y -= player.speed;
      break;
    case 'ArrowDown':
      player.y += player.speed;
      break;
    case 'ArrowLeft':
      player.x -= player.speed;
      break;
    case 'ArrowRight':
      player.x += player.speed;
      break;
  }
}

function moveZombies() {
  zombies.forEach(zombie => {
    let directionX = player.x - zombie.x;
    let directionY = player.y - zombie.y;
    let distance = Math.sqrt(directionX ** 2 + directionY ** 2);
    
    zombie.x += directionX / distance * zombie.speed;
    zombie.y += directionY / distance * zombie.speed;
  });
}

function gameLoop() {
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  
  drawPlayer();
  drawZombies();
  moveZombies();
  checkCollision();
  
  requestAnimationFrame(gameLoop);
}

document.addEventListener('keydown', movePlayer);
gameLoop();
</script>

</body>
</html>