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

Merge pull request #736 from Azgaar/more-hatches

Browse source 
Color picker: more hatches [Avengium, evolvedexperiment]
This commit is contained in:
Azgaar 2022-02-06 22:42:36 +03:00 • committed by GitHub
commit ca2716a5c4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 224 additions and 113 deletions
Download patch file Download diff file Expand all files Collapse all files

196
index.html
View file

@ -148,55 +148,6 @@
</filter> </filter>
</g> </g>
<g id="hatching">
<pattern id="hatch0" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch1" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch2" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch3" patternTransform="rotate(-45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch4" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch5" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch6" patternUnits="userSpaceOnUse" width="5" height="5">
<circle cx="2.5" cy="2.5" r="1" style="fill: black"/>
</pattern>
<pattern id="hatch7" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" transform="rotate(-45 0 0)" style="stroke:black; stroke-width:1.5" />
</pattern>
<pattern id="hatch8" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:2.5"/>
</pattern>
<pattern id="hatch9" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:2.5"/>
</pattern>
<pattern id="hatch10" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:2.5"/>
</pattern>
<pattern id="hatch11" patternTransform="rotate(-45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:2.5"/>
</pattern>
<pattern id="hatch12" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="1" x2="0" y2="3" style="stroke:black; stroke-width:1.5" />
<line x1="1" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:1.5" />
</pattern>
<pattern id="hatch13" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:1.5" />
<line x1="0" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:1.5" />
</pattern>
</g>
<g id="deftemp"> <g id="deftemp">
<mask id="land"></mask> <mask id="land"></mask>
<mask id="water"> <mask id="water">
@ -4356,6 +4307,153 @@
<path d="M 43.4,0 36.2,12.5 43.4,25 M 21.7,12.5 H 36.2 Z M 0,0 H 14.5 L 21.7,12.5 14.5,25 H 0"/> <path d="M 43.4,0 36.2,12.5 43.4,25 M 21.7,12.5 H 36.2 Z M 0,0 H 14.5 L 21.7,12.5 14.5,25 H 0"/>
</pattern> </pattern>
</g> </g>
<g id="defs-hatching">
<pattern id="hatch0" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch1" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch2" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch3" patternTransform="rotate(-45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch4" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch5" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch6" patternUnits="userSpaceOnUse" width="5" height="5">
<circle cx="2.5" cy="2.5" r="1" style="fill: black"/>
</pattern>
<pattern id="hatch7" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" transform="rotate(-45 0 0)" style="stroke:black; stroke-width:1.5" />
</pattern>
<pattern id="hatch8" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:2.5"/>
</pattern>
<pattern id="hatch9" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:2.5"/>
</pattern>
<pattern id="hatch10" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:2.5"/>
</pattern>
<pattern id="hatch11" patternTransform="rotate(-45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:2.5"/>
</pattern>
<pattern id="hatch12" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="1" x2="0" y2="3" style="stroke:black; stroke-width:1.5"/>
<line x1="1" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch13" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch14" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="1" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch15" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="1" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch16" patternTransform="rotate(-45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="1" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch17" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="1" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="1" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch18" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="1" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="1" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch19" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="2" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch20" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="2" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch21" patternTransform="rotate(-45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="2" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch22" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="2" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="2" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch23" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch24" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="2" y1="0" x2="0" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="2" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch25" patternTransform="rotate(-45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="2" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch26" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="2" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch27" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="2" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch28" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="2" y1="0" x2="0" y2="2" style="stroke:black; stroke-width:2"/>
</pattern>
<pattern id="hatch29" patternTransform="rotate(30 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="1" x2="0" y2="3" style="stroke:black; stroke-width:1.5"/>
<line x1="1" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch30" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="1" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:1.5"/>
<line x1="1" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch31" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="1" y1="0" x2="0" y2="3" style="stroke:black; stroke-width:1.5"/>
<line x1="1" y1="0" x2="3" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch32" patternUnits="userSpaceOnUse" width="5" height="5">
<circle cx="2.5" cy="2.5" r="0.5" style="fill: black"/>
</pattern>
<pattern id="hatch33" patternUnits="userSpaceOnUse" width="5" height="5">
<circle cx="2.5" cy="2.5" r="1.5" style="fill: black"/>
</pattern>
<pattern id="hatch34" patternUnits="userSpaceOnUse" width="5" height="5">
<circle cx="3" cy="3" r="1" style="fill: black"/>
<circle cx="1" cy="1" r="1" style="fill: black"/>
</pattern>
<pattern id="hatch35" patternUnits="userSpaceOnUse" width="5" height="5">
<circle cx="3" cy="3" r="1.5" style="fill: black"/>
<circle cx="1" cy="1" r="1.5" style="fill: black"/>
</pattern>
<pattern id="hatch36" patternTransform="rotate(-45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" transform="rotate(-45 0 0)" style="stroke:black; stroke-width:1.5" />
</pattern>
<pattern id="hatch37" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="0" y2="3" transform="rotate(-45 0 0)" style="stroke:black; stroke-width:1.5" />
</pattern>
<pattern id="hatch38" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="4" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch39" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="4" y2="4" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch40" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="3" y2="3" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
<pattern id="hatch41" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse" width="4" height="4">
<line x1="0" y1="0" x2="3" y2="3" style="stroke:black; stroke-width:1.5"/>
<line x1="0" y1="0" x2="4" y2="0" style="stroke:black; stroke-width:1.5"/>
</pattern>
</g>
</defs> </defs>
</svg> </svg>

3
main.js
View file

@ -2,7 +2,7 @@
// https://github.com/Azgaar/Fantasy-Map-Generator // https://github.com/Azgaar/Fantasy-Map-Generator
"use strict"; "use strict";
const version = "1.722"; // generator version const version = "1.73"; // generator version
document.title += " v" + version; document.title += " v" + version;
// switches to disable/enable logging features // switches to disable/enable logging features
@ -435,6 +435,7 @@ function showWelcomeMessage() {
alertMessage.innerHTML = `The Fantasy Map Generator is updated up to version <b>${version}</b>. alertMessage.innerHTML = `The Fantasy Map Generator is updated up to version <b>${version}</b>.
This version is compatible with ${changelog}, loaded <i>.map</i> files will be auto-updated. This version is compatible with ${changelog}, loaded <i>.map</i> files will be auto-updated.
<ul><b>Latest changes:</b> <ul><b>Latest changes:</b>
<li>Color picker: new hatchings</li>
<li>New style presets: Cyberpunk and Atlas</li> <li>New style presets: Cyberpunk and Atlas</li>
<li>Burg temperature graph</li> <li>Burg temperature graph</li>
<li>4 new textures</li> <li>4 new textures</li>

16
modules/export.js
View file

@ -262,19 +262,19 @@ async function getMapURL(type, options = {}) {
if (pattern) cloneDefs.appendChild(pattern.cloneNode(true)); if (pattern) cloneDefs.appendChild(pattern.cloneNode(true));
} }
if (!cloneEl.getElementById("hatching").children.length) cloneEl.getElementById("hatching")?.remove(); // remove unused hatching group
if (!cloneEl.getElementById("fogging-cont")) cloneEl.getElementById("fog")?.remove(); // remove unused fog if (!cloneEl.getElementById("fogging-cont")) cloneEl.getElementById("fog")?.remove(); // remove unused fog
if (!cloneEl.getElementById("regions")) cloneEl.getElementById("statePaths")?.remove(); // removed unused statePaths if (!cloneEl.getElementById("regions")) cloneEl.getElementById("statePaths")?.remove(); // removed unused statePaths
if (!cloneEl.getElementById("labels")) cloneEl.getElementById("textPaths")?.remove(); // removed unused textPaths if (!cloneEl.getElementById("labels")) cloneEl.getElementById("textPaths")?.remove(); // removed unused textPaths
// add armies style // add armies style
if (cloneEl.getElementById("armies")) if (cloneEl.getElementById("armies")) {
cloneEl.insertAdjacentHTML( cloneEl.insertAdjacentHTML(
"afterbegin", "afterbegin",
"<style>#armies text {stroke: none; fill: #fff; text-shadow: 0 0 4px #000; dominant-baseline: central; text-anchor: middle; font-family: Helvetica; fill-opacity: 1;}#armies text.regimentIcon {font-size: .8em;}</style>" "<style>#armies text {stroke: none; fill: #fff; text-shadow: 0 0 4px #000; dominant-baseline: central; text-anchor: middle; font-family: Helvetica; fill-opacity: 1;}#armies text.regimentIcon {font-size: .8em;}</style>"
); );
}
// add xlink: for href to support svg1.1 // add xlink: for href to support svg 1.1
if (type === "svg") { if (type === "svg") {
cloneEl.querySelectorAll("[href]").forEach(el => { cloneEl.querySelectorAll("[href]").forEach(el => {
const href = el.getAttribute("href"); const href = el.getAttribute("href");
@ -283,6 +283,16 @@ async function getMapURL(type, options = {}) {
}); });
} }
// add hatchings
const hatchingUsers = cloneEl.querySelectorAll(`[fill^='url(#hatch']`);
const hatchingFills = unique(Array.from(hatchingUsers).map(el => el.getAttribute("fill")));
const hatchingIds = hatchingFills.map(fill => fill.slice(5, -1));
for (const hatchingId of hatchingIds) {
const hatching = svgDefs.getElementById(hatchingId);
if (hatching) cloneDefs.appendChild(hatching.cloneNode(true));
}
// load fonts
const usedFonts = getUsedFonts(cloneEl); const usedFonts = getUsedFonts(cloneEl);
const fontsToLoad = usedFonts.filter(font => font.src); const fontsToLoad = usedFonts.filter(font => font.src);
if (fontsToLoad.length) { if (fontsToLoad.length) {

92
modules/load.js
View file

@ -190,7 +190,6 @@ function parseLoadedData(data) {
if (customizationMenu.offsetParent) styleTab.click(); if (customizationMenu.offsetParent) styleTab.click();
const reliefIcons = document.getElementById("defs-relief").innerHTML; // save relief icons const reliefIcons = document.getElementById("defs-relief").innerHTML; // save relief icons
const hatching = document.getElementById("hatching").cloneNode(true); // save hatching
void (function parseParameters() { void (function parseParameters() {
const params = data[0].split("|"); const params = data[0].split("|");
@ -426,16 +425,16 @@ function parseLoadedData(data) {
void (function resolveVersionConflicts() { void (function resolveVersionConflicts() {
const version = parseFloat(data[0].split("|")[0]); const version = parseFloat(data[0].split("|")[0]);
if (version < 0.9) { if (version < 0.9) {
// 0.9 has additional relief icons to be included into older maps // v0.9 has additional relief icons to be included into older maps
document.getElementById("defs-relief").innerHTML = reliefIcons; document.getElementById("defs-relief").innerHTML = reliefIcons;
} }
if (version < 1) { if (version < 1) {
// 1.0 adds a new religions layer // v1.0 adds a new religions layer
relig = viewbox.insert("g", "#terrain").attr("id", "relig"); relig = viewbox.insert("g", "#terrain").attr("id", "relig");
Religions.generate(); Religions.generate();
// 1.0 adds a legend box // v1.0 adds a legend box
legend = svg.append("g").attr("id", "legend"); legend = svg.append("g").attr("id", "legend");
legend legend
.attr("font-family", "Almendra SC") .attr("font-family", "Almendra SC")
@ -448,7 +447,7 @@ function parseLoadedData(data) {
.attr("stroke-dasharray", "0 4 10 4") .attr("stroke-dasharray", "0 4 10 4")
.attr("stroke-linecap", "round"); .attr("stroke-linecap", "round");
// 1.0 separated drawBorders fron drawStates() // v1.0 separated drawBorders fron drawStates()
stateBorders = borders.append("g").attr("id", "stateBorders"); stateBorders = borders.append("g").attr("id", "stateBorders");
provinceBorders = borders.append("g").attr("id", "provinceBorders"); provinceBorders = borders.append("g").attr("id", "provinceBorders");
borders borders
@ -461,7 +460,7 @@ function parseLoadedData(data) {
stateBorders.attr("opacity", 0.8).attr("stroke", "#56566d").attr("stroke-width", 1).attr("stroke-dasharray", "2").attr("stroke-linecap", "butt"); stateBorders.attr("opacity", 0.8).attr("stroke", "#56566d").attr("stroke-width", 1).attr("stroke-dasharray", "2").attr("stroke-linecap", "butt");
provinceBorders.attr("opacity", 0.8).attr("stroke", "#56566d").attr("stroke-width", 0.5).attr("stroke-dasharray", "1").attr("stroke-linecap", "butt"); provinceBorders.attr("opacity", 0.8).attr("stroke", "#56566d").attr("stroke-width", 0.5).attr("stroke-dasharray", "1").attr("stroke-linecap", "butt");
// 1.0 adds state relations, provinces, forms and full names // v1.0 adds state relations, provinces, forms and full names
provs = viewbox.insert("g", "#borders").attr("id", "provs").attr("opacity", 0.6); provs = viewbox.insert("g", "#borders").attr("id", "provs").attr("opacity", 0.6);
BurgsAndStates.collectStatistics(); BurgsAndStates.collectStatistics();
BurgsAndStates.generateCampaigns(); BurgsAndStates.generateCampaigns();
@ -473,10 +472,7 @@ function parseLoadedData(data) {
if (!layerIsOn("toggleBorders")) $("#borders").fadeOut(); if (!layerIsOn("toggleBorders")) $("#borders").fadeOut();
if (!layerIsOn("toggleStates")) regions.attr("display", "none").selectAll("path").remove(); if (!layerIsOn("toggleStates")) regions.attr("display", "none").selectAll("path").remove();
// 1.0 adds hatching // v1.0 adds zones layer
document.getElementsByTagName("defs")[0].appendChild(hatching);
// 1.0 adds zones layer
zones = viewbox.insert("g", "#borders").attr("id", "zones").attr("display", "none"); zones = viewbox.insert("g", "#borders").attr("id", "zones").attr("display", "none");
zones.attr("opacity", 0.6).attr("stroke", null).attr("stroke-width", 0).attr("stroke-dasharray", null).attr("stroke-linecap", "butt"); zones.attr("opacity", 0.6).attr("stroke", null).attr("stroke-width", 0).attr("stroke-dasharray", null).attr("stroke-linecap", "butt");
addZones(); addZones();
@ -485,35 +481,35 @@ function parseLoadedData(data) {
turnButtonOn("toggleMarkers"); turnButtonOn("toggleMarkers");
} }
// 1.0 add fogging layer (state focus) // v1.0 add fogging layer (state focus)
fogging = viewbox.insert("g", "#ruler").attr("id", "fogging-cont").attr("mask", "url(#fog)").append("g").attr("id", "fogging").style("display", "none"); fogging = viewbox.insert("g", "#ruler").attr("id", "fogging-cont").attr("mask", "url(#fog)").append("g").attr("id", "fogging").style("display", "none");
fogging.append("rect").attr("x", 0).attr("y", 0).attr("width", "100%").attr("height", "100%"); fogging.append("rect").attr("x", 0).attr("y", 0).attr("width", "100%").attr("height", "100%");
defs.append("mask").attr("id", "fog").append("rect").attr("x", 0).attr("y", 0).attr("width", "100%").attr("height", "100%").attr("fill", "white"); defs.append("mask").attr("id", "fog").append("rect").attr("x", 0).attr("y", 0).attr("width", "100%").attr("height", "100%").attr("fill", "white");
// 1.0 changes states opacity bask to regions level // v1.0 changes states opacity bask to regions level
if (statesBody.attr("opacity")) { if (statesBody.attr("opacity")) {
regions.attr("opacity", statesBody.attr("opacity")); regions.attr("opacity", statesBody.attr("opacity"));
statesBody.attr("opacity", null); statesBody.attr("opacity", null);
} }
// 1.0 changed labels to multi-lined // v1.0 changed labels to multi-lined
labels.selectAll("textPath").each(function () { labels.selectAll("textPath").each(function () {
const text = this.textContent; const text = this.textContent;
const shift = this.getComputedTextLength() / -1.5; const shift = this.getComputedTextLength() / -1.5;
this.innerHTML = `<tspan x="${shift}">${text}</tspan>`; this.innerHTML = `<tspan x="${shift}">${text}</tspan>`;
}); });
// 1.0 added new biome - Wetland // v1.0 added new biome - Wetland
biomesData.name.push("Wetland"); biomesData.name.push("Wetland");
biomesData.color.push("#0b9131"); biomesData.color.push("#0b9131");
biomesData.habitability.push(12); biomesData.habitability.push(12);
} }
if (version < 1.1) { if (version < 1.1) {
// v 1.0 initial code had a bug with religion layer id // v1.0 initial code had a bug with religion layer id
if (!relig.size()) relig = viewbox.insert("g", "#terrain").attr("id", "relig"); if (!relig.size()) relig = viewbox.insert("g", "#terrain").attr("id", "relig");
// v 1.0 initially has Sympathy status then relaced with Friendly // v1.0 initially has Sympathy status then relaced with Friendly
for (const s of pack.states) { for (const s of pack.states) {
if (!s.diplomacy) continue; if (!s.diplomacy) continue;
s.diplomacy = s.diplomacy.map(r => (r === "Sympathy" ? "Friendly" : r)); s.diplomacy = s.diplomacy.map(r => (r === "Sympathy" ? "Friendly" : r));
@ -522,7 +518,7 @@ function parseLoadedData(data) {
// labels should be toggled via style attribute, so remove display attribute // labels should be toggled via style attribute, so remove display attribute
labels.attr("display", null); labels.attr("display", null);
// v 1.0 added religions heirarchy tree // v1.0 added religions heirarchy tree
if (pack.religions[1] && !pack.religions[1].code) { if (pack.religions[1] && !pack.religions[1].code) {
pack.religions pack.religions
.filter(r => r.i) .filter(r => r.i)
@ -542,7 +538,7 @@ function parseLoadedData(data) {
lakes.select("#salt").attr("opacity", 0.5).attr("fill", "#409b8a").attr("stroke", "#388985").attr("stroke-width", 0.7).attr("filter", null); lakes.select("#salt").attr("opacity", 0.5).attr("fill", "#409b8a").attr("stroke", "#388985").attr("stroke-width", 0.7).attr("filter", null);
} }
// v 1.1 added new lake and coast groups // v1.1 added new lake and coast groups
if (!document.getElementById("sinkhole")) { if (!document.getElementById("sinkhole")) {
lakes.append("g").attr("id", "sinkhole"); lakes.append("g").attr("id", "sinkhole");
lakes.append("g").attr("id", "frozen"); lakes.append("g").attr("id", "frozen");
@ -557,7 +553,7 @@ function parseLoadedData(data) {
coastline.select("#lake_island").attr("opacity", 1).attr("stroke", "#7c8eaf").attr("stroke-width", 0.35).attr("filter", null); coastline.select("#lake_island").attr("opacity", 1).attr("stroke", "#7c8eaf").attr("stroke-width", 0.35).attr("filter", null);
} }
// v 1.1 features stores more data // v1.1 features stores more data
defs.select("#land").selectAll("path").remove(); defs.select("#land").selectAll("path").remove();
defs.select("#water").selectAll("path").remove(); defs.select("#water").selectAll("path").remove();
coastline.selectAll("path").remove(); coastline.selectAll("path").remove();
@ -566,13 +562,13 @@ function parseLoadedData(data) {
} }
if (version < 1.11) { if (version < 1.11) {
// v 1.11 added new attributes // v1.11 added new attributes
terrs.attr("scheme", "bright").attr("terracing", 0).attr("skip", 5).attr("relax", 0).attr("curve", 0); terrs.attr("scheme", "bright").attr("terracing", 0).attr("skip", 5).attr("relax", 0).attr("curve", 0);
svg.select("#oceanic > *").attr("id", "oceanicPattern"); svg.select("#oceanic > *").attr("id", "oceanicPattern");
oceanLayers.attr("layers", "-6,-3,-1"); oceanLayers.attr("layers", "-6,-3,-1");
gridOverlay.attr("type", "pointyHex").attr("size", 10); gridOverlay.attr("type", "pointyHex").attr("size", 10);
// v 1.11 added cultures heirarchy tree // v1.11 added cultures heirarchy tree
if (pack.cultures[1] && !pack.cultures[1].code) { if (pack.cultures[1] && !pack.cultures[1].code) {
pack.cultures pack.cultures
.filter(c => c.i) .filter(c => c.i)
@ -582,17 +578,17 @@ function parseLoadedData(data) {
}); });
} }
// v 1.11 had an issue with fogging being displayed on load // v1.11 had an issue with fogging being displayed on load
unfog(); unfog();
// v 1.2 added new terrain attributes // v1.2 added new terrain attributes
if (!terrain.attr("set")) terrain.attr("set", "simple"); if (!terrain.attr("set")) terrain.attr("set", "simple");
if (!terrain.attr("size")) terrain.attr("size", 1); if (!terrain.attr("size")) terrain.attr("size", 1);
if (!terrain.attr("density")) terrain.attr("density", 0.4); if (!terrain.attr("density")) terrain.attr("density", 0.4);
} }
if (version < 1.21) { if (version < 1.21) {
// v 1.11 replaced "display" attribute by "display" style // v1.11 replaced "display" attribute by "display" style
viewbox.selectAll("g").each(function () { viewbox.selectAll("g").each(function () {
if (this.hasAttribute("display")) { if (this.hasAttribute("display")) {
this.removeAttribute("display"); this.removeAttribute("display");
@ -600,7 +596,7 @@ function parseLoadedData(data) {
} }
}); });
// v 1.21 added rivers data to pack // v1.21 added rivers data to pack
pack.rivers = []; // rivers data pack.rivers = []; // rivers data
rivers.selectAll("path").each(function () { rivers.selectAll("path").each(function () {
const i = +this.id.slice(5); const i = +this.id.slice(5);
@ -616,12 +612,12 @@ function parseLoadedData(data) {
} }
if (version < 1.22) { if (version < 1.22) {
// v 1.22 changed state neighbors from Set object to array // v1.22 changed state neighbors from Set object to array
BurgsAndStates.collectStatistics(); BurgsAndStates.collectStatistics();
} }
if (version < 1.3) { if (version < 1.3) {
// v 1.3 added global options object // v1.3 added global options object
const winds = options.slice(); // previostly wind was saved in settings[19] const winds = options.slice(); // previostly wind was saved in settings[19]
const year = rand(100, 2000); const year = rand(100, 2000);
const era = Names.getBaseShort(P(0.7) ? 1 : rand(nameBases.length)) + " Era"; const era = Names.getBaseShort(P(0.7) ? 1 : rand(nameBases.length)) + " Era";
@ -629,10 +625,10 @@ function parseLoadedData(data) {
const military = Military.getDefaultOptions(); const military = Military.getDefaultOptions();
options = {winds, year, era, eraShort, military}; options = {winds, year, era, eraShort, military};
// v 1.3 added campaings data for all states // v1.3 added campaings data for all states
BurgsAndStates.generateCampaigns(); BurgsAndStates.generateCampaigns();
// v 1.3 added militry layer // v1.3 added militry layer
armies = viewbox.insert("g", "#icons").attr("id", "armies"); armies = viewbox.insert("g", "#icons").attr("id", "armies");
armies.attr("opacity", 1).attr("fill-opacity", 1).attr("font-size", 6).attr("box-size", 3).attr("stroke", "#000").attr("stroke-width", 0.3); armies.attr("opacity", 1).attr("fill-opacity", 1).attr("font-size", 6).attr("box-size", 3).attr("stroke", "#000").attr("stroke-width", 0.3);
turnButtonOn("toggleMilitary"); turnButtonOn("toggleMilitary");
@ -640,18 +636,18 @@ function parseLoadedData(data) {
} }
if (version < 1.4) { if (version < 1.4) {
// v 1.35 added dry lakes // v1.35 added dry lakes
if (!lakes.select("#dry").size()) { if (!lakes.select("#dry").size()) {
lakes.append("g").attr("id", "dry"); lakes.append("g").attr("id", "dry");
lakes.select("#dry").attr("opacity", 1).attr("fill", "#c9bfa7").attr("stroke", "#8e816f").attr("stroke-width", 0.7).attr("filter", null); lakes.select("#dry").attr("opacity", 1).attr("fill", "#c9bfa7").attr("stroke", "#8e816f").attr("stroke-width", 0.7).attr("filter", null);
} }
// v 1.4 added ice layer // v1.4 added ice layer
ice = viewbox.insert("g", "#coastline").attr("id", "ice").style("display", "none"); ice = viewbox.insert("g", "#coastline").attr("id", "ice").style("display", "none");
ice.attr("opacity", null).attr("fill", "#e8f0f6").attr("stroke", "#e8f0f6").attr("stroke-width", 1).attr("filter", "url(#dropShadow05)"); ice.attr("opacity", null).attr("fill", "#e8f0f6").attr("stroke", "#e8f0f6").attr("stroke-width", 1).attr("filter", "url(#dropShadow05)");
drawIce(); drawIce();
// v 1.4 added icon and power attributes for units // v1.4 added icon and power attributes for units
for (const unit of options.military) { for (const unit of options.military) {
if (!unit.icon) unit.icon = getUnitIcon(unit.type); if (!unit.icon) unit.icon = getUnitIcon(unit.type);
if (!unit.power) unit.power = unit.crew; if (!unit.power) unit.power = unit.crew;
@ -668,7 +664,7 @@ function parseLoadedData(data) {
else return "⚔️"; else return "⚔️";
} }
// 1.4 added state reference for regiments // v1.4 added state reference for regiments
pack.states.filter(s => s.military).forEach(s => s.military.forEach(r => (r.state = s.i))); pack.states.filter(s => s.military).forEach(s => s.military.forEach(r => (r.state = s.i)));
} }
@ -679,19 +675,19 @@ function parseLoadedData(data) {
localStorage.removeItem("styleAncient"); localStorage.removeItem("styleAncient");
localStorage.removeItem("styleMonochrome"); localStorage.removeItem("styleMonochrome");
// v 1.5 cultures has shield attribute // v1.5 cultures has shield attribute
pack.cultures.forEach(culture => { pack.cultures.forEach(culture => {
if (culture.removed) return; if (culture.removed) return;
culture.shield = Cultures.getRandomShield(); culture.shield = Cultures.getRandomShield();
}); });
// v 1.5 added burg type value // v1.5 added burg type value
pack.burgs.forEach(burg => { pack.burgs.forEach(burg => {
if (!burg.i || burg.removed) return; if (!burg.i || burg.removed) return;
burg.type = BurgsAndStates.getType(burg.cell, burg.port); burg.type = BurgsAndStates.getType(burg.cell, burg.port);
}); });
// v 1.5 added emblems // v1.5 added emblems
defs.append("g").attr("id", "defs-emblems"); defs.append("g").attr("id", "defs-emblems");
emblems = viewbox.insert("g", "#population").attr("id", "emblems").style("display", "none"); emblems = viewbox.insert("g", "#population").attr("id", "emblems").style("display", "none");
emblems.append("g").attr("id", "burgEmblems"); emblems.append("g").attr("id", "burgEmblems");
@ -700,7 +696,7 @@ function parseLoadedData(data) {
regenerateEmblems(); regenerateEmblems();
toggleEmblems(); toggleEmblems();
// v 1.5 changed releif icons data // v1.5 changed releif icons data
terrain.selectAll("use").each(function () { terrain.selectAll("use").each(function () {
const type = this.getAttribute("data-type") || this.getAttribute("xlink:href"); const type = this.getAttribute("data-type") || this.getAttribute("xlink:href");
this.removeAttribute("xlink:href"); this.removeAttribute("xlink:href");
@ -711,7 +707,7 @@ function parseLoadedData(data) {
} }
if (version < 1.6) { if (version < 1.6) {
// v 1.6 changed rivers data // v1.6 changed rivers data
for (const river of pack.rivers) { for (const river of pack.rivers) {
const el = document.getElementById("river" + river.i); const el = document.getElementById("river" + river.i);
if (el) { if (el) {
@ -726,7 +722,7 @@ function parseLoadedData(data) {
} }
} }
// v 1.6 changed lakes data // v1.6 changed lakes data
for (const f of pack.features) { for (const f of pack.features) {
if (f.type !== "lake") continue; if (f.type !== "lake") continue;
if (f.evaporation) continue; if (f.evaporation) continue;
@ -743,7 +739,7 @@ function parseLoadedData(data) {
} }
if (version < 1.61) { if (version < 1.61) {
// v 1.61 changed rulers data // v1.61 changed rulers data
ruler.style("display", null); ruler.style("display", null);
rulers = new Rulers(); rulers = new Rulers();
@ -797,12 +793,12 @@ function parseLoadedData(data) {
} }
if (version < 1.62) { if (version < 1.62) {
// v 1.62 changed grid data // v1.62 changed grid data
gridOverlay.attr("size", null); gridOverlay.attr("size", null);
} }
if (version < 1.63) { if (version < 1.63) {
// v.1.63 changed ocean pattern opacity element // v1.63 changed ocean pattern opacity element
const oceanPattern = document.getElementById("oceanPattern"); const oceanPattern = document.getElementById("oceanPattern");
if (oceanPattern) oceanPattern.removeAttribute("opacity"); if (oceanPattern) oceanPattern.removeAttribute("opacity");
const oceanicPattern = document.getElementById("oceanicPattern"); const oceanicPattern = document.getElementById("oceanicPattern");
@ -816,7 +812,7 @@ function parseLoadedData(data) {
} }
if (version < 1.64) { if (version < 1.64) {
// v.1.64 change states style // v1.64 change states style
const opacity = regions.attr("opacity"); const opacity = regions.attr("opacity");
const filter = regions.attr("filter"); const filter = regions.attr("filter");
statesBody.attr("opacity", opacity).attr("filter", filter); statesBody.attr("opacity", opacity).attr("filter", filter);
@ -825,7 +821,7 @@ function parseLoadedData(data) {
} }
if (version < 1.65) { if (version < 1.65) {
// v 1.65 changed rivers data // v1.65 changed rivers data
d3.select("#rivers").attr("style", null); // remove style to unhide layer d3.select("#rivers").attr("style", null); // remove style to unhide layer
const {cells, rivers} = pack; const {cells, rivers} = pack;
const defaultWidthFactor = rn(1 / (pointsInput.dataset.cells / 10000) ** 0.25, 2); const defaultWidthFactor = rn(1 / (pointsInput.dataset.cells / 10000) ** 0.25, 2);
@ -873,7 +869,7 @@ function parseLoadedData(data) {
} }
if (version < 1.7) { if (version < 1.7) {
// v 1.7 changed markers data // v1.7 changed markers data
const defs = document.getElementById("defs-markers"); const defs = document.getElementById("defs-markers");
const markersGroup = document.getElementById("markers"); const markersGroup = document.getElementById("markers");
@ -931,6 +927,7 @@ function parseLoadedData(data) {
} }
if (version < 1.72) { if (version < 1.72) {
// v1.72 renamed custom style presets
const storedStyles = Object.keys(localStorage).filter(key => key.startsWith("style")); const storedStyles = Object.keys(localStorage).filter(key => key.startsWith("style"));
storedStyles.forEach(styleName => { storedStyles.forEach(styleName => {
const style = localStorage.getItem(styleName); const style = localStorage.getItem(styleName);
@ -939,6 +936,11 @@ function parseLoadedData(data) {
localStorage.removeItem(styleName); localStorage.removeItem(styleName);
}); });
} }
if (version < 1.73) {
// v1.73 moved the hatching patterns out of the user's SVG
document.getElementById("hatching")?.remove();
}
})(); })();
void (function checkDataIntegrity() { void (function checkDataIntegrity() {

28
modules/ui/editors.js
View file

@ -425,10 +425,10 @@ function clearLegend() {
function createPicker() { function createPicker() {
const pos = () => tip("Drag to change the picker position"); const pos = () => tip("Drag to change the picker position");
const cl = () => tip("Click to close the picker"); const cl = () => tip("Click to close the picker");
const closePicker = () => contaiter.style("display", "none"); const closePicker = () => container.style("display", "none");
const contaiter = d3.select("body").append("svg").attr("id", "pickerContainer").attr("width", "100%").attr("height", "100%"); const container = d3.select("body").append("svg").attr("id", "pickerContainer").attr("width", "100%").attr("height", "100%");
contaiter container
.append("rect") .append("rect")
.attr("x", 0) .attr("x", 0)
.attr("y", 0) .attr("y", 0)
@ -437,7 +437,7 @@ function createPicker() {
.attr("opacity", 0.2) .attr("opacity", 0.2)
.on("mousemove", cl) .on("mousemove", cl)
.on("click", closePicker); .on("click", closePicker);
const picker = contaiter const picker = container
.append("g") .append("g")
.attr("id", "picker") .attr("id", "picker")
.call( .call(
@ -494,7 +494,7 @@ function createPicker() {
const colors = picker.append("g").attr("id", "pickerColors").attr("stroke", "#333333"); const colors = picker.append("g").attr("id", "pickerColors").attr("stroke", "#333333");
const hatches = picker.append("g").attr("id", "pickerHatches").attr("stroke", "#333333"); const hatches = picker.append("g").attr("id", "pickerHatches").attr("stroke", "#333333");
const hatching = d3.selectAll("g#hatching > pattern"); const hatching = d3.selectAll("g#defs-hatching > pattern");
const number = hatching.size(); const number = hatching.size();
const clr = d3.range(number).map(i => d3.hsl((i / number) * 360, 0.7, 0.7).hex()); const clr = d3.range(number).map(i => d3.hsl((i / number) * 360, 0.7, 0.7).hex());
@ -504,8 +504,8 @@ function createPicker() {
.attr("id", "picker_" + d) .attr("id", "picker_" + d)
.attr("fill", d) .attr("fill", d)
.attr("class", i ? "" : "selected") .attr("class", i ? "" : "selected")
.attr("x", i * 22 + 4) .attr("x", (i % 14) * 22 + 4)
.attr("y", 40) .attr("y", 40 + Math.floor(i / 14)*20)
.attr("width", 16) .attr("width", 16)
.attr("height", 16); .attr("height", 16);
}); });
@ -515,20 +515,20 @@ function createPicker() {
.append("rect") .append("rect")
.attr("id", "picker_" + this.id) .attr("id", "picker_" + this.id)
.attr("fill", "url(#" + this.id + ")") .attr("fill", "url(#" + this.id + ")")
.attr("x", i * 22 + 4) .attr("x", (i % 14) * 22 + 4)
.attr("y", 61) .attr("y", Math.floor(i / 14)*20 + 20 + (number * 2))
.attr("width", 16) .attr("width", 16)
.attr("height", 16); .attr("height", 16)
}); });
colors colors
.selectAll("rect") .selectAll("rect")
.on("click", pickerFillClicked) .on("click", pickerFillClicked)
.on("mousemove", () => tip("Click to fill with the color")); .on("mouseover", () => tip("Click to fill with the color"));
hatches hatches
.selectAll("rect") .selectAll("rect")
.on("click", pickerFillClicked) .on("click", pickerFillClicked)
.on("mousemove", () => tip("Click to fill with the hatching")); .on("mouseover", function() { tip("Click to fill with the hatching " + this.id) });
// append box // append box
const bbox = picker.node().getBBox(); const bbox = picker.node().getBBox();
@ -544,10 +544,10 @@ function createPicker() {
.attr("fill", "#ffffff") .attr("fill", "#ffffff")
.attr("stroke", "#5d4651") .attr("stroke", "#5d4651")
.on("mousemove", pos); .on("mousemove", pos);
picker.insert("text", ":first-child").attr("x", 291).attr("y", -10).attr("id", "pickerCloseText").text("✕"); picker.insert("text", ":first-child").attr("x", width-20).attr("y", -10).attr("id", "pickerCloseText").text("✕");
picker picker
.insert("rect", ":first-child") .insert("rect", ":first-child")
.attr("x", 288) .attr("x", width-23)
.attr("y", -21) .attr("y", -21)
.attr("id", "pickerCloseRect") .attr("id", "pickerCloseRect")
.attr("width", 14) .attr("width", 14)

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

@ -331,7 +331,7 @@ function editZones() {
function addZonesLayer() { function addZonesLayer() {
const id = getNextId("zone"); const id = getNextId("zone");
const description = "Unknown zone"; const description = "Unknown zone";
const fill = "url(#hatch" + (id.slice(4) % 14) + ")"; const fill = "url(#hatch" + (id.slice(4) % 42) + ")";
zones.append("g").attr("id", id).attr("data-description", description).attr("data-cells", "").attr("fill", fill); zones.append("g").attr("id", id).attr("data-description", description).attr("data-cells", "").attr("fill", fill);
const unit = areaUnit.value === "square" ? " " + distanceUnitInput.value + "²" : " " + areaUnit.value; const unit = areaUnit.value === "square" ? " " + distanceUnitInput.value + "²" : " " + areaUnit.value;