Bonchellon/Star-wars-card-game
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

123

Browse Source
This commit is contained in:
Bonchellon
2026-01-27 22:57:31 +03:00
parent 14d46962d4
commit e1533ea03d
4 changed files with 102 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
public/index.html
View File

@ -11,6 +11,7 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;800&family=Rajdhani:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="starwars-glyphicons/css/starwars-glyphicons.css">
<script src="https://unpkg.com/lucide@latest"></script>
<link rel="stylesheet" href="styles.css">
</head>
<body>
@ -29,8 +30,8 @@
</h1>
<p class="subtitle">PvP до 4 игроков · Игра с ИИ · Работает через Radmin VPN</p>
<button type="button" id="btn-instructions-lobby" class="btn-instructions-lobby" title="Как играть">?</button>
<button type="button" id="btn-cards-gallery" class="btn-instructions-lobby" title="Галерея карт" style="right: 3.5rem;">📚</button>
<button type="button" id="btn-settings-lobby" class="btn-settings-lobby" title="Настройки">⚙</button>
<button type="button" id="btn-cards-gallery" class="btn-instructions-lobby" title="Галерея карт" style="right: 3.5rem;"><i data-lucide="book-open"></i></button>
<button type="button" id="btn-settings-lobby" class="btn-settings-lobby" title="Настройки"><i data-lucide="settings"></i></button>
<div class="lobby-tabs">
<button type="button" class="tab active" data-tab="host">Создать игру</button>
@ -91,7 +92,7 @@
<div id="browse-panel" class="panel hidden">
<label>Ваше имя</label>
<input type="text" id="browse-name" placeholder="Игрок" maxlength="20" />
<button type="button" id="btn-refresh-rooms" class="btn btn-ghost" style="margin-top: 0.5rem;">🔄 Обновить список</button>
<button type="button" id="btn-refresh-rooms" class="btn btn-ghost" style="margin-top: 0.5rem;"><i data-lucide="refresh-cw" style="width: 16px; height: 16px; margin-right: 0.5rem; vertical-align: middle;"></i>Обновить список</button>
<div id="rooms-list" class="rooms-list" style="margin-top: 1rem; max-height: 400px; overflow-y: auto;">
<p class="hint" style="text-align: center; padding: 2rem; color: #94a3b8;">Нажмите "Обновить список" для поиска игр</p>
</div>
@ -103,7 +104,7 @@
<div id="cards-gallery-overlay" class="modal-overlay hidden">
<div class="modal cards-gallery-modal">
<h2>📚 Галерея карт</h2>
<h2><i data-lucide="book-open" style="width: 20px; height: 20px; vertical-align: middle; margin-right: 0.5rem;"></i>Галерея карт</h2>
<div class="gallery-controls">
<select id="gallery-faction-filter" class="gallery-filter">
<option value="">Все фракции</option>
@ -190,18 +191,18 @@
<header class="game-header">
<div class="header-left">
<span class="mana-display">
<i class="swg swg-credits mana-icon" aria-hidden="true"></i>
<i data-lucide="zap" style="width: 18px; height: 18px; color: #00d4ff;"></i>
<span id="your-mana">0</span>/<span id="your-max-mana">0</span>
</span>
<span class="health-display">
<i class="swg swg-deathstar health-icon" aria-hidden="true"></i>
<i data-lucide="heart" style="width: 18px; height: 18px; color: #e63946;"></i>
<span id="your-health">30</span>
</span>
<span class="armor-display" id="armor-display" style="display: none;">
<i class="swg swg-deathstar armor-icon" aria-hidden="true"></i>
<i data-lucide="shield" style="width: 18px; height: 18px; color: #5eb3e8;"></i>
<span id="your-armor">0</span>
</span>
<span class="deck-count"><i class="swg swg-galrep deck-icon" aria-hidden="true"></i><span id="your-deck">0</span> в колоде</span>
<span class="deck-count"><i data-lucide="book-open" style="width: 16px; height: 16px; color: var(--gold); margin-right: 0.2rem; vertical-align: middle;"></i><span id="your-deck">0</span> в колоде</span>
</div>
<div class="header-center">
<span class="turn-badge" id="turn-badge">Ход 1</span>
@ -212,7 +213,7 @@
<button type="button" id="btn-reset-lobby" class="btn btn-ghost hidden" title="Сбросить игру и вернуться в лобби">Вернуться в лобби</button>
</div>
<div class="header-right">
<button type="button" id="btn-cards-gallery-game" class="btn-instructions" title="Галерея карт" style="right: 3.5rem;">📚</button>
<button type="button" id="btn-cards-gallery-game" class="btn-instructions" title="Галерея карт" style="right: 3.5rem;"><i data-lucide="book-open"></i></button>
<button type="button" id="btn-instructions" class="btn-instructions" title="Инструкция">?</button>
<button type="button" id="btn-settings" class="btn-settings" title="Настройки">⚙</button>
</div>
@ -256,7 +257,7 @@
<h2 id="modal-title">Результат</h2>
<p id="modal-body"></p>
<div class="modal-actions" style="display: flex; gap: 0.5rem; margin-top: 1rem; justify-content: center;">
<button type="button" id="btn-new-game" class="btn btn-primary" style="display: none;">🔄 Новая игра</button>
<button type="button" id="btn-new-game" class="btn btn-primary" style="display: none;"><i data-lucide="refresh-cw" style="width: 16px; height: 16px; margin-right: 0.5rem; vertical-align: middle;"></i>Новая игра</button>
<button type="button" id="btn-modal-close" class="btn btn-ghost">Закрыть</button>
</div>
</div>
@ -330,7 +331,7 @@
</div>
<div id="steal-cards-overlay" class="modal-overlay hidden">
<div class="modal steal-cards-modal">
<h2>⚔ Грабеж</h2>
<h2><i data-lucide="swords" style="width: 20px; height: 20px; vertical-align: middle; margin-right: 0.5rem;"></i>Грабеж</h2>
<p class="hint" id="steal-cards-hint" style="font-size: 0.85rem; margin-bottom: 1rem;">Выберите противника и до 2 карт из его колоды</p>
<div id="steal-target-select" class="steal-target-select"></div>
<div id="steal-deck-list" class="steal-deck-list hidden"></div>
@ -366,5 +367,18 @@
<script src="sounds.js"></script>
<script src="music.js"></script>
<script src="game.js"></script>
<script>
// Инициализация Lucide Icons после загрузки всех скриптов
if (typeof lucide !== 'undefined') {
document.addEventListener('DOMContentLoaded', () => {
lucide.createIcons();
// Обновляем иконки при изменении DOM
const observer = new MutationObserver(() => {
lucide.createIcons();
});
observer.observe(document.body, { childList: true, subtree: true });
});
}
</script>
</body>
</html>