Update index.html

index.html

@@ -102,31 +102,38 @@
         }
 
         function fireLaser(source, color, target, isPlayer = false) {
-            const sourcePosition = source.object3D.position;
-            const targetPosition = target.object3D.position;
-            const direction = new THREE.Vector3().subVectors(targetPosition, sourcePosition).normalize();
+            const sourcePosition = source.object3D.position.clone();
+            const targetPosition = target.object3D.position.clone();
             
-            const laserLength = isPlayer ? 100 : 10; // Player lasers are longer
-            const midPoint = new THREE.Vector3().addVectors(sourcePosition, direction.multiplyScalar(laserLength / 2));
+            if (isPlayer) {
+                // For player, set source to be in front of the camera
+                sourcePosition.copy(camera.object3D.position).add(new THREE.Vector3(0, 0, -1));
+                // Set target to be far in the direction the camera is facing
+                const direction = new THREE.Vector3(0, 0, -1);
+                direction.applyQuaternion(camera.object3D.quaternion);
+                targetPosition.copy(sourcePosition).add(direction.multiplyScalar(100));
+            } else {
+                // For enemies, set target to be in front of the camera
+                targetPosition.copy(camera.object3D.position).add(new THREE.Vector3(0, 0, -1));
+            }
+            
+            const distance = sourcePosition.distanceTo(targetPosition);
+            const midPoint = new THREE.Vector3().addVectors(sourcePosition, targetPosition).multiplyScalar(0.5);
             
             const laser = createEntity('laser', {
                 class: 'laser',
-                geometry: {primitive: 'cylinder', radius: 0.05, height: laserLength},
+                geometry: {primitive: 'cylinder', radius: 0.05, height: distance},
                 material: {color: color, opacity: 0.7},
                 position: midPoint
             });
             
             laser.object3D.lookAt(targetPosition);
-            
-            // Rotate the laser to be horizontal for player, keep vertical for enemies
-            if (isPlayer) {
-                laser.object3D.rotateZ(Math.PI / 2);
-            }
+            laser.object3D.rotateX(Math.PI / 2);
             
             laser.setAttribute('animation', {
                 property: 'scale',
                 to: '1 0.01 1',
-                dur: isPlayer ? 1000 : 2000, // Enemy lasers are slower
+                dur: isPlayer ? 1000 : 2000,
                 easing: 'linear'
             });
 
@@ -139,17 +146,24 @@
                 const targets = document.querySelectorAll('.enemy, .spawner');
                 targets.forEach(target => {
                     const targetPos = target.object3D.position;
-                    const distance = sourcePosition.distanceTo(targetPos);
-                    if (distance < 2) {
+                    if (isPointOnLine(sourcePosition, targetPosition, targetPos, 0.5)) {
                         handleHit(target, targetPos);
                     }
                 });
-            } else if (sourcePosition.distanceTo(player.object3D.position) < 2) {
+            } else if (isPointOnLine(sourcePosition, targetPosition, camera.object3D.position, 0.5)) {
                 health = Math.max(0, health - 10);
                 updateDisplays();
             }
         }
 
+        function isPointOnLine(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();
+        }
+
         function handleHit(target, position) {
             if (target.classList.contains('enemy')) {
                 createExplosion(position);
@@ -188,31 +202,7 @@
         }
 
         function shootFromCamera() {
-            const cameraEl = camera.components.camera.el;
-            const direction = new THREE.Vector3(0, 0, -1);
-            direction.applyQuaternion(cameraEl.object3D.quaternion);
-            
-            const raycaster = new THREE.Raycaster(cameraEl.object3D.position, direction);
-            const cursorEl = cursor;
-            const cursorPosition = new THREE.Vector3();
-            cursorEl.object3D.getWorldPosition(cursorPosition);
-            
-            const intersects = raycaster.intersectObjects(scene.object3D.children, true);
-            let targetPosition;
-            
-            if (intersects.length > 0) {
-                const intersect = intersects.find(i => i.object.el && (i.object.el.classList.contains('enemy') || i.object.el.classList.contains('spawner')));
-                if (intersect) {
-                    targetPosition = intersect.point;
-                } else {
-                    targetPosition = cursorPosition;
-                }
-            } else {
-                targetPosition = cursorPosition;
-            }
-            
-            const dummyTarget = { object3D: { position: targetPosition } };
-            fireLaser(camera, '#00FF00', dummyTarget, true);
+            fireLaser(camera, '#00FF00', {object3D: {position: new THREE.Vector3()}}, true);
         }
 
         function updateGame() {
@@ -233,7 +223,7 @@
                         health = Math.max(0, health - 50);
                     }
                     if (Math.random() < 0.01) {
-                        fireLaser(enemy, '#FF0000', player);
+                        fireLaser(enemy, '#FF0000', camera);
                     }
                 }
             });