Update index.html

index.html

@@ -95,7 +95,7 @@
         const PLAYER_SIZE = 30;
         const BULLET_SPEED = 10;
         const ENEMY_SPEED = 2;
-        const SHOOTING_INTERVAL = 333; // 3 shots per second
+        const SHOOTING_INTERVAL = 333;
 
         let game = {
             player: {
@@ -116,8 +116,6 @@
             shooting: false
         };
 
-        const gunSound = new Audio('data:audio/wav;base64,UklGRnoGAABXQVZFZm10IBAAAAABAAEAQB8AAEAfAAABAAgAZGF0YWoGAACBhYqFbF1pbphwX4WqY0J0zGYhdPV3I2vyd5qCvHKTlZJ0j6p+cJGYhIaHmH1li6R9YH6hooCEjaB0f4SOo3yLkZSCeq+bXY/FdWt9tnhcl69yZ5mfdGSSoYKEkZuBdYqgeIKEm4Joe6GJfX+VmnuBjZaFhqmQYY7Hc36QiXd6kpWLgpSieIeQnICEkZeEhJOcfH6Om4GBjZWEgpOYfICLl4OBjZSEgZKYfICKloKBjJODgZGXe3+JlYGAi5KCgJCWen+IlICAfoh+gY2ScICBjX+ChImFhYuJhYeHhoeHh4iIiIiIiIiIiIiIiIiIiIiIiIiHh4aGhYSCgYB/fn18fHx9fn+AgYKEhYeIiYuMjo+RkpSVl5iZmptcW15hZGhrbW5vcHFydHZ4enx+gIKEh4mMj5GSk5OTkpGQjo2LiomIiImKi4yOj5GSlJWXmJqbnZ6foKGio6SlpqeoqaqrrK2ur7CxsrO0tba3uLm6u7y9vr/AwcLDxMXGx8jJysvMzc7P0NHS09TV1tfY2drbAQIDBAUGBwgJCgsMDQ4PEBESExQVFhcYGRobHB0eHyAhIiMkJSYnKCkqKywtLi8wMTIzNDU2Nzg5Ojs8PT4/QEFCQ0RFRkdISUpLTE1OT1BRUlNUVVZXWFlaW1xdXl9gYWJjZGVmZ2hpamtsbW5vcHFyc3R1dnd4eXp7fH1+f4CBgoOEhYaHiImKi4yNjo+QkZKTlJWWl5iZmpucnZ6foKGio6SlpqeoqaqrrK2ur7CxsrO0tba3uLm6u7y9vr/AwcLDxMXGx8jJysvMzc7P0NHS09TV1tfY2drb3N3e3+Dh4uPk5ebn6Onq6+zt7u/w8fLz9PX29/j5+vv8/f7/AAECAwQFBgcICQoLDA0ODxAREhMUFRYXGBkaGxwdHh8gISIjJCUmJygpKissLS4vMDEyMzQ1Njc4OTo7PD0+P0BBQkNERUZHSElKS0xNTk9QUVJTVFVWV1hZWltcXV5fYGFiY2RlZmdoaWprbG1ub3BxcnN0dXZ3eHl6e3x9fn+AgYKDhIWGh4iJiouMjY6PkJGSk5SVlpeYmZqbnJ2en6ChoqOkpaanqKmqq6ytrq+wsbKztLW2t7i5uru8vb6/wMHCw8TFxsfIycrLzM3Oz9DR0tPU1dbX2Nna29zd3t/g4eLj5OXm5+jp6uvs7e7v8PHy8/T19vf4+fr7/P3+/wABAgMEBQYHCAkKCwwNDg8QERITFBUWFxgZGhscHR4fICEiIyQlJicoKSorLC0uLzAxMjM0NTY3ODk6Ozw9Pj9AQUJDREVGR0hJSktMTU5PUFFSU1RVVldYWVpbXF1eX2BhYmNkZWZnaGlqa2xtbm9wcXJzdHV2d3h5ent8fX5/gIGCg4SFhoeIiYqLjI2Oj5CRkpOUlZaXmJmam5ydnp+goaKjpKWmp6ipqqusra6vsLGys7S1tre4ubq7vL2+v8DBwsPExcbHyMnKy8zNzs/Q0dLT1NXW19jZ2tvc3d7f4OHi4+Tl5ufo6err7O3u7/Dx8vP09fb3+Pn6+/z9/v8=');
-
         function spawnEnemies() {
             const enemyCount = game.round * 5;
             for(let i = 0; i < enemyCount; i++) {
@@ -136,6 +134,13 @@
             }
         }
 
+        function drawCircle(x, y, radius, color) {
+            ctx.fillStyle = color;
+            ctx.beginPath();
+            ctx.arc(x, y, radius, 0, Math.PI * 2);
+            ctx.fill();
+        }
+
         function update() {
             // Player movement
             if(game.keys['w'] && game.player.y > PLAYER_SIZE) 
@@ -161,7 +166,6 @@
                         angle: angle + (Math.random() - 0.5) * 0.2
                     });
                 }
-                gunSound.cloneNode().play();
                 game.lastShot = Date.now();
             }
 
