Merge branch 'sittaneumayer-popup'

3 files changed, 78 insertions, 112 deletions

diff --git a/src/pages/popup/popup.js b/src/pages/popup/popup.js
index 36965bd7..f6d0a4ba 100644
--- a/src/pages/popup/popup.js
+++ b/src/pages/popup/popup.js
@@ -4,130 +4,96 @@ window.browser = window.browser || window.chrome
 import servicesHelper from "../../assets/javascripts/services.js"
 import utils from "../../assets/javascripts/utils.js"
 
+document.getElementById("more-options").addEventListener("click", () => browser.runtime.openOptionsPage())
+
+const allSites = document.getElementById("all_sites")
+const currSite = document.getElementById("current_site")
+const currentSiteDivider = document.getElementById("current_site_divider")
+
+const config = await utils.getConfig()
+const divs = {}
+
+for (const service in config.services) {
+	divs[service] = {}
+
+	divs[service].all = allSites.getElementsByClassName(service)[0]
+	divs[service].current = currSite.getElementsByClassName(service)[0]
+
+	divs[service].all_toggle = allSites.getElementsByClassName(service + "-enabled")[0]
+	divs[service].current_toggle = currSite.getElementsByClassName(service + "-enabled")[0]
+
+	divs[service].all_toggle.addEventListener("change", async () => {
+		const options = await utils.getOptions()
+		options[service].enabled = divs[service].all_toggle.checked
+		browser.storage.local.set({ options })
+	})
+	divs[service].current_toggle.addEventListener("change", async () => {
+		const options = await utils.getOptions()
+		options[service].enabled = divs[service].current_toggle.checked
+		browser.storage.local.set({ options })
+	})
+}
+
 browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
+	let url;
+
+	// Set visibility of control buttons
 	if (tabs[0].url) {
-		const url = new URL(tabs[0].url)
+		url = new URL(tabs[0].url)
 		servicesHelper.switchInstance(url).then(r => {
-			if (!r) {
-				document.getElementById("change_instance_div").style.display = "none"
-			}
-			else {
-				document.getElementById("change_instance").addEventListener("click",
-					async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url) })
+			if (r) {
+				document.getElementById("change_instance_div").style.display = ""
+				document.getElementById("change_instance").addEventListener("click", async () =>
+					browser.tabs.update({ url: await servicesHelper.switchInstance(url) })
 				)
 			}
 		})
 		servicesHelper.copyRaw(url, true).then(r => {
-			if (!r) {
-				document.getElementById("copy_original_div").style.display = "none"
-			}
-			else {
-				document.getElementById("copy_original").addEventListener("click", () => servicesHelper.copyRaw(url))
+			if (r) {
+				document.getElementById("copy_original_div").style.display = ""
+				document.getElementById("copy_original").addEventListener("click", () =>
+					servicesHelper.copyRaw(url)
+				)
 			}
 		})
 		servicesHelper.reverse(url).then(r => {
-			if (!r) {
-				document.getElementById("redirect_to_original_div").style.display = "none"
-			} else {
-				document.getElementById("redirect_to_original").addEventListener("click", () => {
-					browser.runtime.sendMessage("reverseTab");
-					calcButtons()
-				})
+			if (r) {
+				document.getElementById("redirect_to_original_div").style.display = ""
+				document.getElementById("redirect_to_original").addEventListener("click", () =>
+					browser.runtime.sendMessage("reverseTab")
+				)
 			}
 		})
 		servicesHelper.redirectAsync(url, "main_frame", null, true).then(r => {
-			if (!r) {
-				document.getElementById("redirect_div").style.display = "none"
-			} else {
-				document.getElementById("redirect").addEventListener("click", () => {
-					browser.runtime.sendMessage("redirectTab");
-					calcButtons()
-				})
+			if (r) {
+				document.getElementById("redirect_div").style.display = ""
+				document.getElementById("redirect").addEventListener("click", () =>
+					browser.runtime.sendMessage("redirectTab")
+				)
 			}
 		})
-	} else {
-		document.getElementById("change_instance_div").style.display = "none"
-		document.getElementById("copy_original_div").style.display = "none"
-		document.getElementById("redirect_div").style.display = "none"
-		document.getElementById("redirect_to_original_div").style.display = "none"
 	}
-})
 
-document.getElementById("more-options").addEventListener("click", () => browser.runtime.openOptionsPage())
-
-const allSites = document.getElementsByClassName("all_sites")[0]
-const currSite = document.getElementsByClassName("current_site")[0]
-
-const config = await utils.getConfig()
+	const options = await utils.getOptions()
 
