Add tree copse to mapsheet1

src/radial.js

@@ -327,12 +327,6 @@ mapsheet4BuildingCoords.forEach(building => {
 const gameboard = svg.querySelector('.gameboard');
 
 let mapsheet1 = {
-  id: 'mapsheet1',
-  grid: new Map(mapsheetHexCoords),
-  buildings: mapsheet1BuildingCoords
-};
-
-let mapsheet10 = {
   id: 'mapsheet1',
   grid: new Map(mapsheetHexCoords),
   buildings: [
@@ -366,10 +360,19 @@ let mapsheet10 = {
       grid: new Map(buildingHexes.bld6),
       position: rotate180({ q: -13, r: 7, s: 6 })
     },
+    {
+      type: 'terrain',
+      grid: generateRadialCoords(
+        new Map(),
+        { q: 0, r: 0, s: 0 },
+        { left: 3, top: 5, right: 3, bottom: 5 }
+      ),
+      position: ({ q, r, s }) => ({ q: q, r: r, s: s })
+    }
   ]
 };
 
-let mapsheet20 = {
+let mapsheet2 = {
   id: 'mapsheet2',
   grid: new Map(mapsheetHexCoords),
   buildings: [
@@ -411,7 +414,7 @@ let mapsheet20 = {
   ]
 };
 
-let mapsheet30 = {
+let mapsheet3 = {
   id: 'mapsheet3',
   grid: new Map(mapsheetHexCoords),
   buildings: [
@@ -453,7 +456,7 @@ let mapsheet30 = {
   ]
 };
 
-let mapsheet40 = {
+let mapsheet4 = {
   id: 'mapsheet4',
   grid: new Map(mapsheetHexCoords),
   buildings: [
@@ -476,24 +479,6 @@ function rotate180(coords) {
   };
 }
 
-let mapsheet2 = {
-  id: 'mapsheet2',
-  grid: mapsheet2hexCoords,
-  buildings: mapsheet2BuildingCoords
-};
-
-let mapsheet3 = {
-  id: 'mapsheet3',
-  grid: mapsheet3hexCoords,
-  buildings: mapsheet3BuildingCoords
-};
-
-let mapsheet4 = {
-  id: 'mapsheet4',
-  grid: mapsheet4hexCoords,
-  buildings: mapsheet4BuildingCoords
-};
-
 function drawMapsheet(gameboard, { id, grid, buildings }, { q: pq, r: pr, s: ps }) {
   const container = document.createElementNS(xmlns, 'g');
   container.id = id;
@@ -603,41 +588,17 @@ function findScalar(arr) {
   });
 }
 
-// mapsheet10 = drawMapsheet(gameboard, mapsheet10, { q: -1, r: 0, s: 1 });
-
 let sheets = [];
 
-// sheets = [[mapsheet30]];
+// sheets = [[mapsheet1]];
+// sheets = [[mapsheet3]];
+// sheets = [[mapsheet2], [mapsheet3]];
+sheets = [[mapsheet2], [mapsheet1], [mapsheet3]];
 
-// drawHexes(gameboard, buildingHexes.bld8, true);
-// drawHexes(gameboard, translateCoords(buildingHexes.bld4, rotate180({ q: -9, r: -6, s: 15 })), true);
-// drawHexes(gameboard, translateCoords(buildingHexes.bld4, rotate180({ q: 0, r: 0, s: 0 })), true);
-
-const buildingTemplate = document.querySelector(`defs #building4`);
-const { x, y } = radialToScreenCoords({ q: 0, r: 0, s: 0 });
-
-const buildingStructure = document.createElementNS(xmlns, 'g');
-buildingStructure.classList.add('structure');
-buildingStructure.classList.add('building');
-buildingStructure.setAttributeNS(null, 'transform', `translate(${x}, ${y}) rotate(180)`);
-// gameboard.appendChild(buildingStructure);
-
-for (let child of buildingTemplate.children) {
-  const use = document.createElementNS(xmlns, 'use');
-  use.setAttributeNS(null, 'href', `#${child.id}`);
-  child.classList.forEach(className => use.classList.add(className));
-  buildingStructure.appendChild(use);
-}
-
-
-// sheets = [[mapsheet20], [mapsheet30]];
-// sheets = [[mapsheet20], [mapsheet10], [mapsheet30]];
-// sheets = [[mapsheet10]];
-
-sheets = [
-  [mapsheet20, mapsheet10],
-  [mapsheet30, mapsheet40]
-];
+// sheets = [
+//   [mapsheet2, mapsheet1],
+//   [mapsheet3, mapsheet4]
+// ];
 
 findScalar(findMult(sheets)).forEach(([vscalar, row]) => {
   const vertMapVect = function(coords) {