v1.4.09

modules/ui/editors.js

@@ -527,11 +527,26 @@ function changePickerSpace() {
   openPicker.updateFill();
 }
 
-// remove all fogging
-function unfog() {
-  defs.select("#fog").selectAll("path").remove();
-  fogging.selectAll("path").remove();
-  fogging.style("display", "none");
+// add fogging
+function fog(id, path) {
+  if (defs.select("#fog #"+id).size()) return;
+  const fadeIn = d3.transition().duration(2000).ease(d3.easeSinInOut);
+  if (defs.select("#fog path").size()) {
+    defs.select("#fog").append("path").attr("d", path).attr("id", id).attr("opacity", 0).transition(fadeIn).attr("opacity", 1);
+  } else {
+    defs.select("#fog").append("path").attr("d", path).attr("id", id).attr("opacity", 1);
+    const opacity = fogging.attr("opacity");
+    fogging.style("display", "block").attr("opacity", 0).transition(fadeIn).attr("opacity", opacity);
+  }
+}
+
+// remove fogging
+function unfog(id) {
+  let el = defs.select("#fog #"+id);
+  if (!id || !el.size()) el = defs.select("#fog").selectAll("path");
+
+  el.remove();
+  if (!defs.selectAll("#fog path").size()) fogging.style("display", "none");
 }
 
 function getFileName(dataType) {

modules/ui/heightmap-editor.js

@@ -185,7 +185,6 @@ function editHeightmap() {
     }
 
     defineBiomes();
-
     rankCells();
     Cultures.generate();
     Cultures.expand();
@@ -354,6 +353,8 @@ function editHeightmap() {
       if (!b.i || b.removed) continue;
       b.cell = findBurgCell(b.x, b.y);
       b.feature = pack.cells.f[b.cell];
+      //if (b.port) b.port = pack.cells.f[pack.cells.haven[b.cell]]; // water body id
+
       pack.cells.burg[b.cell] = b.i;
       if (!b.capital && pack.cells.h[b.cell] < 20) removeBurg(b.i);
       if (b.capital) pack.states[b.state].center = b.cell;

modules/ui/layers.js

@@ -460,6 +460,7 @@ function toggleIce() {
   if (!layerIsOn("toggleIce")) {
     turnButtonOn("toggleIce");
     $('#ice').fadeIn();
+    if (!ice.selectAll("*").size()) drawIce();
     if (event && isCtrlClick(event)) editStyle("ice");
   } else {
     if (event && isCtrlClick(event)) {editStyle("ice"); return;}
@@ -473,7 +474,7 @@ function drawIce() {
   const used = new Uint8Array(cells.i.length);
   Math.seedrandom(seed);
 
-  const shieldMin = -6; // min temp to form ice shield (glacier)
+  const shieldMin = -6; // max temp to form ice shield (glacier)
   const icebergMax = 2; // max temp to form an iceberg
 
   for (const i of grid.cells.i) {

modules/ui/provinces-editor.js

@@ -42,7 +42,7 @@ function editProvinces() {
     if (cl.contains("icon-star-empty")) capitalZoomIn(p); else
     if (cl.contains("icon-flag-empty")) triggerIndependencePromps(p); else
     if (cl.contains("culturePopulation")) changePopulation(p); else
-    if (cl.contains("icon-pin")) focusOn(p, cl); else
+    if (cl.contains("icon-pin")) toggleFog(p, cl); else
     if (cl.contains("icon-trash-empty")) removeProvince(p);
   });
 
@@ -282,7 +282,7 @@ function editProvinces() {
     BurgsAndStates.drawStateLabels([newState, oldState]);
 
     // remove old province
-    unfocus(p);
+    unfog("focusProvince"+p);
     if (states[oldState].provinces.includes(p)) states[oldState].provinces.splice(states[oldState].provinces.indexOf(p), 1);
     provinces[p].removed = true;
 
@@ -347,24 +347,10 @@ function editProvinces() {
 
   }
 
-  function focusOn(p, cl) {
-    const inactive = cl.contains("inactive");
+  function toggleFog(p, cl) {
+    const path = provs.select("#province"+p).attr("d"), id = "focusProvince"+p;
+    cl.contains("inactive") ? fog(id, path) : unfog(id);
     cl.toggle("inactive");
-
-    if (inactive) {
-      if (defs.select("#fog #focusProvince"+p).size()) return;
-      fogging.style("display", "block");
-      const path = provs.select("#province"+p).attr("d");
-      defs.select("#fog").append("path").attr("d", path).attr("fill", "black").attr("id", "focusProvince"+p);
-      fogging.append("path").attr("d", path).attr("id", "focusProvinceHalo"+p)
-        .attr("fill", "none").attr("stroke", pack.provinces[p].color).attr("filter", "url(#blur5)");
-    } else unfocus(p);
-  }
-
-  function unfocus(p) {
-    defs.select("#focusProvince"+p).remove();
-    fogging.select("#focusProvinceHalo"+p).remove();
-    if (!defs.selectAll("#fog path").size()) fogging.style("display", "none"); // all items are de-focused
   }
 
   function removeProvince(p) {
@@ -377,7 +363,7 @@ function editProvinces() {
           const state = pack.provinces[p].state;
           if (pack.states[state].provinces.includes(p)) pack.states[state].provinces.splice(pack.states[state].provinces.indexOf(p), 1);
           pack.provinces[p].removed = true;
-          unfocus(p);
+          unfog("focusProvince"+p);
       
           const g = provs.select("#provincesBody");
           g.select("#province"+p).remove();
@@ -853,7 +839,7 @@ function editProvinces() {
           $(this).dialog("close");
           pack.provinces.filter(p => p.i).forEach(p => {
             p.removed = true;
-            unfocus(p.i);
+            unfog("focusProvince"+p.i);
           });
           pack.cells.i.forEach(i => pack.cells.province[i] = 0);
           pack.states.filter(s => s.i && !s.removed).forEach(s => s.provinces = []);

modules/ui/states-editor.js

@@ -45,7 +45,7 @@ function editStates() {
     if (cl.contains("icon-coa")) stateOpenCOA(ev, state); else
     if (cl.contains("icon-star-empty")) stateCapitalZoomIn(state); else
     if (cl.contains("culturePopulation")) changePopulation(state); else
-    if (cl.contains("icon-pin")) focusOnState(state, cl); else
+    if (cl.contains("icon-pin")) toggleFog(state, cl); else
     if (cl.contains("icon-trash-empty")) stateRemovePrompt(state);
   });
 
@@ -171,6 +171,8 @@ function editStates() {
 
   function stateHighlightOn(event) {
     if (!layerIsOn("toggleStates")) return;
+    if (defs.select("#fog path").size()) return;
+
     const state = +event.target.dataset.id;
     if (customization || !state) return;
     const d = regions.select("#state"+state).attr("d");
@@ -405,26 +407,11 @@ function editStates() {
     recalculateStates();
   }
 
-  function focusOnState(state, cl) {
+  function toggleFog(state, cl) {
     if (customization) return;
-
-    const inactive = cl.contains("inactive");
+    const path = statesBody.select("#state"+state).attr("d"), id = "focusState"+state;
+    cl.contains("inactive") ? fog(id, path) : unfog(id);
     cl.toggle("inactive");
-
-    if (inactive) {
-      if (defs.select("#fog #focusState"+state).size()) return;
-      fogging.style("display", "block");
-      const path = statesBody.select("#state"+state).attr("d");
-      defs.select("#fog").append("path").attr("d", path).attr("fill", "black").attr("id", "focusState"+state);
-      fogging.append("path").attr("d", path).attr("id", "focusStateHalo"+state)
-        .attr("fill", "none").attr("stroke", pack.states[state].color).attr("filter", "url(#blur5)");
-    } else unfocus(state);
-  }
-
-  function unfocus(s) {
-    defs.select("#focusState"+s).remove();
-    fogging.select("#focusStateHalo"+s).remove();
-    if (!defs.selectAll("#fog path").size()) fogging.style("display", "none"); // all items are de-focused
   }
 
   function stateRemovePrompt(state) {
@@ -446,7 +433,7 @@ function editStates() {
     statesBody.select("#state"+state).remove();
     statesBody.select("#state-gap"+state).remove();
     statesHalo.select("#state-border"+state).remove();
-    unfocus(state);
+    unfog("focusState"+state);
     const label = document.querySelector("#stateLabel"+state);
     if (label) label.remove();
     pack.burgs.forEach(b => {if(b.state === state) b.state = 0;});

modules/ui/zones-editor.js

@@ -30,7 +30,7 @@ function editZones() {
     if (cl.contains("culturePopulation")) {changePopulation(zone); return;}
     if (cl.contains("icon-trash-empty")) {zoneRemove(zone); return;}
     if (cl.contains("icon-eye")) {toggleVisibility(el); return;}
-    if (cl.contains("icon-pin")) {focusOnZone(zone, cl); return;}
+    if (cl.contains("icon-pin")) {toggleFog(zone, cl); return;}
     if (cl.contains("fillRect")) {changeFill(el); return;}
     if (customization) selectZone(el);
   });
@@ -194,7 +194,7 @@ function editZones() {
     zones.selectAll("g").each(function() {
       if (this.dataset.cells) return;
       // all zone cells are removed
-      unfocus(this.id);
+      unfog("focusZone"+this.id);
       this.style.display = "block";
     });
 
@@ -253,24 +253,13 @@ function editZones() {
     el.classList.toggle("inactive");
   }
 
-  function focusOnZone(zone, cl) {
-    const inactive = cl.contains("inactive");
+  function toggleFog(z, cl) {
+    const dataCells = zones.select("#"+z).attr("data-cells");
+    if (!dataCells) return;
+
+    const path = "M" + dataCells.split(",").map(c => getPackPolygon(+c)).join("M") + "Z", id = "focusZone"+z;
+    cl.contains("inactive") ? fog(id, path) : unfog(id);
     cl.toggle("inactive");
-
-    if (inactive) {
-      if (defs.select("#fog #focus"+zone).size()) return;
-      const dataCells = zones.select("#"+zone).attr("data-cells");
-      if (!dataCells) return;
-      const data = dataCells.split(",").map(c => +c);
-      const g = defs.select("#fog").append("g").attr("fill", "black").attr("stroke", "black").attr("id", "focus"+zone);
-      g.selectAll("path").data(data).enter().append("path").attr("d", d => "M" + getPackPolygon(d) + "Z");
-      fogging.style("display", "block");
-    } else unfocus(zone);
-  }
-
-  function unfocus(z) {
-    defs.select("#focus"+z).remove();
-    if (!defs.selectAll("#fog path").size()) fogging.style("display", "none"); // all states are de-focused
   }
 
   function toggleLegend() {
@@ -414,7 +403,7 @@ function editZones() {
 
   function zoneRemove(zone) {
     zones.select("#"+zone).remove();
-    unfocus(zone);
+    unfog("focusZone"+zone);
     zonesEditorAddLines();
   }