-let divs = {}
-for (const service in config.services) {
-	divs[service] = {}
-	divs[service].toggle = {}
-	divs[service].current = currSite.getElementsByClassName(service)[0]
-	divs[service].all = allSites.getElementsByClassName(service)[0]
-	divs[service].toggle.current = currSite.getElementsByClassName(service + "-enabled")[0]
-	divs[service].toggle.all = allSites.getElementsByClassName(service + "-enabled")[0]
-}
-
-const currentSiteIsFrontend = document.getElementById("current_site_divider")
-
-browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
-	let options = await utils.getOptions()
-	for (const service in config.services) {
-		if (!options.popupServices.includes(service))
-			allSites.getElementsByClassName(service)[0].classList.add("hide")
-		else
-			allSites.getElementsByClassName(service)[0].classList.remove("hide")
-		currSite.getElementsByClassName(service)[0].classList.add("hide")
+	// Set visibility of all service buttons
+	for (const service of options.popupServices) {
+		divs[service].all.classList.remove("hide")
+		divs[service].all_toggle.checked = options[service].enabled
 	}
 
-	for (const service in config.services) {
-		divs[service].toggle.all.checked = options[service].enabled
-		divs[service].toggle.current.checked = options[service].enabled
-	}
-
-	let url
-	try {
-		url = new URL(tabs[0].url)
-	} catch {
-		currentSiteIsFrontend.classList.add("hide")
-		return
-	}
-
-	let service = await servicesHelper.computeService(url, true)
-	let frontend
-	let instance
-	if (service) {
-		if (typeof service != "string") {
-			instance = service[2]
-			frontend = service[1]
-			service = service[0]
-			let isCustom = false
-			for (const network in config.networks)
-				if (options[frontend].indexOf(instance) > -1)
-					isCustom = true
+	// Set visibility of current page service button
+	if (url) {
+		const service = await servicesHelper.computeService(url)
+		if (service) {
+			divs[service].all.classList.add("hide")
+			divs[service].current.classList.remove("hide")
+			divs[service].current_toggle.checked = options[service].enabled
+			currentSiteDivider.style.display = ""
 		}
-		divs[service].current.classList.remove("hide")
-		divs[service].all.classList.add("hide")
-	} else {
-		currentSiteIsFrontend.classList.add("hide")
 	}
 })
 
-for (const service in config.services) {
-	divs[service].toggle.all.addEventListener("change", async () => {
-		let options = await utils.getOptions()
-		options[service].enabled = divs[service].toggle.all.checked
-		browser.storage.local.set({ options })
-	})
-	divs[service].toggle.current.addEventListener("change", async () => {
-		let options = await utils.getOptions()
-		options[service].enabled = divs[service].toggle.current.checked
-		browser.storage.local.set({ options })
-	})
-}
-
 for (const a of document.getElementsByTagName("a")) {
 	a.addEventListener("click", e => {
 		if (!a.classList.contains("prevent")) {
@@ -135,4 +101,4 @@ for (const a of document.getElementsByTagName("a")) {
 			e.preventDefault()
 		}
 	})
-}
\ No newline at end of file
+}
diff --git a/src/pages/popup/popup.pug b/src/pages/popup/popup.pug
index b5af5614..6af50870 100644
--- a/src/pages/popup/popup.pug
+++ b/src/pages/popup/popup.pug
@@ -6,35 +6,35 @@ html(lang="en")
         link(href="../stylesheets/styles.css" rel="stylesheet")
         link(href="./style.css" rel="stylesheet")
     body(dir="auto")
-        div(class="current_site")
-            include /src/pages/widgets/switches
-            div(id="current_site_divider")
+        div(id="current_site")
+            include /src/pages/popup/switches
+            div(id="current_site_divider" style="display: none")
                 hr
 
-        div(class="all_sites")
-            include /src/pages/widgets/switches
+        div(id="all_sites")
+            include /src/pages/popup/switches
 
         hr
 
-        div(class="some-block" id="change_instance_div")
+        div(class="some-block" id="change_instance_div" style="display: none")
             a(class="title button prevent" id="change_instance")
                 h4() Switch Instance
                 svg(xmlns="http://www.w3.org/2000/svg" height="26px" width="26px" fill="currentColor")
                     path(d="M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z")
 
-        div(class="some-block" id="copy_original_div" title="Copy the original redirected link")
+        div(class="some-block" id="copy_original_div" title="Copy the original redirected link" style="display: none")
             a(class="title button prevent" id="copy_original")
                 h4() Copy Original
                 svg(xmlns="http://www.w3.org/2000/svg" height="24px" width="24px" fill="currentColor")
                     path(d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z")
 
-        div(class="some-block" id="redirect_div")
+        div(class="some-block" id="redirect_div" style="display: none")
             a(class="title button prevent" id="redirect")
                 h4 Redirect
                 svg(xmlns="http://www.w3.org/2000/svg" height="24" width="24" fill="currentColor")
                     path(d="M7 20v-9q0-.825.588-1.413Q8.175 9 9 9h8.2l-1.6-1.6L17 6l4 4-4 4-1.4-1.4 1.6-1.6H9v9Z")
 
-        div(class="some-block" id="redirect_to_original_div")
+        div(class="some-block" id="redirect_to_original_div" style="display: none")
             a(class="title button prevent" id="redirect_to_original")
                 h4 Redirect To Original
                 svg(xmlns="http://www.w3.org/2000/svg" height="24px" width="24px" fill="currentColor")
diff --git a/src/pages/widgets/switches.pug b/src/pages/popup/switches.pug
index 580a25dc..bd53ce7e 100644
--- a/src/pages/widgets/switches.pug
+++ b/src/pages/popup/switches.pug
@@ -1,5 +1,5 @@
-each val, service in services    
-    div(class=service + " some-block")
+each _, service in services    
+    div(class=service + " some-block hide")
         a(class="title" href=services[service].url)
             if services[service].imageType == 'svgMono'
                 img(class='dark' src=`/assets/images/${service}-icon.svg`)