add name display

docker-compose.yml

@@ -5,7 +5,5 @@ services:
     build:
       context: .
       dockerfile: Dockerfile
-      args:
-        GOARCH: arm
     ports:
       - "8080:8080"

main.go

@@ -162,36 +162,44 @@ func wsHandler(w http.ResponseWriter, r *http.Request) {
 			game.GameStatus.Message = "Please make your move"
 		} else if opponent.Move == "" {
 
-			game.GameStatus.Message = "Waiting for opponent"
+			game.GameStatus.Message = fmt.Sprintf("Waiting for %s\n", opponent.Name)
 
 		} else {
 
-			// Generate a random move for the server
-			opponentMove := opponent.Move
+			winner, tie := determineWinner(player, opponent)
 
-			// Determine the winner
-			playerMove := player.Move
-			winner := determineWinner(playerMove, opponentMove)
+			responseMsg := ""
 
-			if winner == "player" {
-				player.Score++
-			} else if winner == "opponent" {
-				opponent.Score++
+			if tie {
+				responseMsg = "it's a tie"
+			} else {
+				if winner.ID == player.ID {
+					player.Score++
+				} else {
+					opponent.Score++
+				}
+				responseMsg = fmt.Sprintf("%s won the round", winner.Name)
 			}
 
+			// Prepare game result
+			game.GameStatus.Message = fmt.Sprintf("Player: %s -> %s, Opponent: %s -> %s, %s",
+				player.Name,
+				player.Move,
+				opponent.Name,
+				opponent.Move,
+				responseMsg)
+
+			// reseting for next round
 			game.GameStatus.Round++
 			player.Move = ""
 			opponent.Move = ""
 
 			fmt.Printf("Player: %s, Opponent: %s\n", player, opponent)
 
-			// Prepare game result
-			game.GameStatus.Message = fmt.Sprintf("Player: %s, Opponent: %s winner is: %s", player.Name, opponent.Name, winner)
-			game.Type = "game_update"
-
 		}
 
 		game.Players = [2]Player{player, opponent}
+		game.Type = "game_update"
 
 		fmt.Print("Game players: ", game.Players)
 
@@ -226,15 +234,18 @@ func getRandomMove() string {
 }
 
 // Function to determine the winner and update the score
-func determineWinner(playerMove, serverMove string) string {
+func determineWinner(player, opponent Player) (winner Player, tie bool) {
+	playerMove := player.Move
+	serverMove := opponent.Move
+
 	if playerMove == serverMove {
-		return "tie"
+		return Player{}, true
 	} else if (playerMove == "rock" && serverMove == "scissors") ||
 		(playerMove == "paper" && serverMove == "rock") ||
 		(playerMove == "scissors" && serverMove == "paper") {
-		return "player"
+		return player, false
 	} else {
-		return "opponent"
+		return opponent, false
 	}
 }
 

static/index.html

@@ -49,6 +49,11 @@ <h1 class="text-3xl font-semibold text-center mb-4">Rock Paper Scissors Game</h1
                 <button class="bg-red-500 hover:bg-red-600 text-white font-semibold py-2 px-4 rounded"
                     onclick="selectMove('scissors')">Scissors</button>
             </div>
+            <!-- New elements to display player names -->
+            <div id="player-names" class="flex justify-between w-full mt-8 text-sm text-gray-500">
+                <div id="player1-name"></div>
+                <div id="player2-name"></div>
+            </div>
         </div>
     </div>
 
@@ -62,7 +67,7 @@ <h1 class="text-3xl font-semibold text-center mb-4">Rock Paper Scissors Game</h1
         const joinGameButton = document.getElementById("join-game");
 
         continueButton.addEventListener("click", function () {
-            const playerName = playerNameInput.value;
+            playerName = playerNameInput.value;
             document.getElementById("join-container").classList.add("hidden");
             document.getElementById("join-game-container").classList.remove("hidden");
         });
@@ -160,8 +165,12 @@ <h1 class="text-3xl font-semibold text-center mb-4">Rock Paper Scissors Game</h1
                     serverScoreCircles[i].classList.add("bg-gray-400");
                 }
             }
+
+            // Display player names
+            document.getElementById("player1-name").textContent = data.players[0].name;
+            document.getElementById("player2-name").textContent = data.players[1].name;
         }
     </script>
 </body>
 
-</html>
+</html>