Web Dev Solutions

Catalin Mititiuc

aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorCatalin Mititiuc <webdevcat@proton.me>2024-06-24 17:03:57 -0700
committerCatalin Mititiuc <webdevcat@proton.me>2024-06-24 17:03:57 -0700
commit05030f7ad690ef2c7eba24df4ae7a6d80491f73f (patch)
treee5699fd8d3345310e129006b5f580d4102eda2ab /src
parentc09ed771987642314e187bec32c2d63f7814a71a (diff)
Fix mapsheet1 building 4 positioning
Diffstat (limited to 'src')
-rw-r--r--src/radial.js63
1 files changed, 39 insertions, 24 deletions
diff --git a/src/radial.js b/src/radial.js
index 9978b14..3e89f23 100644
--- a/src/radial.js
+++ b/src/radial.js
@@ -340,7 +340,32 @@ let mapsheet10 = {
type: 'building2',
grid: buildingHexes.bld2,
position: ({ q, r, s }) => ({ q: q + 7, r: r + 7, s: s - 14 })
- }
+ },
+ {
+ type: 'building3',
+ grid: new Map(buildingHexes.bld3),
+ position: ({ q, r, s }) => ({ q: q - 6, r: r - 6, s: s + 12 })
+ },
+ {
+ type: 'building4',
+ 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',
+ grid: new Map(buildingHexes.bld6),
+ position: rotate180({ q: -13, r: 7, s: 6 })
+ },
]
};
@@ -398,17 +423,17 @@ let mapsheet30 = {
{
type: 'building2',
grid: new Map(buildingHexes.bld2),
- position: reflectR({ q: 9, r: -6, s: -3 })
+ position: rotate180({ q: 9, r: -6, s: -3 })
},
{
type: 'building3',
grid: new Map(buildingHexes.bld3),
- position: reflectR({ q: 17, r: -7, s: -10 })
+ position: rotate180({ q: 17, r: -7, s: -10 })
},
{
type: 'building4',
grid: new Map(buildingHexes.bld4),
- position: reflectR({ q: -10, r: -5, s: 15 })
+ position: rotate180({ q: -10, r: -5, s: 15 })
},
{
type: 'building5',
@@ -418,7 +443,7 @@ let mapsheet30 = {
{
type: 'building6',
grid: new Map(buildingHexes.bld6),
- position: reflectR({ q: 0, r: 6, s: -6 })
+ position: rotate180({ q: 0, r: 6, s: -6 })
},
{
type: 'building7',
@@ -428,13 +453,13 @@ let mapsheet30 = {
]
};
-function reflectR(coords) {
+function rotate180(coords) {
return function ({ q, r, s }) {
return {
q: -q + coords.q,
r: -r + coords.r,
s: -s + coords.s,
- transform: "rotate(180)"
+ transform: (x, y) => `rotate(180 ${x}, ${y}) translate(${x}, ${y})`
};
};
}
@@ -487,20 +512,11 @@ function drawMapsheet(gameboard, { id, grid, buildings }, { q: pq, r: pr, s: ps
const buildingTemplate = document.querySelector(`defs #${building.type}`);
const origin = building.position({ q: 0, r: 0, s: 0 });
- const { x: rx, y: ry } = radialToScreenCoords(origin);
const { x, y } = radialToScreenCoords({ q: origin.q + pq, r: origin.r + pr, s: origin.s + ps });
-
- console.log(x, y);
-
+ const transform = origin.transform || ((x, y) => `translate(${x}, ${y})`);
const buildingStructure = document.createElementNS(xmlns, 'g');
buildingStructure.classList.add('structure');
-
- if (origin.transform) {
- buildingStructure.setAttributeNS(null, 'transform', `rotate(180 ${x}, ${y}) translate(${x}, ${y})`);
- } else {
- buildingStructure.setAttributeNS(null, 'transform', `translate(${x}, ${y})`);
- }
-
+ buildingStructure.setAttributeNS(null, 'transform', transform(x, y));
buildingContainer.appendChild(buildingStructure);
for (let child of buildingTemplate.children) {
@@ -582,8 +598,8 @@ let sheets = [];
// sheets = [[mapsheet30]];
// drawHexes(gameboard, buildingHexes.bld4, true);
-// drawHexes(gameboard, translateCoords(buildingHexes.bld4, reflectR({ q: -9, r: -6, s: 15 })), true);
-// drawHexes(gameboard, translateCoords(buildingHexes.bld4, reflectR({ q: 0, r: 0, s: 0 })), 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 });
@@ -602,9 +618,9 @@ for (let child of buildingTemplate.children) {
}
-sheets = [[mapsheet20], [mapsheet30]];
-// const sheets = [[mapsheet20], [mapsheet10], [mapsheet30]];
-// const sheets = [[mapsheet30]];
+// sheets = [[mapsheet20], [mapsheet30]];
+// sheets = [[mapsheet20], [mapsheet10], [mapsheet30]];
+sheets = [[mapsheet10]];
// const sheets = [
// [mapsheet2, mapsheet1],
@@ -621,7 +637,6 @@ findScalar(findMult(sheets)).forEach(([vscalar, row]) => {
return vectorAdd(coords, { q: 1, r: 0, s: -1 }, hscalar);
}
- console.log(horzMapVect(vertMapVect({ q: 0, r: 0, s: 0 })));
ms = drawMapsheet(gameboard, ms, horzMapVect(vertMapVect({ q: 0, r: 0, s: 0 })));
})
});