aboutsummaryrefslogtreecommitdiffstats
path: root/src/pages/popup
diff options
context:
space:
mode:
authorManeraKai <manerakai@protonmail.com>2024-07-25 15:17:57 +0300
committerManeraKai <manerakai@protonmail.com>2024-07-25 15:17:57 +0300
commitc6de68c4c4bda3edcf6cf012bd98adea3baf866b (patch)
tree419e5cb8cdfe04fd734c5590e78888fa16e58e51 /src/pages/popup
parentMade Select Frontend searchable and with icons (diff)
downloadlibredirect-c6de68c4c4bda3edcf6cf012bd98adea3baf866b.zip
Migrating popup to svelte
Diffstat (limited to 'src/pages/popup')
-rw-r--r--src/pages/popup/index.html17
-rw-r--r--src/pages/popup/popup.js119
-rw-r--r--src/pages/popup/popup.pug53
-rw-r--r--src/pages/popup/style.css65
-rw-r--r--src/pages/popup/switches.pug14
5 files changed, 17 insertions, 251 deletions
diff --git a/src/pages/popup/index.html b/src/pages/popup/index.html
new file mode 100644
index 00000000..5c589bf7
--- /dev/null
+++ b/src/pages/popup/index.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset='utf-8'>
+ <meta name='viewport' content='width=device-width,initial-scale=1'>
+ <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg">
+ <title>Settings</title>
+ <link rel='stylesheet' href='build/bundle.css'>
+ <link rel='stylesheet' href='../stylesheets/styles.css'>
+ <script defer src='build/bundle.js'></script>
+</head>
+
+<body>
+</body>
+
+</html> \ No newline at end of file
diff --git a/src/pages/popup/popup.js b/src/pages/popup/popup.js
deleted file mode 100644
index 77a43000..00000000
--- a/src/pages/popup/popup.js
+++ /dev/null
@@ -1,119 +0,0 @@
-"use strict"
-window.browser = window.browser || window.chrome
-
-import servicesHelper from "../../assets/javascripts/services.js"
-import utils from "../../assets/javascripts/utils.js"
-
-document.getElementById("more-options").href = browser.runtime.getURL("pages/options/index.html")
-document.getElementById("more-options").setAttribute("target", "_blank")
-
-await browser.runtime.getPlatformInfo(r => {
- switch (r.os) {
- case "fuchsia":
- case "ios":
- case "android":
- document.getElementsByTagName("html")[0].classList.add("mobile")
- }
-})
-
-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].all_toggle.addEventListener("change", async () => {
- const options = await utils.getOptions()
- options[service].enabled = divs[service].all_toggle.checked
- browser.storage.local.set({ options })
- })
-
- allSites.getElementsByClassName(`${service}-change_instance`)[0].addEventListener("click", () => {
- browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
- if (tabs[0].url) {
- const url = new URL(tabs[0].url)
- browser.tabs.update({ url: await servicesHelper.switchInstance(url, service) })
- }
- })
- })
-
- divs[service].current_toggle = currSite.getElementsByClassName(`${service}-enabled`)[0]
- 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 })
- })
-
- currSite.getElementsByClassName(`${service}-change_instance`)[0].addEventListener("click", () => {
- browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
- if (tabs[0].url) {
- const url = new URL(tabs[0].url)
- browser.tabs.update({ url: await servicesHelper.switchInstance(url, service) })
- }
- })
- })
-}
-
-browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
- // Set visibility of control buttons
- if (tabs[0].url) {
- const hr = document.getElementById("hr")
- var url = new URL(tabs[0].url)
- servicesHelper.switchInstance(url).then(r => {
- if (r) {
- document.getElementById("change_instance_div").style.display = ""
- hr.style.display = ""
- document
- .getElementById("change_instance")
- .addEventListener("click", async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url) }))
- }
- })
- servicesHelper.reverse(url).then(r => {
- if (r) {
- hr.style.display = ""
-
- document.getElementById("copy_original_div").style.display = ""
- document.getElementById("copy_original").addEventListener("click", () => servicesHelper.copyRaw(url))
-
- 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 = ""
- hr.style.display = ""
- document.getElementById("redirect").addEventListener("click", () => browser.runtime.sendMessage("redirectTab"))
- }
- })
- }
-
- const options = await utils.getOptions()
-
- // 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
- }
-
- // 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 = ""
- }
- }
-})
diff --git a/src/pages/popup/popup.pug b/src/pages/popup/popup.pug
deleted file mode 100644
index ed4c7319..00000000
--- a/src/pages/popup/popup.pug
+++ /dev/null
@@ -1,53 +0,0 @@
-doctype html
-html(lang="en")
- head
- meta(charset="UTF-8")
- meta(name="viewport" content="width=device-width, initial-scale=1.0")
- link(href="../stylesheets/styles.css" rel="stylesheet")
- link(href="./style.css" rel="stylesheet")
- body(dir="auto")
- div(class="block" id="change_instance_div" style="display: none")
- button(class="title button bottom-button" id="change_instance")
- label(data-localise="__MSG_switchInstance__") Switch Instance
- svg(xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" preserveAspectRatio="xMinYMin meet" 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="block" id="copy_original_div" title="Copy the original redirected link" style="display: none")
- button(class="title button bottom-button" id="copy_original")
- label() Copy Original
- svg(xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" preserveAspectRatio="xMinYMin meet" 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="block" id="redirect_div" style="display: none")
- button(class="title button bottom-button" id="redirect")
- label Redirect
- svg(xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" preserveAspectRatio="xMinYMin meet" 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="block" id="redirect_to_original_div" style="display: none")
- button(class="title button bottom-button" id="redirect_to_original")
- label Redirect To Original
- svg(xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" preserveAspectRatio="xMinYMin meet" fill="currentColor")
- path(d="M 17,20 V 11 Q 17,10.175 16.412,9.587 15.825,9 15,9 H 6.8 L 8.4,7.4 7,6 3,10 7,14 8.4,12.6 6.8,11 H 15 v 9 z" id="path2")
-
- hr(id="hr" style="display: none")
-
- div(id="current_site")
- include /src/pages/popup/switches
- div(id="current_site_divider" style="display: none")
- hr
-
- div(id="all_sites")
- include /src/pages/popup/switches
-
- hr
-
- div(class="block")
- a(class="title button bottom-button" id="more-options")
- label(data-localise="__MSG_settings__") Settings
- svg(xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" preserveAspectRatio="xMinYMin meet" fill="currentColor")
- path(d="m9.25 22-.4-3.2q-.325-.125-.612-.3-.288-.175-.563-.375L4.7 19.375l-2.75-4.75 2.575-1.95Q4.5 12.5 4.5 12.337v-.675q0-.162.025-.337L1.95 9.375l2.75-4.75 2.975 1.25q.275-.2.575-.375.3-.175.6-.3l.4-3.2h5.5l.4 3.2q.325.125.613.3.287.175.562.375l2.975-1.25 2.75 4.75-2.575 1.95q.025.175.025.337v.675q0 .163-.05.338l2.575 1.95-2.75 4.75-2.95-1.25q-.275.2-.575.375-.3.175-.6.3l-.4 3.2Zm2.8-6.5q1.45 0 2.475-1.025Q15.55 13.45 15.55 12q0-1.45-1.025-2.475Q13.5 8.5 12.05 8.5q-1.475 0-2.488 1.025Q8.55 10.55 8.55 12q0 1.45 1.012 2.475Q10.575 15.5 12.05 15.5Z")
-
- div(class="space")
- script(type="module" src="../options/init.js")
- script(type="module" src="./popup.js")
diff --git a/src/pages/popup/style.css b/src/pages/popup/style.css
deleted file mode 100644
index 41510615..00000000
--- a/src/pages/popup/style.css
+++ /dev/null
@@ -1,65 +0,0 @@
-body {
- width: 270px;
- min-height: auto;
-}
-
-html,
-body {
- margin: 0;
-}
-
-.hide {
- display: none !important;
-}
-
-.button {
- display: flex;
- margin: 0 auto;
- justify-content: space-between;
-}
-
-.button svg {
- width: 26px;
- height: 26px;
-}
-
-.bottom-button {
- width: 100%;
-}
-
-.space {
- height: 10px;
-}
-
-input {
- height: 23px;
- width: 46px;
-}
-
-div.block label {
- margin: 0;
- font-size: 18px;
- font-weight: bold;
- max-width: 180px;
-}
-
-div.block label:hover {
- cursor: pointer;
-}
-
-div.block div {
- display: flex;
-}
-
-html.mobile body {
- width: 100%;
-}
-
-html.mobile div.block label {
- font-size: 24px;
-}
-
-html.mobile .button svg {
- width: 30px;
- height: 30px;
-}
diff --git a/src/pages/popup/switches.pug b/src/pages/popup/switches.pug
deleted file mode 100644
index 20ed8c61..00000000
--- a/src/pages/popup/switches.pug
+++ /dev/null
@@ -1,14 +0,0 @@
-each _, service in services
- div(class=`${service} block hide`)
- a(class="title" href=services[service].url)
- if services[service].imageType == 'svgMono'
- img(class='dark' src=`/assets/images/${service}-icon.svg`)
- img(class='light' src=`/assets/images/${service}-icon-light.svg`)
- else
- img(src=`/assets/images/${service}-icon.${services[service].imageType}`)
- label=services[service].name
- div
- input(class=`${service}-enabled` type="checkbox" aria-label=`toggle ${services[service].name}`)
- button(class=`${service}-change_instance title button` aria-label=`change instance for ${services[service].name}`)
- svg(xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" preserveAspectRatio="xMinYMin meet" 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") \ No newline at end of file
generated by cgit v1.3.1 (git 2.54.0) at 2026-06-28 09:31:41 +0000