Improve diagraming abilities, fix Chakart full rules

[xogo.git] / base_rules.js

diff --git a/base_rules.js b/base_rules.js
index 5eb4d77..16f6d7a 100644 (file)
--- a/base_rules.js
+++ b/base_rules.js
@@ -415,6 +415,7 @@ export default class ChessRules {
 
     // Graphical (can use variables defined above)
     this.containerId = o.element;
+    this.isDiagram = o.diagram;
     this.graphicalInit();
   }
 
@@ -453,7 +454,7 @@ export default class ChessRules {
       this.setFlags(fenParsed.flags);
     if (this.hasEnpassant)
       this.epSquare = this.getEpSquare(fenParsed.enpassant);
-    if (this.hasReserve)
+    if (this.hasReserve && !this.isDiagram)
       this.initReserves(fenParsed.reserve);
     if (this.options["crazyhouse"])
       this.initIspawn(fenParsed.ispawn);
@@ -557,12 +558,14 @@ export default class ChessRules {
   // VISUAL METHODS
 
   graphicalInit() {
-    // NOTE: not window.onresize = this.re_drawBoardElts because scope (this)
-    window.onresize = () => this.re_drawBoardElements();
-    this.re_drawBoardElements();
-    this.initMouseEvents();
-    const chessboard =
-      document.getElementById(this.containerId).querySelector(".chessboard");
+    const g_init = () => {
+      this.re_drawBoardElements();
+      if (!this.isDiagram && !this.mouseListeners && !this.touchListeners)
+        this.initMouseEvents();
+    };
+    let container = document.getElementById(this.containerId);
+    this.windowResizeObs = new ResizeObserver(g_init);
+    this.windowResizeObs.observe(container);
   }
 
   re_drawBoardElements() {
@@ -587,7 +590,7 @@ export default class ChessRules {
       cbHeight = Math.min(rc.height, 767);
       cbWidth = cbHeight * vRatio;
     }
-    if (this.hasReserve) {
+    if (this.hasReserve && !this.isDiagram) {
       const sqSize = cbWidth / this.size.y;
       // NOTE: allocate space for reserves (up/down) even if they are empty
       // Cannot use getReserveSquareSize() here, but sqSize is an upper bound.
@@ -644,6 +647,7 @@ export default class ChessRules {
   }
 
   setupPieces(r) {
+    // TODO: d_pieces : only markers (for diagrams) / also in rescale()
     if (this.g_pieces) {
       // Refreshing: delete old pieces first
       for (let i=0; i<this.size.x; i++) {
@@ -683,7 +687,7 @@ export default class ChessRules {
         }
       }
     }
-    if (this.hasReserve)
+    if (this.hasReserve && !this.isDiagram)
       this.re_drawReserve(['w', 'b'], r);
   }
 
@@ -813,7 +817,7 @@ export default class ChessRules {
         }
       }
     }
-    if (this.hasReserve)
+    if (this.hasReserve && !this.isDiagram)
       this.rescaleReserve(newR);
   }
 
@@ -996,6 +1000,10 @@ export default class ChessRules {
   }
 
   removeListeners() {
+    let container = document.getElementById(this.containerId);
+    this.windowResizeObs.unobserve(container);
+    if (this.isDiagram)
+      return; //no listeners in this case
     if ('onmousedown' in window) {
       this.mouseListeners.forEach(ml => {
         document.removeEventListener(ml.type, ml.listener);