136 lines
6.6 KiB
HTML
136 lines
6.6 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Симулятор Бомжа 3D</title>
|
||
<link rel="stylesheet" href="css/style.css">
|
||
</head>
|
||
<body>
|
||
<div id="game-wrapper">
|
||
<div id="game-header">
|
||
<h1>🏚️ СИМУЛЯТОР БОМЖА 3D</h1>
|
||
<div id="day-time">
|
||
<span id="day-display">День 1</span>
|
||
<span id="time-display">08:00</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="game-container">
|
||
<div id="game-canvas"></div>
|
||
|
||
<!-- UI Overlay -->
|
||
<div id="ui-overlay">
|
||
<!-- Stats Panel -->
|
||
<div id="stats-panel" class="panel">
|
||
<div class="stat-row">
|
||
<div class="stat-icon">❤️</div>
|
||
<div class="stat-bar-container">
|
||
<div class="stat-bar health-bar" id="health-bar"></div>
|
||
</div>
|
||
<span class="stat-value" id="health-value">100</span>
|
||
</div>
|
||
<div class="stat-row">
|
||
<div class="stat-icon">⚡</div>
|
||
<div class="stat-bar-container">
|
||
<div class="stat-bar energy-bar" id="energy-bar"></div>
|
||
</div>
|
||
<span class="stat-value" id="energy-value">100</span>
|
||
</div>
|
||
<div class="stat-row">
|
||
<div class="stat-icon">💰</div>
|
||
<span class="stat-value money-value" id="money-value">0₽</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Location Bar -->
|
||
<div id="location-bar">
|
||
<span id="location-icon">🏙️</span>
|
||
<span id="location-name">Улица</span>
|
||
</div>
|
||
|
||
<!-- Inventory Panel -->
|
||
<div id="inventory-panel" class="panel">
|
||
<div class="panel-header">
|
||
<span>🎒 Рюкзак</span>
|
||
<span id="inv-count">0/10</span>
|
||
</div>
|
||
<div id="inventory-grid"></div>
|
||
</div>
|
||
|
||
<!-- Locations Menu -->
|
||
<div id="locations-panel" class="panel">
|
||
<div class="panel-header">🚇 Локации</div>
|
||
<button class="loc-btn" data-location="street" onclick="Game.changeLocation('street')">
|
||
<span>🏙️</span> Улица
|
||
</button>
|
||
<button class="loc-btn" data-location="subway" onclick="Game.changeLocation('subway')">
|
||
<span>🚇</span> Метро
|
||
</button>
|
||
<button class="loc-btn" data-location="park" onclick="Game.changeLocation('park')">
|
||
<span>🌳</span> Парк
|
||
</button>
|
||
<button class="loc-btn" data-location="hospital" onclick="Game.changeLocation('hospital')">
|
||
<span>🏥</span> Больница
|
||
</button>
|
||
<button class="loc-btn" data-location="shelter" onclick="Game.changeLocation('shelter')">
|
||
<span>🏠</span> Приют
|
||
</button>
|
||
</div>
|
||
|
||
<!-- Action Hint -->
|
||
<div id="action-hint">Нажми <span class="key">E</span></div>
|
||
</div>
|
||
|
||
<!-- Message Modal -->
|
||
<div id="message-modal" class="modal">
|
||
<div id="message-icon"></div>
|
||
<div id="message-text"></div>
|
||
<button class="modal-btn" onclick="UI.closeMessage()">ОК</button>
|
||
</div>
|
||
|
||
<!-- Title Screen -->
|
||
<div id="title-screen">
|
||
<div class="title-logo">🏚️</div>
|
||
<h1>СИМУЛЯТОР БОМЖА 3D</h1>
|
||
<p class="subtitle">Выживание на улице</p>
|
||
<button class="start-btn" onclick="initGame()">НАЧАТЬ ИГРУ</button>
|
||
<div class="controls-info">
|
||
<div><span class="key">W A S D</span> Ходить</div>
|
||
<div><span class="key">E</span> Взаимодействовать</div>
|
||
<div><span class="key">I</span> Инвентарь</div>
|
||
<div><span class="key">C</span> Крафтинг</div>
|
||
<div><span class="key">Q</span> Квесты</div>
|
||
<div><span class="key">P</span> Магазин</div>
|
||
<div><span class="key">L</span> Ломбард</div>
|
||
<div><span class="key">M</span> Карта</div>
|
||
<div><span class="key">ПРОБЕЛ</span> Атаковать</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="game-footer">
|
||
<span>🏚️ Homeless Simulator 3D v1.0</span>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/postprocessing/EffectComposer.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/postprocessing/RenderPass.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/postprocessing/UnrealBloomPass.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/postprocessing/FilmPass.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/shaders/LuminosityHighPassShader.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/shaders/CopyShader.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/postprocessing/ShaderPass.js"></script>
|
||
<script src="js/data.js"></script>
|
||
<script src="js/textures.js"></script>
|
||
<script src="js/audio.js"></script>
|
||
<script src="js/player3d.js"></script>
|
||
<script src="js/map3d.js"></script>
|
||
<script src="js/objects3d.js"></script>
|
||
<script src="js/effects3d.js"></script>
|
||
<script src="js/ui.js"></script>
|
||
<script src="js/game3d.js"></script>
|
||
</body>
|
||
</html>
|