cm-chessboard 8.0.3 → 8.1.1

package/README.md

@@ -344,9 +344,12 @@ Currently possible extension points are defined in `Extension.js`.
 export const EXTENSION_POINT = {
     positionChanged: "positionChanged", // the positions of the pieces was changed
     boardChanged: "boardChanged", // the board (orientation) was changed
+    boardResized: "boardResized", // the board was resized
     moveInputToggled: "moveInputToggled", // move input was enabled or disabled
     moveInput: "moveInput", // move started, moving over a square, validating or canceled
-    redrawBoard: "redrawBoard", // called after redrawing the board
+    beforeRedrawBoard: "beforeRedrawBoard", // called before redrawing the board
+    afterRedrawBoard: "afterRedrawBoard", // called after redrawing the board
+    redrawBoard: "redrawBoard", // called after redrawing the board, DEPRECATED, use afterRedrawBoard
     animation: "animation", // called on animation start, end and on every animation frame
     destroy: "destroy" // called, before the board is destroyed
 }

package/examples/extensions/markers-extension.html

@@ -23,6 +23,7 @@
 
     const board1 = new Chessboard(document.getElementById("board1"), {
         position: FEN.start,
+        assetsCache: false,
         assetsUrl: "../../assets/",
         extensions: [{class: Markers}]
     })
@@ -50,7 +51,6 @@
     }
     const board2 = new Chessboard(document.getElementById("board2"), {
         position: "rn2k1r1/ppp1pp1p/3p2p1/5bn1/P7/2N2B2/1PPPPP2/2BNK1RR",
-        assetsCache: false,
         assetsUrl: "../../assets/",
         style: {pieces: {file: "pieces/staunty.svg"}},
         extensions: [{class: Markers, autoMarkers: MARKER_TYPE.frame}]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cm-chessboard",
-  "version": "8.0.3",
+  "version": "8.1.1",
   "description": "A JavaScript chessboard which is lightweight, ES6 module based, responsive, SVG rendered and without dependencies.",
   "keywords": [
     "chess",

package/src/extensions/arrows/Arrows.js

@@ -19,7 +19,7 @@ export class Arrows extends Extension {
     /** @constructor */
     constructor(chessboard, props = {}) {
         super(chessboard)
-        this.registerExtensionPoint(EXTENSION_POINT.redrawBoard, () => {
+        this.registerExtensionPoint(EXTENSION_POINT.afterRedrawBoard, () => {
             this.onRedrawBoard()
         })
         this.props = {

package/src/extensions/markers/Markers.js

@@ -26,7 +26,7 @@ export class Markers extends Extension {
     /** @constructor */
     constructor(chessboard, props = {}) {
         super(chessboard)
-        this.registerExtensionPoint(EXTENSION_POINT.redrawBoard, () => {
+        this.registerExtensionPoint(EXTENSION_POINT.afterRedrawBoard, () => {
             this.onRedrawBoard()
         })
         this.props = {

package/src/extensions/promotion-dialog/PromotionDialog.js

@@ -24,7 +24,7 @@ export class PromotionDialog extends Extension {
     /** @constructor */
     constructor(chessboard) {
         super(chessboard)
-        this.registerExtensionPoint(EXTENSION_POINT.redrawBoard, this.extensionPointRedrawBoard.bind(this))
+        this.registerExtensionPoint(EXTENSION_POINT.afterRedrawBoard, this.extensionPointRedrawBoard.bind(this))
         chessboard.showPromotionDialog = this.showPromotionDialog.bind(this)
         chessboard.isPromotionDialogShown = this.isPromotionDialogShown.bind(this)
         this.promotionDialogGroup = Svg.addElement(chessboard.view.interactiveTopLayer, "g", {class: "promotion-dialog-group"})

package/src/model/Extension.js

@@ -9,7 +9,9 @@ export const EXTENSION_POINT = {
     boardChanged: "boardChanged", // the board (orientation) was changed
     moveInputToggled: "moveInputToggled", // move input was enabled or disabled
     moveInput: "moveInput", // move started, moving over a square, validating or canceled
-    redrawBoard: "redrawBoard", // called after redrawing the board
+    beforeRedrawBoard: "beforeRedrawBoard", // called before redrawing the board
+    afterRedrawBoard: "afterRedrawBoard", // called after redrawing the board
+    redrawBoard: "redrawBoard", // called after redrawing the board, DEPRECATED, use afterRedrawBoard
     animation: "animation", // called on animation start, end and on every animation frame
     destroy: "destroy" // called, before the board is destroyed
 }
@@ -21,6 +23,10 @@ export class Extension {
     }
 
     registerExtensionPoint(name, callback) {
+        if(name === EXTENSION_POINT.redrawBoard) {
+            console.warn("EXTENSION_POINT.redrawBoard is deprecated, use EXTENSION_POINT.afterRedrawBoard")
+            name = EXTENSION_POINT.afterRedrawBoard
+        }
         if (!this.chessboard.state.extensionPoints[name]) {
             this.chessboard.state.extensionPoints[name] = []
         }

package/src/view/ChessboardView.js

@@ -38,9 +38,9 @@ export class ChessboardView {
         this.container.addEventListener("touchstart", this.pointerDownListener, {passive: false})
 
         this.createSvgAndGroups()
-        this.updateMetrics()
+        // this.updateMetrics()
         this.handleResize()
-        this.redrawBoard()
+        // this.redrawBoard()
     }
 
     pointerDownHandler(e) {
@@ -132,9 +132,10 @@ export class ChessboardView {
     }
 
     redrawBoard() {
+        this.chessboard.state.invokeExtensionPoints(EXTENSION_POINT.beforeRedrawBoard)
         this.redrawSquares()
         this.drawCoordinates()
-        this.chessboard.state.invokeExtensionPoints(EXTENSION_POINT.redrawBoard)
+        this.chessboard.state.invokeExtensionPoints(EXTENSION_POINT.afterRedrawBoard)
         this.visualizeInputState()
     }