index : btroops | |
Virtual board game-aid for BattleTroops, an infantry combat simulator wargame published by FASA in 1989. |
aboutsummaryrefslogtreecommitdiff |
diff options
author | Catalin Mititiuc <Catalin.Mititiuc@gmail.com> | 2024-04-04 09:04:05 -0700 |
---|---|---|
committer | Catalin Mititiuc <Catalin.Mititiuc@gmail.com> | 2024-04-04 09:04:05 -0700 |
commit | 9e653d068141fa2a969bdc440a1b0a1a63c620c6 (patch) | |
tree | 524c8e97e0f0d6823b854247f2d8bbc104a60d9e /index.js | |
parent | adc67da606798fa0eaf7c155fe73cfa6d87f1463 (diff) |
Add prone counters
Diffstat (limited to 'index.js')
-rw-r--r-- | index.js | 43 |
1 files changed, 36 insertions, 7 deletions
@@ -444,12 +444,15 @@ const Counter = new function() { this.select = function({ dataset: { troopNumber, troopAllegiance }}) { this.unSelect(); - let queriedCounter = container.querySelector(selector(troopNumber, troopAllegiance)); + let counterAndClones = container.querySelectorAll(selector(troopNumber, troopAllegiance)); - if (queriedCounter) { - queriedCounter.classList.add(selectedClass); - queriedCounter.style.pointerEvents = 'auto'; - } + counterAndClones.forEach(el => { + el.style.pointerEvents = 'auto'; + + if (!el.classList.contains('clone')) { + el.classList.add(selectedClass); + } + }); }; this.unSelect = function() { @@ -524,7 +527,7 @@ const Counter = new function() { } else { counter = document.createElementNS(svgns, 'use'), - counter.setAttributeNS(null, 'href', `#t-${troopNumber}`); + counter.setAttributeNS(null, 'href', `#${troopAllegiance}-${troopNumber}`); counter.classList.add('counter', 'selected'); counter.setAttributeNS(null, 'x', point.getAttribute('x')); counter.setAttributeNS(null, 'y', point.getAttribute('y')); @@ -563,6 +566,12 @@ const Counter = new function() { Counter.removeClones(el); }; + + this.hasProne = function(troopNumber, troopAllegiance) { + let selector = `g#${troopAllegiance}-${troopNumber} use[href="#counter-prone"]`; + + return !!document.querySelector(selector); + }; }; const RecordSheet = new function() { @@ -580,6 +589,7 @@ const RecordSheet = new function() { if (selected) { selected.classList.remove('selected'); + document.getElementById('toggle-prone-counter').checked = false; } clipUnclippedFiringArcs(); @@ -591,10 +601,13 @@ const RecordSheet = new function() { }; this.select = function(el) { - let { troopNumber, troopAllegiance } = el.dataset; + let { troopNumber, troopAllegiance } = el.dataset, + proneStatus = Counter.hasProne(troopNumber, troopAllegiance); + this.unSelect(); el.classList.add('selected'); + document.getElementById('toggle-prone-counter').checked = proneStatus; existingArcs = document.querySelectorAll(`#firing-arcs polygon[data-troop-number="${troopNumber}"][data-troop-allegiance="${troopAllegiance}"]`); existingArcs.forEach(el => el.removeAttribute('clip-path')); }; @@ -934,6 +947,22 @@ document.querySelectorAll('#toggle-firing-arc-vis input').forEach(el => el.addEv clipPaths.forEach(cp => cp.style.display = el.checked ? 'none' : ''); })); +document.getElementById('toggle-prone-counter').addEventListener('input', function(e) { + let selected = RecordSheet.getSelected(); + + if (selected) { + let template = q(`g#${selected.dataset.troopAllegiance}-${selected.dataset.troopNumber}`); + + if (this.checked) { + let counter = document.createElementNS(svgns, 'use'); + counter.setAttributeNS(null, 'href', '#counter-prone'); + template.appendChild(counter); + } else { + template.querySelector('[href="#counter-prone"]').remove(); + } + } +}); + (function debug() { function drawLine(x1, y1, x2, y2) { let start = ptGrp.querySelector(`[data-x="${x1}"][data-y="${y1}"]`); |