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

Add two more sight line query functions

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc 2024-04-24 16:43:14 -07:00
parent accff86ae1
commit e7f7bf1f31
2 changed files with 32 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/modules/counter.js
View File

@ -1,6 +1,5 @@
const svgns = "http://www.w3.org/2000/svg"; const svgns = "http://www.w3.org/2000/svg";
export default class Counter { export default class Counter {
constructor(svg) { constructor(svg) {
this.svg = svg; this.svg = svg;
@ -60,8 +59,6 @@ export default class Counter {
let points, let points,
counterNodeList = this.getCounterAndClones(selected); counterNodeList = this.getCounterAndClones(selected);
console.log(selected, counterNodeList);
if (counterNodeList.length > 0 && selected.parentElement.hasAttribute('data-x')) { if (counterNodeList.length > 0 && selected.parentElement.hasAttribute('data-x')) {
let trace = this.svg.querySelector(this.traceSelector(selected)); let trace = this.svg.querySelector(this.traceSelector(selected));

38
src/modules/game.js
View File

@ -45,6 +45,14 @@ export default class Game {
return this.svg.querySelector('line.sight-line'); 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 }}}}) { getGridIndex({ parentElement: { dataset: { x }, parentElement: { dataset: { y }}}}) {
return { x, y }; return { x, y };
} }
@ -127,7 +135,6 @@ export default class Game {
} }
setUpCells() { setUpCells() {
this.getCells().forEach(cell => {
function isGrenade(el) { function isGrenade(el) {
return el && el.getAttribute('href') === '#counter-grenade'; return el && el.getAttribute('href') === '#counter-grenade';
} }
@ -143,10 +150,11 @@ export default class Game {
}; };
} }
this.getCells().forEach(cell => {
cell.addEventListener('click', e => { cell.addEventListener('click', e => {
const state = { const state = {
placing: this.placing, placing: this.placing,
hex: cell.querySelector('use[href="#hex"]'), hex: this.getHex(cell),
occupant: this.getCellOccupant(cell), occupant: this.getCellOccupant(cell),
contents: this.getCellContents(cell) contents: this.getCellContents(cell)
}; };
@ -158,7 +166,7 @@ export default class Game {
} else if (toPlace && !state.occupant) { } else if (toPlace && !state.occupant) {
this.counter.place(toPlace, cell); this.counter.place(toPlace, cell);
this.placing.push(toPlace); this.placing.push(toPlace);
const lockedSl = this.svg.querySelector('.sight-line:not(.active)'); const lockedSl = this.getLockedSightLine();
if (!lockedSl) { if (!lockedSl) {
this.sightLine.clear(); this.sightLine.clear();
@ -181,7 +189,7 @@ export default class Game {
trace.setAttributeNS(null, 'points', points.join(' ')); trace.setAttributeNS(null, 'points', points.join(' '));
} }
this.placing.push(toPlace); this.placing.push(toPlace);
const lockedSl = this.svg.querySelector('.sight-line:not(.active)'); const lockedSl = this.getLockedSightLine();
if (!lockedSl) { if (!lockedSl) {
this.sightLine.clear(); this.sightLine.clear();
@ -202,7 +210,7 @@ export default class Game {
toPlace = state.occupant; toPlace = state.occupant;
this.counter.removeClones(toPlace); this.counter.removeClones(toPlace);
this.counter.getTrace(toPlace).remove(); this.counter.getTrace(toPlace).remove();
const lockedSl = this.svg.querySelector('.sight-line:not(.active)'); const lockedSl = this.getLockedSightLine();
if (!lockedSl) { if (!lockedSl) {
this.sightLine.clear(); 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 => { cell.addEventListener('contextmenu', e => {
e.preventDefault(); e.preventDefault();
let sl = this.svg.querySelector('.sight-line'); let sl = this.getSightLine();
if (sl) { if (sl) {
sl.classList.toggle('active'); sl.classList.toggle('active');
@ -270,7 +268,7 @@ export default class Game {
if (sl.classList.contains('active')) { if (sl.classList.contains('active')) {
this.sightLine.clear(); this.sightLine.clear();
} else { } else {
cell.querySelector(`use[href="#hex"]`).classList.add('sight-line-target'); this.getHex(cell).classList.add('sight-line-target');
} }
cell.dispatchEvent(new MouseEvent('pointerover')); cell.dispatchEvent(new MouseEvent('pointerover'));
@ -281,7 +279,7 @@ export default class Game {
let selected = this.getSelected(); let selected = this.getSelected();
if (selected) { if (selected) {
let sl = this.svg.querySelector('.sight-line'), let sl = this.getSightLine(),
isOnBoard = selected.parentElement.hasAttribute('data-x'), isOnBoard = selected.parentElement.hasAttribute('data-x'),
sourceCell = selected.parentElement; sourceCell = selected.parentElement;
@ -298,9 +296,9 @@ export default class Game {
}); });
cell.addEventListener('pointerout', e => { 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(); this.sightLine.clear();
} }