cutechicken commited on
Commit
3b64ca1
·
verified ·
1 Parent(s): a8639d2

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +32 -12
index.html CHANGED
@@ -86,7 +86,7 @@
86
  // Audio
87
  const cannonSound = new Audio('firemn.ogg');
88
  const machinegunSound = new Audio('firemg.ogg');
89
- const enemyFireSound = new Audio('firemg.ogg');
90
 
91
  // Game state
92
  let currentRound = 1;
@@ -132,27 +132,34 @@
132
  this.maxHealth = 1000;
133
  this.speed = 2;
134
  this.lastShot = 0;
135
- this.shootInterval = 333; // 1초에 3
136
  this.angle = 0;
137
  this.moveAngle = Math.random() * Math.PI * 2;
138
  this.width = 100;
139
  this.height = 45;
 
 
140
  }
141
 
142
  update() {
 
 
 
 
 
 
 
143
  this.x += Math.cos(this.moveAngle) * this.speed;
144
  this.y += Math.sin(this.moveAngle) * this.speed;
145
 
146
- if(this.x < 0 || this.x > canvas.width) this.moveAngle = Math.PI - this.moveAngle;
147
- if(this.y < 0 || this.y > canvas.height) this.moveAngle = -this.moveAngle;
148
-
149
- if(Math.random() < 0.02) {
150
- this.moveAngle = Math.random() * Math.PI * 2;
151
- }
152
 
 
153
  this.angle = Math.atan2(player.y - this.y, player.x - this.x);
154
 
155
- const now = Date.now();
156
  if (now - this.lastShot > this.shootInterval) {
157
  this.shoot();
158
  this.lastShot = now;
@@ -162,8 +169,8 @@
162
  shoot() {
163
  enemyFireSound.cloneNode().play();
164
  bullets.push({
165
- x: this.x,
166
- y: this.y,
167
  angle: this.angle,
168
  speed: 5,
169
  isEnemy: true,
@@ -224,6 +231,7 @@
224
  function updateGame() {
225
  if(gameOver) return;
226
 
 
227
  if(keys['w']) player.y -= player.speed;
228
  if(keys['s']) player.y += player.speed;
229
  if(keys['a']) player.x -= player.speed;
@@ -233,9 +241,10 @@
233
  player.y = Math.max(player.height/2, Math.min(canvas.height - player.height/2, player.y));
234
 
235
  fireBullet();
236
-
237
  enemies.forEach(enemy => enemy.update());
238
 
 
239
  bullets = bullets.filter(bullet => {
240
  bullet.x += Math.cos(bullet.angle) * bullet.speed;
241
  bullet.y += Math.sin(bullet.angle) * bullet.speed;
@@ -269,6 +278,7 @@
269
  bullet.y >= 0 && bullet.y <= canvas.height;
270
  });
271
 
 
272
  items = items.filter(item => {
273
  const dist = Math.hypot(item.x - player.x, item.y - player.y);
274
  if(dist < 30) {
@@ -278,6 +288,7 @@
278
  return true;
279
  });
280
 
 
281
  if(enemies.length === 0) {
282
  if(currentRound < 10) {
283
  nextRoundBtn.style.display = 'block';
@@ -302,14 +313,17 @@
302
  function drawGame() {
303
  drawBackground();
304
 
 
305
  ctx.save();
306
  ctx.translate(player.x, player.y);
307
  ctx.rotate(player.angle);
308
  ctx.drawImage(playerImg, -player.width/2, -player.height/2, player.width, player.height);
309
  ctx.restore();
310
 
 
311
  drawHealthBar(canvas.width/2, 30, player.health, player.maxHealth, 200, 20, 'green');
312
 
 
313
  enemies.forEach(enemy => {
314
  ctx.save();
315
  ctx.translate(enemy.x, enemy.y);
@@ -319,6 +333,7 @@
319
  drawHealthBar(enemy.x, enemy.y - 40, enemy.health, enemy.maxHealth, 60, 5, 'red');
320
  });
321
 
 
322
  bullets.forEach(bullet => {
323
  ctx.beginPath();
324
  ctx.fillStyle = bullet.isEnemy ? 'red' : 'yellow';
@@ -326,6 +341,7 @@
326
  ctx.fill();
327
  });
328
 
 
329
  ctx.fillStyle = 'green';
330
  items.forEach(item => {
331
  ctx.beginPath();
@@ -333,6 +349,7 @@
333
  ctx.fill();
334
  });
335
 
 
336
  ctx.fillStyle = 'white';
337
  ctx.font = '24px Arial';
338
  ctx.fillText(`Round ${currentRound}/10`, 10, 30);
@@ -344,6 +361,7 @@
344
  requestAnimationFrame(gameLoop);
345
  }
346
 
 
347
  nextRoundBtn.addEventListener('click', () => {
348
  currentRound++;
349
  nextRoundBtn.style.display = 'none';
@@ -357,6 +375,7 @@
357
  initRound();
358
  });
359
 
 
360
  Promise.all([
361
  new Promise(resolve => backgroundImg.onload = resolve),
362
  new Promise(resolve => playerImg.onload = resolve),
@@ -366,6 +385,7 @@
366
  gameLoop();
367
  });
368
 
 
369
  window.addEventListener('resize', () => {
370
  canvas.width = window.innerWidth;
371
  canvas.height = window.innerHeight;
 
86
  // Audio
87
  const cannonSound = new Audio('firemn.ogg');
88
  const machinegunSound = new Audio('firemg.ogg');
89
+ const enemyFireSound = new Audio('fireenemy.ogg');
90
 
91
  // Game state
92
  let currentRound = 1;
 
132
  this.maxHealth = 1000;
133
  this.speed = 2;
134
  this.lastShot = 0;
135
+ this.shootInterval = 500; // 1초에 2
136
  this.angle = 0;
137
  this.moveAngle = Math.random() * Math.PI * 2;
138
  this.width = 100;
139
  this.height = 45;
140
+ this.moveTimer = 0;
141
+ this.moveInterval = Math.random() * 2000 + 1000;
142
  }
143
 
144
  update() {
145
+ // Movement
146
+ const now = Date.now();
147
+ if (now - this.moveTimer > this.moveInterval) {
148
+ this.moveAngle = Math.random() * Math.PI * 2;
149
+ this.moveTimer = now;
150
+ }
151
+
152
  this.x += Math.cos(this.moveAngle) * this.speed;
153
  this.y += Math.sin(this.moveAngle) * this.speed;
154
 
155
+ // Keep enemy in bounds
156
+ this.x = Math.max(this.width/2, Math.min(canvas.width - this.width/2, this.x));
157
+ this.y = Math.max(this.height/2, Math.min(canvas.height - this.height/2, this.y));
 
 
 
158
 
159
+ // Aim at player
160
  this.angle = Math.atan2(player.y - this.y, player.x - this.x);
161
 
162
+ // Shooting
163
  if (now - this.lastShot > this.shootInterval) {
164
  this.shoot();
165
  this.lastShot = now;
 
169
  shoot() {
170
  enemyFireSound.cloneNode().play();
171
  bullets.push({
172
+ x: this.x + Math.cos(this.angle) * 30,
173
+ y: this.y + Math.sin(this.angle) * 30,
174
  angle: this.angle,
175
  speed: 5,
176
  isEnemy: true,
 
231
  function updateGame() {
232
  if(gameOver) return;
233
 
234
+ // Player movement
235
  if(keys['w']) player.y -= player.speed;
236
  if(keys['s']) player.y += player.speed;
237
  if(keys['a']) player.x -= player.speed;
 
241
  player.y = Math.max(player.height/2, Math.min(canvas.height - player.height/2, player.y));
242
 
243
  fireBullet();
244
+
245
  enemies.forEach(enemy => enemy.update());
246
 
247
+ // Update bullets and collisions
248
  bullets = bullets.filter(bullet => {
249
  bullet.x += Math.cos(bullet.angle) * bullet.speed;
250
  bullet.y += Math.sin(bullet.angle) * bullet.speed;
 
278
  bullet.y >= 0 && bullet.y <= canvas.height;
279
  });
280
 
281
+ // Update items
282
  items = items.filter(item => {
283
  const dist = Math.hypot(item.x - player.x, item.y - player.y);
284
  if(dist < 30) {
 
288
  return true;
289
  });
290
 
291
+ // Check win condition
292
  if(enemies.length === 0) {
293
  if(currentRound < 10) {
294
  nextRoundBtn.style.display = 'block';
 
313
  function drawGame() {
314
  drawBackground();
315
 
316
+ // Draw player
317
  ctx.save();
318
  ctx.translate(player.x, player.y);
319
  ctx.rotate(player.angle);
320
  ctx.drawImage(playerImg, -player.width/2, -player.height/2, player.width, player.height);
321
  ctx.restore();
322
 
323
+ // Draw player health bar
324
  drawHealthBar(canvas.width/2, 30, player.health, player.maxHealth, 200, 20, 'green');
325
 
326
+ // Draw enemies
327
  enemies.forEach(enemy => {
328
  ctx.save();
329
  ctx.translate(enemy.x, enemy.y);
 
333
  drawHealthBar(enemy.x, enemy.y - 40, enemy.health, enemy.maxHealth, 60, 5, 'red');
334
  });
335
 
336
+ // Draw bullets
337
  bullets.forEach(bullet => {
338
  ctx.beginPath();
339
  ctx.fillStyle = bullet.isEnemy ? 'red' : 'yellow';
 
341
  ctx.fill();
342
  });
343
 
344
+ // Draw items
345
  ctx.fillStyle = 'green';
346
  items.forEach(item => {
347
  ctx.beginPath();
 
349
  ctx.fill();
350
  });
351
 
352
+ // Draw round number
353
  ctx.fillStyle = 'white';
354
  ctx.font = '24px Arial';
355
  ctx.fillText(`Round ${currentRound}/10`, 10, 30);
 
361
  requestAnimationFrame(gameLoop);
362
  }
363
 
364
+ // Button event listeners
365
  nextRoundBtn.addEventListener('click', () => {
366
  currentRound++;
367
  nextRoundBtn.style.display = 'none';
 
375
  initRound();
376
  });
377
 
378
+ // Start game when assets are loaded
379
  Promise.all([
380
  new Promise(resolve => backgroundImg.onload = resolve),
381
  new Promise(resolve => playerImg.onload = resolve),
 
385
  gameLoop();
386
  });
387
 
388
+ // Handle window resize
389
  window.addEventListener('resize', () => {
390
  canvas.width = window.innerWidth;
391
  canvas.height = window.innerHeight;