| 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-14 13:12:21 -0700 |
|---|---|---|
| committer | Catalin Mititiuc <webdevcat@proton.me> | 2024-04-14 13:12:21 -0700 |
| commit | 0aef8a6401230976e567bfd9b0bef56a51d88d34 (patch) | |
| tree | 5f4ebeeb85539e00ffb955f5a4ca5a4671a5027c /src/index.js | |
| parent | 97cc1f012a2d90702f34c1b9aaf80be8ea4ec633 (diff) | |
WIP
Diffstat (limited to 'src/index.js')
| -rw-r--r-- | src/index.js | 49 |
1 files changed, 39 insertions, 10 deletions
diff --git a/src/index.js b/src/index.js index 9a114d7..4106e73 100644 --- a/src/index.js +++ b/src/index.js @@ -144,7 +144,45 @@ const PanZoom = new function () { pan(svg, e); }, { passive: false }); + }; +}; + +const Grid = new function () { + this.setUp = function (cells) { + cells.forEach(cell => cell.addEventListener('click', e => { + let { dataset: { x }, parentElement: { dataset: { y }}} = cell; + + console.log(`Cell at index { x: ${x}, y: ${y} } clicked.`); + })); + }; +}; + +const Counter = new function () { + this.setUp = function (counters) { + counters.forEach(counter => counter.addEventListener('click', e => { + e.stopPropagation(); + + const { allegiance: allegiance, number: n } = counter.dataset, + al = allegiance.charAt(0).toUpperCase() + allegiance.slice(1); + + console.log(`${al} troop #${n} clicked.`); + })); + }; +}; + +const Board = new function () { + function getCells (svg) { + return svg.querySelectorAll('g[data-x]'); + } + + function getCounters (svg) { + return svg.querySelectorAll('use[href*="#t-"]'); } + + this.setUp = function (svg) { + Grid.setUp(getCells(svg)); + Counter.setUp(getCounters(svg)); + }; }; window.addEventListener('load', () => { @@ -159,16 +197,7 @@ window.addEventListener('load', () => { recordSheetVisibility = document.querySelector('#content input[type="checkbox"].visible'); PanZoom.start(svg); - - let cells = svg.querySelectorAll('g[data-x]'); - - cells.forEach(cell => { - cell.addEventListener('click', e => { - let { dataset: { x }, parentElement: { dataset: { y }}} = cell; - - console.log(`Cell at index { x: ${x}, y: ${y} } clicked.`); - } - )}); + Board.setUp(svg); const q = s => document.querySelector(s), qA = s => document.querySelectorAll(s); |