From 18861302e661d90c6955e25254476d75c2e7d978 Mon Sep 17 00:00:00 2001
From: sigmasternchen <git@sigma-star.io>
Date: Thu, 31 Oct 2024 16:46:53 +0100
Subject: [PATCH] fix: Clicking on a piece will no longer prevent the move

---
 js/src/board.ext.js          |  4 +---
 src/View/fragments/board.php | 15 +++++++++------
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/js/src/board.ext.js b/js/src/board.ext.js
index 9413078..3d329e4 100644
--- a/js/src/board.ext.js
+++ b/js/src/board.ext.js
@@ -4,8 +4,7 @@ const loadBoard = (board) => {
     const boardId = board.getAttribute("data-board");
     const getSquare = square => board.getElementsByClassName(square)[0];
     const moveSelected = event => {
-        const move = event.target.getAttribute("data-move");
-        console.log(move);
+        const move = event.currentTarget.getAttribute("data-move");
         board.setAttribute("data-hx-vals", JSON.stringify({"move": move}));
         htmx.trigger(document.body, "chess-move-" + boardId, {});
     };
@@ -49,7 +48,6 @@ const loadBoard = (board) => {
 
 htmx.defineExtension('board', {
     onEvent : function(name, event) {
-        console.log(name);
         if (name !== "htmx:afterProcessNode" ||
             (
                 event?.target?.getAttribute("hx-ext") ??
diff --git a/src/View/fragments/board.php b/src/View/fragments/board.php
index 0d945f0..c7c4d9e 100644
--- a/src/View/fragments/board.php
+++ b/src/View/fragments/board.php
@@ -29,14 +29,14 @@ function getImageForPice(Piece $piece): string {
 }
 
 ?>
-<div class="gameinfo">
-    Current Player: <?= $game->getCurrentSide()->name ?><br />
-    Game State: <?= $game->getGameState()->name ?>
-</div>
 <div class="board <?= $interactive ? "interactive" : "" ?>" id="board<?= $boardId ?>"
     data-board="<?= $boardId ?>"
     <?php if ($interactive) { ?>
-        data-hx-ext="board" data-hx-post="/?move" data-hx-trigger="chess-move-<?= $boardId ?> from:body"
+        data-hx-ext="board"
+        data-hx-post="/?move"
+        data-hx-trigger="chess-move-<?= $boardId ?> from:body"
+        data-hx-swap="outerHTML"
+        data-hx-target="this"
     <?php } ?>
 >
     <?php
@@ -47,7 +47,10 @@ function getImageForPice(Piece $piece): string {
                 $moves = $piece ? $game->getMovesForPiece($piece) : [];
                 $hasMoves = count($moves) > 0;
                 ?>
-            <div class="square <?= strtolower($position->getSquareColor()->name) ?> <?= $hasMoves ? "hasMoves" : "" ?> <?= $position ?>">
+            <div
+                class="square <?= strtolower($position->getSquareColor()->name) ?> <?= $hasMoves ? "hasMoves" : "" ?> <?= $position ?>"
+                data-square="<?= $position ?>"
+            >
                 <?php
                     if ($piece) {
                 ?>