WIP: normalize generateRadialCoords range

src/radial.js

@@ -129,9 +129,9 @@ function generateRadialCoords(l, { q, r, s, t = 0 } = {}, { left, top, right, bo
 
       if ([
         !list.has(w),
-        wr < bottom + r && wr > -top + r,
+        wr <= bottom + r && wr >= -top + r,
-        wq > -dRight + q - dr && wq < dLeft + q + dr,
+        Math.floor((wq - q - ws + s) / 2) <= dLeft,
-        ws > -dLeft + s - dr && ws < dRight + s + dr,
+        Math.floor((ws - s - wq + q) / 2) <= dRight,
       ].every(v => v)) {
         list.set(w, dr);
         queue.push(w);
@@ -594,14 +594,60 @@ const mapsheets = [mapsheet1, mapsheet2, mapsheet3, mapsheet4].reduce((acc, ms)
 
 let sheets = [];
 
-const scenarioMapsheets = document.querySelectorAll('.grid [class^="mapsheet"]');
+const msGrps = [...document.querySelectorAll('.grid .mapsheets > *')].map(g => [...g.querySelectorAll('[class^="mapsheet"]')]);
 
-sheets = [...scenarioMapsheets].map(m => {
+sheets = msGrps.map(msG => {
-  const [mapName] = m.classList;
+  return msG.map(mapsheetEl => {
-  return [mapsheets[mapName]];
+    const mapsheetDef = document.querySelector(`defs #${mapsheetEl.getAttributeNS(null, 'class')}`);
+    const buildings = mapsheetDef.querySelectorAll('[class^="building"]');
+
+    const mapsheet = {
+      id: mapsheetDef.id,
+      grid: generateRadialCoords(
+        new Map(),
+        { q: 0, r: 0, s: 0 },
+        'left' in mapsheetDef.dataset ? toRect(mapsheetDef.dataset) : { left: 17, top: 13, right: 17, bottom: 14 },
+        'left'
+      ),
+      buildings: [...buildings].map(bld => {
+        const bldId = bld.getAttributeNS(null, 'class');
+        const bldDef = document.querySelector(`defs #${bldId}`);
+
+        return {
+          type: bld.getAttributeNS(null, 'class'),
+          elevationLevels: range(0, 1),
+          grid: generateRadialCoords(
+            new Map(),
+            { q: 0, r: 0, s: 0 },
+            toRect(bldDef.dataset),
+            'left'
+          ),
+          position: ({ q, r, s }) => {
+            const { q: dq, r: dr, s: ds } = toRad(bld.dataset);
+            return { q: q + +dq, r: r + +dr, s: s + +ds };
+          }
+        }
+      })
+    }
+
+    return mapsheet;
+  });
 });
 
-scenarioMapsheets.forEach(el => el.remove());
+sheets = []
+
+const scenarioMapsheets = document.querySelectorAll('.grid [class^="mapsheet"]');
+
+// sheets = [...scenarioMapsheets].reduce((acc, m) => {
+//   const [mapName] = m.classList;
+//   if (mapsheets[mapName]) {
+//     acc.push([mapsheets[mapName]]);
+//     m.remove();
+//   }
+//   return acc;
+// }, []);
+
+//scenarioMapsheets.forEach(el => el.remove());
 document.querySelectorAll('use[href^="#building"]').forEach(el => el.remove());
 
 // sheets = [[mapsheet1]];
@@ -647,15 +693,33 @@ function addGroup(container, className) {
   return g;
 }
 
-const { left, right, top, bottom } = document.currentScript.dataset;
+// const { left, right, top, bottom } = document.currentScript.dataset;
+//
+// if (left && right && top && bottom) {
+//   const map = generateRadialCoords(
+//     new Map(),
+//     { q: 0, r: 0, s: 0 },
+//     { left: +left, top: +top, right: +right, bottom: +bottom },
+//     'both'
+//   );
+//
+//   drawHexes(addGroup(grid, 'elevation-0'), map);
+// }
 
-if (left && right && top && bottom) {
+function toRect({ left, right, top, bottom }) {
-  const map = generateRadialCoords(
+  return { left: +left, right: +right, top: +top, bottom: +bottom };
-    new Map(),
-    { q: 0, r: 0, s: 0 },
-    { left: +left, top: +top, right: +right, bottom: +bottom },
-    'both'
-  );
-
-  drawHexes(addGroup(grid, 'elevation-0'), map);
 }
+
+function toRad({ q, r, s }) {
+  return { q: +q, r: +r, s: +s };
+}
+
+const mapsheetEls = document.querySelectorAll('.grid .mapsheet');
+
+drawHexes(addGroup(grid, 'elevation-0'), translateCoords(generateRadialCoords(
+  new Map(),
+  { q: 5, r: -4, s: -1 },
+  { left: 2, top: 4, right: 3, bottom: 5 }
+  , 'both'
+), ({ q, r, s }) => ({ q, r, s })), true);
+// ), ({ q, r, s }) => ({ q: -r, r: -s, s: -q })), true);