Spaces:
Running
Running
| const canvas = document.getElementById("gameCanvas"); | |
| const ctx = canvas.getContext("2d"); | |
| let width = window.innerWidth; | |
| let height = window.innerHeight; | |
| canvas.width = width; | |
| canvas.height = height; | |
| let star = { | |
| x: width / 2, | |
| y: height / 2, | |
| radius: 50, | |
| color: "yellow", | |
| }; | |
| let towers = []; | |
| let enemies = []; | |
| function drawStar() { | |
| ctx.beginPath(); | |
| ctx.arc(star.x, star.y, star.radius, 0, Math.PI * 2); | |
| ctx.fillStyle = star.color; | |
| ctx.fill(); | |
| } | |
| function drawTowers() { | |
| towers.forEach(tower => { | |
| ctx.beginPath(); | |
| ctx.arc(tower.x, tower.y, tower.radius, 0, Math.PI * 2); | |
| ctx.fillStyle = "blue"; | |
| ctx.fill(); | |
| }); | |
| } | |
| function drawEnemies() { | |
| enemies.forEach(enemy => { | |
| ctx.beginPath(); | |
| ctx.arc(enemy.x, enemy.y, enemy.radius, 0, Math.PI * 2); | |
| ctx.fillStyle = "red"; | |
| ctx.fill(); | |
| }); | |
| } | |
| function spawnEnemies() { | |
| let enemy = { | |
| x: Math.random() * width, | |
| y: 0, | |
| radius: 20, | |
| speed: 2, | |
| }; | |
| enemies.push(enemy); | |
| } | |
| function update() { | |
| ctx.clearRect(0, 0, canvas.width, canvas.height); | |
| drawStar(); | |
| drawTowers(); | |
| drawEnemies(); | |
| spawnEnemies(); | |
| requestAnimationFrame(update); | |
| } | |
| update(); |