From ae4502a263b2f5f83b8b0bdf370dfbecaa686df1 Mon Sep 17 00:00:00 2001
From: Anduin Xue <anduin@aiursoft.com>
Date: Tue, 2 Jul 2024 12:41:27 +0000
Subject: [PATCH] Add statusControl and roleControl to ChessBuilder

In ChessServer, the ChessBuilder function and instantiation now take parameters for the statusControl and roleControl elements. This change improves flexibility by allowing these controls to be passed in from the invoking context, rather than being statically defined within the ChessBuilder function.
---
 .../Views/Shared/Components/ChessBoard/Default.cshtml     | 4 +++-
 .../wwwroot/scripts/chessboard/chessboard.js              | 8 +++++---
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/Aiursoft.ChessServer/Views/Shared/Components/ChessBoard/Default.cshtml b/src/Aiursoft.ChessServer/Views/Shared/Components/ChessBoard/Default.cshtml
index 554d8df..e199b26 100644
--- a/src/Aiursoft.ChessServer/Views/Shared/Components/ChessBoard/Default.cshtml
+++ b/src/Aiursoft.ChessServer/Views/Shared/Components/ChessBoard/Default.cshtml
@@ -11,7 +11,9 @@
     window.addEventListener('DOMContentLoaded', async () => {
         var playerId = getUserId();
         var playerColor = await getPlayerColor(@Model.GameId);
-        let anduinChessBoard = new ChessBuilder(playerColor).default();
+        var statusControl = document.getElementById("status");
+        var roleControl = document.getElementById("role");
+        let anduinChessBoard = new ChessBuilder(playerColor, statusControl, roleControl).default();
         anduinChessBoard.run(playerId, @Model.GameId);
 
         document.body.addEventListener('pointerdown', (e) => {
diff --git a/src/Aiursoft.ChessServer/wwwroot/scripts/chessboard/chessboard.js b/src/Aiursoft.ChessServer/wwwroot/scripts/chessboard/chessboard.js
index a27f436..8256f5a 100644
--- a/src/Aiursoft.ChessServer/wwwroot/scripts/chessboard/chessboard.js
+++ b/src/Aiursoft.ChessServer/wwwroot/scripts/chessboard/chessboard.js
@@ -16,8 +16,10 @@ import {
  * let chessBoard = new ChessBuilder().default();
  * ```
  * @param {string} color currently color, w or b
+ * @param {HTMLElement} statusControl status control element
+ * @param {HTMLElement} roleControl role control element
  */
-function ChessBuilder(color) {
+function ChessBuilder(color, statusControl, roleControl) {
   this.onDragStart = undefined;
   this.onDrop = undefined;
   this.onSnapEnd = undefined;
@@ -31,8 +33,8 @@ function ChessBuilder(color) {
     anduinChessBoard.config.onDragStart = buildOnDragStart(anduinChessBoard);
     anduinChessBoard.config.onDrop = buildOnDrop(anduinChessBoard);
     anduinChessBoard.config.onSnapEnd = buildOnSnapEnd(anduinChessBoard);
-    anduinChessBoard.statusControl = document.getElementById("status");
-    anduinChessBoard.roleControl = document.getElementById("role");
+    anduinChessBoard.statusControl = statusControl;
+    anduinChessBoard.roleControl = roleControl;
 
     return anduinChessBoard;
   };