From 481de452766a11ab318842bceab935d435a8892c Mon Sep 17 00:00:00 2001
From: DeNNiiInc <dennii.inc@gmail.com>
Date: Sun, 21 Dec 2025 17:52:12 +1100
Subject: [PATCH] Merge turn indicator with player indicator at top

- Added ID to turn label for easier updates
- Updated multiplayer.js to use turnLabel ID
- Reset turn label when switching modes or resetting game
- Improved UX by keeping player/turn info together
---
 game.js        | 7 +++++++
 index.html     | 8 +++++++-
 multiplayer.js | 3 ++-
 3 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/game.js b/game.js
index 35c538a..23f5d90 100644
--- a/game.js
+++ b/game.js
@@ -243,6 +243,13 @@ class Connect5Game {
     this.currentPlayer = "X";
     this.gameActive = true;
     this.hideVictoryOverlay();
+    
+    // Reset turn label to default
+    const turnLabel = document.getElementById('turnLabel');
+    if (turnLabel) {
+      turnLabel.textContent = 'Current Turn:';
+    }
+    
     this.initializeBoard();
   }
 }
diff --git a/index.html b/index.html
index 93f8aea..5e7fec9 100644
--- a/index.html
+++ b/index.html
@@ -67,7 +67,7 @@
 
           <div class="game-info">
             <div class="turn-indicator">
-              <span class="label">Current Turn:</span>
+              <span class="label" id="turnLabel">Current Turn:</span>
               <div class="player-display">
                 <span class="player-marker" id="currentPlayer">X</span>
               </div>
@@ -281,6 +281,12 @@
           if (window.multiplayerClient) {
             window.multiplayerClient.isMultiplayer = false;
           }
+          
+          // Reset turn label to default
+          const turnLabel = document.getElementById('turnLabel');
+          if (turnLabel) {
+            turnLabel.textContent = 'Current Turn:';
+          }
         } else {
           localBtn.classList.remove('active');
           multiplayerBtn.classList.add('active');
diff --git a/multiplayer.js b/multiplayer.js
index 9c9430f..28c69b5 100644
--- a/multiplayer.js
+++ b/multiplayer.js
@@ -372,8 +372,9 @@ class MultiplayerClient {
         
         // Update current player display to show "YOU ARE X/O"
         const currentPlayerDisplay = document.getElementById('currentPlayer');
+        const turnLabel = document.getElementById('turnLabel');
         currentPlayerDisplay.textContent = this.mySymbol;
-        currentPlayerDisplay.parentElement.previousElementSibling.textContent = `You are:`;
+        turnLabel.textContent = `You are:`;
         
         // Update player display colors based on symbol
         const playerDisplay = document.querySelector('.player-display');