Update index.html

index.html

@@ -511,6 +511,90 @@
         }
     </script>
     
+    <!-- 피치 래더 및 HUD 업데이트 스크립트 -->
+    <script>
+        // 전역 변수
+        let gameStarted = false;
+        
+        // 게임 준비 완료 시 HUD 업데이트 시작
+        window.addEventListener('gameReady', function() {
+            // 중앙 HUD 정보 업데이트를 위한 인터벌
+            setInterval(function() {
+                if (window.gameInstance && window.gameInstance.fighter && window.gameInstance.fighter.isLoaded) {
+                    const fighter = window.gameInstance.fighter;
+                    
+                    // 비행 정보 계산
+                    const speedKnots = Math.round(fighter.speed * 1.94384);
+                    const altitudeMeters = Math.round(fighter.altitude);
+                    const throttlePercent = Math.round(fighter.throttle * 100);
+                    const gForce = fighter.gForce.toFixed(1);
+                    const headingDegrees = Math.round(((fighter.rotation.y * (180 / Math.PI)) + 360) % 360);
+                    
+                    // 중앙 HUD 정보 업데이트
+                    const hudSpeedCentral = document.getElementById('hudSpeedCentral');
+                    const hudAltitudeCentral = document.getElementById('hudAltitudeCentral');
+                    const hudHeadingCentral = document.getElementById('hudHeadingCentral');
+                    const hudGForceCentral = document.getElementById('hudGForceCentral');
+                    const hudThrottleCentral = document.getElementById('hudThrottleCentral');
+                    
+                    if (hudSpeedCentral) hudSpeedCentral.textContent = `SPD: ${speedKnots} KT`;
+                    if (hudAltitudeCentral) hudAltitudeCentral.textContent = `ALT: ${altitudeMeters} M`;
+                    if (hudHeadingCentral) hudHeadingCentral.textContent = `HDG: ${String(headingDegrees).padStart(3, '0')}°`;
+                    if (hudGForceCentral) {
+                        hudGForceCentral.textContent = `G: ${gForce}`;
+                        // G-Force에 따른 색상 변경
+                        if (fighter.overG) {
+                            hudGForceCentral.style.color = '#ff0000';
+                        } else if (parseFloat(gForce) > 7) {
+                            hudGForceCentral.style.color = '#ffff00';
+                        } else {
+                            hudGForceCentral.style.color = '#00ff00';
+                        }
+                    }
+                    if (hudThrottleCentral) hudThrottleCentral.textContent = `THR: ${throttlePercent}%`;
+                    
+                    // 피치 래더 업데이트 - 전투기가 수평일 때 0도가 중앙에 오도록
+                    const pitchLadder = document.getElementById('pitchLadder');
+                    if (pitchLadder) {
+                        const pitchDegrees = fighter.rotation.x * (180 / Math.PI);
+                        // 10도당 20픽셀, 음수로 반대 방향
+                        const pitchOffset = -pitchDegrees * 2;
+                        pitchLadder.style.transform = `translateY(${pitchOffset}px)`;
+                    }
+                    
+                    // HUD 크로스헤어 회전 (롤 각도에 따라)
+                    const hudCrosshair = document.getElementById('hudCrosshair');
+                    if (hudCrosshair && fighter.rotation) {
+                        const rollDegrees = fighter.rotation.z * (180 / Math.PI);
+                        hudCrosshair.style.transform = `translate(-50%, -50%) rotate(${-rollDegrees}deg)`;
+                    }
+                }
+            }, 16); // 약 60fps
+        });
+        
+        // startGame 함수 정의
+        window.startGame = function() {
+            if (!window.gameInstance || !window.gameInstance.isLoaded || !window.gameInstance.isBGMReady) {
+                console.log('게임이 아직 준비되지 않았습니다...');
+                return;
+            }
+            
+            gameStarted = true;
+            document.getElementById('startScreen').style.display = 'none';
+            
+            // 게임 타이틀 숨기기
+            const gameTitle = document.getElementById('gameTitle');
+            if (gameTitle) {
+                gameTitle.style.display = 'none';
+            }
+            
+            document.body.requestPointerLock();
+            
+            window.gameInstance.startBGM();
+            window.gameInstance.startGame();
+        }
+    </script>
+    
     <script src="game.js" type="module"></script>
 </body>
 </html>