WIP: Render buildings already in gameboard when scenario is loaded

src/modules/scenario.js

@@ -94,11 +94,15 @@ export async function build(svg, request) {
   //if (startLocs) grid.before(svg.ownerDocument.importNode(startLocs, true));
 
   const scenarioGrid = scenario.querySelector('.grid');
+  const scenarioBuildings = scenario.querySelector('.gameboard .buildings');
 
   if (scenarioGrid) {
     grid.replaceWith(svg.ownerDocument.importNode(scenarioGrid, true));
   }
 
+  if (scenarioBuildings)
+    svg.querySelector('.gameboard .buildings').replaceWith(svg.ownerDocument.importNode(scenarioBuildings, true));
+
   await loadScript(scenario, svg, 'radial')
   return loadScript(scenario, svg, 'map');
 }

src/radial.js

@@ -197,7 +197,7 @@ function drawBuildings(buildings, container, { q: pq, r: pr, s: ps }, features)
     buildingStructure.setAttributeNS(null, 'transform', transform(x, y));
 
     const [mapsheet] = container.classList;
-    document.querySelector(`.buildings .${mapsheet}`).appendChild(buildingStructure);
+    document.querySelector(`.buildings .${mapsheet}`).prepend(buildingStructure);
 
     building.elevationLevels.forEach(elevationLevel => {
       const hexContainer = document.createElementNS(xmlns, 'g');
@@ -399,7 +399,7 @@ sheets = msGrps.map(msG => {
         }, new Map());
 
         const { q: dq, r: dr, s: ds } = toRad(bld.dataset);
-        let position // = bld.dataset.rotate ? rotate180({ q: +dq, r: +dr, s: +ds }) : ({ q, r, s }) => ({ q: q + +dq, r: r + +dr, s: s + +ds });
+        let position;
 
         if (bld.dataset.rotate)
           position = rotate180({ q: +dq, r: +dr, s: +ds });
@@ -426,7 +426,6 @@ sheets = msGrps.map(msG => {
   });
 });
 
-const scenarioMapsheets = document.querySelectorAll('.grid [class^="mapsheet"]');
 document.querySelectorAll('use[href^="#building"]').forEach(el => el.remove());
 
 let finalGrid = new Map();