Started converting storage format

28 files changed, 283 insertions, 1338 deletions

diff --git a/src/assets/javascripts/general.js b/src/assets/javascripts/general.js
index 35ead2f0..3a8987ac 100644
--- a/src/assets/javascripts/general.js
+++ b/src/assets/javascripts/general.js
@@ -25,17 +25,19 @@ async function initDefaults() {
 	return new Promise(resolve =>
 		browser.storage.local.set(
 			{
-				exceptions: {
-					url: [],
-					regex: [],
+				options: {
+					exceptions: {
+						url: [],
+						regex: [],
+					},
+					theme: "DEFAULT",
+					popupServices: ["youtube", "twitter", "instagram", "tiktok", "imgur", "reddit", "quora", "translate", "maps"],
+					autoRedirect: false,
+					firstPartyIsolate: false,
+					network: "clearnet",
+					networkFallback: true,
+					latencyThreshold: 1000,
 				},
-				theme: "DEFAULT",
-				popupServices: ["youtube", "twitter", "instagram", "tiktok", "imgur", "reddit", "quora", "translate", "maps"],
-				autoRedirect: false,
-				firstPartyIsolate: false,
-				network: "clearnet",
-				networkFallback: true,
-				latencyThreshold: 1000,
 			},
 			() => resolve()
 		)
diff --git a/src/assets/javascripts/services.js b/src/assets/javascripts/services.js
index 25e998d2..9fc5a0a3 100644
--- a/src/assets/javascripts/services.js
+++ b/src/assets/javascripts/services.js
@@ -2,9 +2,7 @@ window.browser = window.browser || window.chrome
 

 import utils from "./utils.js"

 

-let config = {},

-	redirects = {},

-	options = {}

+let config, redirects, options, targets, blacklists

 

 async function getConfig() {

 	return new Promise(resolve => {

@@ -19,48 +17,44 @@ async function getConfig() {
 

 function init() {

 	return new Promise(async resolve => {

-		await getConfig()

-		browser.storage.local.get(["network", "networkFallback", "redirects"], r => {

-			options.network = r.network

-			options.networkFallback = r.networkFallback

+		// await getConfig()

+		browser.storage.local.get(["options", "targets", "redirects", "blacklists"], r => {

+			blacklists = r.blacklists

 			redirects = r.redirects

+			targets = r.targets

+			options = r.options

+			resolve()

 		})

-		for (const service in config.services) {

-			options[service] = {}

-			browser.storage.local.get([`${service}Enabled`, `${service}RedirectType`, `${service}Frontend`], r => {

-				options[service].enabled = r[service + "Enabled"]

-				options[service].frontend = r[service + "Frontend"]

-				options[service].redirectType = r[service + "RedirectType"]

-			})

-			for (const frontend in config.services[service].frontends) {

-				options[frontend] = {}

-				for (const network in config.networks) {

-					options[frontend][network] = {}

-					options[frontend][network] = {}

-					browser.storage.local.get([`${frontend}${utils.camelCase(network)}RedirectsChecks`, `${frontend}${utils.camelCase(network)}CustomRedirects`], r => {

-						options[frontend][network].checks = r[frontend + utils.camelCase(network) + "RedirectsChecks"]

-						options[frontend][network].custom = r[frontend + utils.camelCase(network) + "CustomRedirects"]

-					})

-				}

-			}

-		}

-		resolve()

 	})

 }

 

-function all(service) {

-	init()

+await init()

+await getConfig()

+

+function fetchFrontendInstanceList(service, frontend) {

 	let tmp = []

-	for (const frontend in config.services[service].frontends) {

-		if (config.services[service].frontends[frontend].instanceList) {

-			for (const network in config.networks) {

-				tmp.push(...redirects[frontend][network], ...options[frontend][network].custom)

-			}

-		} else if (config.services[service].frontends[frontend].singleInstance != undefined) tmp.push(config.services[service].frontends[frontend].singleInstance)

-	}

+	if (!config.services[service].frontends[frontend].singleInstance) {

+		for (const network in config.networks) {

+			tmp.push(...redirects[frontend][network], ...options[frontend][network].custom)

+		}

+	} else if (config.services[service].frontends[frontend].singleInstance != undefined) tmp = config.services[service].frontends[frontend].singleInstance

 	return tmp

 }

 

+function all(service, frontend) {

+	// init()

+	// getConfig()

+	let instances = []

+	if (!frontend) {

+		for (const frontend in config.services[service].frontends) {

+			instances.push(...fetchFrontendInstanceList(service, frontend))

+		}

+	} else {

+		instances.push(...fetchFrontendInstanceList(service, frontend))

+	}

+	return instances

+}

+

 function regexArray(service, url) {

 	let targets

 	if (config.services[service].targets == "datajson") {

@@ -77,8 +71,6 @@ function regexArray(service, url) {
 	return false

 }

 

-getConfig()

-init()

 browser.storage.onChanged.addListener(init)

 

 function redirect(url, type, initiator) {

@@ -101,8 +93,8 @@ function redirect(url, type, initiator) {
 		}

 

 		if (config.services[service].frontends[frontend].instanceList) {

-			let instanceList = [...options[frontend][network].checks, ...options[frontend][network].custom]

-			if (instanceList.length === 0 && options.networkFallback) instanceList = [...options[frontend].clearnet.checks, ...options[frontend].clearnet.custom]

+			let instanceList = [...options[frontend][network].enabled, ...options[frontend][network].custom]

+			if (instanceList.length === 0 && options.networkFallback) instanceList = [...options[frontend].clearnet.enabled, ...options[frontend].clearnet.custom]

 			if (instanceList.length === 0) return

 			randomInstance = utils.getRandomInstance(instanceList)

 		} else if (config.services[service].frontends[frontend].singleInstance) randomInstance = config.services[service].frontends[frontend].singleInstance

@@ -401,45 +393,37 @@ function initDefaults() {
 		fetch("/instances/data.json")

 			.then(response => response.text())

 			.then(async data => {

-				let dataJson = JSON.parse(data)

-				let tmpRedirects = JSON.parse(data)

-				browser.storage.local.get(["cloudflareBlackList", "authenticateBlackList", "offlineBlackList"], async r => {

+				browser.storage.local.get(["options", "blacklists"], async r => {

+					let redirects = JSON.parse(data)

+					let options = r.options

+					let targets = {}

 					for (const service in config.services) {

+						options[service] = {}

 						if (config.services[service].targets == "datajson") {

-							browser.storage.local.set({ [service + "Targets"]: [...dataJson[service]] })

-							delete dataJson[service]

+							targets[service] = redirects[service]

+							//delete dataJson[service]

 						}

 						for (const defaultOption in config.services[service].options) {

-							browser.storage.local.set({ [service + utils.camelCase(defaultOption)]: config.services[service].options[defaultOption] })

+							options[service][defaultOption] = config.services[service].options[defaultOption]

 						}

 						for (const frontend in config.services[service].frontends) {

 							if (config.services[service].frontends[frontend].instanceList) {

-								let clearnetChecks = tmpRedirects[frontend].clearnet

-								for (const instance of [...r.cloudflareBlackList, ...r.authenticateBlackList, ...r.offlineBlackList]) {

-									let i = clearnetChecks.indexOf(instance)

-									if (i > -1) clearnetChecks.splice(i, 1)

-								}

+								options[frontend] = {}

 								for (const network in config.networks) {

-									switch (network) {

-										case "clearnet":

-											browser.storage.local.set({

-												[frontend + "ClearnetRedirectsChecks"]: [...clearnetChecks],

-												[frontend + "ClearnetCustomRedirects"]: [],

-											})

-											break

-										default:

-											browser.storage.local.set({

-												[frontend + utils.camelCase(network) + "RedirectsChecks"]: [...tmpRedirects[frontend][network]],

-												[frontend + utils.camelCase(network) + "CustomRedirects"]: [],

-											})

+									options[frontend][network] = {}

+									options[frontend][network].enabled = redirects[frontend][network]

+									options[frontend][network].custom = []

+								}

+								for (const blacklist in r.blacklists) {

+									for (const instance of blacklist) {

+										let i = options[frontend].clearnet.enabled.indexOf(instance)

+										if (i > -1) options[frontend].clearnet.enabled.splice(i, 1)

 									}

 								}

 							}

 						}

 					}

-					browser.storage.local.set({

-						redirects: dataJson,

-					})

+					browser.storage.local.set({ redirects, options, targets })

 					resolve()

 				})

 			})

@@ -459,15 +443,15 @@ function computeService(url) {
 

 function switchInstance(url) {

 	return new Promise(async resolve => {

-		await init()

-		await getConfig()

+		// await init()

+		// await getConfig()

 		const protocolHost = utils.protocolHost(url)

 		for (const service in config.services) {

 			if (!options[service].enabled) continue

 			if (!all(service).includes(protocolHost)) continue

 

-			let instancesList = [...options[options[service].frontend][options.network].checks, ...options[options[service].frontend][options.network].custom]

-			if (instancesList.length === 0 && options.networkFallback) instancesList = [...options[options[service].frontend].clearnet.checks, ...options[options[service].frontend].clearnet.custom]

+			let instancesList = [...options[options[service].frontend][options.network].enabled, ...options[options[service].frontend][options.network].custom]

+			if (instancesList.length === 0 && options.networkFallback) instancesList = [...options[options[service].frontend].clearnet.enabled, ...options[options[service].frontend].clearnet.custom]

 

 			let oldInstance

 			const i = instancesList.indexOf(protocolHost)

@@ -492,8 +476,8 @@ function switchInstance(url) {
 

 function reverse(url) {

 	return new Promise(async resolve => {

-		await init()

-		await getConfig()

+		// await init()

+		// await getConfig()

 		let protocolHost = utils.protocolHost(url)

 		let currentService

 		for (const service in config.services) {

@@ -504,6 +488,8 @@ function reverse(url) {
 			case "instagram":

 				if (url.pathname.startsWith("/p")) resolve(`https://instagram.com${url.pathname.replace("/p", "")}${url.search}`)

 				if (url.pathname.startsWith("/u")) resolve(`https://instagram.com${url.pathname.replace("/u", "")}${url.search}`)

+				resolve(config.services[currentService].url + url.pathname + url.search)

+				return

 			case "youtube":

 			case "imdb":

 			case "imgur":

@@ -518,10 +504,72 @@ function reverse(url) {
 	})

 }

 

+function unifyPreferences(url) {

+	return new Promise(async resolve => {

+		// await init()

+		// await getConfig()

+		const protocolHost = utils.protocolHost(url)

+		let currentFrontend, currentService

+		serviceloop: for (const service in config.services) {

+			for (const frontend in config.services[service].frontends) {

+				if (all(service, frontend).includes(protocolHost)) {

+					currentFrontend = frontend

+					currentService = service

+					break serviceloop

+				}

+			}

+		}

+		let instancesList = [...options[currentFrontend][options.network].enabled, ...options[currentFrontend][options.network].custom]

+		if (options.networkFallback && options.network != "clearnet") instancesList.push(...options[currentFrontend].clearnet.enabled, ...options[currentFrontend].clearnet.custom)

+

+		const frontend = config.services[currentService].frontends[currentFrontend]

+		if ("cookies" in frontend.preferences) {

+			for (const cookie in frontend.preferences.cookies) {

+				await utils.copyCookie(currentFrontend, url, instancesList, cookie)

+			}

+		}

+		if ("localStorage" in frontend.preferences) {

+		}

+		if ("indexeddb" in frontend.preferences) {

+		}

+		if ("token" in frontend.preferences) {

+		}

+		resolve(true)

+	})

+}

+

+function setRedirects(redirects) {

+	browser.storage.local.get(["options", "blacklists"], async r => {

+		let options = r.options

+		let targets = {}

+		for (const service in config.services) {

+			if (config.services[service].targets == "datajson") {

+				targets[service] = redirects[service]

+			}

+			for (const frontend in config.services[service].frontends) {

+				if (config.services[service].frontends[frontend].instanceList) {

+					for (const network in config.networks) {

+						options[frontend][network].enabled = redirects[frontend][network]

+					}

+					for (const blacklist in r.blacklists) {

+						for (const instance of blacklist) {

+							let i = options[frontend].clearnet.enabled.indexOf(instance)

+							if (i > -1) options[frontend].clearnet.enabled.splice(i, 1)

+						}

+					}

+				}

+			}

+		}

+		browser.storage.local.set({ redirects, targets, options })

+	})

+}

+

 export default {

 	redirect,

 	initDefaults,

 	computeService,

 	switchInstance,

 	reverse,

+	unifyPreferences,

+	setRedirects,

 }

diff --git a/src/assets/javascripts/utils.js b/src/assets/javascripts/utils.js
index c28af018..0e8acb3c 100644
--- a/src/assets/javascripts/utils.js
+++ b/src/assets/javascripts/utils.js
@@ -440,21 +440,7 @@ function unify(test) {
 					return
 				}
 
-				let result = await youtubeHelper.copyPasteInvidiousCookies(test, url)
-				if (!result) result = await youtubeHelper.copyPastePipedLocalStorage(test, url, currTab.id)
-				if (!result) result = await youtubeHelper.copyPastePipedMaterialLocalStorage(test, url, currTab.id)
-
-				if (!result) result = await twitterHelper.initNitterCookies(test, url)
-				if (!result) result = await redditHelper.initLibredditCookies(test, url)
-				if (!result) result = await redditHelper.initTedditCookies(test, url)
-				if (!result) result = await searchHelper.initSearxCookies(test, url)
-				if (!result) result = await searchHelper.initSearxngCookies(test, url)
-				if (!result) result = await searchHelper.initLibrexCookies(test, url)
-				if (!result) result = await tiktokHelper.initProxiTokCookies(test, url)
-				if (!result) result = await wikipediaHelper.initWikilessCookies(test, url)
-				if (!result) result = await translateHelper.copyPasteSimplyTranslateCookies(test, url)
-				if (!result) result = await translateHelper.copyPasteLingvaLocalStorage(test, url)
-				if (!result) result = await instagramHelper.initBibliogramPreferences(test, url)
+				let result = await servicesHelper.unifyPreferences(url)
 
 				resolve(result)
 			}
diff --git a/src/config/config.json b/src/config/config.json
index ca835d51..09774895 100644
--- a/src/config/config.json
+++ b/src/config/config.json
@@ -116,7 +116,7 @@
 				"hyperpipe": {

 					"preferences": {

 						"localstorage": ["api", "authapi", "codec", "locale", "next", "pipedapi", "quality", "theme", "vol"],

-						"indexeddb": ["hyperpipedb"]

+						"indexeddb": "hyperpipedb"

 					},

 					"name": "HyperPipe",

 					"instanceList": true

@@ -542,5 +542,10 @@
 			"embeddable": false,

 			"url": "https://send.libredirect.invalid"

 		}

+	},

+	"blacklist": {

+		"cloudflare": { "color": "red" },

+		"authenticate": { "color": "orange" },

+		"offline": { "color": "grey" }

 	}

 }

diff --git a/src/pages/background/background.js b/src/pages/background/background.js
index 7ee1358e..241b51de 100644
--- a/src/pages/background/background.js
+++ b/src/pages/background/background.js
@@ -12,18 +12,13 @@ browser.runtime.onInstalled.addListener(details => {
 			.then(response => response.text())

 			.then(async data => {

 				browser.storage.local.clear(() => {

-					browser.storage.local.set({ cloudflareBlackList: JSON.parse(data).cloudflare }, () => {

-						browser.storage.local.set({ authenticateBlackList: JSON.parse(data).authenticate }, () => {

-							browser.storage.local.set({ offlineBlackList: JSON.parse(data).offline }, () => {

-								generalHelper.initDefaults()

-								servicesHelper.initDefaults()

-							})

-						})

+					browser.storage.local.set({ blacklists: JSON.parse(data) }, () => {

+						generalHelper.initDefaults()

+						servicesHelper.initDefaults()

 					})

 				})

 			})

 	}

-	if (details.reason == "install") initDefaults()

 

 	// if (details.reason == 'install' || (details.reason == "update" && details.previousVersion != browser.runtime.getManifest().version)) {

 	//   if (details.reason == "update")

@@ -36,6 +31,17 @@ browser.runtime.onInstalled.addListener(details => {
 	//     })

 	//   else initDefaults();

 	// }

+	switch (details.reason) {

+		case "install":

+			initDefaults()

+			break

+		case "update":

+			switch (details.previousVersion) {

+				case "2.2.1":

+					//do stuff

+					break

+			}

+	}

 })

 

 let BYPASSTABs = []

@@ -98,21 +104,7 @@ browser.webRequest.onHeadersReceived.addListener(
 */

 

 async function redirectOfflineInstance(url, tabId) {

-	let newUrl = await youtubeHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await twitterHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await instagramHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await redditHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await searchHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await translateHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await mediumHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await quoraHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await libremdbHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await tiktokHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await imgurHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await wikipediaHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await peertubeHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await lbryHelper.switchInstance(url, true)

-	if (!newUrl) newUrl = await youtubeMusicHelper.switchInstance(url, true)

+	let newUrl = await servicesHelper.switchInstance(url, true)

 

 	if (newUrl) {

 		if (counter >= 5) {

@@ -189,5 +181,3 @@ browser.runtime.onMessage.addListener((message, sender, sendResponse) => {
 	if (message.function === "unify") utils.unify(false).then(r => sendResponse({ response: r }))

 	return true

 })

-

-browser.storage.local.set({ version: browser.runtime.getManifest().version })

diff --git a/src/pages/options/widgets/general.js b/src/pages/options/widgets/general.js
index cfc95df2..89d0b6b0 100644
--- a/src/pages/options/widgets/general.js
+++ b/src/pages/options/widgets/general.js
@@ -28,6 +28,24 @@ async function getConfig() {
 	})
 }
 
+function setOption(option, multiChoice, event) {
+	browser.storage.local.get("options", r => {
+		let options = r.options
+		browser.storage.local.set({ options })
+	})
+
+	browser.storage.local.get("options", r => {
+		let options = r.options
+		if (multiChoice) {
+			options[option] = event.target.options[[option].selectedIndex].value
+		} else {
+			options[option] = event.target.checked
+		}
+		browser.storage.local.set({ options })
+		location.reload()
+	})
+}
+
 let exportSettingsElement = document.getElementById("export-settings")
 
 function exportSettings() {
@@ -75,13 +93,9 @@ resetSettings.addEventListener("click", async () => {
 		fetch("/instances/blacklist.json")
 			.then(response => response.text())
 			.then(async data => {
-				browser.storage.local.set({ cloudflareBlackList: JSON.parse(data).cloudflare }, () => {
-					browser.storage.local.set({ offlineBlackList: JSON.parse(data).offline }, () => {
-						browser.storage.local.set({ authenticateBlackList: JSON.parse(data).authenticate }, async () => {
-							await servicesHelper.initDefaults()
-							location.reload()
-						})
-					})
+				browser.storage.local.set({ blacklists: JSON.parse(data) }, async () => {
+					await servicesHelper.initDefaults()
+					location.reload()
 				})
 			})
 	})
@@ -89,32 +103,30 @@ resetSettings.addEventListener("click", async () => {
 
 let autoRedirectElement = document.getElementById("auto-redirect")
 autoRedirectElement.addEventListener("change", event => {
-	browser.storage.local.set({ autoRedirect: event.target.checked })
+	setOption("autoRedirect", false, event)
 })
 
 let themeElement = document.getElementById("theme")
 themeElement.addEventListener("change", event => {
-	const value = event.target.options[theme.selectedIndex].value
-	browser.storage.local.set({ theme: value })
+	setOption("theme", true, event)
 	location.reload()
 })
 
 let networkElement = document.getElementById("network")
 networkElement.addEventListener("change", event => {
-	const value = event.target.options[network.selectedIndex].value
-	browser.storage.local.set({ network: value })
+	setOption("network", true, event)
 	location.reload()
 })
 
 let networkFallbackCheckbox = document.getElementById("network-fallback-checkbox")
 networkFallbackCheckbox.addEventListener("change", event => {
-	browser.storage.local.set({ networkFallback: event.target.checked })
+	setOption("networkFallback", false, event)
 })
 
 let latencyOutput = document.getElementById("latency-output")
 let latencyInput = document.getElementById("latency-input")
 latencyInput.addEventListener("change", event => {
-	browser.storage.local.set({ latencyThreshold: event.target.value })
+	setOption("latencyThreshold", false, event)
 })
 latencyInput.addEventListener("input", event => {
 	latencyOutput.value = event.target.value
@@ -141,46 +153,36 @@ for (const service in config.services) {
 // const firstPartyIsolate = document.getElementById('firstPartyIsolate');
 // firstPartyIsolate.addEventListener("change", () => browser.storage.local.set({ firstPartyIsolate: firstPartyIsolate.checked }))
 
-browser.storage.local.get(
-	[
-		"theme",
-		"autoRedirect",
-		"exceptions",
-		"network",
-		"networkFallback",
-		"latencyThreshold",
-		// 'firstPartyIsolate'
-	],
-	r => {
-		autoRedirectElement.checked = r.autoRedirect
-		themeElement.value = r.theme
-		networkElement.value = r.network
-		networkFallbackCheckbox.checked = r.networkFallback
-		latencyOutput.value = r.latencyThreshold
-		// firstPartyIsolate.checked = r.firstPartyIsolate;
-
-		let networkFallbackElement = document.getElementById("network-fallback")
-		if (networkElement.value == "clearnet") {
-			networkFallbackElement.style.display = "none"
-		} else {
-			networkFallbackElement.style.display = "block"
-		}
+browser.storage.local.get("options", r => {
+	autoRedirectElement.checked = r.options.autoRedirect
+	themeElement.value = r.options.theme
+	networkElement.value = r.options.network
+	networkFallbackCheckbox.checked = r.options.networkFallback
+	latencyOutput.value = r.options.latencyThreshold
+	// firstPartyIsolate.checked = r.firstPartyIsolate;
+
+	let networkFallbackElement = document.getElementById("network-fallback")
+	if (networkElement.value == "clearnet") {
+		networkFallbackElement.style.display = "none"
+	} else {
+		networkFallbackElement.style.display = "block"
+	}
 
-		instanceTypeElement.addEventListener("change", event => {
-			instanceType = event.target.options[instanceTypeElement.selectedIndex].value
-			if (instanceType == "url") {
-				nameCustomInstanceInput.setAttribute("type", "url")
-				nameCustomInstanceInput.setAttribute("placeholder", "https://www.google.com")
-			} else if (instanceType == "regex") {
-				nameCustomInstanceInput.setAttribute("type", "text")
-				nameCustomInstanceInput.setAttribute("placeholder", "https?://(www.|)youtube.com/")
-			}
-		})
-		let exceptionsCustomInstances = r.exceptions
-		function calcExceptionsCustomInstances() {
-			document.getElementById("exceptions-custom-checklist").innerHTML = [...exceptionsCustomInstances.url, ...exceptionsCustomInstances.regex]
-				.map(
-					x => `<div>
+	instanceTypeElement.addEventListener("change", event => {
+		instanceType = event.target.options[instanceTypeElement.selectedIndex].value
+		if (instanceType == "url") {
+			nameCustomInstanceInput.setAttribute("type", "url")
+			nameCustomInstanceInput.setAttribute("placeholder", "https://www.google.com")
+		} else if (instanceType == "regex") {
+			nameCustomInstanceInput.setAttribute("type", "text")
+			nameCustomInstanceInput.setAttribute("placeholder", "https?://(www.|)youtube.com/")
+		}
+	})
+	let exceptionsCustomInstances = r.options.exceptions
+	function calcExceptionsCustomInstances() {
+		document.getElementById("exceptions-custom-checklist").innerHTML = [...exceptionsCustomInstances.url, ...exceptionsCustomInstances.regex]
+			.map(
+				x => `<div>
                       ${x}
                       <button class="add" id="clear-${x}">
                         <svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px"
@@ -190,49 +192,48 @@ browser.storage.local.get(
                       </button>
                     </div>
                     <hr>`
-				)
-				.join("\n")
-
-			for (const x of [...exceptionsCustomInstances.url, ...exceptionsCustomInstances.regex]) {
-				document.getElementById(`clear-${x}`).addEventListener("click", () => {
-					console.log(x)
-					let index
-					index = exceptionsCustomInstances.url.indexOf(x)
-					if (index > -1) exceptionsCustomInstances.url.splice(index, 1)
-					else {
-						index = exceptionsCustomInstances.regex.indexOf(x)
-						if (index > -1) exceptionsCustomInstances.regex.splice(index, 1)
-					}
-					browser.storage.local.set({ exceptions: exceptionsCustomInstances })
-					calcExceptionsCustomInstances()
-				})
+			)
+			.join("\n")
+
+		for (const x of [...exceptionsCustomInstances.url, ...exceptionsCustomInstances.regex]) {
+			document.getElementById(`clear-${x}`).addEventListener("click", () => {
+				console.log(x)
+				let index
+				index = exceptionsCustomInstances.url.indexOf(x)
+				if (index > -1) exceptionsCustomInstances.url.splice(index, 1)
+				else {
+					index = exceptionsCustomInstances.regex.indexOf(x)
+					if (index > -1) exceptionsCustomInstances.regex.splice(index, 1)
+				}
+				options.exceptions = exceptionsCustomInstances
+				browser.storage.local.set({ options })
+				calcExceptionsCustomInstances()
+			})
+		}
+	}
+	calcExceptionsCustomInstances()
+	document.getElementById("custom-exceptions-instance-form").addEventListener("submit", event => {
+		event.preventDefault()
+
+		let val
+		if (instanceType == "url") {
+			if (nameCustomInstanceInput.validity.valid) {
+				let url = new URL(nameCustomInstanceInput.value)
+				val = `${url.network}//${url.host}`
+				if (!exceptionsCustomInstances.url.includes(val)) exceptionsCustomInstances.url.push(val)
 			}
+		} else if (instanceType == "regex") {
+			val = nameCustomInstanceInput.value
+			if (val.trim() != "" && !exceptionsCustomInstances.regex.includes(val)) exceptionsCustomInstances.regex.push(val)
+		}
+		if (val) {
+			options.exceptions = exceptionsCustomInstances
+			browser.storage.local.set({ options })
+			nameCustomInstanceInput.value = ""
 		}
 		calcExceptionsCustomInstances()
-		document.getElementById("custom-exceptions-instance-form").addEventListener("submit", event => {
-			event.preventDefault()
-
-			let val
-			if (instanceType == "url") {
-				if (nameCustomInstanceInput.validity.valid) {
-					let url = new URL(nameCustomInstanceInput.value)
-					val = `${url.network}//${url.host}`
-					if (!exceptionsCustomInstances.url.includes(val)) exceptionsCustomInstances.url.push(val)
-				}
-			} else if (instanceType == "regex") {
-				val = nameCustomInstanceInput.value
-				if (val.trim() != "" && !exceptionsCustomInstances.regex.includes(val)) exceptionsCustomInstances.regex.push(val)
-			}
-			if (val) {
-				browser.storage.local.set({ exceptions: exceptionsCustomInstances })
-				nameCustomInstanceInput.value = ""
-			}
-			calcExceptionsCustomInstances()
-		})
+	})
 
-		browser.storage.local.get("popupServices", r => {
-			popupServices = r.popupServices
-			for (const service in config.services) document.getElementById(service).checked = popupServices.includes(service)
-		})
-	}
-)
+	popupServices = r.options.popupServices
+	for (const service in config.services) document.getElementById(service).checked = popupServices.includes(service)
+})
diff --git a/src/pages/options/widgets/imdb.js b/src/pages/options/widgets/imdb.js
deleted file mode 100644
index f04bef20..00000000
--- a/src/pages/options/widgets/imdb.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("libremdb")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("imdb-enable")
-const imdb = document.getElementById("imdb_page")
-//const frontend = document.getElementById("imdb-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableImdb", "protocol"], r => {
-	enable.checked = !r.disableImdb
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-imdb.addEventListener("change", () => {
-	browser.storage.local.set({ disableImdb: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("imdb", frontends[i], protocols[x], document)
-	}
-	utils.latency("imdb", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/imgur.js b/src/pages/options/widgets/imgur.js
deleted file mode 100644
index 0272b94e..00000000
--- a/src/pages/options/widgets/imgur.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("rimgo")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("imgur-enable")
-const imgur = document.getElementById("imgur_page")
-//const frontend = document.getElementById("imgur-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableImgur", "protocol"], r => {
-	enable.checked = !r.disableImgur
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-imgur.addEventListener("change", () => {
-	browser.storage.local.set({ disableImgur: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("imgur", frontends[i], protocols[x], document)
-	}
-	utils.latency("imgur", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/instagram.js b/src/pages/options/widgets/instagram.js
deleted file mode 100644
index f8301ae7..00000000
--- a/src/pages/options/widgets/instagram.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("bibliogram")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("instagram-enable")
-const instagram = document.getElementById("instagram_page")
-//const frontend = document.getElementById("instagram-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableInstagram", "protocol"], r => {
-	enable.checked = !r.disableInstagram
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-instagram.addEventListener("change", () => {
-	browser.storage.local.set({ disableInstagram: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("instagram", frontends[i], protocols[x], document)
-	}
-	utils.latency("instagram", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/lbry.js b/src/pages/options/widgets/lbry.js
deleted file mode 100644
index 970f9130..00000000
--- a/src/pages/options/widgets/lbry.js
+++ /dev/null
@@ -1,60 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-const frontends = new Array("librarian")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("lbry-enable")
-const lbry = document.getElementById("lbry_page")
-const redirectType = document.getElementById("lbry-redirect_type")
-const frontend = document.getElementById("lbry-frontend")
-let protocol
-
-function changeFrontendsSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		if (frontends[i] == frontend.value) {
-			frontendDiv.style.display = "block"
-		} else {
-			frontendDiv.style.display = "none"
-		}
-	}
-}
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableLbryTargets", "protocol", "lbryFrontend", "lbryRedirectType"], r => {
-	enable.checked = !r.disableLbryTargets
-	protocol = r.network
-	redirectType.value = r.lbryRedirectType
-	frontend.value = r.lbryFrontend
-	changeFrontendsSettings()
-	changeProtocolSettings()
-})
-
-lbry.addEventListener("change", () => {
-	browser.storage.local.set({
-		disableLbryTargets: !enable.checked,
-		lbryRedirectType: redirectType.value,
-		lbryFrontend: frontend.value,
-	})
-	changeFrontendsSettings()
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("lbryTargets", frontends[i], protocols[x], document)
-	}
-	utils.latency("lbryTargets", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/maps.js b/src/pages/options/widgets/maps.js
deleted file mode 100644
index ba44c0c0..00000000
--- a/src/pages/options/widgets/maps.js
+++ /dev/null
@@ -1,57 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-const frontends = new Array("facil")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("maps-enable")
-const maps = document.getElementById("maps_page")
-const frontend = document.getElementById("maps-frontend")
-let protocol
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-function changeFrontendsSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		if (frontends[i] == frontend.value) {
-			frontendDiv.style.display = "block"
-		} else {
-			frontendDiv.style.display = "none"
-		}
-	}
-}
-
-browser.storage.local.get(["disableMaps", "protocol", "mapsFrontend"], r => {
-	enable.checked = !r.disableMaps
-	protocol = r.network
-	frontend.value = r.mapsFrontend
-	changeFrontendsSettings()
-	changeProtocolSettings()
-})
-
-maps.addEventListener("change", () => {
-	browser.storage.local.set({
-		disableMaps: !enable.checked,
-		mapsFrontend: frontend.value,
-	})
-	changeFrontendsSettings()
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("maps", frontends[i], protocols[x], document)
-	}
-	utils.latency("maps", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/medium.js b/src/pages/options/widgets/medium.js
deleted file mode 100644
index c12df456..00000000
--- a/src/pages/options/widgets/medium.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("scribe")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("medium-enable")
-const medium = document.getElementById("medium_page")
-//const frontend = document.getElementById("medium-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableMedium", "protocol"], r => {
-	enable.checked = !r.disableMedium
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-medium.addEventListener("change", () => {
-	browser.storage.local.set({ disableMedium: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("medium", frontends[i], protocols[x], document)
-	}
-	utils.latency("medium", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/peertube.js b/src/pages/options/widgets/peertube.js
deleted file mode 100644
index ca2be429..00000000
--- a/src/pages/options/widgets/peertube.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("simpleertube")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("peertube-enable")
-const peertube = document.getElementById("peertube_page")
-//const frontend = document.getElementById("peertube-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disablePeertubeTargets", "protocol"], r => {
-	enable.checked = !r.disablePeertubeTargets
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-peertube.addEventListener("change", () => {
-	browser.storage.local.set({ disablePeertubeTargets: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("peertube", frontends[i], protocols[x], document)
-	}
-	utils.latency("peertube", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/quora.js b/src/pages/options/widgets/quora.js
deleted file mode 100644
index c0c0d68f..00000000
--- a/src/pages/options/widgets/quora.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("quetre")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("quora-enable")
-const quora = document.getElementById("quora_page")
-//const frontend = document.getElementById("quora-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableQuora", "protocol"], r => {
-	enable.checked = !r.disableQuora
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-quora.addEventListener("change", () => {
-	browser.storage.local.set({ disableQuora: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("quora", frontends[i], protocols[x], document)
-	}
-	utils.latency("quora", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/reddit.js b/src/pages/options/widgets/reddit.js
deleted file mode 100644
index cae7a764..00000000
--- a/src/pages/options/widgets/reddit.js
+++ /dev/null
@@ -1,57 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-const frontends = new Array("libreddit", "teddit")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("reddit-enable")
-const reddit = document.getElementById("reddit_page")
-const frontend = document.getElementById("reddit-frontend")
-let protocol
-
-function changeFrontendsSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		if (frontends[i] == frontend.value) {
-			frontendDiv.style.display = "block"
-		} else {
-			frontendDiv.style.display = "none"
-		}
-	}
-}
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableReddit", "protocol", "redditFrontend"], r => {
-	enable.checked = !r.disableReddit
-	protocol = r.network
-	frontend.value = r.redditFrontend
-	changeFrontendsSettings()
-	changeProtocolSettings()
-})
-
-reddit.addEventListener("change", () => {
-	browser.storage.local.set({
-		disableReddit: !enable.checked,
-		redditFrontend: frontend.value,
-	})
-	changeFrontendsSettings()
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("reddit", frontends[i], protocols[x], document)
-	}
-	utils.latency("reddit", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/reuters.js b/src/pages/options/widgets/reuters.js
deleted file mode 100644
index 58299969..00000000
--- a/src/pages/options/widgets/reuters.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("neuters")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("reuters-enable")
-const reuters = document.getElementById("reuters_page")
-//const frontend = document.getElementById("reuters-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableReuters", "protocol"], r => {
-	enable.checked = !r.disableReuters
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-reuters.addEventListener("change", () => {
-	browser.storage.local.set({ disableReuters: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("reuters", frontends[i], protocols[x], document)
-	}
-	utils.latency("reuters", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/search.js b/src/pages/options/widgets/search.js
deleted file mode 100644
index aa0aa94d..00000000
--- a/src/pages/options/widgets/search.js
+++ /dev/null
@@ -1,91 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// GOAL: to never mention frontends/protocls outside these two arrays, so that adding a new frontend/protocol is as easy as adding it here.
-// This may be expanded across the whole project, where almost everything becomes a template, and the frontend/protocol parts just become a JSON file.
-
-// ONCE FINISHED: add librex and see if it works
-const frontends = new Array("searx", "searxng", "whoogle", "librex") // Add librex once /javascripts/search.js is made agnostic
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-//let frontendProtocols = (frontends.length)
-
-// I will leave comments of my privious attemps so that people can learn from my mistakes. :)
-
-/*
-for (let i = 0; i < frontends.length; i++) {
-  this.frontends[i] = frontends[i].getElementsByClassName(protocol)
-}
-*/
-// There was a class here, but I deleted a bit of it
-/*
-    this.searxDiv = searxDiv.getElementsByClassName(protocol)[0];
-    this.searxngDiv = searxngDiv.getElementsByClassName(protocol)[0];
-    this.librexDiv = librexDiv.getElementsByClassName(protocol)[0];
-    */
-
-/*
-  * Here I was trying to solve the issue by making a 2D array, but I later realised I was overcomplicating things
-for (var i = 0; i < frontends.length; i++) {
-  frontendProtocols[i] = new Array(protocols.length)
-}
-*/
-
-const enable = document.getElementById("search-enable")
-const search = document.getElementById("search_page")
-const frontend = document.getElementById("search-frontend")
-let protocol
-
-function changeFrontendsSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		if (frontends[i] == frontend.value) {
-			frontendDiv.style.display = "block"
-		} else {
-			frontendDiv.style.display = "none"
-		}
-	}
-}
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		//if (frontends[i] == frontend.value) {       // Here we are checking if the frontend matches the current one. This skips the protocol checking for that frontend, speeding things up. I no longer do this as protocol setting is only set once in the ui so every frontend needs to get their protocols setup immidiately.
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				//if the frontend value equals the selected one, it will show. Otherwise, it will be hidden
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-		/*
-    } else {
-      continue
-    }
-    */
-	}
-}
-
-browser.storage.local.get(["disableSearch", "searchFrontend", "protocol"], r => {
-	enable.checked = !r.disableSearch
-	frontend.value = r.searchFrontend
-	protocol = r.network
-
-	changeFrontendsSettings()
-	changeProtocolSettings()
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("search", frontends[i], protocols[x], document)
-	}
-	utils.latency("search", frontends[i], document, location)
-}
-
-search.addEventListener("change", () => {
-	browser.storage.local.set({
-		disableSearch: !enable.checked,
-		searchFrontend: frontend.value,
-	})
-	changeFrontendsSettings()
-})
diff --git a/src/pages/options/widgets/sendTargets.js b/src/pages/options/widgets/sendTargets.js
deleted file mode 100644
index b6acc02c..00000000
--- a/src/pages/options/widgets/sendTargets.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("send")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("sendTargets-enable")
-const sendTargets = document.getElementById("sendTargets_page")
-//const frontend = document.getElementById("sendTargets-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableSendTarget", "protocol"], r => {
-	enable.checked = !r.disableSendTarget
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-sendTargets.addEventListener("change", () => {
-	browser.storage.local.set({ disableSendTarget: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("sendTargets", frontends[i], protocols[x], document)
-	}
-	utils.latency("sendTargets", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/services.js b/src/pages/options/widgets/services.js
index dbb66dec..d709a05b 100644
--- a/src/pages/options/widgets/services.js
+++ b/src/pages/options/widgets/services.js
@@ -1,7 +1,7 @@
 import utils from "../../../assets/javascripts/utils.js"
 
 let config,
-	selectedNetwork,
+	options,
 	divs = {}
 
 function getConfig() {
@@ -15,17 +15,17 @@ function getConfig() {
 	})
 }
 
-function getNetwork() {
+function getOptions() {
 	return new Promise(resolve => {
-		browser.storage.local.get("network", r => {
-			selectedNetwork = r.network
+		browser.storage.local.get("options", r => {
+			options = r.options
 			resolve()
 		})
 	})
 }
 
 await getConfig()
-await getNetwork()
+await getOptions()
 
 function changeFrontendsSettings(service) {
 	for (const frontend in config.services[service].frontends) {
@@ -63,7 +63,7 @@ function changeNetworkSettings() {
 				const frontendDiv = document.getElementById(frontend)
 				for (const network in config.networks) {
 					const networkDiv = frontendDiv.getElementsByClassName(network)[0]
-					if (network == selectedNetwork) {
+					if (network == options.network) {
 						networkDiv.style.display = "block"
 					} else {
 						networkDiv.style.display = "none"
@@ -81,14 +81,13 @@ for (const service in config.services) {
 	for (const option in config.services[service].options) {
 		divs[service][option] = document.getElementById(`${service}-${option}`)
 
-		browser.storage.local.get([`${service + utils.camelCase(option)}`], r => {
-			if (typeof config.services[service].options[option] == "boolean") divs[service][option].checked = r[service + utils.camelCase(option)]
-			else divs[service][option].value = r[service + utils.camelCase(option)]
-		})
+		if (typeof config.services[service].options[option] == "boolean") divs[service][option].checked = options[service][option]
+		else divs[service][option].value = options[service][option]
 
 		divs[service][option].addEventListener("change", () => {
-			if (typeof config.services[service].options[option] == "boolean") browser.storage.local.set({ [service + utils.camelCase(option)]: divs[service][option].checked })
-			else browser.storage.local.set({ [service + utils.camelCase(option)]: divs[service][option].value })
+			if (typeof config.services[service].options[option] == "boolean") options[service][option] = divs[service][option].checked
+			else options[service][option] = divs[service][option].value
+			browser.local.storage.set({ options })
 			changeFrontendsSettings(service)
 		})
 	}
diff --git a/src/pages/options/widgets/tiktok.js b/src/pages/options/widgets/tiktok.js
deleted file mode 100644
index f382ad5a..00000000
--- a/src/pages/options/widgets/tiktok.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("proxiTok")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("tiktok-enable")
-const tiktok = document.getElementById("tiktok_page")
-//const frontend = document.getElementById("tiktok-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableTiktok", "protocol"], r => {
-	enable.checked = !r.disableTiktok
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-tiktok.addEventListener("change", () => {
-	browser.storage.local.set({ disableTiktok: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("tiktok", frontends[i], protocols[x], document)
-	}
-	utils.latency("tiktok", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/translate.js b/src/pages/options/widgets/translate.js
deleted file mode 100644
index c70b679f..00000000
--- a/src/pages/options/widgets/translate.js
+++ /dev/null
@@ -1,57 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-const frontends = new Array("simplyTranslate", "lingva")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("translate-enable")
-const translate = document.getElementById("translate_page")
-const frontend = document.getElementById("translate-frontend")
-let protocol
-
-function changeFrontendsSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		if (frontends[i] == frontend.value) {
-			frontendDiv.style.display = "block"
-		} else {
-			frontendDiv.style.display = "none"
-		}
-	}
-}
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["translateDisable", "translateFrontend", "protocol"], r => {
-	enable.checked = !r.translateDisable
-	frontend.value = r.translateFrontend
-	protocol = r.network
-	changeFrontendsSettings()
-	changeProtocolSettings()
-})
-
-translate.addEventListener("change", () => {
-	browser.storage.local.set({
-		translateDisable: !enable.checked,
-		translateFrontend: frontend.value,
-	})
-	changeFrontendsSettings()
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("translate", frontends[i], protocols[x], document)
-	}
-	utils.latency("translate", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/twitter.js b/src/pages/options/widgets/twitter.js
deleted file mode 100644
index 52d7a73b..00000000
--- a/src/pages/options/widgets/twitter.js
+++ /dev/null
@@ -1,60 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("nitter")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("twitter-enable")
-const twitter = document.getElementById("twitter_page")
-const redirectType = document.getElementById("twitter-redirect_type")
-//const frontend = document.getElementById("twitter-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableTwitter", "protocol", "twitterRedirectType"], r => {
-	enable.checked = !r.disableTwitter
-	protocol = r.network
-	redirectType.value = r.twitterRedirectType
-	changeProtocolSettings()
-})
-
-twitter.addEventListener("change", () => {
-	browser.storage.local.set({
-		disableTwitter: !enable.checked,
-		twitterRedirectType: redirectType.value,
-	})
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("twitter", frontends[i], protocols[x], document)
-	}
-	utils.latency("twitter", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/wikipedia.js b/src/pages/options/widgets/wikipedia.js
deleted file mode 100644
index 120af919..00000000
--- a/src/pages/options/widgets/wikipedia.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
-
-const frontends = new Array("wikiless")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-const enable = document.getElementById("wikipedia-enable")
-const wikipedia = document.getElementById("wikipedia_page")
-//const frontend = document.getElementById("wikipedia-frontend");
-let protocol
-
-/*
-function changeFrontendsSettings() {
-    for (let i = 0; i < frontends.length; i++) {
-        const frontendDiv = document.getElementById(frontends[i])
-        if (frontends[i] == frontend.value) {
-            frontendDiv.style.display = 'block'
-        } else {
-            frontendDiv.style.display = 'none'
-        }
-    }
-}
-*/
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableWikipedia", "protocol"], r => {
-	enable.checked = !r.disableWikipedia
-	protocol = r.network
-	changeProtocolSettings()
-})
-
-wikipedia.addEventListener("change", () => {
-	browser.storage.local.set({ disableWikipedia: !enable.checked })
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("wikipedia", frontends[i], protocols[x], document)
-	}
-	utils.latency("wikipedia", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/youtube.js b/src/pages/options/widgets/youtube.js
deleted file mode 100644
index 4e4bbbae..00000000
--- a/src/pages/options/widgets/youtube.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-const frontends = new Array("invidious", "piped", "pipedMaterial", "cloudtube")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-const singleInstanceFrontends = new Array("freetube", "yatte")
-
-const enable = document.getElementById("youtube-enable")
-const youtube = document.getElementById("youtube_page")
-const youtubeEmbedFrontend = document.getElementById("youtube-embed_frontend")
-const onlyEmbeddedVideo = document.getElementById("youtube-redirect_type")
-const embeddedFrontendDiv = document.getElementById("youtube-embedded_frontend")
-const frontend = document.getElementById("youtube-frontend")
-let protocol
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-function changeEmbedFrontendsSettings() {
-	if (embeddedFrontendDiv.style.display == "block") {
-		for (let i = 0; i < frontends.length; i++) {
-			const embeddedFrontendDiv = document.getElementById(frontends[i])
-			if (frontends[i] == youtubeEmbedFrontend.value) {
-				embeddedFrontendDiv.style.display = "block"
-			} else {
-				embeddedFrontendDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-function changeFrontendsSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		if (frontends[i] == frontend.value) {
-			frontendDiv.style.display = "block"
-		} else {
-			frontendDiv.style.display = "none"
-		}
-	}
-	let singleInstanceFrontend = false
-	for (let i = 0; i < singleInstanceFrontends.length; i++) {
-		if (singleInstanceFrontends[i] == frontend.value) {
-			singleInstanceFrontend = true
-		}
-	}
-	if (singleInstanceFrontend == true) {
-		embeddedFrontendDiv.style.display = "block"
-	} else {
-		embeddedFrontendDiv.style.display = "none"
-	}
-}
-
-browser.storage.local.get(["disableYoutube", "onlyEmbeddedVideo", "youtubeRedirects", "youtubeFrontend", "youtubeEmbedFrontend", "protocol"], r => {
-	enable.checked = !r.disableYoutube
-	onlyEmbeddedVideo.value = r.onlyEmbeddedVideo
-	youtubeEmbedFrontend.value = r.youtubeEmbedFrontend
-	frontend.value = r.youtubeFrontend
-	protocol = r.network
-
-	changeFrontendsSettings()
-	changeProtocolSettings()
-	changeEmbedFrontendsSettings()
-})
-
-youtube.addEventListener("change", () => {
-	browser.storage.local.set({
-		disableYoutube: !enable.checked,
-		youtubeEmbedFrontend: youtubeEmbedFrontend.value,
-		youtubeFrontend: frontend.value,
-		onlyEmbeddedVideo: onlyEmbeddedVideo.value,
-	})
-	changeFrontendsSettings()
-	changeEmbedFrontendsSettings()
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("youtube", frontends[i], protocols[x], document)
-	}
-	utils.latency("youtube", frontends[i], document, location)
-}
diff --git a/src/pages/options/widgets/youtubeMusic.js b/src/pages/options/widgets/youtubeMusic.js
deleted file mode 100644
index bb985b28..00000000
--- a/src/pages/options/widgets/youtubeMusic.js
+++ /dev/null
@@ -1,57 +0,0 @@
-import utils from "../../../assets/javascripts/utils.js"
-
-const frontends = new Array("beatbump", "hyperpipe")
-const protocols = new Array("clearnet", "tor", "i2p", "loki")
-
-let enable = document.getElementById("youtubeMusic-enable")
-const youtubeMusic = document.getElementById("youtubeMusic_page")
-const frontend = document.getElementById("youtubeMusic-frontend")
-let protocol
-
-function changeFrontendsSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		if (frontends[i] == frontend.value) {
-			frontendDiv.style.display = "block"
-		} else {
-			frontendDiv.style.display = "none"
-		}
-	}
-}
-
-function changeProtocolSettings() {
-	for (let i = 0; i < frontends.length; i++) {
-		const frontendDiv = document.getElementById(frontends[i])
-		for (let x = 0; x < protocols.length; x++) {
-			const protocolDiv = frontendDiv.getElementsByClassName(protocols[x])[0]
-			if (protocols[x] == protocol) {
-				protocolDiv.style.display = "block"
-			} else {
-				protocolDiv.style.display = "none"
-			}
-		}
-	}
-}
-
-browser.storage.local.get(["disableYoutubeMusic", "youtubeMusicFrontend", "protocol"], r => {
-	enable.checked = !r.disableYoutubeMusic
-	frontend.value = r.youtubeMusicFrontend
-	protocol = r.network
-	changeFrontendsSettings()
-	changeProtocolSettings()
-})
-
-youtubeMusic.addEventListener("change", () => {
-	browser.storage.local.set({
-		disableYoutubeMusic: !enable.checked,
-		youtubeMusicFrontend: frontend.value,
-	})
-	changeFrontendsSettings()
-})
-
-for (let i = 0; i < frontends.length; i++) {
-	for (let x = 0; x < protocols.length; x++) {
-		utils.processDefaultCustomInstances("youtubeMusic", frontends[i], protocols[x], document)
-	}
-	utils.latency("youtubeMusic", frontends[i], document, location)
-}
diff --git a/src/pages/popup/popup.ejs b/src/pages/popup/popup.ejs
index 5b3bb026..e862e0cb 100644
--- a/src/pages/popup/popup.ejs
+++ b/src/pages/popup/popup.ejs
@@ -8,13 +8,13 @@
   </head>
   <body dir="auto">
     <div class="current_site">
-      <%- include('src/pages/widgets/switches', {config: {networks, services}}) -%>
+      <%- include('src/pages/widgets/switches', {services: services}) -%>
       <div id="current_site_divider">
         <hr>
       </div>
     </div>
     <div class="all_sites">
-      <%- include('src/pages/widgets/switches', {config: {networks, services}}) -%>
+      <%- include('src/pages/widgets/switches', {services: services}) -%>
     </div>
     <hr>
     <div class="some-block" id="change_instance_div"><a class="title button prevent" id="change_instance">
@@ -27,7 +27,7 @@
         <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" 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"></path>
         </svg></a></div>
-    <div class="some-block" id="unify_div" title="Unify cookies across all selected instances"><a class="title button prevent" id="unify">
+    <div class="some-block" id="unify_div" title="Unify preferences across all selected instances"><a class="title button prevent" id="unify">
         <h4 data-localise="__MSG_unifySettings__">Unify Settings</h4>
         <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
           <path d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"></path>
diff --git a/src/pages/popup/popup.js b/src/pages/popup/popup.js
index c28f2d94..098ae01a 100644
--- a/src/pages/popup/popup.js
+++ b/src/pages/popup/popup.js
@@ -56,27 +56,18 @@ await setDivs()
 
 const currentSiteIsFrontend = document.getElementById("current_site_divider")
 
-function getEnabled() {
-	return new Promise(async resolve => {
-		for (const service in config.services) {
-			browser.storage.local.get(`${service}Enabled`, r => {
-				divs[service].toggle.all.checked = r[service + "Enabled"]
-				divs[service].toggle.current.checked = r[service + "Enabled"]
-			})
-		}
-		resolve()
-	})
-}
-
-browser.storage.local.get("popupServices", r => {
+browser.storage.local.get("options", r => {
 	browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
 		for (const service in config.services) {
-			if (!r.popupServices.includes(service)) allSites.getElementsByClassName(service)[0].classList.add("hide")
+			if (!r.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")
 		}
 
-		await getEnabled()
+		for (const service in config.services) {
+			divs[service].toggle.all.checked = r.options[service].enabled
+			divs[service].toggle.current.checked = r.options[service].enabled
+		}
 
 		let url
 		try {
@@ -113,13 +104,17 @@ browser.storage.local.get("popupServices", r => {
 
 for (const service in config.services) {
 	divs[service].toggle.all.addEventListener("change", () => {
-		browser.storage.local.set({
-			[service + "Enabled"]: divs[service].toggle.all.checked,
+		browser.storage.local.get("options", r => {
+			let options = r.options
+			options[service].enabled = divs[service].toggle.all.checked
+			browser.storage.local.set({ options })
 		})
 	})
 	divs[service].toggle.current.addEventListener("change", () => {
-		browser.storage.local.set({
-			[service + "Enabled"]: divs[service].toggle.current.checked,
+		browser.storage.local.get("options", r => {
+			let options = r.options
+			options[service].enabled = divs[service].toggle.current.checked
+			browser.storage.local.set({ options })
 		})
 	})
 }
diff --git a/src/pages/widgets/switches.ejs b/src/pages/widgets/switches.ejs
index 45bcd790..e3ffdae7 100644
--- a/src/pages/widgets/switches.ejs
+++ b/src/pages/widgets/switches.ejs
@@ -1,11 +1,11 @@
-<% for (const service in config.services) { -%>
-<div class="<%= service %> some-block"><a class="title" href="<%= config.services[service].url %>">
-  <% if (config.services[service].imageType != "svgMono") { _%>
-  <img src="../../assets/images/<%= service %>-icon.<%= config.services[service].imageType %>"/>
+<% for (const service in services) { -%>
+<div class="<%= service %> some-block"><a class="title" href="<%= services[service].url %>">
+  <% if (services[service].imageType != "svgMono") { _%>
+  <img src="../../assets/images/<%= service %>-icon.<%= services[service].imageType %>"/>
   <% } else { _%>
   <%- include ('src/assets/images/' + service + '-icon.svg') %>
   <% } _%>
-  <h4 data-localise="__MSG_<%= service %>__"><%= config.services[service].name %></h4></a>
+  <h4 data-localise="__MSG_<%= service %>__"><%= services[service].name %></h4></a>
   <input class="<%= service %>-enabled" type="checkbox"/>
 </div>
 <% } %>