backups/Fantasy-Map-Generator
1
0
Fork 0
mirror of https://github.com/Azgaar/Fantasy-Map-Generator.git synced 2025-12-19 10:31:24 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: zones - render zones as continuius line

Browse source
This commit is contained in:
Azgaar 2024-08-30 16:45:51 +02:00
parent 492bcd9c9b
commit a63a60c0ea
5 changed files with 169 additions and 50 deletions
Download patch file Download diff file Expand all files Collapse all files

32
modules/ui/layers.js
View file

@ -1892,37 +1892,7 @@ function drawZones() {
}
function drawZone({i, cells, type, color}) {
// find a path connecting all cells of zone
const path = getZonePath(cells);
if (!path) return;
function getZonePath(cells) {
const used = new Set();
const vertices = cells.map(c => pack.cells.v[c]).flat();
const points = vertices.map(v => pack.vertices.p[v]);
const boundary = getBoundaryPoints(points, used);
return boundary.length > 2 ? "M" + boundary.join("L") + "Z" : null;
}
function getBoundaryPoints(points, used) {
const boundary = [];
let currentPoint = points[0];
while (true) {
boundary.push(currentPoint);
used.add(currentPoint.toString());
let nextPoint = findNextPoint(currentPoint, points, used);
if (!nextPoint || nextPoint === boundary[0]) break;
currentPoint = nextPoint;
}
return boundary;
}
function findNextPoint(current, points, used) {
return points.find(p => !used.has(p.toString()) && Math.hypot(p[0] - current[0], p[1] - current[1]) < 20);
}
const path = getVertexPath(cells);
return `<path id="zone${i}" data-id="${i}" data-type="${type}" d="${path}" fill="${color}" />`;
}

27
modules/ui/zones-editor.js
View file

@ -33,34 +33,31 @@ function editZones() {
byId("zonesRemove").on("click", e => e.target.classList.toggle("pressed"));
body.on("click", function (ev) {
const el = ev.target;
const classList = el.classList;
const zoneId = +(classList.contains("states") ? el.dataset.id : el.parentNode.dataset.id);
const zone = pack.zones.find(z => z.i === zoneId);
const line = ev.target.closest("div.states");
const zone = pack.zones.find(z => z.i === +line.dataset.id);
if (!zone) return;
if (customization) {
if (zone.hidden) return;
body.querySelector("div.selected").classList.remove("selected");
el.classList.add("selected");
line.classList.add("selected");
return;
}
if (el.closest("fill-box")) changeFill(el.getAttribute("fill"), zone);
else if (classList.contains("zonePopulation")) changePopulation(zone);
else if (classList.contains("icon-trash-empty")) zoneRemove(zone);
else if (classList.contains("icon-eye")) toggleVisibility(zone);
else if (classList.contains("icon-pin")) toggleFog(zone, classList);
if (ev.target.closest("fill-box")) changeFill(ev.target.closest("fill-box").getAttribute("fill"), zone);
else if (ev.target.classList.contains("zonePopulation")) changePopulation(zone);
else if (ev.target.classList.contains("icon-trash-empty")) zoneRemove(zone);
else if (ev.target.classList.contains("icon-eye")) toggleVisibility(zone);
else if (ev.target.classList.contains("icon-pin")) toggleFog(zone, ev.target.classList);
});
body.on("input", function (ev) {
const el = ev.target;
const zoneId = +el.parentNode.dataset.id;
const zone = pack.zones.find(z => z.i === zoneId);
const line = ev.target.closest("div.states");
const zone = pack.zones.find(z => z.i === +line.dataset.id);
if (!zone) return;
if (el.classList.contains("zoneName")) changeDescription(zone, el.value);
else if (el.classList.contains("zoneType")) changeType(zone, el.value);
if (ev.target.classList.contains("zoneName")) changeDescription(zone, ev.target.value);
else if (ev.target.classList.contains("zoneType")) changeType(zone, ev.target.value);
});
// update type filter with a list of used types