Hugging Face's logo

Spaces:
fantos
/
3D-Airforce-Simulator
Running

App Files Community
cutechicken commited on
Commit
bc74592
Β·
verified Β·
1 Parent(s): 947ad50

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +49 -33
index.html CHANGED
@@ -287,7 +287,7 @@
287
  width: 100%;
288
  height: 100%;
289
  background: rgba(0,0,0,0.8);
290
- display: flex;
291
  justify-content: center;
292
  align-items: center;
293
  flex-direction: column;
@@ -324,51 +324,58 @@
324
  </style>
325
  </head>
326
  <body>
 
327
  <div id="loading">
328
  <div class="loading-spinner"></div>
329
- <div class="loading-text">Loading tank assets...</div>
 
 
 
 
 
330
  </div>
331
 
332
- <div class="start-screen" id="startScreen">
 
333
  <h1 style="color: #0f0; font-size: 48px; margin-bottom: 20px;">JET FIGHT SIMULATER</h1>
334
  <button class="start-button" onclick="startGame()">Start Game</button>
335
  <div style="color: #0f0; margin-top: 20px; text-align: center;">
336
  <p>Controls:</p>
337
- <p>W,A,S,D - Move Tank</p>
338
- <p>Mouse - Look Around</p>
 
339
  <p>Left Click - Fire</p>
340
- <p>ESC - Pause</p>
341
  </div>
342
  </div>
343
 
344
-
345
  <div id="gameContainer">
346
- <div id="gameTitle">JET FIGHT SIMULATER</div>
347
- <div id="mission">MISSION: DESTROY ENEMY JET</div>
348
- <div id="gameStats">
349
- <div id="score">Score: 0</div>
350
- <div id="time">Time: 180s</div>
351
- </div>
352
- <div id="crosshair"></div>
353
- <div id="detected" style="position: absolute; top: 55%; left: 50%; transform: translate(-50%, -50%); color: red; font-size: 16px; display: none;">DETECTED</div>
354
- <div id="enemyLabels"></div>
355
-
356
- <!-- 체λ ₯λ°” -->
357
- <div id="healthBar">
358
- <div id="health"></div>
359
- </div>
360
-
361
- <!-- μƒˆλ‘œμš΄ 탄약 μ‹œμŠ€ν…œ -->
362
- <div id="ammoDisplay">APFSDS: 1/1</div>
363
-
364
- <!-- λ¦¬λ‘œλ”© ν…μŠ€νŠΈ -->
365
- <div id="reloadingText">RELOADING...</div>
366
-
367
- <!-- λ ˆμ΄λ” -->
368
- <div id="radar">
369
- <div id="radarLine"></div>
 
370
  </div>
371
- </div>
372
 
373
  <script type="importmap">
374
  {
@@ -380,9 +387,18 @@
380
  </script>
381
  <script>
382
  function startGame() {
 
 
 
 
 
 
383
  document.getElementById('startScreen').style.display = 'none';
384
- // 여기에 κ²Œμž„ μ‹œμž‘ 둜직 μΆ”κ°€
385
  document.body.requestPointerLock();
 
 
 
 
386
  }
387
 
388
  // 포인터 락 이벀트 처리
 
287
  width: 100%;
288
  height: 100%;
289
  background: rgba(0,0,0,0.8);
290
+ display: none; /* μ΄ˆκΈ°μ—λŠ” μˆ¨κΉ€ */
291
  justify-content: center;
292
  align-items: center;
293
  flex-direction: column;
 
324
  </style>
325
  </head>
326
  <body>
327
+ <!-- λ‘œλ”© ν™”λ©΄ (μ²˜μŒμ— ν‘œμ‹œλ¨) -->
328
  <div id="loading">
329
  <div class="loading-spinner"></div>
330
+ <div class="loading-text">Loading Fighter Resources...</div>
331
+ <div style="color: #0f0; font-size: 16px; margin-top: 10px;">
332
+ <p>Loading Aircraft Models...</p>
333
+ <p>Loading Audio Assets...</p>
334
+ <p>Preparing Game Environment...</p>
335
+ </div>
336
  </div>
337
 
338
+ <!-- κ²Œμž„ μ‹œμž‘ ν™”λ©΄ (λ‘œλ”© μ™„λ£Œ ν›„ ν‘œμ‹œλ¨) -->
339
+ <div class="start-screen" id="startScreen">
340
  <h1 style="color: #0f0; font-size: 48px; margin-bottom: 20px;">JET FIGHT SIMULATER</h1>
341
  <button class="start-button" onclick="startGame()">Start Game</button>
342
  <div style="color: #0f0; margin-top: 20px; text-align: center;">
343
  <p>Controls:</p>
344
+ <p>W/S - Throttle Control</p>
345
+ <p>A/D - Rudder Control</p>
346
+ <p>Mouse - Aircraft Control</p>
347
  <p>Left Click - Fire</p>
 
348
  </div>
349
  </div>
350
 
351
+ <!-- κ²Œμž„ ν™”λ©΄ -->
352
  <div id="gameContainer">
353
+ <div id="gameTitle">JET FIGHT SIMULATER</div>
354
+ <div id="mission">MISSION: DESTROY ENEMY JET</div>
355
+ <div id="gameStats">
356
+ <div id="score">Score: 0</div>
357
+ <div id="time">Time: 180s</div>
358
+ </div>
359
+ <div id="crosshair"></div>
360
+ <div id="detected" style="position: absolute; top: 55%; left: 50%; transform: translate(-50%, -50%); color: red; font-size: 16px; display: none;">DETECTED</div>
361
+ <div id="enemyLabels"></div>
362
+
363
+ <!-- 체λ ₯λ°” -->
364
+ <div id="healthBar">
365
+ <div id="health"></div>
366
+ </div>
367
+
368
+ <!-- 탄약 ν‘œμ‹œ -->
369
+ <div id="ammoDisplay">AMMO: 300</div>
370
+
371
+ <!-- λ¦¬λ‘œλ”© ν…μŠ€νŠΈ -->
372
+ <div id="reloadingText">RELOADING...</div>
373
+
374
+ <!-- λ ˆμ΄λ” -->
375
+ <div id="radar">
376
+ <div id="radarLine"></div>
377
+ </div>
378
  </div>
 
379
 
380
  <script type="importmap">
381
  {
 
387
  </script>
388
  <script>
389
  function startGame() {
390
+ // κ²Œμž„κ³Ό BGM이 λͺ¨λ‘ μ€€λΉ„λ˜μ—ˆλŠ”μ§€ 확인
391
+ if (!gameInstance || !gameInstance.isLoaded || !gameInstance.isBGMReady) {
392
+ console.log('κ²Œμž„μ΄ 아직 μ€€λΉ„λ˜μ§€ μ•Šμ•˜μŠ΅λ‹ˆλ‹€...');
393
+ return;
394
+ }
395
+
396
  document.getElementById('startScreen').style.display = 'none';
 
397
  document.body.requestPointerLock();
398
+
399
+ // μ¦‰μ‹œ BGM μž¬μƒ μ‹œλ„ (μ‚¬μš©μž 클릭 μ‹œμ )
400
+ gameInstance.startBGM();
401
+ gameInstance.startGame();
402
  }
403
 
404
  // 포인터 락 이벀트 처리