ccm/btroops
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make sight line module a function instead of a class

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc 2024-04-26 18:19:35 -07:00
parent f07d120b4b
commit 00323b63eb
2 changed files with 53 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/modules/game.js
View File

@ -12,6 +12,7 @@ export default class Game {
this.svg = svg; this.svg = svg;
const board = this.getBoard(); const board = this.getBoard();
this.firingArc = new FiringArc(svg, board); this.firingArc = new FiringArc(svg, board);
this.sightLine = new SightLine(svg, board); this.sightLine = new SightLine(svg, board);
this.counter = new Counter(svg); this.counter = new Counter(svg);
@ -89,7 +90,7 @@ export default class Game {
* @param {(count: [number]) => void} fn * @param {(count: [number]) => void} fn
*/ */
set distanceCallback(fn) { set distanceCallback(fn) {
this.sightLine.distanceCallback = fn; this.sightLine.setDistanceCallback(fn);
} }
endMove() { endMove() {
@ -104,8 +105,6 @@ export default class Game {
select(selected) { select(selected) {
const counter = this.counter.getCounter(selected); const counter = this.counter.getCounter(selected);
console.log(counter);
if (counter) { if (counter) {
this.unSelect(); this.unSelect();
this.placing.push(counter); this.placing.push(counter);

99
src/modules/game/sightLine.js
View File

@ -82,94 +82,97 @@ function linedraw(x1, y1, x2, y2) {
return results; return results;
} }
export default class SightLine { function createElement({ x: x1, y: y1 }, { x: x2, y: y2 }) {
#board; const sightLine = document.createElementNS(svgns, 'line');
#lockTarget;
#activeHexes = [];
sightLine;
constructor(svg, board) { sightLine.classList.add('sight-line');
this.svg = svg; sightLine.classList.add(activeClassName);
this.#board = board; sightLine.setAttributeNS(null, 'x1', x1);
} sightLine.setAttributeNS(null, 'y1', y1);
sightLine.setAttributeNS(null, 'x2', x2);
sightLine.setAttributeNS(null, 'y2', y2);
#drawHexes(...coords) { return sightLine;
this.#clearHexes() }
if (this.distanceCallback) { export default function(svg, board) {
this.distanceCallback(offset_distance(...coords)); let activeHexes = [],
lockTarget,
distanceCallback;
function drawHexes(...coords) {
clearHexes();
if (distanceCallback) {
distanceCallback(offset_distance(...coords));
} }
const lineCoords = linedraw(...coords), const lineCoords = linedraw(...coords),
selector = lineCoords selector = lineCoords
.map(([x, y]) => `g[data-y="${y}"] g[data-x="${x}"] use[href="#hex"]`) .map(([x, y]) => `g[data-y="${y}"] g[data-x="${x}"] use[href="#hex"]`)
.join(', '), .join(', ');
hexes = this.svg.querySelectorAll(selector); activeHexes = svg.querySelectorAll(selector);
activeHexes.forEach(p => p.classList.add(activeClassName));
hexes.forEach(p => p.classList.add(activeClassName));
this.#activeHexes = hexes;
} }
#clearHexes() { function clearHexes() {
if (this.distanceCallback) { if (distanceCallback) {
this.distanceCallback(); distanceCallback();
} }
this.#activeHexes.forEach(el => el.classList.remove(activeClassName)); activeHexes.forEach(el => el.classList.remove(activeClassName));
this.#activeHexes = []; activeHexes = [];
} }
clear() { this.sightLine;
this.clear = function () {
if (this.sightLine) { if (this.sightLine) {
this.sightLine.remove(); this.sightLine.remove();
delete this.sightLine; delete this.sightLine;
} }
if (this.#lockTarget) { if (lockTarget) {
this.#lockTarget.classList.remove(targetClassName); lockTarget.classList.remove(targetClassName);
this.#lockTarget = undefined; lockTarget = null;
} }
this.#clearHexes(); clearHexes();
} }
draw(source, target) { this.draw = function (source, target) {
this.clear(); this.clear();
const sightLine = document.createElementNS(svgns, 'line'); this.sightLine = createElement(source.position, target.position);
board.appendChild(this.sightLine);
sightLine.classList.add('sight-line'); drawHexes(+source.index.x, +source.index.y, +target.index.x, +target.index.y);
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 = sightLine;
this.#board.appendChild(sightLine);
this.#drawHexes(+source.index.x, +source.index.y, +target.index.x, +target.index.y);
} }
update(source) { this.update = function(source) {
const { dataset: { x }, parentElement: { dataset: { y }}} = this.#lockTarget; const { dataset: { x }, parentElement: { dataset: { y }}} = lockTarget;
this.sightLine.setAttributeNS(null, 'x1', source.position.x); this.sightLine.setAttributeNS(null, 'x1', source.position.x);
this.sightLine.setAttributeNS(null, 'y1', source.position.y); 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) { this.toggleLock = function (cell) {
if (this.#lockTarget) { if (lockTarget) {
this.sightLine.classList.add(activeClassName); this.sightLine.classList.add(activeClassName);
this.#lockTarget.classList.remove(targetClassName); lockTarget.classList.remove(targetClassName);
this.#lockTarget = undefined; lockTarget = null;
} else { } else {
this.sightLine.classList.remove(activeClassName); this.sightLine.classList.remove(activeClassName);
cell.classList.add(targetClassName); cell.classList.add(targetClassName);
this.#lockTarget = cell; lockTarget = cell;
} }
} }
this.setDistanceCallback = function(callback) {
distanceCallback = callback;
}
} }