("2d");
var score = 0;
var gameOver = false;
// Player variables
var player = {
x: canvas.width / 2,
y: canvas.height - 50,
width: 50,
height: 50,
color: "blue"
};
// Projectile variables
var projectiles = [];
var projectileSpeed = 5;
var maxProjectiles = 5;
// Enemy variables
var enemies = [];
var enemySpeed = 2;
var maxEnemies = 3;
// Event listeners
canvas.addEventListener("mousemove", movePlayer);
canvas.addEventListener("mousedown", shootProjectile);
// Game loop
function gameLoop() {
if (gameOver) {
return;
}
update();
draw();
requestAnimationFrame(gameLoop);
}
// Update game state
function update() {
// Move projectiles
projectiles.forEach(function(projectile) {
projectile.y -= projectileSpeed;
// Remove projectile if it goes off screen
if (projectile.y < 0) {
projectiles.splice(projectiles.indexOf(projectile), 1);
}
});
// Move enemies
enemies.forEach(function(enemy) {
enemy.y += enemySpeed;
// Remove enemy if it goes off screen
if (enemy.y > canvas.height) {
enemies.splice(enemies.indexOf(enemy), 1);
}
// Check for collision with player
if (collision(player, enemy)) {
gameOver = true;
}
});
// Check for collision between projectiles and enemies
projectiles.forEach(function(projectile) {
enemies.forEach(function(enemy) {
if (collision(projectile, enemy)) {
score++;
projectiles.splice(projectiles.indexOf(projectile), 1);
enemies.splice(enemies.indexOf(enemy), 1);
}
});
});
// Add new enemies
if (enemies.length < maxEnemies) {
spawnEnemy();
}
}
// Draw game state
function draw() {
// Clear canvas
context.clearRect(0, 0, canvas.width, canvas.height);
// Draw player
context.fillStyle = player.color;
context.fillRect(player.x, player.y, player.width, player.height);
// Draw projectiles
projectiles.forEach(function(projectile) {
context.fillStyle = "red";
context.fillRect(
projectile.x,
projectile.y,
projectile.width,
projectile.height
);
});
// Draw enemies
enemies.forEach(function(enemy) {
context.fillStyle = "black";
context.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
});
// Draw score
context.fillStyle = "black";
context.font = "24px Arial";
context.fillText("Score: " + score, 10, 30);
// Game over text
if (gameOver) {
context.fillStyle = "black";
context.font = "48px Arial";
context.fillText("Game Over", canvas.width / 2 - 100, canvas.height / 2);
}
}
// Spawn a new enemy
function spawnEnemy() {
var enemy = {
x: Math.random() * (canvas.width - 50),
y: 0,
width: 50,
height: 50
};
enemies.push(enemy);
}
// Move player with mouse
function movePlayer(event) {
player.x = event.clientX - canvas.offsetLeft - player.width / 2;
}
// Shoot projectile on mouse click
function shootProjectile() {
if (projectiles.length < maxProjectiles) {
var projectile = {
x: player.x + player.width / 2 - 5,
y: player.y - 10,
width: 10,
height: 10
};
projectiles.push(projectile);
}
}
// Check if two objects collide
function collision(obj1, obj2) {
if (
obj1.x < obj2.x + obj2.width &&
obj1.x + obj1.width > obj2.x &&
obj1.y < obj2.y + obj2.height &&
obj1.y + obj1.height > obj2.y
) {
return true;
} else {
return false;
}
}
// Start the game
gameLoop();