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

1.0.18

Browse source
This commit is contained in:
Azgaar 2019-09-10 20:58:13 +03:00
parent 6bd0ce5533
commit 57c1e17c88
11 changed files with 203 additions and 122 deletions
Download patch file Download diff file Expand all files Collapse all files

8
modules/ui/general.js
View file

@ -226,12 +226,16 @@ function applyOption(select, option) {
select.value = option;
}
// prevent default browser behavior for FMG-used hotkeys
document.addEventListener("keydown", event => {
if ([112, 113, 117, 120, 9].includes(event.keyCode)) event.preventDefault(); // F1, F2, F6, F9, Tab
});
// Hotkeys, see github.com/Azgaar/Fantasy-Map-Generator/wiki/Hotkeys
document.addEventListener("keydown", function(event) {
document.addEventListener("keyup", event => {
const active = document.activeElement.tagName;
if (active === "INPUT" || active === "SELECT" || active === "TEXTAREA") return; // don't trigger if user inputs a text
if (active === "DIV" && document.activeElement.contentEditable === "true") return; // don't trigger if user inputs a text
event.preventDefault();
event.stopPropagation();
const key = event.keyCode, ctrl = event.ctrlKey, shift = event.shiftKey, meta = event.metaKey;

8
modules/ui/namesbase-editor.js
View file

@ -34,10 +34,7 @@ function editNamesbase() {
function createBasesList() {
const select = document.getElementById("namesbaseSelect");
select.innerHTML = "";
nameBases.forEach(function(b, i) {
const option = new Option(b.name, i);
select.options.add(option);
});
nameBases.forEach((b, i) => select.options.add(new Option(b.name, i)));
}
function updateInputs() {
@ -130,7 +127,8 @@ function editNamesbase() {
buttons: {
Restore: function() {
$(this).dialog("close");
applyDefaultNamesData();
nameBases = Names.getNameBases();
nameBase = Names.getNameBase();
createBasesList();
updateInputs();
Names.updateChains();

78
modules/ui/religions-editor.js
View file

@ -141,8 +141,7 @@ function editReligions() {
const religion = +event.target.dataset.id;
const info = document.getElementById("religionInfo");
if (info) {
d3.select("#religionHierarchy").select("g[data-id='"+religion+"'] > path")
.attr("stroke", "#c13119").attr("stroke-width", 2);
d3.select("#religionHierarchy").select("g[data-id='"+religion+"'] > path").classed("selected", 1);
const r = pack.religions[religion];
const type = r.name.includes(r.type) ? ""
: r.type === "Folk" || r.type === "Organized"
@ -151,7 +150,8 @@ function editReligions() {
const rural = r.rural * populationRate.value;
const urban = r.urban * populationRate.value * urbanization.value;
const population = rural + urban > 0 ? ". " + si(rn(rural + urban)) + " believers" : ". Extinct";
info.innerHTML = `${r.name}${type}${form}${population}`;
const hint = ". Drag to change the origin";
info.innerHTML = `${r.name}${type}${form}${population}${hint}`;
}
if (!layerIsOn("toggleReligions")) return;
@ -164,8 +164,7 @@ function editReligions() {
const religion = +event.target.dataset.id;
const info = document.getElementById("religionInfo");
if (info) {
d3.select("#religionHierarchy").select("g[data-id='"+religion+"'] > path")
.attr("stroke", "#333333").attr("stroke-width", 1);
d3.select("#religionHierarchy").select("g[data-id='"+religion+"'] > path").classed("selected", 0);
info.innerHTML = "‍";
}
relig.select("#religion"+religion).transition().attr("stroke-width", null).attr("stroke", null);
@ -293,7 +292,7 @@ function editReligions() {
function showHierarchy() {
// build hierarchy tree
const religions = pack.religions.filter(r => !r.removed);
const root = d3.stratify().id(d => d.i).parentId(d => d.origin)(religions);
let root = d3.stratify().id(d => d.i).parentId(d => d.origin)(religions);
const treeWidth = root.leaves().length;
const treeHeight = root.height;
const width = treeWidth * 40, height = treeHeight * 60;
@ -303,8 +302,6 @@ function editReligions() {
const h = height + 30 - margin.top - margin.bottom;
const treeLayout = d3.tree().size([w, h]);
treeLayout(root);
// prepare svg
alertMessage.innerHTML = "<div id='religionInfo'>&#8205;</div>";
const svg = d3.select("#alertMessage").insert("svg", "#religionInfo").attr("id", "religionHierarchy")
@ -313,36 +310,63 @@ function editReligions() {
const links = graph.append("g").attr("fill", "none").attr("stroke", "#aaaaaa");
const nodes = graph.append("g");
// render tree
links.selectAll('path').data(root.links()).enter()
renderTree();
function renderTree() {
treeLayout(root);
links.selectAll('path').data(root.links()).enter()
.append('path').attr("d", d => {return "M" + d.source.x + "," + d.source.y
+ "C" + d.source.x + "," + (d.source.y * 3 + d.target.y) / 4
+ " " + d.target.x + "," + (d.source.y * 2 + d.target.y) / 3
+ " " + d.target.x + "," + d.target.y;});
const node = nodes.selectAll('g').data(root.descendants()).enter()
.append('g').attr("data-id", d => d.data.i)
.attr("transform", d => `translate(${d.x}, ${d.y})`)
.on("mouseenter", () => religionHighlightOn(event))
.on("mouseleave", () => religionHighlightOff(event));
const node = nodes.selectAll('g').data(root.descendants()).enter()
.append('g').attr("data-id", d => d.data.i).attr("stroke", "#333333")
.attr("transform", d => `translate(${d.x}, ${d.y})`)
.on("mouseenter", () => religionHighlightOn(event))
.on("mouseleave", () => religionHighlightOff(event))
.call(d3.drag().on("start", d => dragToReorigin(d)));
node.append("path").attr("d", d => {
if (d.data.type === "Folk") return "M11.3,0A11.3,11.3,0,1,1,-11.3,0A11.3,11.3,0,1,1,11.3,0"; else // circle
if (d.data.type === "Heresy") return "M0,-14L14,0L0,14L-14,0Z"; else // diamond
if (d.data.type === "Cult") return "M-6.5,-11.26l13,0l6.5,11.26l-6.5,11.26l-13,0l-6.5,-11.26Z"; else // hex
if (!d.data.i) return "M5,0A5,5,0,1,1,-5,0A5,5,0,1,1,5,0"; else // small circle
return "M-11,-11h22v22h-22Z"; // square
}).attr("stroke", "#333333")
.attr("fill", d => d.data.i ? d.data.color : "#ffffff")
.attr("stroke-dasharray", d => d.data.cells ? "null" : "1");
node.append("path").attr("d", d => {
if (d.data.type === "Folk") return "M11.3,0A11.3,11.3,0,1,1,-11.3,0A11.3,11.3,0,1,1,11.3,0"; else // circle
if (d.data.type === "Heresy") return "M0,-14L14,0L0,14L-14,0Z"; else // diamond
if (d.data.type === "Cult") return "M-6.5,-11.26l13,0l6.5,11.26l-6.5,11.26l-13,0l-6.5,-11.26Z"; else // hex
if (!d.data.i) return "M5,0A5,5,0,1,1,-5,0A5,5,0,1,1,5,0"; else // small circle
return "M-11,-11h22v22h-22Z"; // square
}).attr("fill", d => d.data.i ? d.data.color : "#ffffff")
.attr("stroke-dasharray", d => d.data.cells ? "null" : "1");
node.append("text").attr("dy", ".35em").style("pointer-events", "none")
.text(d => d.data.i ? d.data.code : '');
node.append("text").attr("dy", ".35em").text(d => d.data.i ? d.data.code : '');
}
$("#alert").dialog({
title: "Religions tree", width: fitContent(), resizable: false,
position: {my: "left center", at: "left+10 center", of: "svg"}, buttons: {}
position: {my: "left center", at: "left+10 center", of: "svg"}, buttons: {},
close: () => {alertMessage.innerHTML = "";}
});
function dragToReorigin(d) {
console.log("dragToReorigin");
const originLine = graph.append("path")
.attr("class", "dragLine").attr("d", `M${d.x},${d.y}L${d.x},${d.y}`);
d3.event.on("drag", () => {
originLine.attr("d", `M${d.x},${d.y}L${d3.event.x},${d3.event.y}`)
});
d3.event.on("end", () => {
originLine.remove();
const selected = graph.select("path.selected");
if (!selected.size()) return;
const religion = d.data.i;
const oldOrigin = d.data.origin;
let newOrigin = selected.datum().data.i;
if (newOrigin == oldOrigin) return; // already child of the selected node
if (d.descendants().some(node => node.id == newOrigin)) return; // cannot be a child of its own child
if (newOrigin == religion) newOrigin = 0; // move to top
pack.religions[religion].origin = d.data.origin = newOrigin; // change data
showHierarchy() // update hierarchy
});
}
}
function toggleExtinct() {