Update index.html

index.html

@@ -96,7 +96,7 @@
             const enemy = createEntity('enemy', {
                 class: 'enemy',
                 geometry: {primitive: 'sphere', radius: 0.5},
-                material: {color: '#FF0000', metalness: 0.7, roughness: 0.3},
+                material: {color: '#FF0000', metalness: 0.7, roughness: 0.3, opacity: 0.5, transparent: true},
                 position: new THREE.Vector3(
                     spawnPosition.x + (Math.random() - 0.5) * 2,
                     1.6, // Keep at player's eye level
@@ -111,64 +111,52 @@
             updateDisplays();
         }
 
-        function fireLaser(source, color, target, isPlayer = false) {
+        function fireLaser(source, color, direction) {
             const sourcePosition = source.object3D.position.clone();
-            let targetPosition;
+            sourcePosition.y = 1.6; // Ensure laser starts at eye level
             
-            if (isPlayer) {
-                sourcePosition.copy(camera.object3D.position).add(new THREE.Vector3(0, 0, -1));
-                const direction = new THREE.Vector3(0, 0, -1);
-                direction.applyQuaternion(camera.object3D.quaternion);
-                targetPosition = sourcePosition.clone().add(direction.multiplyScalar(100));
-            } else {
-                targetPosition = camera.object3D.position.clone();
-            }
-            
-            const distance = sourcePosition.distanceTo(targetPosition);
-            const midPoint = new THREE.Vector3().addVectors(sourcePosition, targetPosition).multiplyScalar(0.5);
+            const laserLength = 100;
+            const endPosition = sourcePosition.clone().add(direction.multiplyScalar(laserLength));
             
             const laser = createEntity('laser', {
                 class: 'laser',
-                geometry: {primitive: 'cylinder', radius: 0.05, height: distance},
+                geometry: {primitive: 'cylinder', radius: 0.05, height: laserLength},
                 material: {color: color, opacity: 0.7},
-                position: midPoint
+                position: sourcePosition.clone().add(direction.multiplyScalar(laserLength / 2))
             });
             
-            laser.object3D.lookAt(targetPosition);
+            laser.object3D.lookAt(endPosition);
             laser.object3D.rotateX(Math.PI / 2);
             
             laser.setAttribute('animation', {
                 property: 'scale',
                 to: '1 0.01 1',
-                dur: isPlayer ? 1000 : 2000,
+                dur: 1000,
                 easing: 'linear'
             });
 
             setTimeout(() => {
                 scene.removeChild(laser);
-            }, isPlayer ? 1000 : 2000);
+            }, 1000);
 
             // Check for collisions
-            if (isPlayer) {
-                const targets = document.querySelectorAll('.enemy, .spawner');
-                targets.forEach(target => {
-                    const targetPos = target.object3D.position;
-                    if (isPointOnLine(sourcePosition, targetPosition, targetPos, 0.5)) {
-                        handleHit(target, targetPos);
-                    }
-                });
-            } else if (isPointOnLine(sourcePosition, targetPosition, camera.object3D.position, 0.5)) {
-                health = Math.max(0, health - 10);
-                updateDisplays();
-            }
+            const targets = document.querySelectorAll('.enemy, .spawner');
+            targets.forEach(target => {
+                const targetPos = target.object3D.position;
+                if (isPointNearLine(sourcePosition, endPosition, targetPos, 0.5)) {
+                    handleHit(target, targetPos);
+                }
+            });
         }
 
-        function isPointOnLine(lineStart, lineEnd, point, threshold) {
+        function isPointNearLine(lineStart, lineEnd, point, threshold) {
             const lineVec = new THREE.Vector3().subVectors(lineEnd, lineStart);
             const pointVec = new THREE.Vector3().subVectors(point, lineStart);
-            const projection = pointVec.projectOnVector(lineVec);
-            const distance = new THREE.Vector3().subVectors(pointVec, projection).length();
-            return distance < threshold && projection.length() <= lineVec.length() && projection.length() >= 0;
+            const lineLengthSq = lineVec.lengthSq();
+            const dotProduct = pointVec.dot(lineVec);
+            const t = Math.max(0, Math.min(1, dotProduct / lineLengthSq));
+            const projection = lineStart.clone().add(lineVec.multiplyScalar(t));
+            return point.distanceTo(projection) < threshold;
         }
 
         function handleHit(target, position) {
@@ -209,7 +197,9 @@
         }
 
         function shootFromCamera() {
-            fireLaser(camera, '#00FF00', {object3D: {position: new THREE.Vector3()}}, true);
+            const direction = new THREE.Vector3(0, 0, -1);
+            direction.applyQuaternion(camera.object3D.quaternion);
+            fireLaser(camera, '#00FF00', direction);
         }
 
         function updateGame() {
@@ -231,7 +221,8 @@
                         health = Math.max(0, health - 50);
                     }
                     if (Math.random() < 0.01) {
-                        fireLaser(enemy, '#FF0000', camera);
+                        const enemyDirection = new THREE.Vector3().subVectors(cameraPosition, enemy.object3D.position).normalize();
+                        fireLaser(enemy, '#FF0000', enemyDirection);
                     }
                 }
             });