leave min height to prevent keyboard page shift

yext · Sep 27, 2023 · 8c406e6 · 8c406e6
1 parent a5191f6
commit 8c406e6
Showing 1 changed file with 33 additions and 34 deletions.
diff --git a/static/js/theme-map/VerticalFullPageMapOrchestrator.js b/static/js/theme-map/VerticalFullPageMapOrchestrator.js
@@ -207,40 +207,39 @@ class VerticalFullPageMapOrchestrator extends ANSWERS.Component {
     this.addMapComponent();
   }
 
-  //NOTE: set min-height for js-answersMap instead to prevent keyboard from shifting the page
-  // /**
-  //  * On Android browsers, opening up the keyboard will shift the contents of the entire page up,
-  //  * moving the map center, and thereby causing a searchOnMapMove to be triggered.
-  //  * The search response would then cause the page to update,
-  //  * and close the keyboard, making it impossible to actually type anything into the searchbar.
-  //  * 
-  //  * Setting a fixed height on elements like .Answers-mapWrapper prevents the keyboard from shifting the content
-  //  * of the page.
-  //  */
-  //  setFixedHeightsOnAndroid() {
-  //   if (!this.isMobile() || !/Android/i.test(navigator.userAgent)) {
-  //     return;
-  //   }
-
-  //   setFixedHeight('.Answers-mapWrapper')
-
-  //   function getSingleElement(selector) {
-  //     const els = document.querySelectorAll(selector);
-  //     if (els.length === 0) {
-  //       console.error(`No ${selector} found, unable to set fixed height for the full page map.`);
-  //     } else if (els.length > 1) {
-  //       console.error(
-  //         `Multiple elements for ${selector} found, expected only 1, not setting fixed height for the full page map.`);
-  //     } else {
-  //       return els[0];
-  //     }
-  //   }
-
-  //   function setFixedHeight(selector) {
-  //     const el = getSingleElement(selector)
-  //     el.style.height = `${el.scrollHeight}px`
-  //   }
-  // }
+  /**
+   * On Android browsers, opening up the keyboard will shift the contents of the entire page up,
+   * moving the map center, and thereby causing a searchOnMapMove to be triggered.
+   * The search response would then cause the page to update,
+   * and close the keyboard, making it impossible to actually type anything into the searchbar.
+   * 
+   * Setting a fixed height on elements like .Answers-mapWrapper prevents the keyboard from shifting the content
+   * of the page.
+   */
+   setFixedHeightsOnAndroid() {
+    if (!this.isMobile() || !/Android/i.test(navigator.userAgent)) {
+      return;
+    }
+
+    setFixedHeight('.Answers-mapWrapper')
+
+    function getSingleElement(selector) {
+      const els = document.querySelectorAll(selector);
+      if (els.length === 0) {
+        console.error(`No ${selector} found, unable to set fixed height for the full page map.`);
+      } else if (els.length > 1) {
+        console.error(
+          `Multiple elements for ${selector} found, expected only 1, not setting fixed height for the full page map.`);
+      } else {
+        return els[0];
+      }
+    }
+
+    function setFixedHeight(selector) {
+      const el = getSingleElement(selector)
+      el.style.minHeight = `${el.scrollHeight}px`
+    }
+  }
 
   /**
    * Properly set CSS classes for mobile and desktop