Clone template instead of modifying original

This commit is contained in:
Catalin Constantin Mititiuc 2024-07-10 19:29:38 -07:00
parent b3f902f012
commit 1711863334
3 changed files with 12 additions and 27 deletions

View File

@ -35,6 +35,12 @@ const mapPlaceholder = document.querySelector('.map-placeholder'),
6: 'six' 6: 'six'
}, },
attrNames = {
'primary-weapon': 'weapon',
'troop-number': 'number',
'squad-number': 'squad'
},
toggleContentVis = (function () { toggleContentVis = (function () {
document.querySelector('#content').style.minWidth = this.checked ? '' : 0; document.querySelector('#content').style.minWidth = this.checked ? '' : 0;
@ -55,19 +61,12 @@ async function buildScenario(req) {
gameboard.stop(); gameboard.stop();
recordSheet.stop(); recordSheet.stop();
// const svg = scenarioTemplate.querySelector('svg').cloneNode(true); const map = document.querySelector('object').contentDocument.querySelector('svg');
const template = scenarioTemplate.querySelector('svg').cloneNode(true);
map.replaceWith(template);
const svg = document.querySelector('object').contentDocument.querySelector('svg'); await build(template, req);
await build(svg, req);
const scenario = await req; const scenario = await req;
const attrNames = {
'primary-weapon': 'weapon',
'troop-number': 'number',
'squad-number': 'squad'
};
const scenarioUnits = scenario.querySelectorAll('svg g.counter'); const scenarioUnits = scenario.querySelectorAll('svg g.counter');
scenarioUnits.forEach(cntr => { scenarioUnits.forEach(cntr => {
@ -81,8 +80,8 @@ async function buildScenario(req) {
mapResourceEl.style.opacity = 1; mapResourceEl.style.opacity = 1;
mapPlaceholder.style.opacity = 0; mapPlaceholder.style.opacity = 0;
panzoom.start(svg); panzoom.start(template);
gameboard.start(svg); gameboard.start(template);
// recordSheet.start(svg.querySelector('.start-locations'), gameboard.getUnits()); // recordSheet.start(svg.querySelector('.start-locations'), gameboard.getUnits());
recordSheet.start(null, scenarioUnits); recordSheet.start(null, scenarioUnits);

View File

@ -70,9 +70,6 @@ export async function build(svg, request) {
return acc; return acc;
}, {}); }, {});
console.log('refs', refs);
console.log(counters.split('/').pop().split('-').shift());
const hashedFilenames = { const hashedFilenames = {
'counters.svg': counters, 'counters.svg': counters,
'mapsheets.svg': mapsheets 'mapsheets.svg': mapsheets
@ -98,13 +95,6 @@ export async function build(svg, request) {
}); });
}); });
// scenario.querySelectorAll('use.mapsheet').forEach(el =>
// gb.querySelector('#background').after(svg.ownerDocument.importNode(el, true))
//);
// startLocs.querySelectorAll('.counter').forEach(el => console.log(el));
//console.log(startLocs);
//if (startLocs) grid.before(svg.ownerDocument.importNode(startLocs, true)); //if (startLocs) grid.before(svg.ownerDocument.importNode(startLocs, true));
const scenarioGrid = scenario.querySelector('.grid'); const scenarioGrid = scenario.querySelector('.grid');
@ -113,8 +103,6 @@ export async function build(svg, request) {
grid.replaceWith(svg.ownerDocument.importNode(scenarioGrid, true)); grid.replaceWith(svg.ownerDocument.importNode(scenarioGrid, true));
} }
//defs.replaceWith(scenario.querySelector('defs'));
await loadScript(scenario, svg, 'radial') await loadScript(scenario, svg, 'radial')
return loadScript(scenario, svg, 'map'); return loadScript(scenario, svg, 'map');
} }

View File

@ -595,8 +595,6 @@ const mapsheets = [mapsheet1, mapsheet2, mapsheet3, mapsheet4].reduce((acc, ms)
return acc; return acc;
}, {}); }, {});
console.log(mapsheets);
let sheets = []; let sheets = [];
const scenarioMapsheets = document.querySelectorAll('.grid [class^="mapsheet"]'); const scenarioMapsheets = document.querySelectorAll('.grid [class^="mapsheet"]');