Réduction de l'espace des TMR

module/tmr-constants.js

@@ -1,27 +1,64 @@
 
-/* -------------------------------------------- */
-export const tmrConstants = {
-  col1_y: 30,
-  col2_y: 55,
-  cellw: 55,
-  cellh: 55,
-  gridx: 28,
-  gridy: 28,
-  // tailles
-  third: 18,
-  half: 27.5,
-  twoThird: 36,
-  full: 55,
-  // decallages
-  center: { x: 0, y: 0 },
-  top: { x: 0, y: -11.5 },
-  topLeft: { x: -11.5, y: -11.5 },
-  left: { x: -11.5, y: 0 },
-  bottomLeft: { x: -11.5, y: 11.5 },
-  bottom: { x: 0, y: 11.5 },
-  bottomRight: { x: 11.5, y: 11.5 },
-  right: { x: 11.5, y: 0 },
-  topRight: { x: 11.5, y: -11.5 },
+export class TMRConstants {
+  constructor({ size = 64 }) {
+    // tailles
+    this.size = size
+    this.half = this.size / 2
+    this.quarter = this.size / 4
+    this.third = this.size / 3
+    this.twoThird = this.size * 2 / 3
+    this.full = this.size
+    // positions
+    this.col1_y = this.half
+    this.col2_y = this.size
+    this.cellw = this.size
+    this.cellh = this.size
+    this.gridx = this.half
+    this.gridy = this.half
+    // decallages
+    this.center = { x: 0, y: 0 }
+    this.top = { x: 0, y: -this.quarter }
+    this.topLeft = { x: -this.quarter, y: -this.quarter }
+    this.left = { x: -this.quarter, y: 0 }
+    this.bottomLeft = { x: -this.quarter, y: this.quarter }
+    this.bottom = { x: 0, y: this.quarter }
+    this.bottomRight = { x: this.quarter, y: this.quarter }
+    this.right = { x: this.quarter, y: 0 }
+    this.topRight = { x: this.quarter, y: -this.quarter }
+    this.marginx = 1
+    this.marginy = 1
+  }
+
+  decallage(x, y) {
+    return {
+      x: x * this.third,
+      y: y * this.third
+    }
+  }
+
+  computeEventPosition(event) {
+    if (!event.nativeEvent.target.getBoundingClientRect) {
+      return { x: 0, y: 0 }
+    }
+    const canvasRect = event.nativeEvent.target.getBoundingClientRect();
+    return {
+      x: event.nativeEvent.clientX - canvasRect.left,
+      y: event.nativeEvent.clientY - canvasRect.top
+    }
+  }
+
+  computeEventOddq(event) {
+    var { x, y } = this.computeEventPosition(event);
+    return this.computeOddq(x, y);
+  }
+
+
+  computeOddq(x, y) {
+    const col = Math.floor(x / this.cellw)
+    const decallageColonne = col % 2 == 0 ? this.col1_y : this.col2_y
+    const row = Math.floor((y - decallageColonne) / this.cellh)
+    return { col, row, x, y }
+  }
 }
 
 // couleurs
@@ -35,13 +72,15 @@ export const tmrColors = {
   rencontre: 0xFF0000,
   casehumide: 0x1050F0,
 }
+
 export const tmrTokenZIndex = {
-  sort: 40,
-  tetes: 20,
   casehumide: 10,
-  conquete: 30,
+  tetes: 20,
+  sort: 30,
+  conquete: 40,
   rencontre: 50,
   trounoir: 60,
   demireve: 70,
   tooltip: 100,
 }
+