Private
Public Access
1
0

feat: Adding economic system to do scoring

This commit is contained in:
gauvainboiche
2026-03-30 11:28:47 +02:00
parent b19fb262a4
commit c0f66d8cc0
16 changed files with 1303 additions and 145 deletions

View File

@@ -7,19 +7,6 @@
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<!-- Mobile / small-screen notice ───────────────────────────────────────── -->
<div class="mobileOverlay" id="mobileOverlay" aria-live="polite" role="alert">
<div class="mobileOverlayCard">
<div class="mobileOverlayIcon">🚀</div>
<h2 class="mobileOverlayTitle">Desktop only</h2>
<p class="mobileOverlayText">
<strong>Star Wars Wild Space</strong> requires a desktop browser.<br />
The galaxy map is not playable on phones or small screens.<br />
Please open this page on a computer.
</p>
</div>
</div>
<!-- Auth Modal ──────────────────────────────────────────────────────────── -->
<div class="authOverlay" id="authOverlay">
<div class="authModal">
@@ -61,11 +48,11 @@
<div class="authTeamChoice">
<label class="authTeamOption">
<input type="radio" name="regTeam" value="blue" required />
<span class="authTeamBadge authTeamBadge--blue">Blue</span>
<span class="authTeamBadge authTeamBadge--blue">Resistance</span>
</label>
<label class="authTeamOption">
<input type="radio" name="regTeam" value="red" />
<span class="authTeamBadge authTeamBadge--red">Red</span>
<span class="authTeamBadge authTeamBadge--red">First Order</span>
</label>
</div>
</div>
@@ -75,13 +62,13 @@
</div>
</div>
<!-- Debug team switcher (only visible when debugModeForTeams is enabled) -->
<!-- Debug team switcher (only visible when admin unlocked) -->
<div class="teamCorner teamCorner--hidden" id="teamCorner">
<span class="teamCornerLabel">Team</span>
<div class="teamSegmented" role="group" aria-label="Active team">
<div class="teamSegmentedTrack" id="teamSegmentedTrack" data-active="blue">
<button type="button" class="teamSegmentedBtn" id="teamBlue" data-team="blue">Blue</button>
<button type="button" class="teamSegmentedBtn" id="teamRed" data-team="red">Red</button>
<button type="button" class="teamSegmentedBtn" id="teamBlue" data-team="blue">Resistance</button>
<button type="button" class="teamSegmentedBtn" id="teamRed" data-team="red">First Order</button>
</div>
</div>
</div>
@@ -90,23 +77,28 @@
<div class="app">
<!-- ── Left information column ────────────────────────────────────────── -->
<aside class="infoColumn">
<aside class="infoColumn" id="infoColumn">
<!-- Mobile close button -->
<button type="button" id="closeMenuBtn" class="closeMenuBtn" aria-label="Close menu"></button>
<div class="infoSection infoSection--title">
<div class="h1">Star Wars Wild Space</div>
<div class="sub">100×100 — exploitable ring only (inner Ø60, outer Ø100)</div>
<div class="sub">100×100 — exploitable zone from playground SVG map</div>
</div>
<!-- Team score display -->
<div class="scoreBoard" id="scoreBoard">
<span class="scoreTeam scoreTeam--blue">
<span class="scoreTeamName">Blue</span>
<img src="./graphism/logo_resistance.svg" alt="Resistance" class="team-logo" />
<span class="scoreTeamName">Resistance</span>
<span class="scoreValue" id="scoreBlue">0</span>
</span>
<span class="scoreSep"></span>
<span class="scoreTeam scoreTeam--red">
<span class="scoreValue" id="scoreRed">0</span>
<span class="scoreTeamName">Red</span>
<span class="scoreTeamName">First Order</span>
<img src="./graphism/logo_first_order.svg" alt="First Order" class="team-logo" />
</span>
</div>
@@ -127,38 +119,87 @@
</span>
</div>
<div class="infoRow">
<span class="infoKey muted">clickCooldownSeconds</span>
<span class="infoKey muted">Temps avant prochain clic</span>
<code class="infoVal" id="cooldownConfig"></code>
</div>
<div class="infoRow">
<span class="infoKey muted">worldSeed</span>
<span class="infoKey muted">Graine de la carte</span>
<code class="infoVal" id="worldSeedDisplay"></code>
</div>
<div class="infoRow">
<span class="infoKey muted">next period (UTC)</span>
<span class="infoKey muted">Prochaine graine (UTC)</span>
<code class="infoVal" id="nextPeriodUtc"></code>
</div>
<div class="infoRow">
<span class="infoKey muted">resets in</span>
<span class="infoKey muted">Prochaine graine dans</span>
<code class="infoVal" id="refreshCountdown">--:--:--</code>
</div>
</div>
<div class="controls">
<button id="refreshBtn" type="button">Refresh</button>
<!-- Planet stats (collapsible) -->
<details class="panel panelCollapsible" id="planetStatsDetails" open>
<summary class="panelTitle panelTitleSummary">🪐 Planet stats</summary>
<pre id="details" class="details details--hidden">Stats are hidden until you click a tile.</pre>
</details>
<!-- Team income summary + cumulative economic score -->
<div class="econSummary">
<!-- Row 1: income per second -->
<div class="econSummaryRow">
<span class="econSummaryTeam econSummaryTeam--blue">
<span class="econSummaryLabel">Résistance</span>
<span class="econSummaryVal" id="incomeBlue">+0.000/s</span>
</span>
<span class="econSummarySep"></span>
<span class="econSummaryTeam econSummaryTeam--red">
<span class="econSummaryVal" id="incomeRed">+0.000/s</span>
<span class="econSummaryLabel">Premier Ordre</span>
</span>
</div>
<!-- Row 2: cumulative economic score -->
<div class="econSummaryRow econSummaryRow--score">
<span class="econSummaryTeam econSummaryTeam--blue">
<span class="econScoreVal" id="econScoreBlue">0.000</span>
<span class="econDelta" id="econDeltaBlue"></span>
</span>
<span class="econSummarySep"></span>
<span class="econSummaryTeam econSummaryTeam--red">
<span class="econDelta" id="econDeltaRed"></span>
<span class="econScoreVal" id="econScoreRed">0.000</span>
</span>
</div>
</div>
<!-- Selection details panel -->
<div class="panel">
<div class="panelTitle">Selection</div>
<pre id="details" class="details details--hidden">Stats are hidden until you click a tile.</pre>
<!-- Resources overview (collapsible) -->
<details class="panel panelCollapsible">
<summary class="panelTitle panelTitleSummary">💰 Ressources économiques</summary>
<div id="resourceTableBody" class="econTableWrap">
<p class="econEmpty">Chargement…</p>
</div>
</details>
<!-- Admin / options section -->
<div class="infoSection infoSection--options">
<details class="optionsDetails">
<summary class="optionsSummary">⚙ Options</summary>
<div class="optionsPanel">
<div class="authField">
<label>Admin password</label>
<input type="password" id="adminPasswordInput" placeholder="Enter admin password" autocomplete="off" />
</div>
<button type="button" id="adminUnlockBtn" class="adminUnlockBtn">Unlock</button>
<div id="adminStatus" class="adminStatus hidden"></div>
</div>
</details>
</div>
</aside>
<!-- ── Galaxy (square, anchored to the right edge) ────────────────────── -->
<!-- ── Galaxy (square, 1000×1000, fixed ratio) ────────────────────────── -->
<main class="galaxyMain">
<canvas id="canvas" width="800" height="800"></canvas>
<!-- Mobile burger button -->
<button type="button" id="burgerBtn" class="burgerBtn" aria-label="Open menu"></button>
<canvas id="canvas" width="1000" height="1000"></canvas>
<div id="hint" class="hint">Click a cell in the ring. Planet stats stay hidden until you reveal a tile.</div>
</main>