diff --git a/main.js b/main.js index 93cc919b..f7346147 100644 --- a/main.js +++ b/main.js @@ -122,7 +122,7 @@ let customization = 0; // 0 - no; 1 = heightmap draw; 2 - states draw; 3 - add s let biomesData = applyDefaultBiomesSystem(); let nameBases = Names.getNameBases(); // cultures-related data -const fonts = ["Almendra+SC", "Georgia", "Arial", "Times+New+Roman", "Comic+Sans+MS", "Lucida+Sans+Unicode", "Courier+New"]; // default web-safe fonts +const fonts = ["Almendra+SC", "Georgia", "Arial", "Times+New+Roman", "Comic+Sans+MS", "Lucida+Sans+Unicode", "Courier+New", "Verdana", "Arial", "Impact"]; // default fonts let color = d3.scaleSequential(d3.interpolateSpectral); // default color scheme const lineGen = d3.line().curve(d3.curveBasis); // d3 line generator with default curve interpolation diff --git a/modules/load.js b/modules/load.js index 4308eceb..15c30438 100644 --- a/modules/load.js +++ b/modules/load.js @@ -220,6 +220,15 @@ function parseLoadedData(data) { burgLabels = labels.select("#burgLabels"); })(); + void (function loadUsedFonts() { + const fontsInUse = getFontsList(svg); + const fontsToLoad = fontsInUse.filter(font => !fonts.includes(font)); + if (fontsToLoad) { + const url = "https://fonts.googleapis.com/css?family=" + fontsToLoad.join("|"); + addFonts(url); + } + })(); + void (function parseGridData() { grid = JSON.parse(data[6]); calculateVoronoi(grid, grid.points); diff --git a/modules/save.js b/modules/save.js index 9b9d74c6..a7c5c687 100644 --- a/modules/save.js +++ b/modules/save.js @@ -269,8 +269,16 @@ async function getMapURL(type, subtype) { }); } - const fontStyle = await GFontToDataURI(getFontsToLoad(clone)); // load non-standard fonts - if (fontStyle) clone.select("defs").append("style").text(fontStyle.join("\n")); // add font to style + // load non-standard fonts + const usedFonts = getFontsList(clone); + const webSafe = ["Georgia", "Times+New+Roman", "Comic+Sans+MS", "Lucida+Sans+Unicode", "Courier+New", "Verdana", "Arial", "Impact"]; + const fontsToLoad = usedFonts.filter(font => !webSafe.includes(font)); + if (fontsToLoad.length) { + const url = "https://fonts.googleapis.com/css?family=" + fontsToLoad.join("|"); + const fontStyle = await GFontToDataURI(url); + if (fontStyle) clone.select("defs").append("style").text(fontStyle.join("\n")); + } + clone.remove(); const serialized = `` + new XMLSerializer().serializeToString(cloneEl); @@ -351,21 +359,17 @@ function inlineStyle(clone) { emptyG.remove(); } -// get non-standard fonts used for labels to fetch them from web -function getFontsToLoad(clone) { - const webSafe = ["Georgia", "Times+New+Roman", "Comic+Sans+MS", "Lucida+Sans+Unicode", "Courier+New", "Verdana", "Arial", "Impact"]; // fonts to not fetch +function getFontsList(svg) { + const fontsInUse = []; - const fontsInUse = new Set(); // to store fonts currently in use - clone.selectAll("#labels > g").each(function () { + svg.selectAll("#labels > g").each(function () { if (!this.hasChildNodes()) return; const font = this.dataset.font; - if (!font || webSafe.includes(font)) return; - fontsInUse.add(font); + if (font) fontsInUse.push(font); }); - const legendFont = legend.attr("data-font"); - if (legend.node().hasChildNodes() && !webSafe.includes(legendFont)) fontsInUse.add(legendFont); - const fonts = [...fontsInUse]; - return fonts.length ? "https://fonts.googleapis.com/css?family=" + fonts.join("|") : null; + if (legend.node().hasChildNodes()) fontsInUse.push(legend.attr("data-font")); + + return [...new Set(fontsInUse)]; } // code from Kaiido's answer https://stackoverflow.com/questions/42402584/how-to-use-google-fonts-in-canvas-when-drawing-dom-objects-in-svg diff --git a/modules/ui/states-editor.js b/modules/ui/states-editor.js index 45c74829..b7952453 100644 --- a/modules/ui/states-editor.js +++ b/modules/ui/states-editor.js @@ -846,7 +846,7 @@ function editStates() { if (owner) { const name = provinces[p].name; - // if province is historical part of abouther state province, unite with old province + // if province is a historical part of another state's province, unite with old province const part = states[owner].provinces.find(n => name.includes(provinces[n].name)); if (part) { provinces[p].removed = true; diff --git a/modules/ui/style.js b/modules/ui/style.js index 3d8e7954..59c8e659 100644 --- a/modules/ui/style.js +++ b/modules/ui/style.js @@ -1233,7 +1233,7 @@ function addFonts(url) { document.head.removeChild(s); return fetched; }) - .catch(function () {}); + .catch(err => ERROR && console.error(err)); } // Update font list for Label and Burg Editors