Goblin Invaders (Like Space Invaders but the aliens are instead goblins)'s game

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

No:50042

128

←

Prev Next

→

Goblin Invaders (Like Space Invaders but the alien..ALL
Developer User21218｜Date and time 24/3/7 14:28:27
Build time 7.139 sec｜Game capacity 1.898KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

<html>
<body>
<canvas id="gameCanvas"></canvas>
<script>
// Game variables
let canvas;
let context;
let player;
let goblins = [];
let score = 0;

// Player object
class Player {
  constructor(x, y, width, height) {
    this.x = x;
    this.y = y;
    this.width = width;
    this.height = height;
  }

draw() {
    context.fillStyle = "blue";
    context.fillRect(this.x, this.y, this.width, this.height);
  }
}

// Goblin object
class Goblin {
  constructor(x, y, width, height, speed) {
    this.x = x;
    this.y = y;
    this.width = width;
    this.height = height;
    this.speed = speed;
  }

draw() {
    context.fillStyle = "green";
    context.fillRect(this.x, this.y, this.width, this.height);
  }

update() {
    this.y += this.speed;
  }
}

// Game loop
function gameLoop() {
  context.clearRect(0, 0, canvas.width, canvas.height);

player.draw();

goblins.forEach((goblin, index) => {
    goblin.draw();
    goblin.update();

// Check for collision with player
    if (
      player.x < goblin.x + goblin.width &&
      player.x + player.width > goblin.x &&
      player.y < goblin.y + goblin.height &&
      player.y + player.height > goblin.y
    ) {
      goblins.splice(index, 1);
      score++;
      alert("Goblin defeated! Score: " + score);
    }

// Remove goblin if it goes off screen
    if (goblin.y > canvas.height) {
      goblins.splice(index, 1);
    }
  });

// Randomly spawn goblins
  if (Math.random() < 0.01) {
    let goblin = new Goblin(
      Math.random() * (canvas.width - 30),
      0,
      30,
      30,
      3
    );
    goblins.push(goblin);
  }

requestAnimationFrame(gameLoop);
}

// Initialize game
window.onload = () => {
  canvas = document.getElementById("gameCanvas");
  context = canvas.getContext("2d");
  player = new Player(canvas.width / 2 - 15, canvas.height - 30, 30, 30);

gameLoop();
};
</script>
</body>
</html>