From c7cf0dcbec5765e8c70a75b1e3daaa2e7e607361 Mon Sep 17 00:00:00 2001
From: Gerome Matilla <gerome.matilla07@gmail.com>
Date: Sat, 6 Jun 2020 07:31:43 +0800
Subject: [PATCH] fix searchbox switching problems

---
 css/search-box.css      |  2 --
 js/animate-dashboard.js |  7 ++++++-
 js/show-search-box.js   | 14 +++++++++-----
 js/weather-screen.js    |  5 +++++
 js/web-menu.js          | 11 ++++++++---
 5 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/css/search-box.css b/css/search-box.css
index 48cd927..52cefed 100644
--- a/css/search-box.css
+++ b/css/search-box.css
@@ -1,6 +1,4 @@
 #searchBoxContainer {
-
-	background: #ff00ff;
 	
 	width: auto;
 	height: auto;
diff --git a/js/animate-dashboard.js b/js/animate-dashboard.js
index 8596e16..997a8a3 100644
--- a/js/animate-dashboard.js
+++ b/js/animate-dashboard.js
@@ -53,7 +53,12 @@ const toggleDashboard = () => {
     if (weatherScreen.classList.contains('showWeatherScreen')) {
         console.log('weather screen is open, closing...');
         hideWeatherScreen();
-        return
+        return;
+
+    } else if (searchBoxContainer.classList.contains('showSearchBox')) {
+        console.log('searchbox is open, closing...');
+        hideSearchBox();
+        
     } else if (webMenu.classList.contains('showWebMenu')) {
         console.log('web menu is open, closing...');
         hideWebMenu();
diff --git a/js/show-search-box.js b/js/show-search-box.js
index 0d0aa9c..a681a24 100644
--- a/js/show-search-box.js
+++ b/js/show-search-box.js
@@ -1,6 +1,5 @@
-var searchBoxContainer = document.getElementById('searchBoxContainer');
-
 var searchBox = document.getElementById('searchBox');
+var searchBoxContainer = document.getElementById('searchBoxContainer');
 var centeredBoxOverlay = document.getElementById('centeredBoxOverlay');
 
 let searchBoxVisility = false;
@@ -12,11 +11,19 @@ const showSearchBox = () => {
     searchBox.focus();
 
     searchBoxVisility = !searchBoxVisility;
+
+    // Toggle overlay
+    centeredBoxOverlay.classList.toggle('showOverlay');
 }
 
 const hideSearchBox = () => {
 	searchBoxContainer.classList.remove('showSearchBox');
 
+    // Toggle overlay
+    centeredBoxOverlay.classList.toggle('showOverlay');
+
+    searchBox.value = '';
+
     searchBoxVisility = !searchBoxVisility;
 }
 
@@ -38,8 +45,5 @@ const toggleSearchBox = () => {
     	showSearchBox();  	
     }
 
-    // Show overlay
-    centeredBoxOverlay.classList.toggle('showOverlay');
-
 	console.log('toggle searchbox');
 }
\ No newline at end of file
diff --git a/js/weather-screen.js b/js/weather-screen.js
index 95560bc..11613f7 100644
--- a/js/weather-screen.js
+++ b/js/weather-screen.js
@@ -262,6 +262,11 @@ const toggleWeatherScreen = () => {
     	console.log('web menu is open, closing...');
     	hideWebMenu();
     	return;
+
+    } else if (searchBoxContainer.classList.contains('showSearchBox')) {
+    	console.log('searchbox is open, closing...');
+    	hideSearchBox();
+    	
     } else if (dashboard.classList.contains('showRightDashboard')) {
     	console.log('dashboard is open, closing...');
     	hideDashboard();
diff --git a/js/web-menu.js b/js/web-menu.js
index b33c09a..cbe233c 100644
--- a/js/web-menu.js
+++ b/js/web-menu.js
@@ -224,14 +224,19 @@ const toggleWebMenu = () => {
     if (weatherScreen.classList.contains('showWeatherScreen')) {
     	console.log('weather screen is open, closing...');
     	hideWeatherScreen();
-    	return
+    	return;
+    	
+    } else if (searchBoxContainer.classList.contains('showSearchBox')) {
+    	console.log('searchbox is open, closing...');
+    	hideSearchBox();
+
     } else if (dashboard.classList.contains('showRightDashboard')) {
     	console.log('dashboard is open, closing...');
     	hideDashboard();
-    }
+    } 
 
     // Toggle center box
-    toggleCenteredBox();   
+    toggleCenteredBox();
 }
 
 // Remove class to focused item