Make sight line module a function instead of a class
This commit is contained in:
parent
f07d120b4b
commit
00323b63eb
@ -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);
|
||||
|
@ -82,94 +82,97 @@ function linedraw(x1, y1, x2, y2) {
|
||||
return results;
|
||||
}
|
||||
|
||||
export default class SightLine {
|
||||
#board;
|
||||
#lockTarget;
|
||||
#activeHexes = [];
|
||||
sightLine;
|
||||
function createElement({ x: x1, y: y1 }, { x: x2, y: y2 }) {
|
||||
const sightLine = document.createElementNS(svgns, 'line');
|
||||
|
||||
constructor(svg, board) {
|
||||
this.svg = svg;
|
||||
this.#board = board;
|
||||
}
|
||||
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);
|
||||
|
||||
#drawHexes(...coords) {
|
||||
this.#clearHexes()
|
||||
return sightLine;
|
||||
}
|
||||
|
||||
if (this.distanceCallback) {
|
||||
this.distanceCallback(offset_distance(...coords));
|
||||
export default function(svg, board) {
|
||||
let activeHexes = [],
|
||||
lockTarget,
|
||||
distanceCallback;
|
||||
|
||||
function drawHexes(...coords) {
|
||||
clearHexes();
|
||||
|
||||
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');
|
||||
this.sightLine = createElement(source.position, target.position);
|
||||
board.appendChild(this.sightLine);
|
||||
|
||||
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 = 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;
|
||||
}
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user