From 00323b63ebbe461f59eb2fa05ef458c12bd9482f Mon Sep 17 00:00:00 2001
From: Catalin Mititiuc
Date: Fri, 26 Apr 2024 18:19:35 -0700
Subject: Make sight line module a function instead of a class
---
src/modules/game.js | 5 +--
src/modules/game/sightLine.js | 101 ++++++++++++++++++++++--------------------
2 files changed, 54 insertions(+), 52 deletions(-)
(limited to 'src')
diff --git a/src/modules/game.js b/src/modules/game.js
index b44d605..260da72 100644
--- a/src/modules/game.js
+++ b/src/modules/game.js
@@ -12,6 +12,7 @@ export default class Game {
this.svg = svg;
const board = this.getBoard();
+
this.firingArc = new FiringArc(svg, board);
this.sightLine = new SightLine(svg, board);
this.counter = new Counter(svg);
@@ -89,7 +90,7 @@ export default class Game {
* @param {(count: [number]) => void} fn
*/
set distanceCallback(fn) {
- this.sightLine.distanceCallback = fn;
+ this.sightLine.setDistanceCallback(fn);
}
endMove() {
@@ -104,8 +105,6 @@ export default class Game {
select(selected) {
const counter = this.counter.getCounter(selected);
- console.log(counter);
-
if (counter) {
this.unSelect();
this.placing.push(counter);
diff --git a/src/modules/game/sightLine.js b/src/modules/game/sightLine.js
index 83cab9b..b0af107 100644
--- a/src/modules/game/sightLine.js
+++ b/src/modules/game/sightLine.js
@@ -82,94 +82,97 @@ function linedraw(x1, y1, x2, y2) {
return results;
}
-export default class SightLine {
- #board;
- #lockTarget;
- #activeHexes = [];
- sightLine;
-
- constructor(svg, board) {
- this.svg = svg;
- this.#board = board;
- }
+function createElement({ x: x1, y: y1 }, { x: x2, y: y2 }) {
+ const sightLine = document.createElementNS(svgns, 'line');
+
+ sightLine.classList.add('sight-line');
+ sightLine.classList.add(activeClassName);
+ sightLine.setAttributeNS(null, 'x1', x1);
+ sightLine.setAttributeNS(null, 'y1', y1);
+ sightLine.setAttributeNS(null, 'x2', x2);
+ sightLine.setAttributeNS(null, 'y2', y2);
+
+ return sightLine;
+}
+
+export default function(svg, board) {
+ let activeHexes = [],
+ lockTarget,
+ distanceCallback;
- #drawHexes(...coords) {
- this.#clearHexes()
+ function drawHexes(...coords) {
+ clearHexes();
- if (this.distanceCallback) {
- this.distanceCallback(offset_distance(...coords));
+ if (distanceCallback) {
+ distanceCallback(offset_distance(...coords));
}
const lineCoords = linedraw(...coords),
selector = lineCoords
.map(([x, y]) => `g[data-y="${y}"] g[data-x="${x}"] use[href="#hex"]`)
- .join(', '),
+ .join(', ');
- hexes = this.svg.querySelectorAll(selector);
-
- hexes.forEach(p => p.classList.add(activeClassName));
- this.#activeHexes = hexes;
+ activeHexes = svg.querySelectorAll(selector);
+ activeHexes.forEach(p => p.classList.add(activeClassName));
}
- #clearHexes() {
- if (this.distanceCallback) {
- this.distanceCallback();
+ function clearHexes() {
+ if (distanceCallback) {
+ distanceCallback();
}
- this.#activeHexes.forEach(el => el.classList.remove(activeClassName));
- this.#activeHexes = [];
+ activeHexes.forEach(el => el.classList.remove(activeClassName));
+ activeHexes = [];
}
- clear() {
+ this.sightLine;
+
+ this.clear = function () {
if (this.sightLine) {
this.sightLine.remove();
delete this.sightLine;
}
- if (this.#lockTarget) {
- this.#lockTarget.classList.remove(targetClassName);
- this.#lockTarget = undefined;
+ if (lockTarget) {
+ lockTarget.classList.remove(targetClassName);
+ lockTarget = null;
}
- this.#clearHexes();
+ clearHexes();
}
- draw(source, target) {
+ this.draw = function (source, target) {
this.clear();
- const sightLine = document.createElementNS(svgns, 'line');
-
- sightLine.classList.add('sight-line');
- sightLine.classList.add(activeClassName);
- sightLine.setAttributeNS(null, 'x1', source.position.x);
- sightLine.setAttributeNS(null, 'y1', source.position.y);
- sightLine.setAttributeNS(null, 'x2', target.position.x);
- sightLine.setAttributeNS(null, 'y2', target.position.y);
+ this.sightLine = createElement(source.position, target.position);
+ board.appendChild(this.sightLine);
- this.sightLine = sightLine;
- this.#board.appendChild(sightLine);
- this.#drawHexes(+source.index.x, +source.index.y, +target.index.x, +target.index.y);
+ drawHexes(+source.index.x, +source.index.y, +target.index.x, +target.index.y);
}
- update(source) {
- const { dataset: { x }, parentElement: { dataset: { y }}} = this.#lockTarget;
+ this.update = function(source) {
+ const { dataset: { x }, parentElement: { dataset: { y }}} = lockTarget;
this.sightLine.setAttributeNS(null, 'x1', source.position.x);
this.sightLine.setAttributeNS(null, 'y1', source.position.y);
- this.#drawHexes(+source.index.x, +source.index.y, +x, +y);
+ drawHexes(+source.index.x, +source.index.y, +x, +y);
}
- toggleLock(cell) {
- if (this.#lockTarget) {
+ this.toggleLock = function (cell) {
+ if (lockTarget) {
this.sightLine.classList.add(activeClassName);
- this.#lockTarget.classList.remove(targetClassName);
- this.#lockTarget = undefined;
+ lockTarget.classList.remove(targetClassName);
+ lockTarget = null;
} else {
this.sightLine.classList.remove(activeClassName);
cell.classList.add(targetClassName);
- this.#lockTarget = cell;
+ lockTarget = cell;
}
}
+
+ this.setDistanceCallback = function(callback) {
+ distanceCallback = callback;
+ }
}
--
cgit v1.2.3