From e7f7bf1f31a7e1f937eb3eda4ee735db04e6384e Mon Sep 17 00:00:00 2001
From: Catalin Mititiuc
Date: Wed, 24 Apr 2024 16:43:14 -0700
Subject: Add two more sight line query functions
---
src/modules/counter.js | 3 ---
src/modules/game.js | 62 ++++++++++++++++++++++++--------------------------
2 files changed, 30 insertions(+), 35 deletions(-)
(limited to 'src')
diff --git a/src/modules/counter.js b/src/modules/counter.js
index 591f09b..69552d8 100644
--- a/src/modules/counter.js
+++ b/src/modules/counter.js
@@ -1,6 +1,5 @@
const svgns = "http://www.w3.org/2000/svg";
-
export default class Counter {
constructor(svg) {
this.svg = svg;
@@ -60,8 +59,6 @@ export default class Counter {
let points,
counterNodeList = this.getCounterAndClones(selected);
- console.log(selected, counterNodeList);
-
if (counterNodeList.length > 0 && selected.parentElement.hasAttribute('data-x')) {
let trace = this.svg.querySelector(this.traceSelector(selected));
diff --git a/src/modules/game.js b/src/modules/game.js
index fe15055..f9ce991 100644
--- a/src/modules/game.js
+++ b/src/modules/game.js
@@ -45,6 +45,14 @@ export default class Game {
return this.svg.querySelector('line.sight-line');
}
+ getActiveSightLine() {
+ return this.svg.querySelector('line.sight-line.active');
+ }
+
+ getLockedSightLine() {
+ return this.svg.querySelector('line.sight-line:not(.active)');
+ }
+
getGridIndex({ parentElement: { dataset: { x }, parentElement: { dataset: { y }}}}) {
return { x, y };
}
@@ -127,26 +135,26 @@ export default class Game {
}
setUpCells() {
- this.getCells().forEach(cell => {
- function isGrenade(el) {
- return el && el.getAttribute('href') === '#counter-grenade';
- }
+ function isGrenade(el) {
+ return el && el.getAttribute('href') === '#counter-grenade';
+ }
- function isClone(counter) {
- const isClone = counter.classList.contains('clone'),
- { allegiance: clAl, number: clNum } = counter.dataset;
+ function isClone(counter) {
+ const isClone = counter.classList.contains('clone'),
+ { allegiance: clAl, number: clNum } = counter.dataset;
- return {
- of: function ({ dataset: { allegiance, number }}) {
- return isClone && clAl == allegiance && clNum == number;
- }
- };
- }
+ return {
+ of: function ({ dataset: { allegiance, number }}) {
+ return isClone && clAl == allegiance && clNum == number;
+ }
+ };
+ }
+ this.getCells().forEach(cell => {
cell.addEventListener('click', e => {
const state = {
placing: this.placing,
- hex: cell.querySelector('use[href="#hex"]'),
+ hex: this.getHex(cell),
occupant: this.getCellOccupant(cell),
contents: this.getCellContents(cell)
};
@@ -158,7 +166,7 @@ export default class Game {
} else if (toPlace && !state.occupant) {
this.counter.place(toPlace, cell);
this.placing.push(toPlace);
- const lockedSl = this.svg.querySelector('.sight-line:not(.active)');
+ const lockedSl = this.getLockedSightLine();
if (!lockedSl) {
this.sightLine.clear();
@@ -181,7 +189,7 @@ export default class Game {
trace.setAttributeNS(null, 'points', points.join(' '));
}
this.placing.push(toPlace);
- const lockedSl = this.svg.querySelector('.sight-line:not(.active)');
+ const lockedSl = this.getLockedSightLine();
if (!lockedSl) {
this.sightLine.clear();
@@ -202,7 +210,7 @@ export default class Game {
toPlace = state.occupant;
this.counter.removeClones(toPlace);
this.counter.getTrace(toPlace).remove();
- const lockedSl = this.svg.querySelector('.sight-line:not(.active)');
+ const lockedSl = this.getLockedSightLine();
if (!lockedSl) {
this.sightLine.clear();
@@ -249,20 +257,10 @@ export default class Game {
}
});
- // Logic for this event:
- // If there's a locked sightline, unlock it. Otherwise, if there's an
- // active sightline, lock it.
-
- // There is an active sightline when there is a selected soldier, its
- // counter is on the board, and the pointer is over a cell other than the
- // one that counter occupies.
-
- // There is a locked sightline when there is a selected soldier, its
- // counter is on the board, and one cell has the 'sight-line-target' class.
cell.addEventListener('contextmenu', e => {
e.preventDefault();
- let sl = this.svg.querySelector('.sight-line');
+ let sl = this.getSightLine();
if (sl) {
sl.classList.toggle('active');
@@ -270,7 +268,7 @@ export default class Game {
if (sl.classList.contains('active')) {
this.sightLine.clear();
} else {
- cell.querySelector(`use[href="#hex"]`).classList.add('sight-line-target');
+ this.getHex(cell).classList.add('sight-line-target');
}
cell.dispatchEvent(new MouseEvent('pointerover'));
@@ -281,7 +279,7 @@ export default class Game {
let selected = this.getSelected();
if (selected) {
- let sl = this.svg.querySelector('.sight-line'),
+ let sl = this.getSightLine(),
isOnBoard = selected.parentElement.hasAttribute('data-x'),
sourceCell = selected.parentElement;
@@ -298,9 +296,9 @@ export default class Game {
});
cell.addEventListener('pointerout', e => {
- let sl = this.svg.querySelector('.sight-line.active');
+ let sl = this.getActiveSightLine();
- if (sl && sl.classList.contains('active')) {
+ if (sl) {
this.sightLine.clear();
}
--
cgit v1.2.3