diff --git a/modules/ui/general.js b/modules/ui/general.js
index 997b321f..4305f016 100644
--- a/modules/ui/general.js
+++ b/modules/ui/general.js
@@ -335,10 +335,6 @@ function getPrecipitation(prec) {
   return prec * 100 + " mm";
 }
 
-function getPrecipitation(prec) {
-  return prec * 100 + " mm";
-}
-
 // get user-friendly (real-world) precipitation value from map data
 function getFriendlyPrecipitation(i) {
   const prec = grid.cells.prec[pack.cells.g[i]];
diff --git a/modules/ui/regiment-editor.js b/modules/ui/regiment-editor.js
index 3c0fe73c..359cca91 100644
--- a/modules/ui/regiment-editor.js
+++ b/modules/ui/regiment-editor.js
@@ -370,8 +370,8 @@ function editRegiment(selector) {
           military.splice(regIndex, 1);
 
           const index = notes.findIndex(n => n.id === elSelected.id);
-      if (index != -1) notes.splice(index, 1);
-      elSelected.remove();
+          if (index != -1) notes.splice(index, 1);
+          elSelected.remove();
 
           if (militaryOverviewRefresh.offsetParent) militaryOverviewRefresh.click();
           if (regimentsOverviewRefresh.offsetParent) regimentsOverviewRefresh.click();
diff --git a/modules/ui/rivers-editor.js b/modules/ui/rivers-editor.js
index c94d8492..7a24cfe5 100644
--- a/modules/ui/rivers-editor.js
+++ b/modules/ui/rivers-editor.js
@@ -1,4 +1,4 @@
-'use strict';
+"use strict";
 function editRiver(id) {
   if (customization) return;
   if (elSelected && id === elSelected.attr("id")) return;
@@ -47,18 +47,18 @@ function editRiver(id) {
   document.getElementById("riverWidthFactor").addEventListener("input", changeWidthFactor);
 
   function getRiver() {
-    const riverId = +elSelected.attr('id').slice(5);
-    const river = pack.rivers.find((r) => r.i === riverId);
+    const riverId = +elSelected.attr("id").slice(5);
+    const river = pack.rivers.find(r => r.i === riverId);
     return river;
   }
 
   function updateRiverData() {
     const r = getRiver();
 
-    document.getElementById('riverName').value = r.name;
-    document.getElementById('riverType').value = r.type;
+    document.getElementById("riverName").value = r.name;
+    document.getElementById("riverType").value = r.type;
 
-    const parentSelect = document.getElementById('riverMainstem');
+    const parentSelect = document.getElementById("riverMainstem");
     parentSelect.options.length = 0;
     const parent = r.parent || r.i;
     const sortedRivers = pack.rivers.slice().sort((a, b) => (a.name > b.name ? 1 : -1));
@@ -66,7 +66,7 @@ function editRiver(id) {
       const opt = new Option(river.name, river.i, false, river.i === parent);
       parentSelect.options.add(opt);
     });
-    document.getElementById('riverBasin').value = pack.rivers.find((river) => river.i === r.basin).name;
+    document.getElementById("riverBasin").value = pack.rivers.find(river => river.i === r.basin).name;
 
     document.getElementById("riverDischarge").value = r.discharge + " m³/s";
     document.getElementById("riverSourceWidth").value = r.sourceWidth;
@@ -208,8 +208,8 @@ function editRiver(id) {
   function changeParent() {
     const r = getRiver();
     r.parent = +this.value;
-    r.basin = pack.rivers.find((river) => river.i === r.parent).basin;
-    document.getElementById('riverBasin').value = pack.rivers.find((river) => river.i === r.basin).name;
+    r.basin = pack.rivers.find(river => river.i === r.parent).basin;
+    document.getElementById("riverBasin").value = pack.rivers.find(river => river.i === r.basin).name;
   }
 
   function changeSourceWidth() {
@@ -232,9 +232,9 @@ function editRiver(id) {
   }
 
   function editRiverLegend() {
-    const id = elSelected.attr('id');
+    const id = elSelected.attr("id");
     const river = getRiver();
-    editNotes(id, river.name + ' ' + river.type);
+    editNotes(id, river.name + " " + river.type);
   }
 
   function removeRiver() {
diff --git a/modules/ui/rivers-overview.js b/modules/ui/rivers-overview.js
index f5166c9c..e9045fd5 100644
--- a/modules/ui/rivers-overview.js
+++ b/modules/ui/rivers-overview.js
@@ -1,12 +1,12 @@
-'use strict';
+"use strict";
 function overviewRivers() {
   if (customization) return;
-  closeDialogs('#riversOverview, .stable');
-  if (!layerIsOn('toggleRivers')) toggleRivers();
+  closeDialogs("#riversOverview, .stable");
+  if (!layerIsOn("toggleRivers")) toggleRivers();
 
-  const body = document.getElementById('riversBody');
+  const body = document.getElementById("riversBody");
   riversOverviewAddLines();
-  $('#riversOverview').dialog();
+  $("#riversOverview").dialog();
 
   if (modules.overviewRivers) return;
   modules.overviewRivers = true;
@@ -28,15 +28,15 @@ function overviewRivers() {
 
   // add line for each river
   function riversOverviewAddLines() {
-    body.innerHTML = '';
-    let lines = '';
+    body.innerHTML = "";
+    let lines = "";
     const unit = distanceUnitInput.value;
 
     for (const r of pack.rivers) {
-      const discharge = r.discharge + ' m³/s';
-      const length = rn(r.length * distanceScaleInput.value) + ' ' + unit;
-      const width = rn(r.width * distanceScaleInput.value, 3) + ' ' + unit;
-      const basin = pack.rivers.find((river) => river.i === r.basin)?.name;
+      const discharge = r.discharge + " m³/s";
+      const length = rn(r.length * distanceScaleInput.value) + " " + unit;
+      const width = rn(r.width * distanceScaleInput.value, 3) + " " + unit;
+      const basin = pack.rivers.find(river => river.i === r.basin)?.name;
 
       lines += /* html */ `<div
         class="states"
@@ -59,7 +59,7 @@ function overviewRivers() {
         <span data-tip="Remove river" class="icon-trash-empty"></span>
       </div>`;
     }
-    body.insertAdjacentHTML('beforeend', lines);
+    body.insertAdjacentHTML("beforeend", lines);
 
     // update footer
     riversFooterNumber.innerHTML = pack.rivers.length;
@@ -71,17 +71,17 @@ function overviewRivers() {
     riversFooterWidth.innerHTML = rn(averageWidth * distanceScaleInput.value, 3) + " " + unit;
 
     // add listeners
-    body.querySelectorAll('div.states').forEach((el) => el.addEventListener('mouseenter', (ev) => riverHighlightOn(ev)));
-    body.querySelectorAll('div.states').forEach((el) => el.addEventListener('mouseleave', (ev) => riverHighlightOff(ev)));
-    body.querySelectorAll('div > span.icon-dot-circled').forEach((el) => el.addEventListener('click', zoomToRiver));
-    body.querySelectorAll('div > span.icon-pencil').forEach((el) => el.addEventListener('click', openRiverEditor));
-    body.querySelectorAll('div > span.icon-trash-empty').forEach((el) => el.addEventListener('click', triggerRiverRemove));
+    body.querySelectorAll("div.states").forEach(el => el.addEventListener("mouseenter", ev => riverHighlightOn(ev)));
+    body.querySelectorAll("div.states").forEach(el => el.addEventListener("mouseleave", ev => riverHighlightOff(ev)));
+    body.querySelectorAll("div > span.icon-dot-circled").forEach(el => el.addEventListener("click", zoomToRiver));
+    body.querySelectorAll("div > span.icon-pencil").forEach(el => el.addEventListener("click", openRiverEditor));
+    body.querySelectorAll("div > span.icon-trash-empty").forEach(el => el.addEventListener("click", triggerRiverRemove));
 
     applySorting(riversHeader);
   }
 
   function riverHighlightOn(event) {
-    if (!layerIsOn('toggleRivers')) toggleRivers();
+    if (!layerIsOn("toggleRivers")) toggleRivers();
     const r = +event.target.dataset.id;
     rivers
       .select("#river" + r)
@@ -104,9 +104,9 @@ function overviewRivers() {
   }
 
   function toggleBasinsHightlight() {
-    if (rivers.attr('data-basin') === 'hightlighted') {
-      rivers.selectAll('*').attr('fill', null);
-      rivers.attr('data-basin', null);
+    if (rivers.attr("data-basin") === "hightlighted") {
+      rivers.selectAll("*").attr("fill", null);
+      rivers.attr("data-basin", null);
     } else {
       rivers.attr("data-basin", "hightlighted");
       const basins = [...new Set(pack.rivers.map(r => r.basin))];
@@ -124,7 +124,7 @@ function overviewRivers() {
   }
 
   function downloadRiversData() {
-    let data = 'Id,River,Type,Discharge,Length,Width,Basin\n'; // headers
+    let data = "Id,River,Type,Discharge,Length,Width,Basin\n"; // headers
 
     body.querySelectorAll(":scope > div").forEach(function (el) {
       const d = el.dataset;
@@ -134,7 +134,7 @@ function overviewRivers() {
       data += [d.id, d.name, d.type, discharge, length, width, d.basin].join(",") + "\n";
     });
 
-    const name = getFileName('Rivers') + '.csv';
+    const name = getFileName("Rivers") + ".csv";
     downloadFile(data, name);
   }
 
diff --git a/modules/ui/routes-editor.js b/modules/ui/routes-editor.js
index 4aefcdb1..785c22a9 100644
--- a/modules/ui/routes-editor.js
+++ b/modules/ui/routes-editor.js
@@ -1,9 +1,9 @@
-'use strict';
+"use strict";
 function editRoute(onClick) {
   if (customization) return;
-  if (!onClick && elSelected && d3.event.target.id === elSelected.attr('id')) return;
-  closeDialogs('.stable');
-  if (!layerIsOn('toggleRoutes')) toggleRoutes();
+  if (!onClick && elSelected && d3.event.target.id === elSelected.attr("id")) return;
+  closeDialogs(".stable");
+  if (!layerIsOn("toggleRoutes")) toggleRoutes();
 
   $("#routeEditor").dialog({
     title: "Edit Route",
@@ -12,32 +12,32 @@ function editRoute(onClick) {
     close: closeRoutesEditor
   });
 
-  debug.append('g').attr('id', 'controlPoints');
+  debug.append("g").attr("id", "controlPoints");
   const node = onClick ? elSelected.node() : d3.event.target;
-  elSelected = d3.select(node).on('click', addInterimControlPoint);
+  elSelected = d3.select(node).on("click", addInterimControlPoint);
   drawControlPoints(node);
   selectRouteGroup(node);
 
-  viewbox.on('touchmove mousemove', showEditorTips);
+  viewbox.on("touchmove mousemove", showEditorTips);
   if (onClick) toggleRouteCreationMode();
 
   if (modules.editRoute) return;
   modules.editRoute = true;
 
   // add listeners
-  document.getElementById('routeGroupsShow').addEventListener('click', showGroupSection);
-  document.getElementById('routeGroup').addEventListener('change', changeRouteGroup);
-  document.getElementById('routeGroupAdd').addEventListener('click', toggleNewGroupInput);
-  document.getElementById('routeGroupName').addEventListener('change', createNewGroup);
-  document.getElementById('routeGroupRemove').addEventListener('click', removeRouteGroup);
-  document.getElementById('routeGroupsHide').addEventListener('click', hideGroupSection);
-  document.getElementById('routeElevationProfile').addEventListener('click', showElevationProfile);
+  document.getElementById("routeGroupsShow").addEventListener("click", showGroupSection);
+  document.getElementById("routeGroup").addEventListener("change", changeRouteGroup);
+  document.getElementById("routeGroupAdd").addEventListener("click", toggleNewGroupInput);
+  document.getElementById("routeGroupName").addEventListener("change", createNewGroup);
+  document.getElementById("routeGroupRemove").addEventListener("click", removeRouteGroup);
+  document.getElementById("routeGroupsHide").addEventListener("click", hideGroupSection);
+  document.getElementById("routeElevationProfile").addEventListener("click", showElevationProfile);
 
-  document.getElementById('routeEditStyle').addEventListener('click', editGroupStyle);
-  document.getElementById('routeSplit').addEventListener('click', toggleRouteSplitMode);
-  document.getElementById('routeLegend').addEventListener('click', editRouteLegend);
-  document.getElementById('routeNew').addEventListener('click', toggleRouteCreationMode);
-  document.getElementById('routeRemove').addEventListener('click', removeRoute);
+  document.getElementById("routeEditStyle").addEventListener("click", editGroupStyle);
+  document.getElementById("routeSplit").addEventListener("click", toggleRouteSplitMode);
+  document.getElementById("routeLegend").addEventListener("click", editRouteLegend);
+  document.getElementById("routeNew").addEventListener("click", toggleRouteCreationMode);
+  document.getElementById("routeRemove").addEventListener("click", removeRoute);
 
   function showEditorTips() {
     showMainTip();
@@ -53,7 +53,7 @@ function editRoute(onClick) {
       const point = node.getPointAtLength(i);
       addControlPoint([point.x, point.y]);
     }
-    routeLength.innerHTML = rn(l * distanceScaleInput.value) + ' ' + distanceUnitInput.value;
+    routeLength.innerHTML = rn(l * distanceScaleInput.value) + " " + distanceUnitInput.value;
   }
 
   function addControlPoint(point, before = null) {
@@ -69,8 +69,8 @@ function editRoute(onClick) {
 
   function addInterimControlPoint() {
     const point = d3.mouse(this);
-    const controls = document.getElementById('controlPoints').querySelectorAll('circle');
-    const points = Array.from(controls).map((circle) => [+circle.getAttribute('cx'), +circle.getAttribute('cy')]);
+    const controls = document.getElementById("controlPoints").querySelectorAll("circle");
+    const points = Array.from(controls).map(circle => [+circle.getAttribute("cx"), +circle.getAttribute("cy")]);
     const index = getSegmentId(points, point, 2);
     addControlPoint(point, ":nth-child(" + (index + 1) + ")");
 
@@ -78,8 +78,8 @@ function editRoute(onClick) {
   }
 
   function dragControlPoint() {
-    this.setAttribute('cx', d3.event.x);
-    this.setAttribute('cy', d3.event.y);
+    this.setAttribute("cx", d3.event.x);
+    this.setAttribute("cy", d3.event.y);
     redrawRoute();
   }
 
@@ -93,9 +93,9 @@ function editRoute(onClick) {
         points.push([this.getAttribute("cx"), this.getAttribute("cy")]);
       });
 
-    elSelected.attr('d', round(lineGen(points)));
+    elSelected.attr("d", round(lineGen(points)));
     const l = elSelected.node().getTotalLength();
-    routeLength.innerHTML = rn(l * distanceScaleInput.value) + ' ' + distanceUnitInput.value;
+    routeLength.innerHTML = rn(l * distanceScaleInput.value) + " " + distanceUnitInput.value;
 
     if (modules.elevation) showEPForRoute(elSelected.node());
   }
@@ -120,7 +120,7 @@ function editRoute(onClick) {
 
   function selectRouteGroup(node) {
     const group = node.parentNode.id;
-    const select = document.getElementById('routeGroup');
+    const select = document.getElementById("routeGroup");
     select.options.length = 0; // remove all options
 
     routes.selectAll("g").each(function () {
@@ -133,10 +133,10 @@ function editRoute(onClick) {
   }
 
   function toggleNewGroupInput() {
-    if (routeGroupName.style.display === 'none') {
-      routeGroupName.style.display = 'inline-block';
+    if (routeGroupName.style.display === "none") {
+      routeGroupName.style.display = "inline-block";
       routeGroupName.focus();
-      routeGroup.style.display = 'none';
+      routeGroup.style.display = "none";
     } else {
       routeGroupName.style.display = "none";
       routeGroup.style.display = "inline-block";
@@ -154,17 +154,17 @@ function editRoute(onClick) {
       .replace(/[^\w\s]/gi, "");
 
     if (document.getElementById(group)) {
-      tip('Element with this id already exists. Please provide a unique name', false, 'error');
+      tip("Element with this id already exists. Please provide a unique name", false, "error");
       return;
     }
 
     if (Number.isFinite(+group.charAt(0))) {
-      tip('Group name should start with a letter', false, 'error');
+      tip("Group name should start with a letter", false, "error");
       return;
     }
     // just rename if only 1 element left
     const oldGroup = elSelected.node().parentNode;
-    const basic = ['roads', 'trails', 'searoutes'].includes(oldGroup.id);
+    const basic = ["roads", "trails", "searoutes"].includes(oldGroup.id);
     if (!basic && oldGroup.childElementCount === 1) {
       document.getElementById("routeGroup").selectedOptions[0].remove();
       document.getElementById("routeGroup").options.add(new Option(group, group, false, true));
@@ -175,18 +175,18 @@ function editRoute(onClick) {
     }
 
     const newGroup = elSelected.node().parentNode.cloneNode(false);
-    document.getElementById('routes').appendChild(newGroup);
+    document.getElementById("routes").appendChild(newGroup);
     newGroup.id = group;
-    document.getElementById('routeGroup').options.add(new Option(group, group, false, true));
+    document.getElementById("routeGroup").options.add(new Option(group, group, false, true));
     document.getElementById(group).appendChild(elSelected.node());
 
     toggleNewGroupInput();
-    document.getElementById('routeGroupName').value = '';
+    document.getElementById("routeGroupName").value = "";
   }
 
   function removeRouteGroup() {
     const group = elSelected.node().parentNode.id;
-    const basic = ['roads', 'trails', 'searoutes'].includes(group);
+    const basic = ["roads", "trails", "searoutes"].includes(group);
     const count = elSelected.node().parentNode.childElementCount;
     alertMessage.innerHTML = /* html */ `Are you sure you want to remove ${
       basic ? "all elements in the group" : "the entire route group"
@@ -216,12 +216,12 @@ function editRoute(onClick) {
 
   function editGroupStyle() {
     const g = elSelected.node().parentNode.id;
-    editStyle('routes', g);
+    editStyle("routes", g);
   }
 
   function toggleRouteSplitMode() {
-    document.getElementById('routeNew').classList.remove('pressed');
-    this.classList.toggle('pressed');
+    document.getElementById("routeNew").classList.remove("pressed");
+    this.classList.toggle("pressed");
   }
 
   function clickControlPoint() {
@@ -252,54 +252,34 @@ function editRoute(onClick) {
         this.remove();
       });
 
-  function splitRoute(clicked) {
-    lineGen.curve(d3.curveCatmullRom.alpha(0.1));
-    const group = d3.select(elSelected.node().parentNode);
-    routeSplit.classList.remove('pressed');
-
-    const points1 = [],
-      points2 = [];
-    let points = points1;
-    debug
-      .select('#controlPoints')
-      .selectAll('circle')
-      .each(function () {
-        points.push([this.getAttribute('cx'), this.getAttribute('cy')]);
-        if (this === clicked) {
-          points = points2;
-          points.push([this.getAttribute('cx'), this.getAttribute('cy')]);
-        }
-        this.remove();
-      });
-
-    elSelected.attr('d', round(lineGen(points1)));
-    const id = getNextId('route');
-    group.append('path').attr('id', id).attr('d', lineGen(points2));
-    debug.select('#controlPoints').selectAll('circle').remove();
+    elSelected.attr("d", round(lineGen(points1)));
+    const id = getNextId("route");
+    group.append("path").attr("id", id).attr("d", lineGen(points2));
+    debug.select("#controlPoints").selectAll("circle").remove();
     drawControlPoints(elSelected.node());
   }
 
   function toggleRouteCreationMode() {
-    document.getElementById('routeSplit').classList.remove('pressed');
-    document.getElementById('routeNew').classList.toggle('pressed');
-    if (document.getElementById('routeNew').classList.contains('pressed')) {
-      tip('Click on map to add control points', true);
-      viewbox.on('click', addPointOnClick).style('cursor', 'crosshair');
-      elSelected.on('click', null);
+    document.getElementById("routeSplit").classList.remove("pressed");
+    document.getElementById("routeNew").classList.toggle("pressed");
+    if (document.getElementById("routeNew").classList.contains("pressed")) {
+      tip("Click on map to add control points", true);
+      viewbox.on("click", addPointOnClick).style("cursor", "crosshair");
+      elSelected.on("click", null);
     } else {
       clearMainTip();
-      viewbox.on('click', clicked).style('cursor', 'default');
-      elSelected.on('click', addInterimControlPoint).attr('data-new', null);
+      viewbox.on("click", clicked).style("cursor", "default");
+      elSelected.on("click", addInterimControlPoint).attr("data-new", null);
     }
   }
 
   function addPointOnClick() {
     // create new route
-    if (!elSelected.attr('data-new')) {
-      debug.select('#controlPoints').selectAll('circle').remove();
+    if (!elSelected.attr("data-new")) {
+      debug.select("#controlPoints").selectAll("circle").remove();
       const parent = elSelected.node().parentNode;
-      const id = getNextId('route');
-      elSelected = d3.select(parent).append('path').attr('id', id).attr('data-new', 1);
+      const id = getNextId("route");
+      elSelected = d3.select(parent).append("path").attr("id", id).attr("data-new", 1);
     }
 
     addControlPoint(d3.mouse(this));
@@ -307,7 +287,7 @@ function editRoute(onClick) {
   }
 
   function editRouteLegend() {
-    const id = elSelected.attr('id');
+    const id = elSelected.attr("id");
     editNotes(id, id);
   }
 
@@ -330,12 +310,11 @@ function editRoute(onClick) {
   }
 
   function closeRoutesEditor() {
-    elSelected.attr('data-new', null).on('click', null);
+    elSelected.attr("data-new", null).on("click", null);
     clearMainTip();
-    routeSplit.classList.remove('pressed');
-    routeNew.classList.remove('pressed');
-    debug.select('#controlPoints').remove();
+    routeSplit.classList.remove("pressed");
+    routeNew.classList.remove("pressed");
+    debug.select("#controlPoints").remove();
     unselect();
   }
 }
-}
\ No newline at end of file
diff --git a/modules/ui/style.js b/modules/ui/style.js
index 5b8d2c1e..9e5744d7 100644
--- a/modules/ui/style.js
+++ b/modules/ui/style.js
@@ -1,16 +1,16 @@
 // UI module to control the style
-'use strict';
+"use strict";
 
 // add available filters to lists
 {
   const filters = Array.from(document.getElementById("filters").querySelectorAll("filter"));
   const emptyOption = '<option value="" selected>None</option>';
-  const options = filters.map((filter) => {
-    const id = filter.getAttribute('id');
-    const name = filter.getAttribute('name');
+  const options = filters.map(filter => {
+    const id = filter.getAttribute("id");
+    const name = filter.getAttribute("name");
     return `<option value="url(#${id})">${name}</option>`;
   });
-  const allOptions = emptyOption + options.join('');
+  const allOptions = emptyOption + options.join("");
 
   document.getElementById("styleFilterInput").innerHTML = allOptions;
   document.getElementById("styleStatesBodyFilter").innerHTML = allOptions;
@@ -29,49 +29,49 @@ function editStyle(element, group) {
   if (group) styleGroupSelect.options.add(new Option(group, group, true, true));
   selectStyleElement();
 
-  styleElementSelect.classList.add('glow');
-  if (group) styleGroupSelect.classList.add('glow');
+  styleElementSelect.classList.add("glow");
+  if (group) styleGroupSelect.classList.add("glow");
   setTimeout(() => {
-    styleElementSelect.classList.remove('glow');
-    if (group) styleGroupSelect.classList.remove('glow');
+    styleElementSelect.classList.remove("glow");
+    if (group) styleGroupSelect.classList.remove("glow");
   }, 1500);
 }
 
 // Toggle style sections on element select
-styleElementSelect.addEventListener('change', selectStyleElement);
+styleElementSelect.addEventListener("change", selectStyleElement);
 function selectStyleElement() {
   const sel = styleElementSelect.value;
   let el = d3.select("#" + sel);
 
-  styleElements.querySelectorAll('tbody').forEach((e) => (e.style.display = 'none')); // hide all sections
+  styleElements.querySelectorAll("tbody").forEach(e => (e.style.display = "none")); // hide all sections
 
   // show alert line if layer is not visible
-  const isLayerOff = sel !== 'ocean' && (el.style('display') === 'none' || !el.selectAll('*').size());
-  styleIsOff.style.display = isLayerOff ? 'block' : 'none';
+  const isLayerOff = sel !== "ocean" && (el.style("display") === "none" || !el.selectAll("*").size());
+  styleIsOff.style.display = isLayerOff ? "block" : "none";
 
   // active group element
   const group = styleGroupSelect.value;
-  if (['routes', 'labels', 'coastline', 'lakes', 'anchors', 'burgIcons', 'borders'].includes(sel)) {
-    const gEl = group && el.select('#' + group);
-    el = group && gEl.size() ? gEl : el.select('g');
+  if (["routes", "labels", "coastline", "lakes", "anchors", "burgIcons", "borders"].includes(sel)) {
+    const gEl = group && el.select("#" + group);
+    el = group && gEl.size() ? gEl : el.select("g");
   }
 
   // opacity
-  if (!['landmass', 'ocean', 'regions', 'legend'].includes(sel)) {
-    styleOpacity.style.display = 'block';
-    styleOpacityInput.value = styleOpacityOutput.value = el.attr('opacity') || 1;
+  if (!["landmass", "ocean", "regions", "legend"].includes(sel)) {
+    styleOpacity.style.display = "block";
+    styleOpacityInput.value = styleOpacityOutput.value = el.attr("opacity") || 1;
   }
 
   // filter
-  if (!['landmass', 'legend', 'regions'].includes(sel)) {
-    styleFilter.style.display = 'block';
-    styleFilterInput.value = el.attr('filter') || '';
+  if (!["landmass", "legend", "regions"].includes(sel)) {
+    styleFilter.style.display = "block";
+    styleFilterInput.value = el.attr("filter") || "";
   }
 
   // fill
-  if (['rivers', 'lakes', 'landmass', 'prec', 'ice', 'fogging'].includes(sel)) {
-    styleFill.style.display = 'block';
-    styleFillInput.value = styleFillOutput.value = el.attr('fill');
+  if (["rivers", "lakes", "landmass", "prec", "ice", "fogging"].includes(sel)) {
+    styleFill.style.display = "block";
+    styleFillInput.value = styleFillOutput.value = el.attr("fill");
   }
 
   // stroke color and width
@@ -87,74 +87,74 @@ function selectStyleElement() {
   }
 
   // stroke dash
-  if (['routes', 'borders', 'temperature', 'legend', 'population', 'coordinates', 'zones', 'gridOverlay'].includes(sel)) {
-    styleStrokeDash.style.display = 'block';
-    styleStrokeDasharrayInput.value = el.attr('stroke-dasharray') || '';
-    styleStrokeLinecapInput.value = el.attr('stroke-linecap') || 'inherit';
+  if (["routes", "borders", "temperature", "legend", "population", "coordinates", "zones", "gridOverlay"].includes(sel)) {
+    styleStrokeDash.style.display = "block";
+    styleStrokeDasharrayInput.value = el.attr("stroke-dasharray") || "";
+    styleStrokeLinecapInput.value = el.attr("stroke-linecap") || "inherit";
   }
 
   // clipping
-  if (['cells', 'gridOverlay', 'coordinates', 'compass', 'terrain', 'temperature', 'routes', 'texture', 'biomes', 'zones'].includes(sel)) {
-    styleClipping.style.display = 'block';
-    styleClippingInput.value = el.attr('mask') || '';
+  if (["cells", "gridOverlay", "coordinates", "compass", "terrain", "temperature", "routes", "texture", "biomes", "zones"].includes(sel)) {
+    styleClipping.style.display = "block";
+    styleClippingInput.value = el.attr("mask") || "";
   }
 
   // show specific sections
-  if (sel === 'texture') styleTexture.style.display = 'block';
+  if (sel === "texture") styleTexture.style.display = "block";
 
-  if (sel === 'terrs') {
-    styleHeightmap.style.display = 'block';
-    styleHeightmapScheme.value = terrs.attr('scheme');
-    styleHeightmapTerracingInput.value = styleHeightmapTerracingOutput.value = terrs.attr('terracing');
-    styleHeightmapSkipInput.value = styleHeightmapSkipOutput.value = terrs.attr('skip');
-    styleHeightmapSimplificationInput.value = styleHeightmapSimplificationOutput.value = terrs.attr('relax');
-    styleHeightmapCurve.value = terrs.attr('curve');
+  if (sel === "terrs") {
+    styleHeightmap.style.display = "block";
+    styleHeightmapScheme.value = terrs.attr("scheme");
+    styleHeightmapTerracingInput.value = styleHeightmapTerracingOutput.value = terrs.attr("terracing");
+    styleHeightmapSkipInput.value = styleHeightmapSkipOutput.value = terrs.attr("skip");
+    styleHeightmapSimplificationInput.value = styleHeightmapSimplificationOutput.value = terrs.attr("relax");
+    styleHeightmapCurve.value = terrs.attr("curve");
   }
 
-  if (sel === 'markers') {
-    styleMarkers.style.display = 'block';
-    styleRescaleMarkers.checked = +markers.attr('rescale');
+  if (sel === "markers") {
+    styleMarkers.style.display = "block";
+    styleRescaleMarkers.checked = +markers.attr("rescale");
   }
 
-  if (sel === 'gridOverlay') {
-    styleGrid.style.display = 'block';
-    styleGridType.value = el.attr('type');
-    styleGridScale.value = el.attr('scale') || 1;
-    styleGridShiftX.value = el.attr('dx') || 0;
-    styleGridShiftY.value = el.attr('dy') || 0;
+  if (sel === "gridOverlay") {
+    styleGrid.style.display = "block";
+    styleGridType.value = el.attr("type");
+    styleGridScale.value = el.attr("scale") || 1;
+    styleGridShiftX.value = el.attr("dx") || 0;
+    styleGridShiftY.value = el.attr("dy") || 0;
     calculateFriendlyGridSize();
   }
 
-  if (sel === 'compass') {
-    styleCompass.style.display = 'block';
-    const tr = parseTransform(compass.select('use').attr('transform'));
+  if (sel === "compass") {
+    styleCompass.style.display = "block";
+    const tr = parseTransform(compass.select("use").attr("transform"));
     styleCompassShiftX.value = tr[0];
     styleCompassShiftY.value = tr[1];
     styleCompassSizeInput.value = styleCompassSizeOutput.value = tr[2];
   }
 
-  if (sel === 'terrain') {
-    styleRelief.style.display = 'block';
-    styleReliefSizeOutput.innerHTML = styleReliefSizeInput.value = terrain.attr('size');
-    styleReliefDensityOutput.innerHTML = styleReliefDensityInput.value = terrain.attr('density');
-    styleReliefSet.value = terrain.attr('set');
+  if (sel === "terrain") {
+    styleRelief.style.display = "block";
+    styleReliefSizeOutput.innerHTML = styleReliefSizeInput.value = terrain.attr("size");
+    styleReliefDensityOutput.innerHTML = styleReliefDensityInput.value = terrain.attr("density");
+    styleReliefSet.value = terrain.attr("set");
   }
 
-  if (sel === 'population') {
-    stylePopulation.style.display = 'block';
-    stylePopulationRuralStrokeInput.value = stylePopulationRuralStrokeOutput.value = population.select('#rural').attr('stroke');
-    stylePopulationUrbanStrokeInput.value = stylePopulationUrbanStrokeOutput.value = population.select('#urban').attr('stroke');
-    styleStrokeWidth.style.display = 'block';
-    styleStrokeWidthInput.value = styleStrokeWidthOutput.value = el.attr('stroke-width') || '';
+  if (sel === "population") {
+    stylePopulation.style.display = "block";
+    stylePopulationRuralStrokeInput.value = stylePopulationRuralStrokeOutput.value = population.select("#rural").attr("stroke");
+    stylePopulationUrbanStrokeInput.value = stylePopulationUrbanStrokeOutput.value = population.select("#urban").attr("stroke");
+    styleStrokeWidth.style.display = "block";
+    styleStrokeWidthInput.value = styleStrokeWidthOutput.value = el.attr("stroke-width") || "";
   }
 
-  if (sel === 'regions') {
-    styleStates.style.display = 'block';
-    styleStatesBodyOpacity.value = styleStatesBodyOpacityOutput.value = statesBody.attr('opacity') || 1;
-    styleStatesBodyFilter.value = statesBody.attr('filter') || '';
-    styleStatesHaloWidth.value = styleStatesHaloWidthOutput.value = statesHalo.attr('data-width') || 10;
-    styleStatesHaloOpacity.value = styleStatesHaloOpacityOutput.value = statesHalo.attr('opacity') || 1;
-    const blur = parseFloat(statesHalo.attr('filter')?.match(/blur\(([^)]+)\)/)?.[1]) || 0;
+  if (sel === "regions") {
+    styleStates.style.display = "block";
+    styleStatesBodyOpacity.value = styleStatesBodyOpacityOutput.value = statesBody.attr("opacity") || 1;
+    styleStatesBodyFilter.value = statesBody.attr("filter") || "";
+    styleStatesHaloWidth.value = styleStatesHaloWidthOutput.value = statesHalo.attr("data-width") || 10;
+    styleStatesHaloOpacity.value = styleStatesHaloOpacityOutput.value = statesHalo.attr("opacity") || 1;
+    const blur = parseFloat(statesHalo.attr("filter")?.match(/blur\(([^)]+)\)/)?.[1]) || 0;
     styleStatesHaloBlur.value = styleStatesHaloBlurOutput.value = blur;
   }
 
@@ -216,10 +216,10 @@ function selectStyleElement() {
     styleStrokeWidth.style.display = "block";
     styleSize.style.display = "block";
 
-    styleLegend.style.display = 'block';
-    styleLegendColItemsOutput.value = styleLegendColItems.value = el.attr('data-columns');
-    styleLegendBackOutput.value = styleLegendBack.value = el.select('#legendBox').attr('fill');
-    styleLegendOpacityOutput.value = styleLegendOpacity.value = el.select('#legendBox').attr('fill-opacity');
+    styleLegend.style.display = "block";
+    styleLegendColItemsOutput.value = styleLegendColItems.value = el.attr("data-columns");
+    styleLegendBackOutput.value = styleLegendBack.value = el.select("#legendBox").attr("fill");
+    styleLegendOpacityOutput.value = styleLegendOpacity.value = el.select("#legendBox").attr("fill-opacity");
 
     styleStrokeInput.value = styleStrokeOutput.value = el.attr("stroke") || "#111111";
     styleStrokeWidthInput.value = styleStrokeWidthOutput.value = el.attr("stroke-width") || 0.5;
@@ -246,28 +246,21 @@ function selectStyleElement() {
     styleTemperatureFontSizeInput.value = styleTemperatureFontSizeOutput.value = el.attr("font-size") || "8px";
   }
 
-  if (sel === 'coordinates') {
-    styleSize.style.display = 'block';
-    styleFontSize.value = el.attr('data-size');
+  if (sel === "coordinates") {
+    styleSize.style.display = "block";
+    styleFontSize.value = el.attr("data-size");
   }
 
-  if (sel === 'armies') {
-    styleArmies.style.display = 'block';
-    styleArmiesFillOpacity.value = styleArmiesFillOpacityOutput.value = el.attr('fill-opacity');
-    styleArmiesSize.value = styleArmiesSizeOutput.value = el.attr('box-size');
+  if (sel === "armies") {
+    styleArmies.style.display = "block";
+    styleArmiesFillOpacity.value = styleArmiesFillOpacityOutput.value = el.attr("fill-opacity");
+    styleArmiesSize.value = styleArmiesSizeOutput.value = el.attr("box-size");
   }
 
-  if (sel === 'emblems') {
-    styleEmblems.style.display = 'block';
-    styleStrokeWidth.style.display = 'block';
-    styleStrokeWidthInput.value = styleStrokeWidthOutput.value = el.attr('stroke-width') || 1;
-  }
-
-  if (sel === 'goods') {
-    styleStrokeWidth.style.display = 'block';
-    styleStrokeWidthInput.value = styleStrokeWidthOutput.value = el.attr('stroke-width') || '';
-    styleResources.style.display = 'block';
-    styleResourcesCircle.checked = +el.attr('data-circle');
+  if (sel === "emblems") {
+    styleEmblems.style.display = "block";
+    styleStrokeWidth.style.display = "block";
+    styleStrokeWidthInput.value = styleStrokeWidthOutput.value = el.attr("stroke-width") || 1;
   }
 
   if (sel === 'goods') {
@@ -279,18 +272,18 @@ function selectStyleElement() {
 
   // update group options
   styleGroupSelect.options.length = 0; // remove all options
-  if (['routes', 'labels', 'coastline', 'lakes', 'anchors', 'burgIcons', 'borders'].includes(sel)) {
-    const groups = document.getElementById(sel).querySelectorAll('g');
-    groups.forEach((el) => {
-      if (el.id === 'burgLabels') return;
+  if (["routes", "labels", "coastline", "lakes", "anchors", "burgIcons", "borders"].includes(sel)) {
+    const groups = document.getElementById(sel).querySelectorAll("g");
+    groups.forEach(el => {
+      if (el.id === "burgLabels") return;
       const option = new Option(`${el.id} (${el.childElementCount})`, el.id, false, false);
       styleGroupSelect.options.add(option);
     });
-    styleGroupSelect.value = el.attr('id');
-    styleGroup.style.display = 'block';
+    styleGroupSelect.value = el.attr("id");
+    styleGroup.style.display = "block";
   } else {
     styleGroupSelect.options.add(new Option(sel, sel, false, true));
-    styleGroup.style.display = 'none';
+    styleGroup.style.display = "none";
   }
 
   if (sel === "coastline" && styleGroupSelect.value === "sea_island") {
@@ -301,7 +294,7 @@ function selectStyleElement() {
 }
 
 // Handle style inputs change
-styleGroupSelect.addEventListener('change', selectStyleElement);
+styleGroupSelect.addEventListener("change", selectStyleElement);
 
 function getEl() {
   const el = styleElementSelect.value;
@@ -342,9 +335,9 @@ styleOpacityInput.addEventListener("input", function () {
   getEl().attr("opacity", this.value);
 });
 
-styleFilterInput.addEventListener('change', function () {
-  if (styleGroupSelect.value === 'ocean') return oceanLayers.attr('filter', this.value);
-  getEl().attr('filter', this.value);
+styleFilterInput.addEventListener("change", function () {
+  if (styleGroupSelect.value === "ocean") return oceanLayers.attr("filter", this.value);
+  getEl().attr("filter", this.value);
 });
 
 styleTextureInput.addEventListener("change", function () {
@@ -398,13 +391,13 @@ styleGridShiftY.addEventListener("input", function () {
   if (layerIsOn("toggleGrid")) drawGrid();
 });
 
-styleShiftX.addEventListener('input', shiftElement);
-styleShiftY.addEventListener('input', shiftElement);
+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})`);
+  getEl().attr("transform", `translate(${x},${y})`);
 }
 
 styleRescaleMarkers.addEventListener("change", function () {
@@ -466,21 +459,21 @@ styleHeightmapCurve.addEventListener("change", function () {
 styleReliefSet.addEventListener("change", function () {
   terrain.attr("set", this.value);
   ReliefIcons();
-  if (!layerIsOn('toggleRelief')) toggleRelief();
+  if (!layerIsOn("toggleRelief")) toggleRelief();
 });
 
-styleReliefSizeInput.addEventListener('change', function () {
-  terrain.attr('size', this.value);
+styleReliefSizeInput.addEventListener("change", function () {
+  terrain.attr("size", this.value);
   styleReliefSizeOutput.value = this.value;
   ReliefIcons();
-  if (!layerIsOn('toggleRelief')) toggleRelief();
+  if (!layerIsOn("toggleRelief")) toggleRelief();
 });
 
-styleReliefDensityInput.addEventListener('change', function () {
-  terrain.attr('density', this.value);
+styleReliefDensityInput.addEventListener("change", function () {
+  terrain.attr("density", this.value);
   styleReliefDensityOutput.value = this.value;
   ReliefIcons();
-  if (!layerIsOn('toggleRelief')) toggleRelief();
+  if (!layerIsOn("toggleRelief")) toggleRelief();
 });
 
 styleTemperatureFillOpacityInput.addEventListener("input", function () {
@@ -513,31 +506,31 @@ styleCompassSizeInput.addEventListener("input", function () {
   shiftCompass();
 });
 
-styleCompassShiftX.addEventListener('input', shiftCompass);
-styleCompassShiftY.addEventListener('input', shiftCompass);
+styleCompassShiftX.addEventListener("input", shiftCompass);
+styleCompassShiftY.addEventListener("input", shiftCompass);
 
 function shiftCompass() {
   const tr = `translate(${styleCompassShiftX.value} ${styleCompassShiftY.value}) scale(${styleCompassSizeInput.value})`;
-  compass.select('use').attr('transform', tr);
+  compass.select("use").attr("transform", tr);
 }
 
 styleLegendColItems.addEventListener("input", function () {
   styleLegendColItemsOutput.value = this.value;
-  legend.select('#legendBox').attr('data-columns', this.value);
+  legend.select("#legendBox").attr("data-columns", this.value);
   redrawLegend();
 });
 
 styleLegendBack.addEventListener("input", function () {
   styleLegendBackOutput.value = this.value;
-  legend.select('#legendBox').attr('fill', this.value);
+  legend.select("#legendBox").attr("fill", this.value);
 });
 
 styleLegendOpacity.addEventListener("input", function () {
   styleLegendOpacityOutput.value = this.value;
-  legend.select('#legendBox').attr('fill-opacity', this.value);
+  legend.select("#legendBox").attr("fill-opacity", this.value);
 });
 
-styleSelectFont.addEventListener('change', changeFont);
+styleSelectFont.addEventListener("change", changeFont);
 function changeFont() {
   const family = styleSelectFont.value;
   getEl().attr("font-family", family);
@@ -604,10 +597,10 @@ styleFontMinus.addEventListener("click", function () {
 function changeFontSize(el, size) {
   styleFontSize.value = size;
 
-  const getSizeOnScale = (element) => {
+  const getSizeOnScale = element => {
     // some labels are rescaled on zoom
-    if (element === 'labels') return Math.max(rn((size + size / scale) / 2, 2), 1);
-    if (element === 'coordinates') return rn(size / scale ** 0.8, 2);
+    if (element === "labels") return Math.max(rn((size + size / scale) / 2, 2), 1);
+    if (element === "coordinates") return rn(size / scale ** 0.8, 2);
 
     // other has the same size
     return size;
@@ -616,7 +609,7 @@ function changeFontSize(el, size) {
   const scaleSize = getSizeOnScale(styleElementSelect.value);
   el.attr("data-size", size).attr("font-size", scaleSize);
 
-  if (styleElementSelect.value === 'legend') redrawLegend();
+  if (styleElementSelect.value === "legend") redrawLegend();
 }
 
 styleRadiusInput.addEventListener("change", function () {
@@ -684,59 +677,53 @@ function changeIconSize(size, group) {
   styleIconSizeInput.value = size;
 }
 
-styleStatesBodyOpacity.addEventListener('input', function () {
+styleStatesBodyOpacity.addEventListener("input", function () {
   styleStatesBodyOpacityOutput.value = this.value;
-  statesBody.attr('opacity', this.value);
+  statesBody.attr("opacity", this.value);
 });
 
-styleStatesBodyFilter.addEventListener('change', function () {
-  statesBody.attr('filter', this.value);
+styleStatesBodyFilter.addEventListener("change", function () {
+  statesBody.attr("filter", this.value);
 });
 
-styleStatesHaloWidth.addEventListener('input', function () {
+styleStatesHaloWidth.addEventListener("input", function () {
   styleStatesHaloWidthOutput.value = this.value;
-  statesHalo.attr('data-width', this.value).attr('stroke-width', this.value);
+  statesHalo.attr("data-width", this.value).attr("stroke-width", this.value);
 });
 
 styleStatesHaloOpacity.addEventListener("input", function () {
   styleStatesHaloOpacityOutput.value = this.value;
-  statesHalo.attr('opacity', this.value);
+  statesHalo.attr("opacity", this.value);
 });
 
-styleStatesHaloBlur.addEventListener('input', function () {
+styleStatesHaloBlur.addEventListener("input", function () {
   styleStatesHaloBlurOutput.value = this.value;
   const blur = +this.value > 0 ? `blur(${this.value}px)` : null;
-  statesHalo.attr('filter', blur);
+  statesHalo.attr("filter", blur);
 });
 
-styleArmiesFillOpacity.addEventListener('input', function () {
-  armies.attr('fill-opacity', this.value);
+styleArmiesFillOpacity.addEventListener("input", function () {
+  armies.attr("fill-opacity", this.value);
   styleArmiesFillOpacityOutput.value = this.value;
 });
 
 styleArmiesSize.addEventListener("input", function () {
   armies.attr("box-size", this.value).attr("font-size", this.value * 2);
   styleArmiesSizeOutput.value = this.value;
-  armies.selectAll('g').remove(); // clear armies layer
-  pack.states.forEach((s) => {
+  armies.selectAll("g").remove(); // clear armies layer
+  pack.states.forEach(s => {
     if (!s.i || s.removed || !s.military.length) return;
     Military.drawRegiments(s.military, s.i);
   });
 });
 
-emblemsStateSizeInput.addEventListener('change', drawEmblems);
-emblemsProvinceSizeInput.addEventListener('change', drawEmblems);
-emblemsBurgSizeInput.addEventListener('change', drawEmblems);
+emblemsStateSizeInput.addEventListener("change", drawEmblems);
+emblemsProvinceSizeInput.addEventListener("change", drawEmblems);
+emblemsBurgSizeInput.addEventListener("change", drawEmblems);
 
-styleResourcesCircle.addEventListener('change', function () {
-  goods.attr('data-circle', +this.checked);
-  goods.selectAll('*').remove();
-  drawResources();
-});
-
-styleResourcesCircle.addEventListener('change', function () {
-  goods.attr('data-circle', +this.checked);
-  goods.selectAll('*').remove();
+styleResourcesCircle.addEventListener("change", function () {
+  goods.attr("data-circle", +this.checked);
+  goods.selectAll("*").remove();
   drawResources();
 });
 
@@ -761,9 +748,9 @@ function textureProvideURL() {
         opt.text = name.slice(0, 20);
         styleTextureInput.add(opt);
         styleTextureInput.value = textureURL.value;
-        getBase64(textureURL.value, (base64) => texture.select('image').attr('xlink:href', base64));
+        getBase64(textureURL.value, base64 => texture.select("image").attr("xlink:href", base64));
         zoom.scaleBy(svg, 1.00001); // enforce browser re-draw
-        $(this).dialog('close');
+        $(this).dialog("close");
       },
       Cancel: function () {
         $(this).dialog("close");
@@ -773,11 +760,11 @@ function textureProvideURL() {
 }
 
 function fetchTextureURL(url) {
-  INFO && console.log('Provided URL is', url);
+  INFO && console.log("Provided URL is", url);
   const img = new Image();
   img.onload = function () {
-    const canvas = document.getElementById('texturePreview');
-    const ctx = canvas.getContext('2d');
+    const canvas = document.getElementById("texturePreview");
+    const ctx = canvas.getContext("2d");
     ctx.clearRect(0, 0, canvas.width, canvas.height);
     ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
   };
@@ -818,22 +805,22 @@ function updateElements() {
   });
 
   // redraw elements
-  if (layerIsOn('toggleHeight')) drawHeightmap();
-  if (legend.selectAll('*').size() && window.redrawLegend) redrawLegend();
-  oceanLayers.selectAll('path').remove();
+  if (layerIsOn("toggleHeight")) drawHeightmap();
+  if (legend.selectAll("*").size() && window.redrawLegend) redrawLegend();
+  oceanLayers.selectAll("path").remove();
   OceanLayers();
   invokeActiveZooming();
 }
 
 // GLOBAL FILTERS
-mapFilters.addEventListener('click', applyMapFilter);
+mapFilters.addEventListener("click", applyMapFilter);
 function applyMapFilter(event) {
-  if (event.target.tagName !== 'BUTTON') return;
+  if (event.target.tagName !== "BUTTON") return;
   const button = event.target;
-  svg.attr('data-filter', null).attr('filter', null);
-  if (button.classList.contains('pressed')) return button.classList.remove('pressed');
+  svg.attr("data-filter", null).attr("filter", null);
+  if (button.classList.contains("pressed")) return button.classList.remove("pressed");
 
-  mapFilters.querySelectorAll('.pressed').forEach((button) => button.classList.remove('pressed'));
-  button.classList.add('pressed');
-  svg.attr('data-filter', button.id).attr('filter', 'url(#filter-' + button.id + ')');
+  mapFilters.querySelectorAll(".pressed").forEach(button => button.classList.remove("pressed"));
+  button.classList.add("pressed");
+  svg.attr("data-filter", button.id).attr("filter", "url(#filter-" + button.id + ")");
 }
diff --git a/modules/ui/tools.js b/modules/ui/tools.js
index 54caec75..d2f5a5e5 100644
--- a/modules/ui/tools.js
+++ b/modules/ui/tools.js
@@ -1,36 +1,36 @@
+"use strict";
 // module to control the Tools options (click to edit, to re-geenerate, tp add)
-'use strict';
 
 toolsContent.addEventListener("click", function (event) {
   if (customization) return tip("Please exit the customization mode first", false, "warning");
   if (!["BUTTON", "I"].includes(event.target.tagName)) return;
   const button = event.target.id;
 
-  // Click to open Editor buttons
-  if (button === 'editHeightmapButton') editHeightmap();
-  else if (button === 'editBiomesButton') editBiomes();
-  else if (button === 'editStatesButton') editStates();
-  else if (button === 'editProvincesButton') editProvinces();
-  else if (button === 'editDiplomacyButton') editDiplomacy();
-  else if (button === 'editCulturesButton') editCultures();
-  else if (button === 'editReligions') editReligions();
+  // click on open Editor buttons
+  if (button === "editHeightmapButton") editHeightmap();
+  else if (button === "editBiomesButton") editBiomes();
+  else if (button === "editStatesButton") editStates();
+  else if (button === "editProvincesButton") editProvinces();
+  else if (button === "editDiplomacyButton") editDiplomacy();
+  else if (button === "editCulturesButton") editCultures();
+  else if (button === "editReligions") editReligions();
   else if (button === 'editResources') editResources();
-  else if (button === 'editEmblemButton') openEmblemEditor();
-  else if (button === 'editNamesBaseButton') editNamesbase();
-  else if (button === 'editUnitsButton') editUnits();
-  else if (button === 'editNotesButton') editNotes();
-  else if (button === 'editZonesButton') editZones();
-  else if (button === 'overviewBurgsButton') overviewBurgs();
-  else if (button === 'overviewRiversButton') overviewRivers();
-  else if (button === 'overviewMilitaryButton') overviewMilitary();
-  else if (button === 'overviewCellsButton') viewCellDetails();
+  else if (button === "editEmblemButton") openEmblemEditor();
+  else if (button === "editNamesBaseButton") editNamesbase();
+  else if (button === "editUnitsButton") editUnits();
+  else if (button === "editNotesButton") editNotes();
+  else if (button === "editZonesButton") editZones();
+  else if (button === "overviewChartsButton") overviewCharts();
+  else if (button === "overviewBurgsButton") overviewBurgs();
+  else if (button === "overviewRiversButton") overviewRivers();
+  else if (button === "overviewMilitaryButton") overviewMilitary();
+  else if (button === "overviewMarkersButton") overviewMarkers();
+  else if (button === "overviewCellsButton") viewCellDetails();
 
-  // Click to Regenerate buttons
-  if (event.target.parentNode.id === 'regenerateFeature') {
-    if (sessionStorage.getItem('regenerateFeatureDontAsk')) {
-      processFeatureRegeneration(event, button);
-      return;
-    }
+  // click on Regenerate buttons
+  if (event.target.parentNode.id === "regenerateFeature") {
+    const dontAsk = sessionStorage.getItem("regenerateFeatureDontAsk");
+    if (dontAsk) return processFeatureRegeneration(event, button);
 
     alertMessage.innerHTML = /* html */ `Regeneration will remove all the custom changes for the element.<br /><br />Are you sure you want to proceed?`;
     $("#alert").dialog({
@@ -59,12 +59,18 @@ toolsContent.addEventListener("click", function (event) {
     });
   }
 
-  // Click to Add buttons
-  if (button === 'addLabel') toggleAddLabel();
-  else if (button === 'addBurgTool') toggleAddBurg();
-  else if (button === 'addRiver') toggleAddRiver();
-  else if (button === 'addRoute') toggleAddRoute();
-  else if (button === 'addMarker') toggleAddMarker();
+  // click on Configure regenerate buttons
+  if (button === "configRegenerateMarkers") configMarkersGeneration();
+
+  // click on Add buttons
+  if (button === "addLabel") toggleAddLabel();
+  else if (button === "addBurgTool") toggleAddBurg();
+  else if (button === "addRiver") toggleAddRiver();
+  else if (button === "addRoute") toggleAddRoute();
+  else if (button === "addMarker") toggleAddMarker();
+  // click to create a new map buttons
+  else if (button === "openSubmapMenu") UISubmap.openSubmapMenu();
+  else if (button === "openResampleMenu") UISubmap.openResampleMenu();
 });
 
 function processFeatureRegeneration(event, button) {
@@ -76,20 +82,20 @@ function processFeatureRegeneration(event, button) {
     if (!layerIsOn("toggleRelief")) toggleRelief();
   } else if (button === "regenerateRoutes") {
     Routes.regenerate();
-    if (!layerIsOn('toggleRoutes')) toggleRoutes();
-  } else if (button === 'regenerateRivers') regenerateRivers();
-  else if (button === 'regeneratePopulation') recalculatePopulation();
-  else if (button === 'regenerateStates') regenerateStates();
-  else if (button === 'regenerateProvinces') regenerateProvinces();
-  else if (button === 'regenerateBurgs') regenerateBurgs();
+    if (!layerIsOn("toggleRoutes")) toggleRoutes();
+  } else if (button === "regenerateRivers") regenerateRivers();
+  else if (button === "regeneratePopulation") recalculatePopulation();
+  else if (button === "regenerateStates") regenerateStates();
+  else if (button === "regenerateProvinces") regenerateProvinces();
+  else if (button === "regenerateBurgs") regenerateBurgs();
   else if (button === 'regenerateResources') regenerateResources();
-  else if (button === 'regenerateEmblems') regenerateEmblems();
-  else if (button === 'regenerateReligions') regenerateReligions();
-  else if (button === 'regenerateCultures') regenerateCultures();
-  else if (button === 'regenerateMilitary') regenerateMilitary();
-  else if (button === 'regenerateIce') regenerateIce();
-  else if (button === 'regenerateMarkers') regenerateMarkers(event);
-  else if (button === 'regenerateZones') regenerateZones(event);
+  else if (button === "regenerateEmblems") regenerateEmblems();
+  else if (button === "regenerateReligions") regenerateReligions();
+  else if (button === "regenerateCultures") regenerateCultures();
+  else if (button === "regenerateMilitary") regenerateMilitary();
+  else if (button === "regenerateIce") regenerateIce();
+  else if (button === "regenerateMarkers") regenerateMarkers();
+  else if (button === "regenerateZones") regenerateZones(event);
 }
 
 async function openEmblemEditor() {
@@ -430,23 +436,11 @@ function regenerateIce() {
   drawIce();
 }
 
-function regenerateMarkers(event) {
-  if (isCtrlClick(event)) prompt("Please provide markers number multiplier", {default: 1, step: 0.01, min: 0, max: 100}, v => addNumberOfMarkers(v));
-  else addNumberOfMarkers();
-
-  function addNumberOfMarkers(multiplier) {
-    pack.markers = pack.markers.filter(marker => {
-      if (marker.lock) return true;
-      document.getElementById(`marker${marker.i}`)?.remove();
-      const index = notes.findIndex(note => note.id === marker.id);
-      if (index != -1) notes.splice(index, 1);
-      return false;
-    });
-
-    Markers.regenerate(multiplier);
-    turnButtonOn("toggleMarkers");
-    drawMarkers();
-  }
+function regenerateMarkers() {
+  Markers.regenerate();
+  turnButtonOn("toggleMarkers");
+  drawMarkers();
+  if (document.getElementById("markersOverviewRefresh").offsetParent) markersOverviewRefresh.click();
 }
 
 function regenerateZones(event) {
diff --git a/modules/ui/units-editor.js b/modules/ui/units-editor.js
index e7ecb959..37645978 100644
--- a/modules/ui/units-editor.js
+++ b/modules/ui/units-editor.js
@@ -1,14 +1,14 @@
-'use strict';
+"use strict";
 function editUnits() {
-  closeDialogs('#unitsEditor, .stable');
-  $('#unitsEditor').dialog();
+  closeDialogs("#unitsEditor, .stable");
+  $("#unitsEditor").dialog();
 
   if (modules.editUnits) return;
   modules.editUnits = true;
 
-  $('#unitsEditor').dialog({
-    title: 'Units Editor',
-    position: {my: 'right top', at: 'right-10 top+10', of: 'svg', collision: 'fit'}
+  $("#unitsEditor").dialog({
+    title: "Units Editor",
+    position: {my: "right top", at: "right-10 top+10", of: "svg", collision: "fit"}
   });
 
   const drawBar = () => drawScaleBar(scale);
@@ -36,12 +36,12 @@ function editUnits() {
   document.getElementById("urbanDensityOutput").addEventListener("input", changeUrbanDensity);
   document.getElementById("urbanDensityInput").addEventListener("change", changeUrbanDensity);
 
-  document.getElementById('addLinearRuler').addEventListener('click', addRuler);
-  document.getElementById('addOpisometer').addEventListener('click', toggleOpisometerMode);
-  document.getElementById('addRouteOpisometer').addEventListener('click', toggleRouteOpisometerMode);
-  document.getElementById('addPlanimeter').addEventListener('click', togglePlanimeterMode);
-  document.getElementById('removeRulers').addEventListener('click', removeAllRulers);
-  document.getElementById('unitsRestore').addEventListener('click', restoreDefaultUnits);
+  document.getElementById("addLinearRuler").addEventListener("click", addRuler);
+  document.getElementById("addOpisometer").addEventListener("click", toggleOpisometerMode);
+  document.getElementById("addRouteOpisometer").addEventListener("click", toggleRouteOpisometerMode);
+  document.getElementById("addPlanimeter").addEventListener("click", togglePlanimeterMode);
+  document.getElementById("removeRulers").addEventListener("click", removeAllRulers);
+  document.getElementById("unitsRestore").addEventListener("click", restoreDefaultUnits);
 
   function changeDistanceUnit() {
     if (this.value === "custom_name") {
@@ -109,21 +109,21 @@ function editUnits() {
     unlock("distanceScale");
 
     // units
-    const US = navigator.language === 'en-US';
-    const UK = navigator.language === 'en-GB';
-    distanceUnitInput.value = US || UK ? 'mi' : 'km';
-    heightUnit.value = US || UK ? 'ft' : 'm';
-    temperatureScale.value = US ? '°F' : '°C';
-    areaUnit.value = 'square';
-    localStorage.removeItem('distanceUnit');
-    localStorage.removeItem('heightUnit');
-    localStorage.removeItem('temperatureScale');
-    localStorage.removeItem('areaUnit');
+    const US = navigator.language === "en-US";
+    const UK = navigator.language === "en-GB";
+    distanceUnitInput.value = US || UK ? "mi" : "km";
+    heightUnit.value = US || UK ? "ft" : "m";
+    temperatureScale.value = US ? "°F" : "°C";
+    areaUnit.value = "square";
+    localStorage.removeItem("distanceUnit");
+    localStorage.removeItem("heightUnit");
+    localStorage.removeItem("temperatureScale");
+    localStorage.removeItem("areaUnit");
     calculateFriendlyGridSize();
 
     // height exponent
     heightExponentInput.value = heightExponentOutput.value = 1.8;
-    localStorage.removeItem('heightExponent');
+    localStorage.removeItem("heightExponent");
     calculateTemperatures();
 
     // scale bar
@@ -163,10 +163,10 @@ function editUnits() {
   }
 
   function toggleOpisometerMode() {
-    if (this.classList.contains('pressed')) {
+    if (this.classList.contains("pressed")) {
       restoreDefaultEvents();
       clearMainTip();
-      this.classList.remove('pressed');
+      this.classList.remove("pressed");
     } else {
       if (!layerIsOn("toggleRulers")) toggleRulers();
       tip("Draw a curve to measure length. Hold Shift to disallow path optimization", true);
@@ -195,10 +195,10 @@ function editUnits() {
   }
 
   function toggleRouteOpisometerMode() {
-    if (this.classList.contains('pressed')) {
+    if (this.classList.contains("pressed")) {
       restoreDefaultEvents();
       clearMainTip();
-      this.classList.remove('pressed');
+      this.classList.remove("pressed");
     } else {
       if (!layerIsOn("toggleRulers")) toggleRulers();
       tip("Draw a curve along routes to measure length. Hold Shift to measure away from roads.", true);
@@ -244,10 +244,10 @@ function editUnits() {
   }
 
   function togglePlanimeterMode() {
-    if (this.classList.contains('pressed')) {
+    if (this.classList.contains("pressed")) {
       restoreDefaultEvents();
       clearMainTip();
-      this.classList.remove('pressed');
+      this.classList.remove("pressed");
     } else {
       if (!layerIsOn("toggleRulers")) toggleRulers();
       tip("Draw a curve to measure its area. Hold Shift to disallow path optimization", true);
diff --git a/modules/ui/zones-editor.js b/modules/ui/zones-editor.js
index 8476123e..759447dd 100644
--- a/modules/ui/zones-editor.js
+++ b/modules/ui/zones-editor.js
@@ -127,8 +127,6 @@ function editZones() {
     $("#zonesEditor").dialog({width: fitContent()});
   }
 
-  function filterZonesByType() {}
-
   function zoneHighlightOn(event) {
     const zone = event.target.dataset.id;
     zones.select("#" + zone).style("outline", "1px solid red");