feat: New features (research, invest, gambling, new game+, trophies)

This commit is contained in:
gauvainboiche
2026-10-08 14:03:00 +02:00
parent 1caa4d92b9
commit fc0d5e3ba4
56 changed files with 4332 additions and 249 deletions
+45 -35
View File
@@ -14,48 +14,49 @@
<body>
<header class="topbar">
<h1 class="topbar__title" id="game-title" data-i18n="theme.title">Idle Clicker</h1>
<div class="topbar__controls">
<label class="field">
<span class="field__label" data-i18n="ui.theme">Theme</span>
<select id="theme-select"></select>
</label>
<label class="field">
<span class="field__label" data-i18n="ui.language">Language</span>
<select id="locale-select"></select>
</label>
<button class="btn btn--ghost" id="open-settings" type="button" data-i18n="ui.settings">Save &amp; settings</button>
</div>
<button class="btn btn--ghost menu-toggle" id="menu-toggle" type="button" aria-expanded="false" aria-controls="menu">
<span aria-hidden="true">☰</span> <span data-i18n="ui.menu">Menu</span>
</button>
<!-- Tabs + controls: a burger menu on phones, a tab bar from tablet width (see css/layout.css) -->
<nav class="menu" id="menu" data-i18n-attr="aria-label:ui.menu">
<ul class="tabs" id="tabs"></ul>
<div class="menu__controls">
<label class="field">
<span class="field__label" data-i18n="ui.theme">Theme</span>
<select id="theme-select"></select>
</label>
<label class="field">
<span class="field__label" data-i18n="ui.language">Language</span>
<select id="locale-select"></select>
</label>
<button class="btn btn--ghost" id="open-settings" type="button" data-i18n="ui.settings">Save &amp; settings</button>
</div>
</nav>
</header>
<!-- Always visible, whichever section is open -->
<section class="resourcebar" aria-label="Resources">
<div class="res res--primary">
<span class="icon icon--placeholder" aria-hidden="true" data-icon="res.units"></span>
<div><span class="res__label" data-i18n="theme.res.units"></span><strong id="v-units">0</strong></div>
</div>
<div class="res">
<span class="icon icon--placeholder" aria-hidden="true" data-icon="res.funds"></span>
<div><span class="res__label" data-i18n="theme.res.funds"></span><strong id="v-funds">0</strong></div>
</div>
<div class="res">
<span class="icon icon--placeholder" aria-hidden="true" data-icon="res.material"></span>
<div><span class="res__label" data-i18n="theme.res.material"></span><strong id="v-material">0</strong></div>
</div>
</section>
<p class="banner" id="cookie-warning" hidden data-i18n="toast.cookiesBlocked"></p>
<main class="game" id="game">
<main class="views">
<div class="game" id="game" data-view="main">
<!-- Overview -->
<section class="panel panel--stats" aria-labelledby="h-stats">
<h2 class="panel__title" id="h-stats" data-i18n="ui.overview">Overview</h2>
<div class="tiles">
<div class="tile tile--primary">
<span class="icon icon--placeholder" aria-hidden="true" data-icon="res.units"></span>
<div>
<span class="tile__label" data-i18n="theme.res.units"></span>
<strong class="tile__value" id="v-units">0</strong>
</div>
</div>
<div class="tile">
<span class="icon icon--placeholder" aria-hidden="true" data-icon="res.funds"></span>
<div>
<span class="tile__label" data-i18n="theme.res.funds"></span>
<strong class="tile__value" id="v-funds">0</strong>
</div>
</div>
<div class="tile">
<span class="icon icon--placeholder" aria-hidden="true" data-icon="res.material"></span>
<div>
<span class="tile__label" data-i18n="theme.res.material"></span>
<strong class="tile__value" id="v-material">0</strong>
</div>
</div>
</div>
<dl class="stats">
<div><dt data-i18n="ui.totalProduced"></dt><dd id="v-total">0</dd></div>
<div><dt data-i18n="ui.production"></dt><dd id="v-rate">0</dd></div>
@@ -120,6 +121,15 @@
<p class="hint" id="upgrades-empty" data-i18n="ui.noUpgrades"></p>
<ul class="cards" id="upgrades"></ul>
</section>
</div>
<!-- The other sections are built by js/ui/*View.js; they unlock with progress -->
<div class="view" data-view="contracts" id="view-contracts" hidden></div>
<div class="view" data-view="invest" id="view-invest" hidden></div>
<div class="view" data-view="research" id="view-research" hidden></div>
<div class="view" data-view="gamble" id="view-gamble" hidden></div>
<div class="view" data-view="legacy" id="view-legacy" hidden></div>
<div class="view" data-view="achievements" id="view-achievements" hidden></div>
</main>
<!-- Save & settings -->