Update index.html

index.html

@@ -1040,9 +1040,129 @@
                         threat.style.top = `${y}px`;
                         
                         rwrThreats.appendChild(threat);
+                        
+                        // 락온 중인 적이면 RWR에 방향선 표시
+                        if (enemy.isLocking && enemy.lockTarget === fighter) {
+                            const lockLine = document.createElement('div');
+                            lockLine.className = 'rwr-lock-line';
+                            
+                            // 중앙에서 적까지의 선
+                            const lineLength = Math.sqrt(Math.pow(x - 100, 2) + Math.pow(y - 100, 2));
+                            const lineAngle = Math.atan2(y - 100, x - 100);
+                            
+                            lockLine.style.width = `${lineLength}px`;
+                            lockLine.style.left = '100px';
+                            lockLine.style.top = '100px';
+                            lockLine.style.transform = `rotate(${lineAngle}rad)`;
+                            
+                            rwrThreats.appendChild(lockLine);
+                        }
                     }
                 });
             }
+            
+            // 락온 경고 화살표 업데이트
+            updateLockWarningArrows(fighter);
+            
+            // 미사일 거리 경고 업데이트
+            updateMissileWarnings(fighter);
+        }
+        
+        // 락온 경고 화살표 표시
+        function updateLockWarningArrows(fighter) {
+            // 기존 화살표 제거
+            const existingArrows = document.querySelectorAll('.lock-warning-arrow');
+            existingArrows.forEach(arrow => arrow.remove());
+            
+            if (!fighter.beingLockedBy || fighter.beingLockedBy.length === 0) return;
+            
+            fighter.beingLockedBy.forEach(enemy => {
+                if (!enemy.position) return;
+                
+                // 화면 밖에 있는 적만 화살표 표시
+                const screenPos = getScreenPosition(enemy.position);
+                if (screenPos) return; // 화면 안에 있으면 화살표 불필요
+                
+                // 상대 위치 계산
+                const relativePos = enemy.position.clone().sub(fighter.position);
+                const angle = Math.atan2(relativePos.x, relativePos.z) - fighter.rotation.y;
+                
+                const arrow = document.createElement('div');
+                arrow.className = 'lock-warning-arrow';
+                
+                // 화면 가장자리에 화살표 배치
+                const screenCenterX = window.innerWidth / 2;
+                const screenCenterY = window.innerHeight / 2;
+                const edgeDistance = Math.min(screenCenterX - 100, screenCenterY - 100);
+                
+                const arrowX = screenCenterX + Math.sin(angle) * edgeDistance;
+                const arrowY = screenCenterY - Math.cos(angle) * edgeDistance;
+                
+                arrow.style.left = `${arrowX}px`;
+                arrow.style.top = `${arrowY}px`;
+                
+                // 화살표 회전
+                const rotationAngle = angle * (180 / Math.PI);
+                arrow.style.transform = `translate(-50%, -50%) rotate(${rotationAngle}deg)`;
+                
+                document.body.appendChild(arrow);
+            });
+        }
+        
+        // 미사일 거리 경고 표시
+        function updateMissileWarnings(fighter) {
+            // 기존 경고 패널 제거
+            const existingPanel = document.querySelector('.missile-warning-panel');
+            if (existingPanel) existingPanel.remove();
+            
+            if (!fighter.incomingMissiles || fighter.incomingMissiles.length === 0) return;
+            
+            const panel = document.createElement('div');
+            panel.className = 'missile-warning-panel';
+            
+            fighter.incomingMissiles.forEach((missile, index) => {
+                if (!missile.position) return;
+                
+                const distance = Math.round(fighter.position.distanceTo(missile.position));
+                
+                const warningItem = document.createElement('div');
+                warningItem.className = 'missile-warning-item';
+                warningItem.textContent = `MISSILE ${index + 1}: ${distance}m`;
+                
+                // 거리에 따른 색상 강조
+                if (distance < 500) {
+                    warningItem.style.fontSize = '20px';
+                    warningItem.style.color = '#ff0000';
+                    warningItem.style.textShadow = '0 0 10px #ff0000, 0 0 20px #ff0000';
+                } else if (distance < 1000) {
+                    warningItem.style.fontSize = '18px';
+                }
+                
+                panel.appendChild(warningItem);
+            });
+            
+            document.body.appendChild(panel);
+        }
+        
+        // 3D 위치를 화면 좌표로 변환하는 헬퍼 함수
+        function getScreenPosition(worldPosition) {
+            if (!window.gameInstance || !window.gameInstance.camera) return null;
+            
+            const vector = worldPosition.clone();
+            vector.project(window.gameInstance.camera);
+            
+            // 카메라 뒤에 있는 객체는 null 반환
+            if (vector.z > 1) return null;
+            
+            const x = (vector.x * 0.5 + 0.5) * window.innerWidth;
+            const y = (-vector.y * 0.5 + 0.5) * window.innerHeight;
+            
+            // 화면 밖에 있으면 null 반환
+            if (x < 0 || x > window.innerWidth || y < 0 || y > window.innerHeight) {
+                return null;
+            }
+            
+            return { x, y };
         }
         
         // startGame 함수 정의