Add special transform for building 4, mapsheet 1

author: Catalin Mititiuc <webdevcat@proton.me> 2024-07-13 11:44:13 -0700
committer: Catalin Mititiuc <webdevcat@proton.me> 2024-07-13 11:44:13 -0700
commit: c0fe0407380f51c83178991f5f3719eab5452559 (patch)
tree: f12bd723c50b6a1a37a097748669c998f1b6871a
parent: 5465a0741a075de714053e7196adf8492272877c (diff)
4 files changed, 33 insertions, 5 deletions
diff --git a/public/assets/images/map4.svg b/public/assets/images/map4.svg
index ec57ad4..1462a04 100644
--- a/public/assets/images/map4.svg
+++ b/public/assets/images/map4.svg
@@ -73,6 +73,4 @@
       </g>
     </g>
   </g>
-
-  <script data-left="2" data-right="2" data-top="2" data-bottom="2"></script>
 </svg>
diff --git a/public/assets/images/mapsheets.svg b/public/assets/images/mapsheets.svg
index 52c024c..3f62c5f 100644
--- a/public/assets/images/mapsheets.svg
+++ b/public/assets/images/mapsheets.svg
@@ -48,6 +48,7 @@
         <path id="building8-windows" class="windows" d="m 67.141739,52.500009 -13.043477,1e-5 m -145.028256,-135.978261 -1e-5,-13.043473 m 207.840024,-1.95653 -2e-5,-13.043495 m -23.78826,-0.97825 H 80.078262 M 90.930001,-9.99998 v -10 m -41.108261,-77.500015 -13.043477,1e-5 m -38.9165241,-1e-5 -13.0434759,1e-5 M -62.758261,-112.5 l -13.043478,1e-5 m 177.583479,195.000009 -13.043475,1e-5 m -179.66826,-135.97827 -10e-6,-13.043479 m 10e-6,58.04348 -10e-6,-13.043479 m -25.979975,43.043478 -10e-6,-13.04348 m 10e-6,43.04348 -10e-6,-13.04348 m 10e-6,43.04348 -10e-6,-13.04348 m 236.01173,-60.97826 -13.04347,10e-6 m 19.51174,59.02173 -1e-5,-13.04348 m 1e-5,-16.95652 -1e-5,-13.04348 M -5.4258655,84.398019 1.0958663,73.102029" />
       </g>
     </g>
+
     <g id="building7" class="building">
       <g class="footprint">
         <g data-q="0" data-r="0" data-s="0" data-left="6" data-top="3" data-right="6" data-bottom="2" data-offset="left" />
@@ -66,6 +67,7 @@
         <path id="building7-windows" class="windows" d="M 3.2610648,50.648099 -3.2606848,39.352121 m -58.2062772,-98.862913 -11.29598,6.521748 m -17.097923,103.637038 6.52173,-11.295988 m 63.880873,-106.851791 -13.043477,1e-5 m -84.408251,44.021514 -1e-5,-13.043478 m 225.16038,-16.956522 -1e-5,-13.043478 m -196.988632,14.021734 -13.043478,1e-5 m 210.03212,44.0217348 -1e-5,-13.0434798 m -41.108632,-45.978045 -13.043476,1e-5 M -116.91,51.521739 l -1e-5,-13.043478 m 184.051749,14.021954 -13.043477,1e-5 m -21.596523,-1e-5 -13.043478,1e-5 m 82.323479,-1e-5 -13.043475,1e-5" />
       </g>
     </g>
+
     <g id="building6" class="building">
       <g class="footprint">
         <g data-q="0" data-r="0" data-s="0" data-left="0" data-top="4" data-right="1" data-bottom="3" data-offset="none" />
@@ -81,6 +83,7 @@
         <path id="building6-windows" class="windows" d="M -12.99,-25 V -35 M 30.31,6.52 l -0,-13.04 m -6.47,-60.98 -13.04,0 M 30.31,35 V 25 M -12.99,6.52 -12.99,-6.52" />
       </g>
     </g>
+
     <g id="building5" class="building">
       <g class="footprint">
         <g data-q="0" data-r="0" data-s="0" data-left="4" data-top="2" data-right="3" data-bottom="1" data-offset="none" />
@@ -96,6 +99,7 @@
         <path id="building5-windows" class="windows" d="m -19.458262,22.499995 -13.043477,1e-5 M -82.269997,4.9999997 V -5 M 47.630001,20 V 9.9999997 m -32.448262,12.4999953 -13.0434773,1e-5 m 39.0234773,-60.00001 -13.043477,1e-5 m -8.468261,-5e-6 -8.851739,5e-6 m -30.256523,-1e-5 -13.043478,1e-5 M -82.269999,20 V 9.9999998" />
       </g>
     </g>
+
     <g id="building4" class="building">
       <g class="footprint">
         <g data-q="0" data-r="0" data-s="0" data-left="1" data-top="3" data-right="2" data-bottom="4" data-offset="left" />
