From 169aa0e72bf3b5b0e29a628a6854918a5fcb1c89 Mon Sep 17 00:00:00 2001 From: Didictateur Date: Sat, 14 Mar 2026 10:40:49 +0100 Subject: [PATCH] turn indicator --- frontend/pages/riichi/chap5.html | 71 ++++++++++++++++++++++++++++++++ 1 file changed, 71 insertions(+) diff --git a/frontend/pages/riichi/chap5.html b/frontend/pages/riichi/chap5.html index 0f6cf73..4d42749 100644 --- a/frontend/pages/riichi/chap5.html +++ b/frontend/pages/riichi/chap5.html @@ -137,6 +137,20 @@ z-index: 2; } + #game-info { + position: absolute; + top: 65.5%; + left: 49%; + transform: translate(-50%, -50%); + width: 259px; + height: 259px; + background-color: #f5f5f0; + border-radius: 20px; + padding: 20px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + z-index: 1; + } + #discard-0 { position: absolute; transform: translate(-50%, 50%); @@ -192,6 +206,43 @@ height: 65px; width: 48px; } + + .turn-indicator { + position: absolute; + display: none; + height: 6px; + background: linear-gradient(90deg, #FFD700, #FFA500); + border-radius: 3px; + box-shadow: 0 0 10px rgba(255, 215, 0, 0.6), inset 0 1px 2px rgba(255, 255, 255, 0.3); + } + + #turn-indicator-0 { + transform: translate(-50%, 50%); + bottom: 20%; + left: 49%; + width: 250px; + } + + #turn-indicator-1 { + transform: translate(-50%, -400%) rotate(-90deg) translate(0%, 450%); + bottom: 32.5%; + left: 61%; + width: 250px; + } + + #turn-indicator-2 { + transform: translate(-50%, -400%) rotate(180deg) translate(0%, 450%); + bottom: 44%; + left: 49%; + width: 250px; + } + + #turn-indicator-3 { + transform: translate(-50%, -400%) rotate(90deg) translate(0%, 450%); + bottom: 32%; + left: 37%; + width: 250px; + } @@ -204,14 +255,19 @@
+
+
+
+
+
@@ -272,6 +328,7 @@ if (currentIdx !== -1) { game.discard(0, currentIdx); game.nextTurn(); + updateTurnIndicator(); renderHands(); renderDiscards(); playBotsSequentially(); @@ -304,6 +361,7 @@ // Défausser la tuile piochée (index === tiles.length) game.discard(0, game.hands[0].tiles.length); game.nextTurn(); + updateTurnIndicator(); renderHands(); renderDiscards(); playBotsSequentially(); @@ -354,6 +412,7 @@ await new Promise(resolve => setTimeout(resolve, 800)); game.botPlay(); game.nextTurn(); + updateTurnIndicator(); renderHands(); renderDiscards(); } @@ -362,7 +421,19 @@ renderDiscards(); } + function updateTurnIndicator() { + for (let i = 0; i < 4; i++) { + const indicator = document.getElementById(`turn-indicator-${i}`); + if (i === game.turn) { + indicator.style.display = 'block'; + } else { + indicator.style.display = 'none'; + } + } + } + renderHands(); + updateTurnIndicator(); });