Put grid cells above buildings
This commit is contained in:
@@ -405,6 +405,15 @@ function drawBuildings(buildings, container, { q: pq, r: pr, s: ps }, furniture)
|
||||
let buildingGrid = translateCoords(building.grid, building.position);
|
||||
buildingGrid = translateCoords(buildingGrid, ({ q, r, s }) => ({ q: q + pq, r: r + pr, s: s + ps }));
|
||||
|
||||
const buildingTemplate = document.querySelector(`defs #${building.type}`);
|
||||
const origin = building.position({ q: 0, r: 0, s: 0 });
|
||||
const { x, y } = radialToScreenCoords({ q: origin.q + pq, r: origin.r + pr, s: origin.s + ps });
|
||||
const transform = origin.transform || ((x, y) => `translate(${x}, ${y})`);
|
||||
const buildingStructure = document.createElementNS(xmlns, 'g');
|
||||
buildingStructure.classList.add('structure');
|
||||
buildingStructure.setAttributeNS(null, 'transform', transform(x, y));
|
||||
buildingContainer.appendChild(buildingStructure);
|
||||
|
||||
building.elevationLevels.forEach(elevationLevel => {
|
||||
const hexContainer = document.createElementNS(xmlns, 'g');
|
||||
hexContainer.classList.add(`elevation-${elevationLevel === -1 ? 'basement' : elevationLevel}`);
|
||||
@@ -415,24 +424,39 @@ function drawBuildings(buildings, container, { q: pq, r: pr, s: ps }, furniture)
|
||||
acc = new Map([...acc, ...buildingGrid]);
|
||||
});
|
||||
|
||||
const buildingTemplate = document.querySelector(`defs #${building.type}`);
|
||||
const origin = building.position({ q: 0, r: 0, s: 0 });
|
||||
const { x, y } = radialToScreenCoords({ q: origin.q + pq, r: origin.r + pr, s: origin.s + ps });
|
||||
const transform = origin.transform || ((x, y) => `translate(${x}, ${y})`);
|
||||
const buildingStructure = document.createElementNS(xmlns, 'g');
|
||||
buildingStructure.classList.add('structure');
|
||||
buildingStructure.setAttributeNS(null, 'transform', transform(x, y));
|
||||
buildingContainer.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));
|
||||
|
||||
if (use.classList.contains('floor'))
|
||||
building.elevationLevels.forEach(el => use.classList.add(`elevation-${el === -1 ? 'basement' : el}`));
|
||||
|
||||
if (use.classList.contains('outer-wall') || use.classList.contains('inner-wall'))
|
||||
building.elevationLevels.slice(0, -1).forEach(el => use.classList.add(`elevation-${el === -1 ? 'basement' : el}`));
|
||||
|
||||
if (use.classList.contains('windows'))
|
||||
building.elevationLevels.slice(0, -1).filter(el => el >= 0).forEach(el => use.classList.add(`elevation-${el}`));
|
||||
|
||||
if (use.classList.contains('exits')) use.classList.add(`elevation-0`);
|
||||
|
||||
if ((use.classList.contains('doors') || use.classList.contains('door-edges')) && !use.classList.contains('exits'))
|
||||
building.elevationLevels.slice(0, -1).forEach(el => use.classList.add(`elevation-${el === -1 ? 'basement' : el}`));
|
||||
|
||||
if (use.classList.contains('furniture'))
|
||||
building.elevationLevels.slice(0, -1).forEach(el => use.classList.add(`elevation-${el === -1 ? 'basement' : el}`));
|
||||
|
||||
buildingStructure.appendChild(use);
|
||||
}
|
||||
|
||||
const furnitureEl = furniture && furniture.querySelector(`.${building.type} .furniture`);
|
||||
if (furnitureEl) buildingStructure.appendChild(furnitureEl);
|
||||
|
||||
if (furnitureEl) {
|
||||
for (let child of furnitureEl.children) {
|
||||
(child.classList.contains('stairs') ? building.elevationLevels : building.elevationLevels.slice(0, -1)).forEach(el => child.classList.add(`elevation-${el === -1 ? 'basement' : el}`));
|
||||
}
|
||||
buildingStructure.appendChild(furnitureEl);
|
||||
}
|
||||
|
||||
return acc;
|
||||
}, new Map());
|
||||
|
||||
Reference in New Issue
Block a user