From 84066bb234284e587d40820fac9590da66e8594a Mon Sep 17 00:00:00 2001
From: Kevin Dao <kevindao2006@gmail.com>
Date: Tue, 13 Aug 2019 18:51:03 -0500
Subject: [PATCH] Added auto-closing of popup windows when clicked outside of
 the element. Fixed positioning of settings bar

---
 css/popup.css |  7 +++----
 js/popup.js   | 15 ++++++++++++++-
 popup.html    |  2 +-
 3 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/css/popup.css b/css/popup.css
index ded50742..4adaf33a 100644
--- a/css/popup.css
+++ b/css/popup.css
@@ -85,10 +85,9 @@ i {
 }
 
 .settings {
-    position: absolute;
-    bottom: 0px;
-    right: 0px;
+    position: relative;
     display: flex;
+    float: right;
     vertical-align: middle;
     box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
     transition: 0.3s;
@@ -358,7 +357,7 @@ input[type=number]::-webkit-outer-spin-button {
 .simple-menu-option:hover {
     background-color: rgba(177, 175, 175, 0.200);
     transition-duration: 0.4s;
-    color: #FF9800;
+    /* color: #FF9800; */
 }
 
 .simple-menu-option:focus {
diff --git a/js/popup.js b/js/popup.js
index f2622c92..c793fca4 100644
--- a/js/popup.js
+++ b/js/popup.js
@@ -2,8 +2,8 @@ var courses;
 
 setCourseList();
 getSemesters();
-var can_remove = true;
 
+var can_remove = true;
 
 function setCourseList() {
 	$("#courseList").empty()
@@ -79,6 +79,19 @@ function formatShortenedCourseName(course) {
 	return `${department} ${number} (${course.unique})`;
 }
 
+$(document).click(function(event) {
+	$target = $(event.target);
+	console.log($target);
+	// If we're not clicking on search button or search popup, and popup is visible, hide it
+	if (!$target.closest('#search').length && !$target.closest('#search-popup').length && $('#search-popup').is(":visible")) {
+		hideSearchPopup();
+	}
+
+	// If we're not clicking on import/export button or imp/exp popup, and popup is visible, hide it
+	if (!$target.closest('#impexp').length && !$target.closest('#import-export-popup').length && $('#import-export-popup').is(":visible")) {
+		hideImportExportPopup();
+	}
+});
 
 $("#clear").click(function () {
 	chrome.storage.sync.set({
diff --git a/popup.html b/popup.html
index 3f24574c..8682d93f 100644
--- a/popup.html
+++ b/popup.html
@@ -19,7 +19,7 @@
 
   <div>
     <ul id="courseList" style="list-style-type: none;padding: 5px;"></ul>
-    <h2 id="empty" style="font-weight: normal;font-size: large;margin: 60px 30px 40px 30px ;text-align: center">
+    <h2 id="empty" style="font-weight: normal;font-size: large;margin: 60px 30px 180px 30px ;text-align: center">
       <div id="main" style="margin-bottom: 5px;">Doesn't Look Like
         Anything
         To Me.