@@ -111,6 +115,7 @@
         <path id="building4-windows" class="windows" d="m -30.309995,21.521739 -10e-6,-13.0434784 m 69.280008,-31.9565216 -10e-6,-13.043478 m -15.128255,104.021734 -13.043478,1e-5 m -41.108264,-75.978266 -10e-6,-13.043478 m 69.280017,58.043478 -10e-6,-13.043479" />
       </g>
     </g>
+
     <g id="building3" class="building">
       <g class="footprint">
         <g data-q="0" data-r="0" data-s="0" data-left="1" data-top="2" data-right="1" data-bottom="3" data-offset="none" />
@@ -126,6 +131,7 @@
         <path id="building3-windows" class="windows" d="m 15.181739,52.499998 -13.0434778,1e-5 m -32.4482592,-30.978269 -10e-6,-13.0434782 m 60.62002,-16.9565213 -10e-6,-13.0434785 m -41.108263,-15.978263 -13.043478,1e-5 m 54.151751,59.021731 -10e-6,-13.0434788" />
       </g>
     </g>
+
     <g id="building2" class="building">
       <g class="footprint">
         <g data-q="0" data-r="0" data-s="0" data-left="2" data-top="4" data-right="2" data-bottom="4" data-offset="both" />
@@ -270,8 +276,11 @@
       </g>
 
       <!-- TODO this building has a special transform. see radial.js -->
-      <g class="building4" data-q="15" data-r="-7" data-s="-8" data-el="0,1">
+      <g class="building4" data-q="15" data-r="-7" data-s="-8" data-el="0,1" data-transform="special">
         <use href="#building4"/>
+        <g class="footprint">
+          <g data-q="0" data-r="0" data-s="0" data-left="1" data-top="3" data-right="2" data-bottom="4" data-offset="right" />
+        </g>
         <g class="furniture">
           <use href="#bed" transform="translate(-17.654924,-30)" />
           <use href="#bed" transform="translate(25.645076,-42)" />
diff --git a/public/assets/images/scenario_template.svg b/public/assets/images/scenario_template.svg
index 01fb328..5480a8c 100644
--- a/public/assets/images/scenario_template.svg
+++ b/public/assets/images/scenario_template.svg
@@ -3,6 +3,13 @@
   <link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="../css/radial.css" type="text/css" />
   <link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="../css/map.css" type="text/css" />
 
+  <!--<style>-->
+  <!--  .grid .building use {-->
+  <!--    opacity: 1;-->
+  <!--    fill: teal;-->
+  <!--  }-->
+  <!--</style>-->
+
   <defs>
     <polygon id="hex" points="0,10 8.66,5 8.66,-5 0,-10 -8.66,-5 -8.66,5"/>
 
diff --git a/src/radial.js b/src/radial.js
index 6ad04b0..547c0ea 100644
--- a/src/radial.js
+++ b/src/radial.js
@@ -624,14 +624,28 @@ sheets = msGrps.map(msG => {
       buildings: [...buildings].map(bld => {
         const bldId = bld.getAttributeNS(null, 'class');
         const bldDef = document.querySelector(`defs #${bldId}`);
+        // Map-specific footprint definition override
+        const footprint = bld.querySelector('.footprint') ? bld.querySelectorAll('.footprint g') : bldDef.querySelectorAll('.footprint g');
 
-        const grid = [...bldDef.querySelectorAll('.footprint g')].reduce((acc, coordEl) => {
+        const grid = [...footprint].reduce((acc, coordEl) => {
           acc = generateRadialCoords(acc, toRad(coordEl.dataset), toRect(coordEl.dataset), coordEl.dataset.offset);
           return acc;
         }, new Map());
 
         const { q: dq, r: dr, s: ds } = toRad(bld.dataset);
-        const 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 // = bld.dataset.rotate ? rotate180({ q: +dq, r: +dr, s: +ds }) : ({ q, r, s }) => ({ q: q + +dq, r: r + +dr, s: s + +ds });
+
+        if (bld.dataset.rotate)
+          position = rotate180({ q: +dq, r: +dr, s: +ds });
+        else if (bld.dataset.transform)
+          position = ({ q, r, s }) => ({
+            q: q + +dq,
+            r: r + +dr,
+            s: s + +ds,
+            transform: (x, y) => `translate(${x + horzSpacing}, ${y})`
+          })
+        else
+          position = ({ q, r, s }) => ({ q: q + +dq, r: r + +dr, s: s + +ds });
 
         return {
           type: bld.getAttributeNS(null, 'class'),
author	Catalin Mititiuc <webdevcat@proton.me>	2024-07-13 11:44:13 -0700
committer	Catalin Mititiuc <webdevcat@proton.me>	2024-07-13 11:44:13 -0700
commit	c0fe0407380f51c83178991f5f3719eab5452559 (patch)
tree	f12bd723c50b6a1a37a097748669c998f1b6871a
parent	5465a0741a075de714053e7196adf8492272877c (diff)