From c38ca69dd215f5994687d5bc4e43b3327b35932a Mon Sep 17 00:00:00 2001
From: starnakin <camille@chauvet.pro>
Date: Mon, 13 May 2024 16:35:41 +0200
Subject: [PATCH] profile: add winrate

---
 frontend/static/js/views/ProfilePageView.js | 27 ++++++++++++++++++---
 games/serializers.py                        |  4 +--
 2 files changed, 26 insertions(+), 5 deletions(-)

diff --git a/frontend/static/js/views/ProfilePageView.js b/frontend/static/js/views/ProfilePageView.js
index 43df461..41405c8 100644
--- a/frontend/static/js/views/ProfilePageView.js
+++ b/frontend/static/js/views/ProfilePageView.js
@@ -75,14 +75,32 @@ export default class extends AbstractView {
 			statusIndicator.classList.add('bg-danger');
 	}
 
+	/**
+	 * @param {[Object]} games 
+	 */
 	async fillStatistics(games)
 	{
+		const winrateDiv = document.getElementById("winrate");
+		
+		const win = 0;
+		const lose = 0;
 
+		games.forEach(game => {
+			if (game.finished === false)
+				return
+
+			if (client.me.id === game.winner.id)
+				win++;
+			else
+				lose++;
+		});
+
+		winrateDiv.innerText = `winrate: ${win + lose === 0 ? "🤓" : win / (win + lose)}`
 	}
 
 	async fillHistory(games)
     {
-        let game_list = document.getElementById("game-list");
+        const game_list = document.getElementById("game-list");
 
         games.forEach(game => {
 
@@ -96,7 +114,7 @@ export default class extends AbstractView {
             if (game.started)
                 game_item.style.backgroundColor = "yellow";
             if (game.finished)
-                game_item.style.backgroundColor = this.profile.id === game.winner_id ? "green" : "red";
+                game_item.style.backgroundColor = this.profile.id === game.winner.id ? "green" : "red";
 
             game.players.forEach(player => {
                 let player_score = document.createElement("a");
@@ -133,9 +151,12 @@ export default class extends AbstractView {
 			<button class='btn btn-sm btn-danger d-none' id='blockButton'>Block</button>
 			<button class='btn btn-sm btn-secondary d-none' id='unblockButton'>Unblock</button>
 		  </div>
+		  <h1>Games</h1>
+		  <div>
+			<h1 id='winrate'></h1>
+		  </div>
 		  <div>
 			<link rel="stylesheet" href="/static/css/gameHistory.css">
-			<h1>Game History</h1>
 			<div id="game-list"></div>
 		  </div>
 		</div>
diff --git a/games/serializers.py b/games/serializers.py
index 746b02d..2c8200c 100644
--- a/games/serializers.py
+++ b/games/serializers.py
@@ -9,7 +9,7 @@ from profiles.serializers import ProfileSerializer
 class GameSerializer(serializers.ModelSerializer):
 
     players = serializers.SerializerMethodField()
-    winner_id = serializers.ReadOnlyField()
+    winner = serializers.ReadOnlyField()
     state = serializers.SerializerMethodField()
     started = serializers.ReadOnlyField()
     finished = serializers.ReadOnlyField()
@@ -19,7 +19,7 @@ class GameSerializer(serializers.ModelSerializer):
 
     class Meta:
         model = GameModel
-        fields = ["id", "winner_id", "state", "started", "finished", "players", "start_timestamp", "stop_timestamp", "game_type"]
+        fields = ["id", "winner", "state", "started", "finished", "players", "start_timestamp", "stop_timestamp", "game_type"]
 
     def get_state(self, instance: GameModel):
         if (instance.finished):