Web Dev Solutions

Catalin Mititiuc

aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorCatalin Mititiuc <webdevcat@proton.me>2024-07-13 11:46:33 -0700
committerCatalin Mititiuc <webdevcat@proton.me>2024-07-13 11:47:07 -0700
commita70c2617d51054acb261103580b3197e51cb35ce (patch)
treef0203a40376c767b99ace78b05a56ff1f07ac269
parentc0fe0407380f51c83178991f5f3719eab5452559 (diff)
Remove hard-coded map data
-rw-r--r--public/assets/images/mapsheets.svg1
-rw-r--r--src/radial.js288
2 files changed, 0 insertions, 289 deletions
diff --git a/public/assets/images/mapsheets.svg b/public/assets/images/mapsheets.svg
index 3f62c5f..e143fd4 100644
--- a/public/assets/images/mapsheets.svg
+++ b/public/assets/images/mapsheets.svg
@@ -275,7 +275,6 @@
<text class="elevation" x="15" y="49">2</text>
</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" data-transform="special">
<use href="#building4"/>
<g class="footprint">
diff --git a/src/radial.js b/src/radial.js
index 547c0ea..b459ad0 100644
--- a/src/radial.js
+++ b/src/radial.js
@@ -153,235 +153,6 @@ function translateCoords(map, translator) {
return translated;
}
-const buildingHexes = {};
-
-buildingHexes.bld1 = generateRadialCoords(
- new Map(),
- { q: 0, r: 0, s: 0 },
- { left: 2, top: 4, right: 3, bottom: 5 },
- 'left'
-);
-
-buildingHexes.bld2 = [
- [{ q: 0, r: 0, s: 0 }, { left: 3, top: 5, right: 3, bottom: 5 }, 'both'],
- [{ q: 3, r: 0, s: -3 }, { left: 1, top: 2, right: 1, bottom: 4 }, 'right'],
- [{ q: -3, r: 0, s: 3 }, { left: 1, top: 2, right: 1, bottom: 4 }, 'left'],
-].reduce((acc, args) => new Map([...generateRadialCoords(acc, ...args)]), new Map());
-
-buildingHexes.bld3 = generateRadialCoords(
- new Map(),
- { q: 0, r: 0, s: 0 },
- { left: 2, top: 3, right: 2, bottom: 4 }
-);
-
-buildingHexes.bld4 = generateRadialCoords(
- new Map(),
- { q: 0, r: 0, s: 0 },
- { left: 2, top: 4, right: 3, bottom: 5 },
- 'left'
-);
-
-buildingHexes.bld5 = generateRadialCoords(
- new Map(),
- { q: 0, r: 0, s: 0 },
- { left: 5, top: 3, right: 4, bottom: 2 }
-);
-
-buildingHexes.bld6 = generateRadialCoords(
- new Map(),
- { q: 0, r: 0, s: 0 },
- { left: 1, top: 5, right: 2, bottom: 4 }
-);
-
-buildingHexes.bld7 = [
- [{ q: 0, r: 0, s: 0 }, { left: 7, top: 4, right: 7, bottom: 3 }, 'left'],
- [{ q: 1, r: -4, s: 3 }, { left: 5, top: 1, right: 6, bottom: 1 }],
- [{ q: 5, r: 3, s: -8 }, { left: 1, top: 1, right: 2, bottom: 1 }],
- [{ q: -4, r: 3, s: 1 }, { left: 3, top: 1, right: 4, bottom: 1 }],
-].reduce((acc, args) => new Map([...generateRadialCoords(acc, ...args)]), new Map());
-
-buildingHexes.bld8 = [
- [{ q: 0, r: 0, s: 0 }, { left: 6, top: 7, right: 6, bottom: 4 }, 'both'],
- [{ q: 5, r: 2, s: -7 }, { left: 1, top: 2, right: 1, bottom: 2 }],
- [{ q: 1, r: 5, s: -6 }, { left: 4, top: 2, right: 4, bottom: 2 }, 'both'],
- [{ q: -2, r: 4, s: -2 }, { left: 1, top: 1, right: 1, bottom: 1 }],
- [{ q: 7, r: -7, s: 0 }, { left: 2, top: 1, right: 2, bottom: 1 }],
- [{ q: -2, r: -7, s: 9 }, { left: 2, top: 1, right: 2, bottom: 1 }],
- [{ q: -3, r: -6, s: 9 }, { left: 1, top: 1, right: 1, bottom: 2 }, 'left'],
- [{ q: -7, r: 3, s: 4 }, { left: 1, top: 3, right: 2, bottom: 3 }, 'right'],
- [{ q: -7, r: 4, s: 3 }, { left: 1, top: 1, right: 1, bottom: 1 }]
-].reduce((acc, args) => new Map([...generateRadialCoords(acc, ...args)]), new Map());
-
-const mapsheetHexCoords = generateRadialCoords(
- new Map(),
- { q: 0, r: 0, s: 0 },
- { left: 17, top: 13, right: 17, bottom: 14 },
- 'left'
-);
-
-const mapsheet1 = {
- id: 'mapsheet1',
- grid: new Map(mapsheetHexCoords),
- buildings: [
- {
- type: 'building2',
- elevationLevels: range(0, 1),
- grid: buildingHexes.bld2,
- position: ({ q, r, s }) => ({ q: q + 7, r: r + 7, s: s - 14 })
- },
- {
- type: 'building3',
- elevationLevels: range(-1, 2),
- grid: new Map(buildingHexes.bld3),
- position: ({ q, r, s }) => ({ q: q - 6, r: r - 6, s: s + 12 })
- },
- {
- type: 'building4',
- elevationLevels: range(0, 1),
- grid: generateRadialCoords(
- new Map(),
- { q: 0, r: 0, s: 0 },
- { left: 2, top: 4, right: 3, bottom: 5 },
- 'right'
- ),
- position: ({ q, r, s }) => ({
- q: q + 15,
- r: r - 7,
- s: s - 8,
- transform: (x, y) => `translate(${x + horzSpacing}, ${y})`
- })
- },
- {
- type: 'building6',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld6),
- position: rotate180({ q: -13, r: 7, s: 6 })
- },
- ],
- features: [
- {
- 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, r, s })
- }
- ]
-};
-
-const mapsheet2 = {
- id: 'mapsheet2',
- grid: new Map(mapsheetHexCoords),
- buildings: [
- {
- type: 'building1',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld1),
- position: ({ q, r, s }) => ({ q: q + 1, r: r + 6, s: s - 7 })
- },
- {
- type: 'building2',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld2),
- position: ({ q, r, s }) => ({ q: q + 7, r: r + 7, s: s - 14 })
- },
- {
- type: 'building3',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld3),
- position: ({ q, r, s }) => ({ q: q - 14, r: r + 5, s: s + 9 })
- },
- {
- type: 'building4',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld4),
- position: ({ q, r, s }) => ({ q: q - 8, r: r + 6, s: s + 2 })
- },
- {
- type: 'building5',
- elevationLevels: range(-1, 3),
- grid: new Map(buildingHexes.bld5),
- position: ({ q, r, s }) => ({ q: q + 13, r: r - 6, s: s - 7 })
- },
- {
- type: 'building6',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld6),
- position: ({ q, r, s }) => ({ q: q + 7, r: r - 6, s: s - 1 })
- },
- {
- type: 'building7',
- elevationLevels: range(-1, 3),
- grid: new Map(buildingHexes.bld7),
- position: ({ q, r, s }) => ({ q: q - 6, r: r - 5, s: s + 11 }),
- },
- ]
-};
-
-const mapsheet3 = {
- id: 'mapsheet3',
- grid: new Map(mapsheetHexCoords),
- buildings: [
- {
- type: 'building1',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld1),
- position: ({ q, r, s }) => ({ q: q - 1, r: r - 6, s: s + 7 })
- },
- {
- type: 'building2',
- elevationLevels: range(-1, 3),
- grid: new Map(buildingHexes.bld2),
- position: rotate180({ q: 9, r: -6, s: -3 })
- },
- {
- type: 'building3',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld3),
- position: rotate180({ q: 17, r: -7, s: -10 })
- },
- {
- type: 'building4',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld4),
- position: rotate180({ q: -10, r: -5, s: 15 })
- },
- {
- type: 'building5',
- elevationLevels: range(-1, 2),
- grid: new Map(buildingHexes.bld5),
- position: ({ q, r, s }) => ({ q: q + 6, r: r + 8, s: s - 14 })
- },
- {
- type: 'building6',
- elevationLevels: range(0, 1),
- grid: new Map(buildingHexes.bld6),
- position: rotate180({ q: 0, r: 6, s: -6 })
- },
- {
- type: 'building7',
- elevationLevels: range(-1, 2),
- grid: new Map(buildingHexes.bld7),
- position: ({ q, r, s }) => ({ q: q - 12, r: r + 8, s: s + 4 })
- },
- ]
-};
-
-const mapsheet4 = {
- id: 'mapsheet4',
- grid: new Map(mapsheetHexCoords),
- buildings: [
- {
- type: 'building8',
- elevationLevels: range(0, 2),
- grid: buildingHexes.bld8,
- position: ({ q, r, s }) => ({ q: q + 1, r: r + 1, s: s - 2 })
- },
- ]
-}
-
function range(start, stop, step = 1) {
return Array.from({ length: (stop - start) / step + 1 }, (_, i) => start + i * step);
}
@@ -589,11 +360,6 @@ function findScalar(arr, width, height) {
});
}
-const mapsheets = [mapsheet1, mapsheet2, mapsheet3, mapsheet4].reduce((acc, ms) => {
- acc[ms.id] = ms;
- return acc;
-}, {});
-
let sheets = [];
const mapsheetsContainer = document.querySelector('.grid .mapsheets');
@@ -660,41 +426,9 @@ sheets = msGrps.map(msG => {
});
});
-// 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]];
-// sheets = [[mapsheet2]];
-// sheets = [[mapsheet2], [mapsheet3]];
-// sheets = [[mapsheet2], [mapsheet1], [mapsheet3]];
-
-// drawMapsheet(grid, mapsheet2, vectorAdd({ q: 0, r: 0, s: 0 }, { q: 1, r: -2, s: 1 }, 6));
-
-// sheets = [
-// [mapsheet2, mapsheet1],
-// [mapsheet3, mapsheet4]
-// ];
-
-// drawBuildings([{
-// type: 'building2',
-// elevationLevels: range(-1, 2),
-// grid: new Map(buildingHexes.bld2),
-// position: coords => coords
-// }], grid, { q: 0, r: 0, s: 0 });
-
let finalGrid = new Map();
findScalar(findMult(sheets), +width + 1, +height).forEach(([vscalar, row]) => {
@@ -719,19 +453,6 @@ function addGroup(container, className) {
return g;
}
-// 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);
-// }
-
function toRect({ left, right, top, bottom }) {
return { left: +left, right: +right, top: +top, bottom: +bottom };
}
@@ -740,12 +461,3 @@ 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);