diff --git a/index.css b/index.css index 0758a0c5..558728b7 100644 --- a/index.css +++ b/index.css @@ -169,6 +169,7 @@ t, #temperature, #texture, #landmass, +#vignette, #fogging { pointer-events: none; } diff --git a/index.html b/index.html index 31f3b8df..a8f43689 100644 --- a/index.html +++ b/index.html @@ -359,9 +359,17 @@ + + + + + + + +
@@ -703,6 +711,15 @@ > Scale Bar +
  • + Vignette +
    • @@ -785,6 +802,7 @@ + @@ -909,6 +927,51 @@ + + + Preset + + + + + + + Position + +
    + x + + width  + +
    +
    + y + + height + +
    + + + + + Radius + + x + + y + + + + + + Blur + + + 50px + + + + Pattern @@ -990,16 +1053,6 @@ - - - Shift by axes - - - - - - - Size @@ -7923,7 +7976,7 @@ - + @@ -7984,12 +8037,12 @@ - + - + diff --git a/main.js b/main.js index 945fb0bd..6db57f59 100644 --- a/main.js +++ b/main.js @@ -1,7 +1,7 @@ -// Azgaar (azgaar.fmg@yandex.com). Minsk, 2017-2022. MIT License +"use strict"; +// Azgaar (azgaar.fmg@yandex.com). Minsk, 2017-2023. MIT License // https://github.com/Azgaar/Fantasy-Map-Generator -"use strict"; // set debug options const PRODUCTION = location.hostname && location.hostname !== "localhost" && location.hostname !== "127.0.0.1"; const DEBUG = localStorage.getItem("debug"); diff --git a/modules/dynamic/auto-update.js b/modules/dynamic/auto-update.js index 30e07cd8..5dbebb60 100644 --- a/modules/dynamic/auto-update.js +++ b/modules/dynamic/auto-update.js @@ -710,4 +710,30 @@ export function resolveVersionConflicts(version) { drawTexture(); } } + + if (version < 1.95) { + // v1.95.00 added vignette visual layer + const mask = defs.append("mask").attr("id", "vignette-mask"); + mask.append("rect").attr("fill", "white").attr("x", 0).attr("y", 0).attr("width", "100%").attr("height", "100%"); + mask + .append("rect") + .attr("id", "vignette-rect") + .attr("fill", "black") + .attr("x", "0.3%") + .attr("y", "0.4%") + .attr("width", "99.4%") + .attr("height", "99.2%") + .attr("rx", "5%") + .attr("ry", "5%") + .attr("filter", "blur(20px)"); + + const vignette = svg + .append("g") + .attr("id", "vignette") + .attr("mask", "url(#vignette-mask)") + .attr("opacity", 0.3) + .attr("fill", "#000000") + .style("display", "none"); + vignette.append("rect").attr("x", 0).attr("y", 0).attr("width", "100%").attr("height", "100%"); + } } diff --git a/modules/io/load.js b/modules/io/load.js index 282cf009..769c7d6a 100644 --- a/modules/io/load.js +++ b/modules/io/load.js @@ -10,7 +10,7 @@ async function quickLoad() { } async function loadFromDropbox() { - const mapPath = document.getElementById("loadFromDropboxSelect")?.value; + const mapPath = byId("loadFromDropboxSelect")?.value; DEBUG && console.log("Loading map from Dropbox:", mapPath); const blob = await Cloud.providers.dropbox.load(mapPath); @@ -19,8 +19,8 @@ async function loadFromDropbox() { async function createSharableDropboxLink() { const mapFile = document.querySelector("#loadFromDropbox select").value; - const sharableLink = document.getElementById("sharableLink"); - const sharableLinkContainer = document.getElementById("sharableLinkContainer"); + const sharableLink = byId("sharableLink"); + const sharableLinkContainer = byId("sharableLinkContainer"); try { const previewLink = await Cloud.providers.dropbox.getLink(mapFile); @@ -110,7 +110,7 @@ function uploadMap(file, callback) { const fileReader = new FileReader(); fileReader.onloadend = async function (fileLoadedEvent) { if (callback) callback(); - document.getElementById("coas").innerHTML = ""; // remove auto-generated emblems + byId("coas").innerHTML = ""; // remove auto-generated emblems const result = fileLoadedEvent.target.result; const [mapData, mapVersion] = await parseLoadedResult(result); @@ -408,15 +408,14 @@ async function parseLoadedData(data) { })(); void (function restoreLayersState() { - // helper functions - const notHidden = selection => selection.node() && selection.style("display") !== "none"; + const isVisible = selection => selection.node() && selection.style("display") !== "none"; + const isVisibleNode = node => node && node.style.display !== "none"; const hasChildren = selection => selection.node()?.hasChildNodes(); const hasChild = (selection, selector) => selection.node()?.querySelector(selector); - const turnOn = el => document.getElementById(el).classList.remove("buttonoff"); + const turnOn = el => byId(el).classList.remove("buttonoff"); // turn all layers off - document - .getElementById("mapLayers") + byId("mapLayers") .querySelectorAll("li") .forEach(el => el.classList.add("buttonoff")); @@ -427,27 +426,28 @@ async function parseLoadedData(data) { if (hasChildren(cells)) turnOn("toggleCells"); if (hasChildren(gridOverlay)) turnOn("toggleGrid"); if (hasChildren(coordinates)) turnOn("toggleCoordinates"); - if (notHidden(compass) && hasChild(compass, "use")) turnOn("toggleCompass"); + if (isVisible(compass) && hasChild(compass, "use")) turnOn("toggleCompass"); if (hasChildren(rivers)) turnOn("toggleRivers"); - if (notHidden(terrain) && hasChildren(terrain)) turnOn("toggleRelief"); + if (isVisible(terrain) && hasChildren(terrain)) turnOn("toggleRelief"); if (hasChildren(relig)) turnOn("toggleReligions"); if (hasChildren(cults)) turnOn("toggleCultures"); if (hasChildren(statesBody)) turnOn("toggleStates"); if (hasChildren(provs)) turnOn("toggleProvinces"); - if (hasChildren(zones) && notHidden(zones)) turnOn("toggleZones"); - if (notHidden(borders) && hasChild(borders, "path")) turnOn("toggleBorders"); - if (notHidden(routes) && hasChild(routes, "path")) turnOn("toggleRoutes"); + if (hasChildren(zones) && isVisible(zones)) turnOn("toggleZones"); + if (isVisible(borders) && hasChild(borders, "path")) turnOn("toggleBorders"); + if (isVisible(routes) && hasChild(routes, "path")) turnOn("toggleRoutes"); if (hasChildren(temperature)) turnOn("toggleTemp"); if (hasChild(population, "line")) turnOn("togglePopulation"); if (hasChildren(ice)) turnOn("toggleIce"); if (hasChild(prec, "circle")) turnOn("togglePrec"); - if (notHidden(emblems) && hasChild(emblems, "use")) turnOn("toggleEmblems"); - if (notHidden(labels)) turnOn("toggleLabels"); - if (notHidden(icons)) turnOn("toggleIcons"); - if (hasChildren(armies) && notHidden(armies)) turnOn("toggleMilitary"); + if (isVisible(emblems) && hasChild(emblems, "use")) turnOn("toggleEmblems"); + if (isVisible(labels)) turnOn("toggleLabels"); + if (isVisible(icons)) turnOn("toggleIcons"); + if (hasChildren(armies) && isVisible(armies)) turnOn("toggleMilitary"); if (hasChildren(markers)) turnOn("toggleMarkers"); - if (notHidden(ruler)) turnOn("toggleRulers"); - if (notHidden(scaleBar)) turnOn("toggleScaleBar"); + if (isVisible(ruler)) turnOn("toggleRulers"); + if (isVisible(scaleBar)) turnOn("toggleScaleBar"); + if (isVisibleNode(byId("vignette"))) turnOn("toggleVignette"); getCurrentPreset(); })(); @@ -462,7 +462,7 @@ async function parseLoadedData(data) { { // dynamically import and run auto-update script const versionNumber = parseFloat(params[0]); - const {resolveVersionConflicts} = await import("../dynamic/auto-update.js?v=1.94.00"); + const {resolveVersionConflicts} = await import("../dynamic/auto-update.js?v=1.95.00"); resolveVersionConflicts(versionNumber); } diff --git a/modules/ui/hotkeys.js b/modules/ui/hotkeys.js index 4543d187..a0d866c9 100644 --- a/modules/ui/hotkeys.js +++ b/modules/ui/hotkeys.js @@ -91,6 +91,7 @@ function handleKeyup(event) { else if (code === "KeyK") toggleMarkers(); else if (code === "Equal" && !customization) toggleRulers(); else if (code === "Slash") toggleScaleBar(); + else if (code === "BracketLeft") toggleVignette(); else if (code === "ArrowLeft") zoom.translateBy(svg, 10, 0); else if (code === "ArrowRight") zoom.translateBy(svg, -10, 0); else if (code === "ArrowUp") zoom.translateBy(svg, 0, 10); diff --git a/modules/ui/layers.js b/modules/ui/layers.js index c2188ab0..945f3df9 100644 --- a/modules/ui/layers.js +++ b/modules/ui/layers.js @@ -14,7 +14,8 @@ function getDefaultPresets() { "toggleRivers", "toggleRoutes", "toggleScaleBar", - "toggleStates" + "toggleStates", + "toggleVignette" ], cultural: [ "toggleBorders", @@ -23,7 +24,8 @@ function getDefaultPresets() { "toggleLabels", "toggleRivers", "toggleRoutes", - "toggleScaleBar" + "toggleScaleBar", + "toggleVignette" ], religions: [ "toggleBorders", @@ -32,12 +34,13 @@ function getDefaultPresets() { "toggleReligions", "toggleRivers", "toggleRoutes", - "toggleScaleBar" + "toggleScaleBar", + "toggleVignette" ], - provinces: ["toggleBorders", "toggleIcons", "toggleProvinces", "toggleRivers", "toggleScaleBar"], - biomes: ["toggleBiomes", "toggleIce", "toggleRivers", "toggleScaleBar"], - heightmap: ["toggleHeight", "toggleRivers"], - physical: ["toggleCoordinates", "toggleHeight", "toggleIce", "toggleRivers", "toggleScaleBar"], + provinces: ["toggleBorders", "toggleIcons", "toggleProvinces", "toggleRivers", "toggleScaleBar", "toggleVignette"], + biomes: ["toggleBiomes", "toggleIce", "toggleRivers", "toggleScaleBar", "toggleVignette"], + heightmap: ["toggleHeight", "toggleRivers", "toggleVignette"], + physical: ["toggleCoordinates", "toggleHeight", "toggleIce", "toggleRivers", "toggleScaleBar", "toggleVignette"], poi: [ "toggleBorders", "toggleHeight", @@ -46,7 +49,8 @@ function getDefaultPresets() { "toggleMarkers", "toggleRivers", "toggleRoutes", - "toggleScaleBar" + "toggleScaleBar", + "toggleVignette" ], military: [ "toggleBorders", @@ -56,7 +60,8 @@ function getDefaultPresets() { "toggleRivers", "toggleRoutes", "toggleScaleBar", - "toggleStates" + "toggleStates", + "toggleVignette" ], emblems: [ "toggleBorders", @@ -66,7 +71,8 @@ function getDefaultPresets() { "toggleRivers", "toggleRoutes", "toggleScaleBar", - "toggleStates" + "toggleStates", + "toggleVignette" ], landmass: ["toggleScaleBar"] }; @@ -1862,6 +1868,18 @@ function drawEmblems() { TIME && console.timeEnd("drawEmblems"); } +function toggleVignette(event) { + if (!layerIsOn("toggleVignette")) { + turnButtonOn("toggleVignette"); + $("#vignette").fadeIn(); + if (event && isCtrlClick(event)) editStyle("vignette"); + } else { + if (event && isCtrlClick(event)) return editStyle("vignette"); + $("#vignette").fadeOut(); + turnButtonOff("toggleVignette"); + } +} + function layerIsOn(el) { const buttonoff = document.getElementById(el).classList.contains("buttonoff"); return !buttonoff; diff --git a/modules/ui/style.js b/modules/ui/style.js index f9e0189e..47b8be24 100644 --- a/modules/ui/style.js +++ b/modules/ui/style.js @@ -100,7 +100,7 @@ function selectStyleElement() { } // fill - if (["rivers", "lakes", "landmass", "prec", "ice", "fogging"].includes(styleElement)) { + if (["rivers", "lakes", "landmass", "prec", "ice", "fogging", "vignette"].includes(styleElement)) { styleFill.style.display = "block"; styleFillInput.value = styleFillOutput.value = el.attr("fill"); } @@ -355,6 +355,22 @@ function selectStyleElement() { const auto = (styleCoastlineAuto.checked = coastline.select("#sea_island").attr("auto-filter")); if (auto) styleFilter.style.display = "none"; } + + if (styleElement === "vignette") { + styleVignette.style.display = "block"; + + const maskRect = byId("vignette-rect"); + if (maskRect) { + const digit = str => str.replace(/[^\d.]/g, ""); + styleVignetteX.value = digit(maskRect.getAttribute("x")); + styleVignetteY.value = digit(maskRect.getAttribute("y")); + styleVignetteWidth.value = digit(maskRect.getAttribute("width")); + styleVignetteHeight.value = digit(maskRect.getAttribute("height")); + styleVignetteRx.value = digit(maskRect.getAttribute("rx")); + styleVignetteRy.value = digit(maskRect.getAttribute("ry")); + styleVignetteBlur.value = styleVignetteBlurOutput.value = digit(maskRect.getAttribute("filter")); + } + } } // Handle style inputs change @@ -471,15 +487,6 @@ styleGridShiftY.addEventListener("input", function () { if (layerIsOn("toggleGrid")) drawGrid(); }); -styleShiftX.addEventListener("input", shiftElement); -styleShiftY.addEventListener("input", shiftElement); - -function shiftElement() { - const x = styleShiftX.value || 0; - const y = styleShiftY.value || 0; - getEl().attr("transform", `translate(${x},${y})`); -} - styleRescaleMarkers.addEventListener("change", function () { markers.attr("rescale", +this.checked); invokeActiveZooming(); @@ -961,6 +968,81 @@ function fetchTextureURL(url) { img.src = url; } +const vignettePresets = { + default: `{ "#vignette": { "opacity": 0.3, "fill": "#000000", "filter": null }, "#vignette-rect": { "x": "0.3%", "y": "0.4%", "width": "99.6%", "height": "99.2%", "rx": "5%", "ry": "5%", "filter": "blur(20px)" } }`, + neon: `{ "#vignette": { "opacity": 0.5, "fill": "#7300ff", "filter": null }, "#vignette-rect": { "x": "0.3%", "y": "0.4%", "width": "99.6%", "height": "99.2%", "rx": "0%", "ry": "0%", "filter": "blur(15px)" } }`, + smoke: `{ "#vignette": { "opacity": 1, "fill": "#000000", "filter": "url(#splotch)" }, "#vignette-rect": { "x": "3%", "y": "5%", "width": "96%", "height": "90%", "rx": "10%", "ry": "10%", "filter": "blur(100px)" } }`, + wound: `{ "#vignette": { "opacity": 0.8, "fill": "#ff0000", "filter": "url(#paper)"}, "#vignette-rect": {"x": "0.5%", "y": "1%", "width": "99%", "height": "98%", "rx": "5%", "ry": "5%", "filter": "blur(50px)" } }`, + paper: `{ "#vignette": { "opacity": 1, "fill": "#000000", "filter": "url(#paper)" }, "#vignette-rect": { "x": "0.3%", "y": "0.4%", "width": "99.6%", "height": "99.2%", "rx": "20%", "ry": "20%", "filter": "blur(150px)" } }`, + granite: `{ "#vignette": { "opacity": 0.95, "fill": "#231b1b", "filter": "url(#crumpled)" }, "#vignette-rect": { "x": "3%", "y": "5%", "width": "94%", "height": "90%", "rx": "20%", "ry": "20%", "filter": "blur(150px)" } }`, + spotlight: `{ "#vignette": { "opacity": 0.96, "fill": "#000000", "filter": null }, "#vignette-rect": { "x": "20%", "y": "30%", "width": "24%", "height": "30%", "rx": "50%", "ry": "50%", "filter": "blur(30px) "} }` +}; + +Object.keys(vignettePresets).forEach(preset => { + styleVignettePreset.options.add(new Option(preset, preset, false, false)); +}); + +styleVignettePreset.addEventListener("change", function () { + const attributes = JSON.parse(vignettePresets[this.value]); + + for (const selector in attributes) { + const el = document.querySelector(selector); + if (!el) continue; + for (const attr in attributes[selector]) { + const value = attributes[selector][attr]; + el.setAttribute(attr, value); + } + } + + const vignette = byId("vignette"); + if (vignette) { + styleOpacityInput.value = styleOpacityOutput.value = vignette.getAttribute("opacity"); + styleFillInput.value = styleFillOutput.value = vignette.getAttribute("fill"); + styleFilterInput.value = vignette.getAttribute("filter"); + } + + const maskRect = byId("vignette-rect"); + if (maskRect) { + const digit = str => str.replace(/[^\d.]/g, ""); + styleVignetteX.value = digit(maskRect.getAttribute("x")); + styleVignetteY.value = digit(maskRect.getAttribute("y")); + styleVignetteWidth.value = digit(maskRect.getAttribute("width")); + styleVignetteHeight.value = digit(maskRect.getAttribute("height")); + styleVignetteRx.value = digit(maskRect.getAttribute("rx")); + styleVignetteRy.value = digit(maskRect.getAttribute("ry")); + styleVignetteBlur.value = styleVignetteBlurOutput.value = digit(maskRect.getAttribute("filter")); + } +}); + +styleVignetteX.addEventListener("input", function () { + byId("vignette-rect")?.setAttribute("x", `${this.value}%`); +}); + +styleVignetteWidth.addEventListener("input", function () { + byId("vignette-rect")?.setAttribute("width", `${this.value}%`); +}); + +styleVignetteY.addEventListener("input", function () { + byId("vignette-rect")?.setAttribute("y", `${this.value}%`); +}); + +styleVignetteHeight.addEventListener("input", function () { + byId("vignette-rect")?.setAttribute("height", `${this.value}%`); +}); + +styleVignetteRx.addEventListener("input", function () { + byId("vignette-rect")?.setAttribute("rx", `${this.value}%`); +}); + +styleVignetteRy.addEventListener("input", function () { + byId("vignette-rect")?.setAttribute("ry", `${this.value}%`); +}); + +styleVignetteBlur.addEventListener("input", function () { + styleVignetteBlurOutput.value = this.value; + byId("vignette-rect")?.setAttribute("filter", `blur(${this.value}px)`); +}); + function updateElements() { // burgIcons to desired size burgIcons.selectAll("g").each(function () { diff --git a/modules/ui/stylePresets.js b/modules/ui/stylePresets.js index 460b713d..05302577 100644 --- a/modules/ui/stylePresets.js +++ b/modules/ui/stylePresets.js @@ -299,7 +299,9 @@ function addStylePreset() { "font-family", "filter" ], - "#fogging": ["opacity", "fill", "filter"] + "#fogging": ["opacity", "fill", "filter"], + "#vignette": ["opacity", "fill", "filter"], + "#vignette-rect": ["x", "y", "width", "height", "rx", "ry", "filter"] }; for (const selector in attributes) { diff --git a/styles/ancient.json b/styles/ancient.json index a1c3f1ea..e57f2d87 100644 --- a/styles/ancient.json +++ b/styles/ancient.json @@ -384,5 +384,19 @@ "opacity": 0.98, "fill": "#30426f", "filter": null + }, + "#vignette": { + "opacity": 0.2, + "fill": "#000000", + "filter": "" + }, + "#vignette-rect": { + "x": "0%", + "y": "0%", + "width": "100%", + "height": "100%", + "rx": "0%", + "ry": "0%", + "filter": "blur(50px)" } } diff --git a/styles/atlas.json b/styles/atlas.json index 1a44619f..6366e5f4 100644 --- a/styles/atlas.json +++ b/styles/atlas.json @@ -384,5 +384,19 @@ "opacity": 0.98, "fill": "#30426f", "filter": null + }, + "#vignette": { + "opacity": 0.2, + "fill": "#000000", + "filter": null + }, + "#vignette-rect": { + "x": "0.2%", + "y": "0.3%", + "width": "99.8%", + "height": "99.4%", + "rx": "5%", + "ry": "5%", + "filter": "blur(30px)" } } diff --git a/styles/clean.json b/styles/clean.json index 4282202c..ba3685a4 100644 --- a/styles/clean.json +++ b/styles/clean.json @@ -386,5 +386,19 @@ "opacity": 1, "fill": "#ffffff", "filter": null + }, + "#vignette": { + "opacity": 0, + "fill": "#000000", + "filter": null + }, + "#vignette-rect": { + "x": "0.3%", + "y": "0.4%", + "width": "99.6%", + "height": "99.2%", + "rx": "5%", + "ry": "5%", + "filter": "blur(20px)" } } diff --git a/styles/cyberpunk.json b/styles/cyberpunk.json index 2a24002e..e69f5c43 100644 --- a/styles/cyberpunk.json +++ b/styles/cyberpunk.json @@ -384,5 +384,19 @@ "opacity": 0.98, "fill": "#1b1423", "filter": null + }, + "#vignette": { + "opacity": 0, + "fill": "#000000", + "filter": null + }, + "#vignette-rect": { + "x": "0.3%", + "y": "0.4%", + "width": "99.6%", + "height": "99.2%", + "rx": "5%", + "ry": "5%", + "filter": "blur(20px)" } } diff --git a/styles/default.json b/styles/default.json index 7905324f..e2cf0e6d 100644 --- a/styles/default.json +++ b/styles/default.json @@ -384,5 +384,19 @@ "opacity": 0.98, "fill": "#30426f", "filter": null + }, + "#vignette": { + "opacity": 0.3, + "fill": "#000000", + "filter": null + }, + "#vignette-rect": { + "x": "0.3%", + "y": "0.4%", + "width": "99.6%", + "height": "99.2%", + "rx": "5%", + "ry": "5%", + "filter": "blur(20px)" } } diff --git a/styles/gloom.json b/styles/gloom.json index 897aa1d3..ec4084d2 100644 --- a/styles/gloom.json +++ b/styles/gloom.json @@ -386,5 +386,19 @@ "opacity": 0.98, "fill": "#1b1423", "filter": null + }, + "#vignette": { + "opacity": 0.5, + "fill": "#042603", + "filter": null + }, + "#vignette-rect": { + "x": "0.1%", + "y": "0.2%", + "width": "99.8%", + "height": "99.6%", + "rx": "10%", + "ry": "10%", + "filter": "blur(30px)" } } diff --git a/styles/light.json b/styles/light.json index 34ef841f..978a039b 100644 --- a/styles/light.json +++ b/styles/light.json @@ -384,5 +384,19 @@ "opacity": 1, "fill": "#30426f", "filter": null + }, + "#vignette": { + "opacity": 0.15, + "fill": "#000000", + "filter": null + }, + "#vignette-rect": { + "x": "0.2%", + "y": "0.3%", + "width": "99.8%", + "height": "99.4%", + "rx": "5%", + "ry": "5%", + "filter": "blur(20px)" } } diff --git a/styles/monochrome.json b/styles/monochrome.json index c512fdc4..23ff7a48 100644 --- a/styles/monochrome.json +++ b/styles/monochrome.json @@ -380,5 +380,19 @@ "opacity": 0.98, "fill": "#30426f", "filter": null + }, + "#vignette": { + "opacity": 0.3, + "fill": "#000000", + "filter": null + }, + "#vignette-rect": { + "x": "0.3%", + "y": "0.4%", + "width": "99.6%", + "height": "99.2%", + "rx": "5%", + "ry": "5%", + "filter": "blur(20px)" } } diff --git a/styles/night.json b/styles/night.json index 0f0820d1..99df7867 100644 --- a/styles/night.json +++ b/styles/night.json @@ -384,5 +384,19 @@ "opacity": 0.8, "fill": "#000000", "filter": null + }, + "#vignette": { + "opacity": 0, + "fill": "#000000", + "filter": null + }, + "#vignette-rect": { + "x": "0.3%", + "y": "0.4%", + "width": "99.6%", + "height": "99.2%", + "rx": "5%", + "ry": "5%", + "filter": "blur(20px)" } } diff --git a/styles/pale.json b/styles/pale.json index 60cca2e9..4bddc4d2 100644 --- a/styles/pale.json +++ b/styles/pale.json @@ -384,5 +384,19 @@ "opacity": 1, "fill": "#30426f", "filter": null + }, + "#vignette": { + "opacity": 0.2, + "fill": "#000000", + "filter": null + }, + "#vignette-rect": { + "x": "0.3%", + "y": "0.4%", + "width": "99.6%", + "height": "99.2%", + "rx": "5%", + "ry": "5%", + "filter": "blur(30px)" } } diff --git a/styles/watercolor.json b/styles/watercolor.json index d52c4da9..01763c1b 100644 --- a/styles/watercolor.json +++ b/styles/watercolor.json @@ -384,5 +384,19 @@ "opacity": 0.97, "fill": "#8398ce", "filter": null + }, + "#vignette": { + "opacity": 0.2, + "fill": "#000000", + "filter": null + }, + "#vignette-rect": { + "x": "0.3%", + "y": "0.4%", + "width": "99.6%", + "height": "99.2%", + "rx": "5%", + "ry": "5%", + "filter": "blur(20px)" } } diff --git a/versioning.js b/versioning.js index 69e65f3c..8d658c4f 100644 --- a/versioning.js +++ b/versioning.js @@ -1,7 +1,7 @@ "use strict"; // version and caching control -const version = "1.94.06"; // generator version, update each time +const version = "1.95.00"; // generator version, update each time { document.title += " v" + version; @@ -28,6 +28,7 @@ const version = "1.94.06"; // generator version, update each time

    Join our Discord server and Reddit community to ask questions, share maps, discuss the Generator and Worlbuilding, report bugs and propose new features.