From af076ae3aa657a9e15c1aa681985d216cc88bbc6 Mon Sep 17 00:00:00 2001
From: Edward Betts <edward@4angle.com>
Date: Fri, 14 May 2021 11:08:50 +0200
Subject: [PATCH] Hide search box when showing item detail

---
 static/js/map.js   |  5 +++--
 templates/map.html | 32 +++++++++++++++++---------------
 2 files changed, 20 insertions(+), 17 deletions(-)

diff --git a/static/js/map.js b/static/js/map.js
index 5780a5a..2ade739 100644
--- a/static/js/map.js
+++ b/static/js/map.js
@@ -24,6 +24,7 @@ var detail_card = document.getElementById("detail-card");
 var detail = document.getElementById("detail");
 var detail_image = document.getElementById("detail-image");
 var detail_header = document.getElementById("detail-header");
+var search_and_isa = document.getElementById("search-and-isa");
 var detail_qid;
 var candidates = document.getElementById("candidates");
 var checkbox_list = document.getElementsByClassName("isa-checkbox");
@@ -366,7 +367,7 @@ function mouse_events(marker, qid) {
   });
   marker.on("click", function () {
     var wd_item = items[qid].wikidata;
-    isa_card.classList.add("d-none");
+    search_and_isa.classList.add("d-none");
     detail_card.classList.remove("d-none");
     detail_card.classList.add("bg-highlight");
     close_item_details();
@@ -583,7 +584,7 @@ document.getElementById("search-form").onsubmit = function (e) {
 };
 
 function close_detail() {
-  isa_card.classList.remove("d-none");
+  search_and_isa.classList.remove("d-none");
   detail_card.classList.add("d-none");
 
   close_item_details();
diff --git a/templates/map.html b/templates/map.html
index c742e88..749d4c7 100644
--- a/templates/map.html
+++ b/templates/map.html
@@ -23,24 +23,26 @@
     </button>
 
     <div id="sidebar">
-      <div class="card m-2" id="search-card">
-        <div class="card-body">
-          <form id="search-form">
-          <div>
-            <input id="search-text" placeholder="place">
-            <button type="submit" id="search-btn" class="btn btn-primary">search</button>
-          </div>
-          </form>
-          <div id="search-results">
+      <div id="search-and-isa">
+        <div class="card m-2" id="search-card">
+          <div class="card-body">
+            <form id="search-form">
+            <div>
+              <input id="search-text" placeholder="place">
+              <button type="submit" id="search-btn" class="btn btn-primary">search</button>
+            </div>
+            </form>
+            <div id="search-results">
+            </div>
           </div>
         </div>
-      </div>
 
-      <div class="card d-none m-2" id="isa-card">
-        <div class="card-body">
-          <div class="h5 card-title">item types</div>
-          <div><a href="#" id="show-all-isa">show all</a></div>
-          <div id="isa-list">
+        <div class="card d-none m-2" id="isa-card">
+          <div class="card-body">
+            <div class="h5 card-title">item types</div>
+            <div><a href="#" id="show-all-isa">show all</a></div>
+            <div id="isa-list">
+            </div>
           </div>
         </div>
       </div>