Web Dev Solutions

Catalin Mititiuc

From 82d3a4b415ba920176058d615b697e84a49adabc Mon Sep 17 00:00:00 2001 From: Catalin Mititiuc Date: Tue, 30 Apr 2024 10:17:45 -0700 Subject: Create record sheet dynamically when map is loaded --- src/index.js | 41 +++++++++++++++++++++++++++++------------ 1 file changed, 29 insertions(+), 12 deletions(-) (limited to 'src/index.js') diff --git a/src/index.js b/src/index.js index a6bd5d0..b6315f5 100644 --- a/src/index.js +++ b/src/index.js @@ -16,6 +16,35 @@ object.addEventListener('load', function (e) { const svg = this.contentDocument.querySelector('svg'); panzoom.start(svg); gameboard.start(svg); + + recordSheet.clear(); + + const recordTemplate = document.querySelector('template#soldier-record-block'); + const startLoc = svg.querySelector('.start-locations'); + const forces = recordSheet.createRecords(gameboard.getUnits(), recordTemplate); + + for (const affiliation in forces) { + const container = document.querySelector(`#${affiliation}-record`); + const name = startLoc.dataset[`${affiliation}Name`]; + if (name) { + container.querySelector('.name').textContent = name; + } + forces[affiliation].forEach(r => container.appendChild(r)); + } + + document.querySelectorAll('.soldier-record').forEach(el => + el.addEventListener('click', () => { + if (el.classList.contains('selected')) { + el.classList.remove('selected'); + gameboard.unSelect(); + recordSheet.unSelect(); + } else { + gameboard.select(el); + } + }) + ); + + window.game = gameboard; }); gameboard.setDistanceCallback((count = '-') => { @@ -26,18 +55,6 @@ gameboard.setDistanceCallback((count = '-') => { gameboard.setProneFlagCallback(checked => proneToggle.checked = checked); gameboard.setSelectCallback(data => recordSheet.select(data)); -document.querySelectorAll('.soldier-record').forEach(el => - el.addEventListener('click', () => { - if (el.classList.contains('selected')) { - el.classList.remove('selected'); - gameboard.unSelect(); - recordSheet.unSelect(); - } else { - gameboard.select(el); - } - }) -); - document.querySelectorAll('.end-move').forEach(el => el.addEventListener('click', () => { recordSheet.endMove(); gameboard.endMove(); -- cgit v1.2.3