From b3e2aa00e705b91ce70cd8d2dd540fab0429cb16 Mon Sep 17 00:00:00 2001
From: Azgaar <maxganiev@yandex.com>
Date: Sun, 6 Aug 2023 22:59:33 +0400
Subject: [PATCH] Independent North and South Poles temperature (#972)

* Poles to have Different Temperature (Ref: Axial Tilt suggestion) (#964)

* Initial Idea

* Changed Names:
Currently still only on NorthTemperature reliant, compadible version

* Restored Generation of Temperature

* Temperature Function found

* Version Bump

* Scuffed Saving solution

* Current Version(without the save changes)

* Globe Temperature Display

* Individual Regeneration of Temperatures

* Fixed Loading and Saving
New Maps save a Dummy 0 at settings[17]

* Final Version Bump
(currently no description for the Update)

---------

Co-authored-by: Azgaar <maxganiev@yandex.com>

* chore: formatting

* refactor: temperature inputs

* feat: rework temperature generation alg

* style: respore winds button

* refactor: update options on load, don't update temperature UI

* refactor: no need to keep compatibility here

* fix: load temp setting from .map file

---------

Co-authored-by: Leo <leonard.krusch@gmx.de>
---
 index.html                       | 181 ++++++++++++++++++-------------
 main.js                          |  63 +++++++----
 modules/dynamic/export-json.js   |   2 -
 modules/io/load.js               |  15 +--
 modules/io/save.js               |   4 +-
 modules/ui/options.js            |  25 ++---
 modules/ui/world-configurator.js |  94 +++++++++++-----
 utils/unitUtils.js               |   3 +-
 versioning.js                    |   8 +-
 9 files changed, 240 insertions(+), 155 deletions(-)

diff --git a/index.html b/index.html
index 9e1cf078..e719c1bf 100644
--- a/index.html
+++ b/index.html
@@ -2346,29 +2346,58 @@
 
     <div id="dialogs">
       <div id="worldConfigurator" class="dialog stable" style="display: none">
-        <div>
+        <div style="display: flex">
           <div id="worldControls">
             <div>
               <i data-locked="0" id="lock_temperatureEquator" class="icon-lock-open"></i>
               <label data-tip="Set temperature at equator">
                 <i>Equator:</i>
-                <input
-                  id="temperatureEquatorInput"
-                  data-stored="temperatureEquator"
-                  type="number"
-                  min="-50"
-                  max="50"
-                />°C = <span id="temperatureEquatorF"></span>°F
+                <input id="temperatureEquatorInput" data-stored="temperatureEquator" type="number" min="-50" max="50" />
+                <span>°C = <span id="temperatureEquatorF"></span></span>
                 <input id="temperatureEquatorOutput" data-stored="temperatureEquator" type="range" min="-50" max="50" />
               </label>
             </div>
             <div>
-              <i data-locked="0" id="lock_temperaturePole" class="icon-lock-open"></i>
-              <label data-tip="Set temperature near poles">
-                <i>Poles:</i>
-                <input id="temperaturePoleInput" data-stored="temperaturePole" type="number" min="-50" max="50" />°C =
-                <span id="temperaturePoleF"></span>°F
-                <input id="temperaturePoleOutput" data-stored="temperaturePole" type="range" min="-50" max="50" />
+              <label data-tip="Set the North Pole average yearly temperature">
+                <i data-locked="0" id="lock_temperatureNorthPole" class="icon-lock-open"></i>
+                <i>North Pole:</i>
+                <input
+                  id="temperatureNorthPoleInput"
+                  data-stored="temperatureNorthPole"
+                  type="number"
+                  min="-50"
+                  max="50"
+                />
+                <span>°C = <span id="temperatureNorthPoleF"></span></span>
+                <input
+                  id="temperatureNorthPoleOutput"
+                  data-stored="temperatureNorthPole"
+                  type="range"
+                  min="-50"
+                  max="50"
+                />
+              </label>
+            </div>
+
+            <div>
+              <label data-tip="Set the South Pole average yearly temperature">
+                <i data-locked="0" id="lock_temperatureSouthPole" class="icon-lock-open"></i>
+                <i>South Pole:</i>
+                <input
+                  id="temperatureSouthPoleInput"
+                  data-stored="temperatureSouthPole"
+                  type="number"
+                  min="-50"
+                  max="50"
+                />
+                <span>°C = <span id="temperatureSouthPoleF"></span></span>
+                <input
+                  id="temperatureSouthPoleOutput"
+                  data-stored="temperatureSouthPole"
+                  type="range"
+                  min="-50"
+                  max="50"
+                />
               </label>
             </div>
             <div>
@@ -2424,59 +2453,65 @@
             <div data-tip="Map coordinates on globe"><i>Coords:</i> <span id="mapCoordinates"></span></div>
           </div>
 
-          <svg id="globe" width="22em" height="22em" viewBox="-20 -25 240 240">
-            <defs>
-              <linearGradient id="temperatureGradient" x1="0" x2="0" y1="0" y2="1">
-                <stop class="tempGradient90" offset="0%" stop-color="blue" />
-                <stop class="tempGradient60" offset="16.6%" stop-color="green" />
-                <stop class="tempGradient30" offset="33.3%" stop-color="yellow" />
-                <stop class="tempGradient0" offset="50%" stop-color="red" />
-                <stop class="tempGradient30" offset="66.6%" stop-color="yellow" />
-                <stop class="tempGradient60" offset="83.3%" stop-color="green" />
-                <stop class="tempGradient90" offset="100%" stop-color="blue" />
-              </linearGradient>
-            </defs>
-            <g id="globeNoteLines">
-              <line x1="5" x2="220" y1="0" y2="0" />
-              <line x1="5" x2="220" y1="13" y2="13" />
-              <line x1="5" x2="220" y1="49.5" y2="49.5" />
-              <line x1="-5" x2="220" y1="100" y2="100" />
-              <line x1="5" x2="220" y1="150.5" y2="150.5" />
-              <line x1="5" x2="220" y1="187" y2="187" />
-              <line x1="5" x2="220" y1="200" y2="200" />
-            </g>
-            <g id="globeWindArrows" data-tip="Click to change wind direction" stroke-linejoin="round">
-              <circle cx="210" cy="6" r="12" />
-              <path data-tier="0" d="M210,11 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(225 210 6)" />
-              <circle cx="210" cy="30" r="12" />
-              <path data-tier="1" d="M210,35 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(45 210 30)" />
-              <circle cx="210" cy="75" r="12" />
-              <path data-tier="2" d="M210,80 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(225 210 75)" />
-              <circle cx="210" cy="130" r="12" />
-              <path data-tier="3" d="M210,135 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(315 210 130)" />
-              <circle cx="210" cy="173" r="12" />
-              <path data-tier="4" d="M210,178 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(135 210 173)" />
-              <circle cx="210" cy="194" r="12" />
-              <path data-tier="5" d="M210,199 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(315 210 194)" />
-            </g>
-            <g id="globaAxisLabels">
-              <text x="82%" y="-4%">wind</text>
-              <text x="-8%" y="-4%">latitude</text>
-            </g>
-            <g id="globeLatLabels">
-              <text x="-15" y="5">90°</text>
-              <text x="-15" y="18">60°</text>
-              <text x="-15" y="53">30°</text>
-              <text x="-15" y="103">0°</text>
-              <text x="-15" y="153">30°</text>
-              <text x="-15" y="190">60°</text>
-              <text x="-15" y="204">90°</text>
-            </g>
-            <circle id="globeOutline" cx="100" cy="100" r="100" />
-            <line id="globeEquator" x1="1" x2="199" y1="100" y2="100" />
-            <path id="globeGraticule" />
-            <path id="globeArea" />
-          </svg>
+          <div style="display: flex; flex-direction: column; align-items: flex-end">
+            <svg id="globe" width="22em" viewBox="-20 -25 240 240">
+              <defs>
+                <linearGradient id="temperatureGradient" x1="0" x2="0" y1="0" y2="1">
+                  <stop id="grad90" offset="0%" stop-color="blue" />
+                  <stop id="grad60" offset="16.6%" stop-color="green" />
+                  <stop id="grad30" offset="33.3%" stop-color="yellow" />
+                  <stop id="grad0" offset="50%" stop-color="red" />
+                  <stop id="grad-30" offset="66.6%" stop-color="yellow" />
+                  <stop id="grad-60" offset="83.3%" stop-color="green" />
+                  <stop id="grad-90" offset="100%" stop-color="blue" />
+                </linearGradient>
+              </defs>
+              <g id="globeNoteLines">
+                <line x1="5" x2="220" y1="0" y2="0" />
+                <line x1="5" x2="220" y1="13" y2="13" />
+                <line x1="5" x2="220" y1="49.5" y2="49.5" />
+                <line x1="-5" x2="220" y1="100" y2="100" />
+                <line x1="5" x2="220" y1="150.5" y2="150.5" />
+                <line x1="5" x2="220" y1="187" y2="187" />
+                <line x1="5" x2="220" y1="200" y2="200" />
+              </g>
+              <g id="globeWindArrows" data-tip="Click to change wind direction" stroke-linejoin="round">
+                <circle cx="210" cy="6" r="12" />
+                <path data-tier="0" d="M210,11 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(225 210 6)" />
+                <circle cx="210" cy="30" r="12" />
+                <path data-tier="1" d="M210,35 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(45 210 30)" />
+                <circle cx="210" cy="75" r="12" />
+                <path data-tier="2" d="M210,80 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(225 210 75)" />
+                <circle cx="210" cy="130" r="12" />
+                <path data-tier="3" d="M210,135 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(315 210 130)" />
+                <circle cx="210" cy="173" r="12" />
+                <path data-tier="4" d="M210,178 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(135 210 173)" />
+                <circle cx="210" cy="194" r="12" />
+                <path data-tier="5" d="M210,199 v-10 l-3,3 m6,0 l-3,-3" transform="rotate(315 210 194)" />
+              </g>
+              <g id="globaAxisLabels">
+                <text x="82%" y="-4%">wind</text>
+                <text x="-8%" y="-4%">latitude</text>
+              </g>
+              <g id="globeLatLabels">
+                <text x="-15" y="5">90°</text>
+                <text x="-15" y="18">60°</text>
+                <text x="-15" y="53">30°</text>
+                <text x="-15" y="103">0°</text>
+                <text x="-15" y="153">30°</text>
+                <text x="-15" y="190">60°</text>
+                <text x="-15" y="204">90°</text>
+              </g>
+              <circle id="globeOutline" cx="100" cy="100" r="100" />
+              <line id="globeEquator" x1="1" x2="199" y1="100" y2="100" />
+              <path id="globeGraticule" />
+              <path id="globeArea" />
+            </svg>
+
+            <button id="restoreWinds" data-tip="Click to restore default (Earth-based) wind directions">
+              Restore winds
+            </button>
+          </div>
         </div>
       </div>
 
@@ -7924,14 +7959,14 @@
     <script src="modules/ui/stylePresets.js?v=1.89.11"></script>
 
     <script src="modules/ui/general.js?v=1.87.03"></script>
-    <script src="modules/ui/options.js?v=1.89.36"></script>
-    <script src="main.js?v=1.89.32"></script>
+    <script src="modules/ui/options.js?v=1.90.00"></script>
+    <script src="main.js?v=1.90.00"></script>
 
     <script defer src="modules/relief-icons.js"></script>
     <script defer src="modules/ui/style.js"></script>
     <script defer src="modules/ui/editors.js?v=1.89.35"></script>
-    <script defer src="modules/ui/tools.js?v=1.89.38"></script>
-    <script defer src="modules/ui/world-configurator.js"></script>
+    <script defer src="modules/ui/tools.js?v=1.90.00"></script>
+    <script defer src="modules/ui/world-configurator.js?v=1.90.00"></script>
     <script defer src="modules/ui/heightmap-editor.js?v=1.89.06"></script>
     <script defer src="modules/ui/provinces-editor.js?v=1.89.00"></script>
     <script defer src="modules/ui/biomes-editor.js"></script>
@@ -7967,8 +8002,8 @@
     <script defer src="libs/rgbquant.min.js"></script>
     <script defer src="libs/jquery.ui.touch-punch.min.js"></script>
 
-    <script defer src="modules/io/save.js?v=1.89.29"></script>
-    <script defer src="modules/io/load.js?v=1.89.30"></script>
+    <script defer src="modules/io/save.js?v=1.90.00"></script>
+    <script defer src="modules/io/load.js?v=1.90.00"></script>
     <script defer src="modules/io/cloud.js"></script>
     <script defer src="modules/io/export.js?v=1.89.36"></script>
     <script defer src="modules/io/formats.js"></script>
diff --git a/main.js b/main.js
index e6f95d45..c5dfdf4b 100644
--- a/main.js
+++ b/main.js
@@ -5,8 +5,8 @@
 // set debug options
 const PRODUCTION = location.hostname && location.hostname !== "localhost" && location.hostname !== "127.0.0.1";
 const DEBUG = localStorage.getItem("debug");
-const INFO = DEBUG || !PRODUCTION;
-const TIME = DEBUG || !PRODUCTION;
+const INFO = true;
+const TIME = true;
 const WARN = true;
 const ERROR = true;
 
@@ -179,13 +179,17 @@ function onZoom() {
 const onZoomDebouced = debounce(onZoom, 50);
 const zoom = d3.zoom().scaleExtent([1, 20]).on("zoom", onZoomDebouced);
 
-// default options
+// default options, based on Earth data
 let options = {
   pinNotes: false,
   showMFCGMap: true,
   winds: [225, 45, 225, 315, 135, 315],
+  temperatureEquator: 27,
+  temperatureNorthPole: -30,
+  temperatureSouthPole: -15,
   stateLabelsMode: "auto"
 };
+
 let mapCoordinates = {}; // map coordinates on globe
 let populationRate = +document.getElementById("populationRateInput").value;
 let distanceScale = +document.getElementById("distanceScaleInput").value;
@@ -467,7 +471,7 @@ function applyDefaultBiomesSystem() {
   const biomesMartix = [
     // hot ↔ cold [>19°C; <-4°C]; dry ↕ wet
     new Uint8Array([1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 10]),
-    new Uint8Array([3, 3, 3, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 9, 9, 9, 9, 10, 10, 10]),
+    new Uint8Array([1, 3, 3, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 9, 9, 9, 9, 10, 10, 10]),
     new Uint8Array([5, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 9, 9, 9, 9, 9, 10, 10, 10]),
     new Uint8Array([5, 6, 6, 6, 6, 6, 6, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 9, 9, 9, 9, 9, 9, 10, 10, 10]),
     new Uint8Array([7, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 9, 9, 9, 9, 9, 9, 9, 10, 10])
@@ -968,7 +972,7 @@ function defineMapSize() {
 
     const part = grid.features.some(f => f.land && f.border); // if land goes over map borders
     const max = part ? 80 : 100; // max size
-    const lat = () => gauss(P(0.5) ? 40 : 60, 15, 25, 75); // latitude shift
+    const lat = () => gauss(P(0.5) ? 40 : 60, 20, 25, 75); // latitude shift
 
     if (!part) {
       if (template === "Pangea") return [100, 50];
@@ -1003,30 +1007,49 @@ function calculateMapCoordinates() {
   mapCoordinates = {latT, latN, latS, lonT: lon * 2, lonW: -lon, lonE: lon};
 }
 
-// temperature model
+// temperature model, trying to follow real-world data
+// based on http://www-das.uwyo.edu/~geerts/cwx/notes/chap16/Image64.gif
 function calculateTemperatures() {
   TIME && console.time("calculateTemperatures");
   const cells = grid.cells;
   cells.temp = new Int8Array(cells.i.length); // temperature array
 
-  const tEq = +temperatureEquatorInput.value;
-  const tPole = +temperaturePoleInput.value;
-  const tDelta = tEq - tPole;
-  const int = d3.easePolyInOut.exponent(0.5); // interpolation function
+  const {temperatureEquator, temperatureNorthPole, temperatureSouthPole} = options;
+  const tropics = [16, -20]; // tropics zone
+  const tropicalGradient = 0.15;
 
-  d3.range(0, cells.i.length, grid.cellsX).forEach(function (r) {
-    const y = grid.points[r][1];
-    const lat = Math.abs(mapCoordinates.latN - (y / graphHeight) * mapCoordinates.latT); // [0; 90]
-    const initTemp = tEq - int(lat / 90) * tDelta;
-    for (let i = r; i < r + grid.cellsX; i++) {
-      cells.temp[i] = minmax(initTemp - convertToFriendly(cells.h[i]), -128, 127);
+  const tempNorthTropic = temperatureEquator - tropics[0] * tropicalGradient;
+  const northernGradient = (tempNorthTropic - temperatureNorthPole) / (90 - tropics[0]);
+
+  const tempSouthTropic = temperatureEquator + tropics[1] * tropicalGradient;
+  const southernGradient = (tempSouthTropic - temperatureSouthPole) / (90 + tropics[1]);
+
+  const exponent = +heightExponentInput.value;
+
+  for (let rowCellId = 0; rowCellId < cells.i.length; rowCellId += grid.cellsX) {
+    const [, y] = grid.points[rowCellId];
+    const rowLatitude = mapCoordinates.latN - (y / graphHeight) * mapCoordinates.latT; // [90; -90]
+    const tempSeaLevel = calculateSeaLevelTemp(rowLatitude);
+    DEBUG && console.info(`${rn(rowLatitude)}° sea temperature: ${rn(tempSeaLevel)}°C`);
+
+    for (let cellId = rowCellId; cellId < rowCellId + grid.cellsX; cellId++) {
+      const tempAltitudeDrop = getAltitudeTemperatureDrop(cells.h[cellId]);
+      cells.temp[cellId] = minmax(tempSeaLevel - tempAltitudeDrop, -128, 127);
     }
-  });
+  }
 
-  // temperature decreases by 6.5 degree C per 1km
-  function convertToFriendly(h) {
+  function calculateSeaLevelTemp(latitude) {
+    const isTropical = latitude <= 16 && latitude >= -20;
+    if (isTropical) return temperatureEquator - Math.abs(latitude) * tropicalGradient;
+
+    return latitude > 0
+      ? tempNorthTropic - (latitude - tropics[0]) * northernGradient
+      : tempSouthTropic + (latitude - tropics[1]) * southernGradient;
+  }
+
+  // temperature drops by 6.5°C per 1km of altitude
+  function getAltitudeTemperatureDrop(h) {
     if (h < 20) return 0;
-    const exponent = +heightExponentInput.value;
     const height = Math.pow(h - 18, exponent);
     return rn((height / 1000) * 6.5);
   }
diff --git a/modules/dynamic/export-json.js b/modules/dynamic/export-json.js
index d9e6d42e..8860cbd0 100644
--- a/modules/dynamic/export-json.js
+++ b/modules/dynamic/export-json.js
@@ -108,8 +108,6 @@ function getSettings() {
     urbanization: urbanization,
     mapSize: mapSizeOutput.value,
     latitudeO: latitudeOutput.value,
-    temperatureEquator: temperatureEquatorOutput.value,
-    temperaturePole: temperaturePoleOutput.value,
     prec: precOutput.value,
     options: options,
     mapName: mapName.value,
diff --git a/modules/io/load.js b/modules/io/load.js
index a3549279..13b2b6e7 100644
--- a/modules/io/load.js
+++ b/modules/io/load.js
@@ -218,10 +218,13 @@ async function parseLoadedData(data) {
       if (settings[13]) urbanization = urbanizationInput.value = urbanizationOutput.value = settings[13];
       if (settings[14]) mapSizeInput.value = mapSizeOutput.value = minmax(settings[14], 1, 100);
       if (settings[15]) latitudeInput.value = latitudeOutput.value = minmax(settings[15], 0, 100);
-      if (settings[16]) temperatureEquatorInput.value = temperatureEquatorOutput.value = settings[16];
-      if (settings[17]) temperaturePoleInput.value = temperaturePoleOutput.value = settings[17];
       if (settings[18]) precInput.value = precOutput.value = settings[18];
+
       if (settings[19]) options = JSON.parse(settings[19]);
+      // setting 16 and 17 (temperature) are part of options now
+      if (settings[16]) options.temperatureEquator = Number(settings[16]);
+      if (settings[17]) options.temperatureNorthPole = options.temperatureSouthPole = Number(settings[17]);
+
       if (settings[20]) mapName.value = settings[20];
       if (settings[21]) hideLabels.checked = +settings[21];
       if (settings[22]) stylePreset.value = settings[22];
@@ -231,6 +234,9 @@ async function parseLoadedData(data) {
 
     void (function applyOptionsToUI() {
       stateLabelsModeInput.value = options.stateLabelsMode;
+      yearInput.value = options.year;
+      eraInput.value = options.era;
+      shapeRendering.value = viewbox.attr("shape-rendering") || "geometricPrecision";
     })();
 
     void (function parseConfiguration() {
@@ -586,11 +592,6 @@ async function parseLoadedData(data) {
     if (rulers && layerIsOn("toggleRulers")) rulers.draw();
     if (layerIsOn("toggleGrid")) drawGrid();
 
-    // set options
-    yearInput.value = options.year;
-    eraInput.value = options.era;
-    shapeRendering.value = viewbox.attr("shape-rendering") || "geometricPrecision";
-
     if (window.restoreDefaultEvents) restoreDefaultEvents();
     focusOn(); // based on searchParams focus on point, cell or burg
     invokeActiveZooming();
diff --git a/modules/io/save.js b/modules/io/save.js
index bf78fd0e..f3e58147 100644
--- a/modules/io/save.js
+++ b/modules/io/save.js
@@ -24,8 +24,8 @@ function getMapData() {
     urbanization,
     mapSizeOutput.value,
     latitudeOutput.value,
-    temperatureEquatorOutput.value,
-    temperaturePoleOutput.value,
+    0, // previously used for temperatureEquatorOutput.value
+    0, // previously used for tempNorthOutput.value
     precOutput.value,
     JSON.stringify(options),
     mapName.value,
diff --git a/modules/ui/options.js b/modules/ui/options.js
index 37eb3f06..04d65494 100644
--- a/modules/ui/options.js
+++ b/modules/ui/options.js
@@ -559,11 +559,10 @@ function applyStoredOptions() {
     if (key.slice(0, 5) === "style") applyOption(stylePreset, key, key.slice(5));
   }
 
-  if (stored("winds"))
-    options.winds = localStorage
-      .getItem("winds")
-      .split(",")
-      .map(w => +w);
+  if (stored("winds")) options.winds = localStorage.getItem("winds").split(",").map(Number);
+  if (stored("temperatureEquator")) options.temperatureEquator = +localStorage.getItem("temperatureEquator");
+  if (stored("temperatureNorthPole")) options.temperatureNorthPole = +localStorage.getItem("temperatureNorthPole");
+  if (stored("temperatureSouthPole")) options.temperatureSouthPole = +localStorage.getItem("temperatureSouthPole");
   if (stored("military")) options.military = JSON.parse(stored("military"));
 
   if (stored("tooltipSize")) changeTooltipSize(stored("tooltipSize"));
@@ -607,13 +606,10 @@ function randomizeOptions() {
   if (randomize || !locked("culturesSet")) randomizeCultureSet();
 
   // 'Configure World' settings
+  if (randomize || !locked("temperatureEquator")) options.temperatureEquator = gauss(25, 7, 20, 35, 0);
+  if (randomize || !locked("temperatureNorthPole")) options.temperatureNorthPole = gauss(-25, 7, -40, 10, 0);
+  if (randomize || !locked("temperatureSouthPole")) options.temperatureSouthPole = gauss(-15, 7, -40, 10, 0);
   if (randomize || !locked("prec")) precInput.value = precOutput.value = gauss(100, 40, 5, 500);
-  const tMax = 30,
-    tMin = -30; // temperature extremes
-  if (randomize || !locked("temperatureEquator"))
-    temperatureEquatorOutput.value = temperatureEquatorInput.value = rand(tMax - 10, tMax);
-  if (randomize || !locked("temperaturePole"))
-    temperaturePoleOutput.value = temperaturePoleInput.value = rand(tMin, tMin + 30);
 
   // 'Units Editor' settings
   const US = navigator.language === "en-US";
@@ -1072,8 +1068,7 @@ function toggle3dOptions() {
   document.getElementById("options3dGlobeResolution").addEventListener("change", changeResolution);
   // document.getElementById("options3dMeshWireframeMode").addEventListener("change",toggleWireframe3d);
   document.getElementById("options3dSunColor").addEventListener("input", changeSunColor);
-  document.getElementById("options3dSubdivide").addEventListener("change",toggle3dSubdivision);
-
+  document.getElementById("options3dSubdivide").addEventListener("change", toggle3dSubdivision);
 
   function updateValues() {
     const globe = document.getElementById("canvas3d").dataset.type === "viewGlobe";
@@ -1113,7 +1108,7 @@ function toggle3dOptions() {
     ThreeD.setLightness(this.value / 100);
   }
 
-  function changeSunColor(){
+  function changeSunColor() {
     ThreeD.setSunColor(options3dSunColor.value);
   }
 
@@ -1134,7 +1129,7 @@ function toggle3dOptions() {
     ThreeD.toggleLabels();
   }
 
-  function toggle3dSubdivision(){
+  function toggle3dSubdivision() {
     ThreeD.toggle3dSubdivision();
   }
 
diff --git a/modules/ui/world-configurator.js b/modules/ui/world-configurator.js
index 73a3621e..ae222a59 100644
--- a/modules/ui/world-configurator.js
+++ b/modules/ui/world-configurator.js
@@ -1,5 +1,6 @@
 function editWorld() {
   if (customization) return;
+
   $("#worldConfigurator").dialog({
     title: "Configure World",
     resizable: false,
@@ -8,8 +9,7 @@ function editWorld() {
       "Whole World": () => applyWorldPreset(100, 50),
       Northern: () => applyWorldPreset(33, 25),
       Tropical: () => applyWorldPreset(33, 50),
-      Southern: () => applyWorldPreset(33, 75),
-      "Restore Winds": restoreDefaultWinds
+      Southern: () => applyWorldPreset(33, 75)
     },
     open: function () {
       const buttons = $(this).dialog("widget").find(".ui-dialog-buttonset > button");
@@ -17,7 +17,6 @@ function editWorld() {
       buttons[1].addEventListener("mousemove", () => tip("Click to set map size to cover the Northern latitudes"));
       buttons[2].addEventListener("mousemove", () => tip("Click to set map size to cover the Tropical latitudes"));
       buttons[3].addEventListener("mousemove", () => tip("Click to set map size to cover the Southern latitudes"));
-      buttons[4].addEventListener("mousemove", () => tip("Click to restore default wind directions"));
     },
     close: function () {
       $(this).dialog("destroy");
@@ -25,28 +24,56 @@ function editWorld() {
   });
 
   const globe = d3.select("#globe");
-  const clr = d3.scaleSequential(d3.interpolateSpectral);
-  const tMax = 30,
-    tMin = -25; // temperature extremes
   const projection = d3.geoOrthographic().translate([100, 100]).scale(100);
   const path = d3.geoPath(projection);
 
+  updateInputValues();
   updateGlobeTemperature();
   updateGlobePosition();
 
   if (modules.editWorld) return;
   modules.editWorld = true;
 
-  document.getElementById("worldControls").addEventListener("input", e => updateWorld(e.target));
+  byId("worldControls").addEventListener("input", e => updateWorld(e.target));
   globe.select("#globeWindArrows").on("click", changeWind);
   globe.select("#globeGraticule").attr("d", round(path(d3.geoGraticule()()))); // globe graticule
   updateWindDirections();
 
+  byId("restoreWinds").addEventListener("click", restoreDefaultWinds);
+
+  function updateInputValues() {
+    byId("temperatureEquatorInput").value = options.temperatureEquator;
+    byId("temperatureEquatorOutput").value = options.temperatureEquator;
+    byId("temperatureEquatorF").innerText = convertTemperature(options.temperatureEquator, "°F");
+
+    byId("temperatureNorthPoleInput").value = options.temperatureNorthPole;
+    byId("temperatureNorthPoleOutput").value = options.temperatureNorthPole;
+    byId("temperatureNorthPoleF").innerText = convertTemperature(options.temperatureNorthPole, "°F");
+
+    byId("temperatureSouthPoleInput").value = options.temperatureSouthPole;
+    byId("temperatureSouthPoleOutput").value = options.temperatureSouthPole;
+    byId("temperatureSouthPoleF").innerText = convertTemperature(options.temperatureSouthPole, "°F");
+  }
+
   function updateWorld(el) {
-    if (el) {
-      document.getElementById(el.dataset.stored + "Input").value = el.value;
-      document.getElementById(el.dataset.stored + "Output").value = el.value;
-      if (el.dataset.stored) lock(el.dataset.stored);
+    if (el?.dataset.stored) {
+      const stored = el.dataset.stored;
+      byId(stored + "Input").value = el.value;
+      byId(stored + "Output").value = el.value;
+      lock(el.dataset.stored);
+
+      if (stored === "temperatureEquator") {
+        options.temperatureEquator = Number(el.value);
+        byId("temperatureEquatorF").innerText = convertTemperature(options.temperatureEquator, "°F");
+      }
+      if (stored === "temperatureNorthPole") {
+        options.temperatureNorthPole = Number(el.value);
+        byId("temperatureNorthPoleF").innerText = convertTemperature(options.temperatureNorthPole, "°F");
+      }
+      if (stored === "temperatureSouthPole") {
+        options.temperatureSouthPole = Number(el.value);
+        byId("temperatureSouthPoleF").innerText = convertTemperature(options.temperatureSouthPole, "°F");
+      }
     }
 
     updateGlobeTemperature();
@@ -65,11 +92,11 @@ function editWorld() {
     if (layerIsOn("toggleBiomes")) drawBiomes();
     if (layerIsOn("toggleCoordinates")) drawCoordinates();
     if (layerIsOn("toggleRivers")) drawRivers();
-    if (document.getElementById("canvas3d")) setTimeout(ThreeD.update(), 500);
+    if (byId("canvas3d")) setTimeout(ThreeD.update(), 500);
   }
 
   function updateGlobePosition() {
-    const size = +document.getElementById("mapSizeOutput").value;
+    const size = +byId("mapSizeOutput").value;
     const eqD = ((graphHeight / 2) * 100) / size;
 
     calculateMapCoordinates();
@@ -77,12 +104,12 @@ function editWorld() {
     const scale = +distanceScaleInput.value;
     const unit = distanceUnitInput.value;
     const meridian = toKilometer(eqD * 2 * scale);
-    document.getElementById("mapSize").innerHTML = `${graphWidth}x${graphHeight}`;
-    document.getElementById("mapSizeFriendly").innerHTML = `${rn(graphWidth * scale)}x${rn(graphHeight * scale)} ${unit}`;
-    document.getElementById("meridianLength").innerHTML = rn(eqD * 2);
-    document.getElementById("meridianLengthFriendly").innerHTML = `${rn(eqD * 2 * scale)} ${unit}`;
-    document.getElementById("meridianLengthEarth").innerHTML = meridian ? " = " + rn(meridian / 200) + "%🌏" : "";
-    document.getElementById("mapCoordinates").innerHTML = `${lat(mc.latN)} ${Math.abs(rn(mc.lonW))}°W; ${lat(mc.latS)} ${rn(mc.lonE)}°E`;
+    byId("mapSize").innerHTML = `${graphWidth}x${graphHeight}`;
+    byId("mapSizeFriendly").innerHTML = `${rn(graphWidth * scale)}x${rn(graphHeight * scale)} ${unit}`;
+    byId("meridianLength").innerHTML = rn(eqD * 2);
+    byId("meridianLengthFriendly").innerHTML = `${rn(eqD * 2 * scale)} ${unit}`;
+    byId("meridianLengthEarth").innerHTML = meridian ? " = " + rn(meridian / 200) + "%🌏" : "";
+    byId("mapCoordinates").innerHTML = `${lat(mc.latN)} ${Math.abs(rn(mc.lonW))}°W; ${lat(mc.latS)} ${rn(mc.lonE)}°E`;
 
     function toKilometer(v) {
       if (unit === "km") return v;
@@ -104,15 +131,24 @@ function editWorld() {
     globe.select("#globeArea").attr("d", round(path(area.outline()))); // map area
   }
 
+  // update temperatures on globe (visual-only)
   function updateGlobeTemperature() {
-    const tEq = +document.getElementById("temperatureEquatorOutput").value;
-    document.getElementById("temperatureEquatorF").innerHTML = rn((tEq * 9) / 5 + 32);
-    const tPole = +document.getElementById("temperaturePoleOutput").value;
-    document.getElementById("temperaturePoleF").innerHTML = rn((tPole * 9) / 5 + 32);
-    globe.selectAll(".tempGradient90").attr("stop-color", clr(1 - (tPole - tMin) / (tMax - tMin)));
-    globe.selectAll(".tempGradient60").attr("stop-color", clr(1 - (tEq - ((tEq - tPole) * 2) / 3 - tMin) / (tMax - tMin)));
-    globe.selectAll(".tempGradient30").attr("stop-color", clr(1 - (tEq - ((tEq - tPole) * 1) / 3 - tMin) / (tMax - tMin)));
-    globe.select(".tempGradient0").attr("stop-color", clr(1 - (tEq - tMin) / (tMax - tMin)));
+    const tEq = options.temperatureEquator;
+    const tNP = options.temperatureNorthPole;
+    const tSP = options.temperatureSouthPole;
+
+    const scale = d3.scaleSequential(d3.interpolateSpectral);
+    const getColor = value => scale(1 - value);
+    const [tMin, tMax] = [-25, 30]; // temperature extremes
+    const tDelta = tMax - tMin;
+
+    globe.select("#grad90").attr("stop-color", getColor((tNP - tMin) / tDelta));
+    globe.select("#grad60").attr("stop-color", getColor((tEq - ((tEq - tNP) * 2) / 3 - tMin) / tDelta));
+    globe.select("#grad30").attr("stop-color", getColor((tEq - ((tEq - tNP) * 1) / 4 - tMin) / tDelta));
+    globe.select("#grad0").attr("stop-color", getColor((tEq - tMin) / tDelta));
+    globe.select("#grad-30").attr("stop-color", getColor((tEq - ((tEq - tSP) * 1) / 4 - tMin) / tDelta));
+    globe.select("#grad-60").attr("stop-color", getColor((tEq - ((tEq - tSP) * 2) / 3 - tMin) / tDelta));
+    globe.select("#grad-90").attr("stop-color", getColor((tSP - tMin) / tDelta));
   }
 
   function updateWindDirections() {
@@ -146,8 +182,8 @@ function editWorld() {
   }
 
   function applyWorldPreset(size, lat) {
-    document.getElementById("mapSizeInput").value = document.getElementById("mapSizeOutput").value = size;
-    document.getElementById("latitudeInput").value = document.getElementById("latitudeOutput").value = lat;
+    byId("mapSizeInput").value = byId("mapSizeOutput").value = size;
+    byId("latitudeInput").value = byId("latitudeOutput").value = lat;
     lock("mapSize");
     lock("latitude");
     updateWorld();
diff --git a/utils/unitUtils.js b/utils/unitUtils.js
index a9a933df..d940e349 100644
--- a/utils/unitUtils.js
+++ b/utils/unitUtils.js
@@ -13,8 +13,7 @@ const temperatureConversionMap = {
   "°Rø": temp => rn((temp * 21) / 40 + 7.5) + "°Rø"
 };
 
-function convertTemperature(temp) {
-  const scale = temperatureScale.value || "°C";
+function convertTemperature(temp, scale = temperatureScale.value || "°C") {
   return temperatureConversionMap[scale](temp);
 }
 
diff --git a/versioning.js b/versioning.js
index 7b4b88e1..77a1bcda 100644
--- a/versioning.js
+++ b/versioning.js
@@ -1,8 +1,7 @@
 "use strict";
 
 // version and caching control
-
-const version = "1.89.39"; // generator version, update each time
+const version = "1.90.00"; // generator version, update each time
 
 {
   document.title += " v" + version;
@@ -29,17 +28,16 @@ const version = "1.89.39"; // generator version, update each time
 
       <ul>
         <strong>Latest changes:</strong>
+        <li>North and South Poles temperature can be set independently</li>
         <li>More than 70 new heraldic charges</li>
         <li>Multi-color heraldic charges support</li>
-        <li>New 3D scene options</li>
+        <li>New 3D scene options and improvements</li>
         <li>Autosave feature (in Options)</li>
         <li>Google translation support (in Options)</li>
         <li>Religions can be edited and redrawn like cultures</li>
         <li>Lock states, provinces, cultures, and religions from regeneration</li>
         <li>Heightmap brushes: linear edit option</li>
         <li>Data Charts screen</li>
-        <li>Сultures and religions can have multiple parents in hierarchy tree</li>
-        <li>Heightmap selection screen</li>
       </ul>
 
       <p>Join our <a href="${discord}" target="_blank">Discord server</a> and <a href="${reddit}" target="_blank">Reddit community</a> to ask questions, share maps, discuss the Generator and Worlbuilding, report bugs and propose new features.</p>