From c9fd598c9cf7d9080489c95d62ec5be2c5c1fe40 Mon Sep 17 00:00:00 2001
From: Azgaar <maxganiev@yandex.ru>
Date: Sun, 29 May 2022 02:05:42 +0300
Subject: [PATCH] heightmapSelect - make default select element non-clickable

---
 index.html                             |  6 +++---
 modules/dynamic/heightmap-selection.js | 24 ++++++++++++++++--------
 modules/ui/options.js                  |  2 +-
 3 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/index.html b/index.html
index c3ef5ab1..a435d974 100644
--- a/index.html
+++ b/index.html
@@ -1318,13 +1318,13 @@
               </td>
             </tr>
 
-            <tr data-tip="Select heightmap generation template or precreated heightmap">
+            <tr data-tip="Select template or precreated heightmap to be used on generation">
               <td>
                 <i data-locked="0" id="lock_template" class="icon-lock-open"></i>
               </td>
               <td>Heightmap</td>
-              <td>
-                <select id="templateInput" data-stored="template" disabled style="opacity: 1; color: unset"></select>
+              <td id="templateInputContainer" class="pointer">
+                <select id="templateInput" data-stored="template" style="pointer-events: none"></select>
               </td>
               <td></td>
             </tr>
diff --git a/modules/dynamic/heightmap-selection.js b/modules/dynamic/heightmap-selection.js
index 15f62ce4..0942c12c 100644
--- a/modules/dynamic/heightmap-selection.js
+++ b/modules/dynamic/heightmap-selection.js
@@ -69,13 +69,18 @@ function appendStyleSheet() {
     .heightmap-selection_options {
       display: grid;
       grid-template-columns: 2fr 1fr;
-      justify-items: start;
     }
 
     .heightmap-selection_options > div:first-child {
       display: grid;
-      grid-template-columns: 1fr 1fr;
+      grid-template-columns: 1fr 1fr 1fr;
       align-items: center;
+      justify-self: start;
+      justify-items: start;
+    }
+
+    .heightmap-selection_options > div:last-child {
+      justify-self: end;
     }
 
     .heightmap-selection article {
@@ -127,23 +132,27 @@ function appendStyleSheet() {
 function insertEditorHtml() {
   const heightmapSelectionHtml = /* html */ `<div id="heightmapSelection" class="dialog stable">
     <div class="heightmap-selection">
-      <section>
+      <section data-tip="Select heightmap template – template provides unique, but similar-looking maps on generation">
         <header><h1>Heightmap templates</h1></header>
         <div class="heightmap-selection_container"></div>
       </section>
-      <section>
-        <header><h1>Pre-created heightmaps</h1></header>
+      <section data-tip="Select precreated heightmap – it will be the same for each map">
+        <header><h1>Precreated heightmaps</h1></header>
         <div class="heightmap-selection_container"></div>
       </section>
       <section>
         <header><h1>Options</h1></header>
         <div class="heightmap-selection_options">
           <div>
+            <label data-tip="Rerender all preview images" class="checkbox-label" id="heightmapSelectionRedrawPreview">
+              <i class="icon-cw"></i>
+              Redraw preview
+            </label>
             <div>
               <input id="heightmapSelectionRenderOcean" class="checkbox" type="checkbox" />
-              <label for="heightmapSelectionRenderOcean" class="checkbox-label">Render ocean heights</label>
+              <label data-tip="Draw heights of water cells" for="heightmapSelectionRenderOcean" class="checkbox-label">Render ocean heights</label>
             </div>
-            <div>
+            <div data-tip="Color scheme used for heightmap preview">
               Color scheme
               <select id="heightmapSelectionColorScheme">
                 <option value="bright" selected>Bright</option>
@@ -154,7 +163,6 @@ function insertEditorHtml() {
             </div>
           </div>
           <div>
-            <button data-tip="Rerender all preview images" id="heightmapSelectionRedrawPreview">Redraw preview</button>
             <button data-tip="Open Template Editor" data-tool="templateEditor" id="heightmapSelectionEditTemplates">Edit Templates</button>
             <button data-tip="Open Image Converter" data-tool="imageConverter" id="heightmapSelectionImportHeightmap">Import Heightmap</button>
           </div>
diff --git a/modules/ui/options.js b/modules/ui/options.js
index 888571c7..522c50ea 100644
--- a/modules/ui/options.js
+++ b/modules/ui/options.js
@@ -142,7 +142,7 @@ optionsContent.addEventListener("click", function (event) {
   else if (id === "optionsMapHistory") showSeedHistoryDialog();
   else if (id === "optionsCopySeed") copyMapURL();
   else if (id === "optionsEraRegenerate") regenerateEra();
-  else if (id === "templateInput") openTemplateSelectionDialog();
+  else if (id === "templateInputContainer") openTemplateSelectionDialog();
   else if (id === "zoomExtentDefault") restoreDefaultZoomExtent();
   else if (id === "translateExtent") toggleTranslateExtent(event.target);
   else if (id === "speakerTest") testSpeaker();