index : btroops | |
Virtual board game-aid for BattleTroops, an infantry combat simulator wargame published by FASA in 1989. |
aboutsummaryrefslogtreecommitdiff |
diff options
author | Catalin Mititiuc <webdevcat@proton.me> | 2024-04-24 11:22:42 -0700 |
---|---|---|
committer | Catalin Mititiuc <webdevcat@proton.me> | 2024-04-24 12:21:35 -0700 |
commit | b73217c5c45e2c23ac14e70346036cf4477a6ebe (patch) | |
tree | c66cb1b18eba1db7b25611ff779cb361dc7da813 /src/modules | |
parent | 3d2d5cad852a8dc5bd8f4f619b85775a3d1a09f6 (diff) |
Make trooper counters groups
Diffstat (limited to 'src/modules')
-rw-r--r-- | src/modules/counter.js | 24 | ||||
-rw-r--r-- | src/modules/game.js | 24 |
2 files changed, 25 insertions, 23 deletions
diff --git a/src/modules/counter.js b/src/modules/counter.js index 3438566..a4bd4b4 100644 --- a/src/modules/counter.js +++ b/src/modules/counter.js @@ -13,7 +13,7 @@ export default class Counter { } selector(troopNumber, allegiance) { - return `use.counter${this.dataSelector(troopNumber, allegiance)}`; + return `.counter${this.dataSelector(troopNumber, allegiance)}`; } position(x, y) { @@ -21,7 +21,7 @@ export default class Counter { } counterPosition(x, y) { - return `use.counter[data-x="${x}"][data-x="${y}"]`; + return `.counter[data-x="${x}"][data-x="${y}"]`; } traceSelector(troopNumber, allegiance) { @@ -29,19 +29,19 @@ export default class Counter { } getCounters() { - return this.svg.querySelectorAll(`use[data-allegiance][data-number]:not(.clone)`); + return this.svg.querySelectorAll(`.counter[data-allegiance][data-number]:not(.clone)`); } getClones(al, n) { - return this.svg.querySelectorAll(`use[data-allegiance="${al}"][data-number="${n}"].clone`); + return this.svg.querySelectorAll(`.counter.clone[data-allegiance="${al}"][data-number="${n}"]`); } getCounter(al, n) { - return this.svg.querySelector(`use[data-allegiance="${al}"][data-number="${n}"]:not(.clone)`); + return this.svg.querySelector(`.counter[data-allegiance="${al}"][data-number="${n}"]:not(.clone)`); } getCounterAndClones(al, n) { - return this.svg.querySelectorAll(`use[data-allegiance="${al}"][data-number="${n}"]`); + return this.svg.querySelectorAll(`.counter[data-allegiance="${al}"][data-number="${n}"]`); } getTrace({ dataset: { allegiance, number } }) { @@ -247,7 +247,7 @@ export default class Counter { selected.parentElement.parentElement.dataset.y ] - let clone = selected.cloneNode(); + let clone = selected.cloneNode(true); clone.classList.remove(selectedClass); clone.classList.add('clone'); @@ -255,12 +255,6 @@ export default class Counter { selected.parentElement.appendChild(clone); point.parentElement.appendChild(selected); - console.log(this.getCounterAndClones(troopAllegiance, troopNumber)); - - if (clone.parentElement.querySelector('[href="#counter-prone"]')) { - this.toggleProne(); - } - let previous = this.getCellPosition(clone.parentElement), current = this.getCellPosition(selected.parentElement); @@ -331,14 +325,14 @@ export default class Counter { isOnBoard = selected && selected.parentElement.hasAttribute('data-x'); if (selected && isOnBoard) { - const proneCounter = selected.parentElement.querySelector('[href="#counter-prone"]'); + const proneCounter = selected.querySelector('[href="#counter-prone"]'); if (proneCounter) { proneCounter.remove(); } else { const counter = document.createElementNS(svgns, 'use'); counter.setAttributeNS(null, 'href', '#counter-prone'); - selected.parentElement.appendChild(counter); + selected.appendChild(counter); } } } diff --git a/src/modules/game.js b/src/modules/game.js index ff9937b..657aa9d 100644 --- a/src/modules/game.js +++ b/src/modules/game.js @@ -23,11 +23,19 @@ export default class Game { } getCells() { - return this.svg.querySelectorAll('g[data-x]'); + return this.svg.querySelectorAll('g[data-y] > g[data-x]'); } getCell(x, y) { - return this.svg.querySelector(`g[data-y="${y}"] g[data-x="${x}"]`); + return this.svg.querySelector(`g[data-y="${y}"] > g[data-x="${x}"]`); + } + + getCellOccupant(cell) { + return cell.querySelector('.counter'); + } + + getCellContents(cell) { + return cell.querySelectorAll('*:not(use[href="#hex"])'); } getHex(cell) { @@ -35,7 +43,7 @@ export default class Game { } getSelected() { - return this.svg.querySelector(`use[data-allegiance][data-number].selected`); + return this.svg.querySelector(`.counter.selected[data-allegiance][data-number]`); } getSightLine() { @@ -55,7 +63,7 @@ export default class Game { } getCounterAtGridIndex(x, y) { - return this.getCell(x, y).querySelector('use[href*="#t-"'); + return this.getCell(x, y).querySelector('.counter'); } getBoard() { @@ -152,8 +160,8 @@ export default class Game { const state = { placing: this.placing, hex: cell.querySelector('use[href="#hex"]'), - occupant: cell.querySelector('use[href*="#t-"'), - contents: cell.querySelectorAll('*:not(use[href="#hex"])') + occupant: this.getCellOccupant(cell), + contents: this.getCellContents(cell) }; let toPlace = this.placing.pop(); @@ -285,7 +293,7 @@ export default class Game { } } - let occupant = cell.querySelector('use[href*="#t-"'); + let occupant = this.getCellOccupant(cell); if (occupant) { const { number, allegiance } = occupant.dataset; @@ -304,7 +312,7 @@ export default class Game { this.sightLine.clear(); } - let occupant = cell.querySelector('use[href*="#t-"'); + let occupant = this.getCellOccupant(cell); if (occupant) { let { number, allegiance } = occupant.dataset, |