@@ -171,13 +175,11 @@
                 bullet.x += Math.cos(bullet.angle) * BULLET_SPEED;
                 bullet.y += Math.sin(bullet.angle) * BULLET_SPEED;
 
-                // Remove out of bounds bullets
                 if(bullet.x < 0 || bullet.x > canvas.width || 
                    bullet.y < 0 || bullet.y > canvas.height) {
                     game.player.bullets.splice(i, 1);
                 }
 
-                // Check enemy hits
                 for(let j = game.enemies.length - 1; j >= 0; j--) {
                     const enemy = game.enemies[j];
                     const dx = bullet.x - enemy.x;
@@ -188,7 +190,6 @@
                         if(enemy.health <= 0) {
                             game.enemies.splice(j, 1);
                             game.player.bulletsPerShot++;
-                            // Drop health item
                             game.items.push({
                                 x: enemy.x,
                                 y: enemy.y,
@@ -202,15 +203,12 @@
 
             // Update enemies
             game.enemies.forEach(enemy => {
-                // Movement
                 enemy.x += enemy.direction.x * ENEMY_SPEED;
                 enemy.y += enemy.direction.y * ENEMY_SPEED;
 
-                // Bounce off walls
                 if(enemy.x < 0 || enemy.x > canvas.width) enemy.direction.x *= -1;
                 if(enemy.y < 0 || enemy.y > canvas.height) enemy.direction.y *= -1;
 
-                // Shooting
                 if(Date.now() - enemy.lastShot > 1000) {
                     const angle = Math.atan2(
                         game.player.y - enemy.y,
@@ -224,13 +222,11 @@
                     enemy.lastShot = Date.now();
                 }
 
-                // Update enemy bullets
                 for(let i = enemy.bullets.length - 1; i >= 0; i--) {
                     const bullet = enemy.bullets[i];
                     bullet.x += Math.cos(bullet.angle) * BULLET_SPEED/2;
                     bullet.y += Math.sin(bullet.angle) * BULLET_SPEED/2;
 
-                    // Check player hit
                     const dx = bullet.x - game.player.x;
                     const dy = bullet.y - game.player.y;
                     if(Math.sqrt(dx*dx + dy*dy) < PLAYER_SIZE/2) {
@@ -244,7 +240,6 @@
                         }
                     }
 
-                    // Remove out of bounds bullets
                     if(bullet.x < 0 || bullet.x > canvas.width || 
                        bullet.y < 0 || bullet.y > canvas.height) {
                         enemy.bullets.splice(i, 1);
@@ -275,7 +270,7 @@
                     document.getElementById('round').textContent = `Round ${game.round}`;
                     game.player.health = game.player.maxHealth;
                     document.getElementById('health').style.width = '100%';
-                    game.player.bulletsPerShot = 1; // Reset bullets per shot
+                    game.player.bulletsPerShot = 1;
                     spawnEnemies();
                 }
             }
@@ -284,24 +279,19 @@
         function draw() {
             ctx.clearRect(0, 0, canvas.width, canvas.height);
 
-            // Draw player
-            ctx.fillStyle = 'white';
-            ctx.font = '30px Arial';
-            ctx.fillText('🐭', game.player.x - 15, game.player.y + 15);
+            // Draw player (blue circle)
+            drawCircle(game.player.x, game.player.y, PLAYER_SIZE/2, '#3498db');
 
             // Draw player bullets
             ctx.fillStyle = 'yellow';
             game.player.bullets.forEach(bullet => {
-                ctx.beginPath();
-                ctx.arc(bullet.x, bullet.y, 3, 0, Math.PI * 2);
-                ctx.fill();
+                drawCircle(bullet.x, bullet.y, 3, 'yellow');
             });
 
             // Draw enemies
             game.enemies.forEach(enemy => {
-                // Enemy
-                ctx.fillStyle = 'white';
-                ctx.fillText('🐱', enemy.x - 15, enemy.y + 15);
+                // Enemy (red circle)
+                drawCircle(enemy.x, enemy.y, PLAYER_SIZE/2, '#e74c3c');
 
                 // Health bar
                 ctx.fillStyle = '#600';
@@ -311,18 +301,14 @@
                            (enemy.health/enemy.maxHealth) * 50, 5);
 
                 // Enemy bullets
-                ctx.fillStyle = 'red';
                 enemy.bullets.forEach(bullet => {
-                    ctx.beginPath();
-                    ctx.arc(bullet.x, bullet.y, 3, 0, Math.PI * 2);
-                    ctx.fill();
+                    drawCircle(bullet.x, bullet.y, 3, 'red');
                 });
             });
 
-            // Draw items
-            ctx.fillStyle = 'green';
+            // Draw items (green circles)
             game.items.forEach(item => {
-                ctx.fillText('✚', item.x - 10, item.y + 10);
+                drawCircle(item.x, item.y, PLAYER_SIZE/3, '#2ecc71');
             });
         }
 
@@ -378,4 +364,4 @@
         gameLoop();
     </script>
 </body>
-</html><script async data-explicit-opt-in="true" data-cookie-opt-in="true" src="https://vercel.live/_next-live/feedback/feedback.js"></script>
+</html>