From 3e353e98cccc14619889df84cf43b6c140146e0a Mon Sep 17 00:00:00 2001 From: Azgaar Date: Sun, 6 Feb 2022 22:38:58 +0300 Subject: [PATCH] add only used hatchings on export --- modules/export.js | 19 ++-- modules/load.js | 222 +++++++++++++++++++++++----------------------- 2 files changed, 124 insertions(+), 117 deletions(-) diff --git a/modules/export.js b/modules/export.js index 06257d60..8eb6eb90 100644 --- a/modules/export.js +++ b/modules/export.js @@ -180,9 +180,6 @@ async function getMapURL(type, options = {}) { filters[i].remove(); } - const hatching = svgDefs.getElementById("defs-hatching"); - if (hatching) cloneDefs.appendChild(hatching.cloneNode(true)); - // remove unused patterns const patterns = cloneEl.querySelectorAll("pattern"); for (let i = 0; i < patterns.length; i++) { @@ -261,19 +258,19 @@ async function getMapURL(type, options = {}) { if (pattern) cloneDefs.appendChild(pattern.cloneNode(true)); } - if (!cloneEl.getElementById("defs-hatching").children.length) cloneEl.getElementById("defs-hatching")?.remove(); // remove unused hatching group 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("labels")) cloneEl.getElementById("textPaths")?.remove(); // removed unused textPaths // add armies style - if (cloneEl.getElementById("armies")) + if (cloneEl.getElementById("armies")) { cloneEl.insertAdjacentHTML( "afterbegin", "" ); + } - // add xlink: for href to support svg1.1 + // add xlink: for href to support svg 1.1 if (type === "svg") { cloneEl.querySelectorAll("[href]").forEach(el => { const href = el.getAttribute("href"); @@ -282,6 +279,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 fontsToLoad = usedFonts.filter(font => font.src); if (fontsToLoad.length) { diff --git a/modules/load.js b/modules/load.js index 2217bd8f..73a3982d 100644 --- a/modules/load.js +++ b/modules/load.js @@ -425,16 +425,16 @@ function parseLoadedData(data) { void (function resolveVersionConflicts() { const version = parseFloat(data[0].split('|')[0]); if (version < 0.9) { - // 0.9 has additional relief icons to be included into older maps - document.getElementById('defs-relief').innerHTML = reliefIcons; + // v0.9 has additional relief icons to be included into older maps + document.getElementById("defs-relief").innerHTML = reliefIcons; } if (version < 1) { - // 1.0 adds a new religions layer - relig = viewbox.insert('g', '#terrain').attr('id', 'relig'); + // v1.0 adds a new religions layer + relig = viewbox.insert("g", "#terrain").attr("id", "relig"); Religions.generate(); - // 1.0 adds a legend box + // v1.0 adds a legend box legend = svg.append("g").attr("id", "legend"); legend .attr("font-family", "Almendra SC") @@ -447,7 +447,7 @@ function parseLoadedData(data) { .attr("stroke-dasharray", "0 4 10 4") .attr("stroke-linecap", "round"); - // 1.0 separated drawBorders fron drawStates() + // v1.0 separated drawBorders fron drawStates() stateBorders = borders.append("g").attr("id", "stateBorders"); provinceBorders = borders.append("g").attr("id", "provinceBorders"); borders @@ -460,8 +460,8 @@ function parseLoadedData(data) { 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"); - // 1.0 adds state relations, provinces, forms and full names - provs = viewbox.insert('g', '#borders').attr('id', 'provs').attr('opacity', 0.6); + // v1.0 adds state relations, provinces, forms and full names + provs = viewbox.insert("g", "#borders").attr("id", "provs").attr("opacity", 0.6); BurgsAndStates.collectStatistics(); BurgsAndStates.generateCampaigns(); BurgsAndStates.generateDiplomacy(); @@ -472,44 +472,44 @@ function parseLoadedData(data) { if (!layerIsOn('toggleBorders')) $('#borders').fadeOut(); if (!layerIsOn('toggleStates')) regions.attr('display', 'none').selectAll('path').remove(); - // 1.0 adds zones layer - 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'); + // v1.0 adds zones layer + 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"); addZones(); if (!markers.selectAll("*").size()) { Markers.generate(); turnButtonOn("toggleMarkers"); } - // 1.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.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'); + // 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.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"); - // 1.0 changes states opacity bask to regions level - if (statesBody.attr('opacity')) { - regions.attr('opacity', statesBody.attr('opacity')); - statesBody.attr('opacity', null); + // v1.0 changes states opacity bask to regions level + if (statesBody.attr("opacity")) { + regions.attr("opacity", statesBody.attr("opacity")); + statesBody.attr("opacity", null); } - // 1.0 changed labels to multi-lined - labels.selectAll('textPath').each(function () { + // v1.0 changed labels to multi-lined + labels.selectAll("textPath").each(function () { const text = this.textContent; const shift = this.getComputedTextLength() / -1.5; this.innerHTML = `${text}`; }); - // 1.0 added new biome - Wetland - biomesData.name.push('Wetland'); - biomesData.color.push('#0b9131'); + // v1.0 added new biome - Wetland + biomesData.name.push("Wetland"); + biomesData.color.push("#0b9131"); biomesData.habitability.push(12); } if (version < 1.1) { - // v 1.0 initial code had a bug with religion layer id - if (!relig.size()) relig = viewbox.insert('g', '#terrain').attr('id', 'relig'); + // v1.0 initial code had a bug with religion layer id + 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) { if (!s.diplomacy) continue; s.diplomacy = s.diplomacy.map((r) => (r === 'Sympathy' ? 'Friendly' : r)); @@ -518,7 +518,7 @@ function parseLoadedData(data) { // labels should be toggled via style attribute, so remove display attribute 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) { pack.religions .filter((r) => r.i) @@ -538,14 +538,14 @@ function parseLoadedData(data) { 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 - if (!document.getElementById('sinkhole')) { - lakes.append('g').attr('id', 'sinkhole'); - lakes.append('g').attr('id', 'frozen'); - lakes.append('g').attr('id', 'lava'); - lakes.select('#sinkhole').attr('opacity', 1).attr('fill', '#5bc9fd').attr('stroke', '#53a3b0').attr('stroke-width', 0.7).attr('filter', null); - lakes.select('#frozen').attr('opacity', 0.95).attr('fill', '#cdd4e7').attr('stroke', '#cfe0eb').attr('stroke-width', 0).attr('filter', null); - lakes.select('#lava').attr('opacity', 0.7).attr('fill', '#90270d').attr('stroke', '#f93e0c').attr('stroke-width', 2).attr('filter', 'url(#crumpled)'); + // v1.1 added new lake and coast groups + if (!document.getElementById("sinkhole")) { + lakes.append("g").attr("id", "sinkhole"); + lakes.append("g").attr("id", "frozen"); + lakes.append("g").attr("id", "lava"); + lakes.select("#sinkhole").attr("opacity", 1).attr("fill", "#5bc9fd").attr("stroke", "#53a3b0").attr("stroke-width", 0.7).attr("filter", null); + lakes.select("#frozen").attr("opacity", 0.95).attr("fill", "#cdd4e7").attr("stroke", "#cfe0eb").attr("stroke-width", 0).attr("filter", null); + lakes.select("#lava").attr("opacity", 0.7).attr("fill", "#90270d").attr("stroke", "#f93e0c").attr("stroke-width", 2).attr("filter", "url(#crumpled)"); coastline.append('g').attr('id', 'sea_island'); coastline.append('g').attr('id', 'lake_island'); @@ -553,22 +553,22 @@ function parseLoadedData(data) { 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 - defs.select('#land').selectAll('path').remove(); - defs.select('#water').selectAll('path').remove(); - coastline.selectAll('path').remove(); - lakes.selectAll('path').remove(); + // v1.1 features stores more data + defs.select("#land").selectAll("path").remove(); + defs.select("#water").selectAll("path").remove(); + coastline.selectAll("path").remove(); + lakes.selectAll("path").remove(); drawCoastline(); } if (version < 1.11) { - // v 1.11 added new attributes - terrs.attr('scheme', 'bright').attr('terracing', 0).attr('skip', 5).attr('relax', 0).attr('curve', 0); - svg.select('#oceanic > *').attr('id', 'oceanicPattern'); - oceanLayers.attr('layers', '-6,-3,-1'); - gridOverlay.attr('type', 'pointyHex').attr('size', 10); + // v1.11 added new attributes + terrs.attr("scheme", "bright").attr("terracing", 0).attr("skip", 5).attr("relax", 0).attr("curve", 0); + svg.select("#oceanic > *").attr("id", "oceanicPattern"); + oceanLayers.attr("layers", "-6,-3,-1"); + 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) { pack.cultures .filter((c) => c.i) @@ -578,25 +578,25 @@ 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(); - // v 1.2 added new terrain attributes - if (!terrain.attr('set')) terrain.attr('set', 'simple'); - if (!terrain.attr('size')) terrain.attr('size', 1); - if (!terrain.attr('density')) terrain.attr('density', 0.4); + // v1.2 added new terrain attributes + if (!terrain.attr("set")) terrain.attr("set", "simple"); + if (!terrain.attr("size")) terrain.attr("size", 1); + if (!terrain.attr("density")) terrain.attr("density", 0.4); } if (version < 1.21) { - // v 1.11 replaced "display" attribute by "display" style - viewbox.selectAll('g').each(function () { - if (this.hasAttribute('display')) { - this.removeAttribute('display'); - this.style.display = 'none'; + // v1.11 replaced "display" attribute by "display" style + viewbox.selectAll("g").each(function () { + if (this.hasAttribute("display")) { + this.removeAttribute("display"); + this.style.display = "none"; } }); - // v 1.21 added rivers data to pack + // v1.21 added rivers data to pack pack.rivers = []; // rivers data rivers.selectAll('path').each(function () { const i = +this.id.slice(5); @@ -612,12 +612,12 @@ function parseLoadedData(data) { } 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(); } 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 year = rand(100, 2000); const era = Names.getBaseShort(P(0.7) ? 1 : rand(nameBases.length)) + ' Era'; @@ -625,29 +625,29 @@ function parseLoadedData(data) { const military = Military.getDefaultOptions(); 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(); - // v 1.3 added militry layer - 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); - turnButtonOn('toggleMilitary'); + // v1.3 added militry layer + 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); + turnButtonOn("toggleMilitary"); Military.generate(); } if (version < 1.4) { - // v 1.35 added dry lakes - if (!lakes.select('#dry').size()) { - 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); + // v1.35 added dry lakes + if (!lakes.select("#dry").size()) { + 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); } - // v 1.4 added ice layer - 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)'); + // v1.4 added ice layer + 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)"); 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) { if (!unit.icon) unit.icon = getUnitIcon(unit.type); if (!unit.power) unit.power = unit.crew; @@ -664,8 +664,8 @@ function parseLoadedData(data) { else return '⚔️'; } - // 1.4 added state reference for regiments - pack.states.filter((s) => s.military).forEach((s) => s.military.forEach((r) => (r.state = s.i))); + // v1.4 added state reference for regiments + pack.states.filter(s => s.military).forEach(s => s.military.forEach(r => (r.state = s.i))); } if (version < 1.5) { @@ -675,39 +675,39 @@ function parseLoadedData(data) { localStorage.removeItem('styleAncient'); localStorage.removeItem('styleMonochrome'); - // v 1.5 cultures has shield attribute - pack.cultures.forEach((culture) => { + // v1.5 cultures has shield attribute + pack.cultures.forEach(culture => { if (culture.removed) return; culture.shield = Cultures.getRandomShield(); }); - // v 1.5 added burg type value - pack.burgs.forEach((burg) => { + // v1.5 added burg type value + pack.burgs.forEach(burg => { if (!burg.i || burg.removed) return; burg.type = BurgsAndStates.getType(burg.cell, burg.port); }); - // v 1.5 added emblems - defs.append('g').attr('id', 'defs-emblems'); - emblems = viewbox.insert('g', '#population').attr('id', 'emblems').style('display', 'none'); - emblems.append('g').attr('id', 'burgEmblems'); - emblems.append('g').attr('id', 'provinceEmblems'); - emblems.append('g').attr('id', 'stateEmblems'); + // v1.5 added emblems + defs.append("g").attr("id", "defs-emblems"); + emblems = viewbox.insert("g", "#population").attr("id", "emblems").style("display", "none"); + emblems.append("g").attr("id", "burgEmblems"); + emblems.append("g").attr("id", "provinceEmblems"); + emblems.append("g").attr("id", "stateEmblems"); regenerateEmblems(); toggleEmblems(); - // v 1.5 changed releif icons data - terrain.selectAll('use').each(function () { - const type = this.getAttribute('data-type') || this.getAttribute('xlink:href'); - this.removeAttribute('xlink:href'); - this.removeAttribute('data-type'); - this.removeAttribute('data-size'); - this.setAttribute('href', type); + // v1.5 changed releif icons data + terrain.selectAll("use").each(function () { + const type = this.getAttribute("data-type") || this.getAttribute("xlink:href"); + this.removeAttribute("xlink:href"); + this.removeAttribute("data-type"); + this.removeAttribute("data-size"); + this.setAttribute("href", type); }); } if (version < 1.6) { - // v 1.6 changed rivers data + // v1.6 changed rivers data for (const river of pack.rivers) { const el = document.getElementById('river' + river.i); if (el) { @@ -722,7 +722,7 @@ function parseLoadedData(data) { } } - // v 1.6 changed lakes data + // v1.6 changed lakes data for (const f of pack.features) { if (f.type !== 'lake') continue; if (f.evaporation) continue; @@ -739,8 +739,8 @@ function parseLoadedData(data) { } if (version < 1.61) { - // v 1.61 changed rulers data - ruler.style('display', null); + // v1.61 changed rulers data + ruler.style("display", null); rulers = new Rulers(); ruler.selectAll('.ruler > .white').each(function () { @@ -793,16 +793,16 @@ function parseLoadedData(data) { } if (version < 1.62) { - // v 1.62 changed grid data - gridOverlay.attr('size', null); + // v1.62 changed grid data + gridOverlay.attr("size", null); } if (version < 1.63) { - // v.1.63 changed ocean pattern opacity element - const oceanPattern = document.getElementById('oceanPattern'); - if (oceanPattern) oceanPattern.removeAttribute('opacity'); - const oceanicPattern = document.getElementById('oceanicPattern'); - if (!oceanicPattern.getAttribute('opacity')) oceanicPattern.setAttribute('opacity', 0.2); + // v1.63 changed ocean pattern opacity element + const oceanPattern = document.getElementById("oceanPattern"); + if (oceanPattern) oceanPattern.removeAttribute("opacity"); + const oceanicPattern = document.getElementById("oceanicPattern"); + if (!oceanicPattern.getAttribute("opacity")) oceanicPattern.setAttribute("opacity", 0.2); // v 1.63 moved label text-shadow from css to editable inline style burgLabels.select('#cities').style('text-shadow', 'white 0 0 4px'); @@ -819,16 +819,16 @@ function parseLoadedData(data) { } if (version < 1.64) { - // v.1.64 change states style - const opacity = regions.attr('opacity'); - const filter = regions.attr('filter'); - statesBody.attr('opacity', opacity).attr('filter', filter); - statesHalo.attr('opacity', opacity).attr('filter', 'blur(5px)'); - regions.attr('opacity', null).attr('filter', null); + // v1.64 change states style + const opacity = regions.attr("opacity"); + const filter = regions.attr("filter"); + statesBody.attr("opacity", opacity).attr("filter", filter); + statesHalo.attr("opacity", opacity).attr("filter", "blur(5px)"); + regions.attr("opacity", null).attr("filter", null); } 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 const {cells, rivers} = pack; const defaultWidthFactor = rn(1 / (pointsInput.dataset.cells / 10000) ** 0.25, 2); @@ -994,7 +994,7 @@ function parseLoadedData(data) { // sort markers by index pack.markers.sort((a, b) => a.i - b.i); } - })(); + })(); changeMapSize();