Fixes for the chess game

eyss · Oct 25, 2021 · 048bb92 · 048bb92
1 parent 16c393d
commit 048bb92
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 8 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/ui/chess/package.json b/ui/chess/package.json
@@ -30,7 +30,7 @@
     "@open-wc/scoped-elements": "^2.0.0-next.4",
     "@scoped-elements/material-web": "^0.0.14",
     "chess.js": "^0.11.0",
-    "chessboard-element": "^1.1.0",
+    "chessboard-element": "^1.2.0",
     "lit": "^2.0.2",
     "lit-svelte-stores": "^0.1.3"
   },

diff --git a/ui/chess/src/elements/chess-game.ts b/ui/chess/src/elements/chess-game.ts
@@ -71,10 +71,12 @@ export class ChessGame extends ScopedElementsMixin(LitElement) {
   updated(changedValues: PropertyValues) {
     super.updated(changedValues);
 
-    const board = this.shadowRoot?.getElementById('board');
-    if (board && (board as any).setPosition) {
-      (board as any).setPosition(this.chessGame().fen());
-      (board as any).position = this.chessGame().fen();
+    const board = this.shadowRoot?.getElementById('board') as
+      | ChessBoardElement
+      | undefined;
+    if (board && board.setPosition) {
+      board.setPosition(this.chessGame().fen());
+      board.requestUpdate();
     }
   }
 
@@ -377,7 +379,6 @@ export class ChessGame extends ScopedElementsMixin(LitElement) {
           style="margin-right: 40px"
           .orientation=${this.amIWhite() ? 'white' : 'black'}
           ?draggable-pieces=${!this.isGameOver()}
-          position="${this.chessGame().fen()}"
           @drag-start=${this.onDragStart}
           @drop=${this.onDrop}
           @mouseover-square=${this.onMouseOverSquare}

diff --git a/ui/elemental-chess/rollup.config.js b/ui/elemental-chess/rollup.config.js
@@ -32,6 +32,8 @@ export default {
       preferBuiltins: false,
     }),
     replace({
+      "const srcSquareRect = srcSquare.getBoundingClientRect();": "if(!srcSquare) return {};const srcSquareRect = srcSquare.getBoundingClientRect();",
+      "this._draggedPieceElement.addEventListener('transitionend', transitionComplete);": "this._draggedPieceElement.addEventListener('transitionend', transitionComplete);resolve();",
       'process.env.ENV': `"${process.env.ENV}"`,
       'process.env.HC_PORT': `"${process.env.HC_PORT}"`,
       "COMB = require('@holo-host/comb').COMB":

diff --git a/ui/elemental-chess/web-dev-server.config.mjs b/ui/elemental-chess/web-dev-server.config.mjs
@@ -31,6 +31,11 @@ export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
 
   plugins: [
     replace({
+      'const srcSquareRect = srcSquare.getBoundingClientRect();':
+        'if(!srcSquare) return {};const srcSquareRect = srcSquare.getBoundingClientRect();',
+
+      "this._draggedPieceElement.addEventListener('transitionend', transitionComplete);":
+        "this._draggedPieceElement.addEventListener('transitionend', transitionComplete);resolve();",
       'process.env.ENV': JSON.stringify(process.env.ENV),
       'process.env.HC_PORT': JSON.stringify(process.env.HC_PORT || 8888),
       '  COMB =': 'window.COMB =',