WIP: Optimization, resolve incorrect protocol storage, unified protocol settings...

Optmizations still throw a lot of errors, this will be resolved

Custom instances of previously unused protocols do not save, this will be resolved

Track version number locally for easier config migration in the future

38 files changed, 920 insertions, 684 deletions

diff --git a/src/pages/options/widgets/general.js b/src/pages/options/widgets/general.js
index c0faf410..106bd532 100644
--- a/src/pages/options/widgets/general.js
+++ b/src/pages/options/widgets/general.js
@@ -151,9 +151,9 @@ resetSettings.addEventListener("click",
 );
 
 let autoRedirectElement = document.getElementById("auto-redirect")
-autoRedirectElement.addEventListener("change",
-  event => browser.storage.local.set({ autoRedirect: event.target.checked })
-);
+autoRedirectElement.addEventListener("change", event => {
+  browser.storage.local.set({ autoRedirect: event.target.checked })
+});
 
 let themeElement = document.getElementById("theme");
 themeElement.addEventListener("change", event => {
@@ -162,6 +162,18 @@ themeElement.addEventListener("change", event => {
   location.reload();
 })
 
+let protocolElement = document.getElementById("protocol");
+protocolElement.addEventListener("change", event => {
+  const value = event.target.options[protocol.selectedIndex].value;
+  browser.storage.local.set({ protocol: value });
+  location.reload();
+})
+
+let protocolFallbackElement = document.getElementById("protocol-fallback")
+protocolFallbackElement.addEventListener("change", event => {
+  browser.storage.local.set({ protocolFallback: event.target.checked});
+})
+
 let nameCustomInstanceInput = document.getElementById("exceptions-custom-instance");
 let instanceTypeElement = document.getElementById("exceptions-custom-instance-type");
 let instanceType = "url"
@@ -188,12 +200,23 @@ browser.storage.local.get(
     'theme',
     'autoRedirect',
     'exceptions',
+    'protocol',
+    'protocolFallback'
     // 'firstPartyIsolate'
   ],
   r => {
     autoRedirectElement.checked = r.autoRedirect;
     themeElement.value = r.theme;
+    protocolElement.value = r.protocol;
+    protocolFallbackElement.checked = r.protocolFallback;
     // firstPartyIsolate.checked = r.firstPartyIsolate;
+    
+    if (protocolElement.value == "normal") {
+      protocolFallbackElement.style.display = 'none';
+    } else {
+      protocolFallbackElement.style.display = 'block';
+    }
+
 
     instanceTypeElement.addEventListener("change",
       event => {
diff --git a/src/pages/options/widgets/general.pug b/src/pages/options/widgets/general.pug
index 920d2b54..e6e80afb 100644
--- a/src/pages/options/widgets/general.pug
+++ b/src/pages/options/widgets/general.pug
@@ -15,6 +15,19 @@ section#general_page.option-block
         input#firstPartyIsolate(type="checkbox")
 
     .some-block.option-block
+        h4(data-localise="__MSG_protocol__")
+        select#protocol
+            option(value="normal" data-localise="__MSG_normal__") Normal
+            option(value="tor") Tor
+            option(value="i2p") I2P
+            option(value="loki") Lokinet
+
+    #protocol-fallback
+        .some-block.option-block
+            h4(data-localise="__MSG_protocolFallback__") Fallback to normal if no frontends are available for the current protocol
+            input#protocol-fallback(type="checkbox")
+
+    .some-block.option-block
         h4(data-localise="__MSG_autoRedirect__")
         input#auto-redirect(type="checkbox")
 
@@ -188,4 +201,4 @@ section#general_page.option-block
             input#sendTargets(type="checkbox")
 
 
-    script(type="module" src="./widgets/general.js")
\ No newline at end of file
+    script(type="module" src="./widgets/general.js")
diff --git a/src/pages/options/widgets/imdb.js b/src/pages/options/widgets/imdb.js
index f2c6cba5..ad115e93 100644
--- a/src/pages/options/widgets/imdb.js
+++ b/src/pages/options/widgets/imdb.js
@@ -1,42 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("libremdb")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("imdb-enable");
-const protocol = document.getElementById("imdb-protocol")
 const imdb = document.getElementById('imdb_page');
+//const frontend = document.getElementById("imdb-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    const normalDiv = imdb.getElementsByClassName("normal")[0];
-    const torDiv = imdb.getElementsByClassName("tor")[0];
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+/*
+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'
+        }
     }
 }
+*/
 
-imdb.addEventListener("change", () => {
-    changeProtocolSettings();
-    browser.storage.local.set({
-        disableImdb: !enable.checked,
-        imdbProtocol: protocol.value,
-    })
-})
+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",
-        "imdbProtocol"
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableImdb;
-        protocol.value = r.imdbProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
     }
 )
 
-utils.processDefaultCustomInstances('imdb', 'libremdb', 'normal', document);
-utils.processDefaultCustomInstances('imdb', 'libremdb', 'tor', document);
-utils.latency('imdb', 'libremdb', document, location)
\ No newline at end of file
+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/imdb.pug b/src/pages/options/widgets/imdb.pug
index 07749144..008e1c00 100644
--- a/src/pages/options/widgets/imdb.pug
+++ b/src/pages/options/widgets/imdb.pug
@@ -6,12 +6,6 @@ section#imdb_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#imdb-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#imdb-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
     #libremdb
         hr
         .normal
@@ -21,6 +15,12 @@ section#imdb_page.option-block
             +latency('libremdb')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://libremdb.onion')
+            +instances('http://libremdb.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://libremdb.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://libremdb.loki')
 
-    script(type="module" src="./widgets/imdb.js")
\ No newline at end of file
+    script(type="module" src="./widgets/imdb.js")
diff --git a/src/pages/options/widgets/imgur.js b/src/pages/options/widgets/imgur.js
index ffb28405..475bf472 100644
--- a/src/pages/options/widgets/imgur.js
+++ b/src/pages/options/widgets/imgur.js
@@ -1,53 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("rimgo")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("imgur-enable");
-const protocol = document.getElementById("imgur-protocol")
 const imgur = document.getElementById('imgur_page');
+//const frontend = document.getElementById("imgur-frontend");
+let protocol
 
-const normalDiv = imgur.getElementsByClassName("normal")[0];
-const torDiv = imgur.getElementsByClassName("tor")[0];
-const i2pDiv = imgur.getElementsByClassName("i2p")[0];
+/*
+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() {
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.style.display = 'none';
-        i2pDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
-        i2pDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'i2p') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'none';
-        i2pDiv.style.display = 'block';
+    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",
-        "imgurProtocol",
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableImgur;
-        protocol.value = r.imgurProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
     }
 );
 
 imgur.addEventListener("change", () => {
-    changeProtocolSettings();
-    browser.storage.local.set({
-        disableImgur: !enable.checked,
-        imgurProtocol: protocol.value,
-    });
+    browser.storage.local.set({ disableImgur: !enable.checked });
 })
 
-utils.processDefaultCustomInstances('imgur', 'rimgo', 'normal', document);
-utils.processDefaultCustomInstances('imgur', 'rimgo', 'tor', document);
-utils.processDefaultCustomInstances('imgur', 'rimgo', 'i2p', document);
-
-utils.latency('imgur', 'rimgo', document, location)
\ No newline at end of file
+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/imgur.pug b/src/pages/options/widgets/imgur.pug
index 5e514341..eacd066e 100644
--- a/src/pages/options/widgets/imgur.pug
+++ b/src/pages/options/widgets/imgur.pug
@@ -7,13 +7,6 @@ section#imgur_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#imgur-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#imgur-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-            option(value="i2p" data-localise="__MSG_i2p__") I2P
-
     #rimgo
         hr
         .normal
@@ -23,10 +16,12 @@ section#imgur_page.option-block
             +latency('rimgo')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://rimgo.onion')
-
+            +instances('http://rimgo.onion')
         .i2p
             include ../../widgets/instances.pug
-            +instances('https://rimgo.onion')
+            +instances('http://rimgo.onion')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://rimgo.loki')
 
-    script(type="module" src="./widgets/imgur.js")
\ No newline at end of file
+    script(type="module" src="./widgets/imgur.js")
diff --git a/src/pages/options/widgets/instagram.js b/src/pages/options/widgets/instagram.js
index 8bd1a101..84456845 100644
--- a/src/pages/options/widgets/instagram.js
+++ b/src/pages/options/widgets/instagram.js
@@ -1,45 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
-const enable = document.getElementById("instagram-enable");
-const protocol = document.getElementById("instagram-protocol");
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("bibliogram")
+const protocols = new Array("normal", "tor", "i2p", "loki")
 
+const enable = document.getElementById("instagram-enable");
 const instagram = document.getElementById('instagram_page')
-const normalDiv = instagram.getElementsByClassName("normal")[0];
-const torDiv = instagram.getElementsByClassName("tor")[0];
+//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() {
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+    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",
-        "instagramProtocol"
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableInstagram;
-        protocol.value = r.instagramProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
     }
 )
 
 instagram.addEventListener("change", () => {
-    changeProtocolSettings();
-    browser.storage.local.set({
-        disableInstagram: !enable.checked,
-        instagramProtocol: protocol.value,
-    })
+    browser.storage.local.set({ disableInstagram: !enable.checked })
 })
 
-
-utils.processDefaultCustomInstances('instagram', 'bibliogram', 'normal', document);
-utils.processDefaultCustomInstances('instagram', 'bibliogram', 'tor', document);
-
-utils.latency('instagram', 'bibliogram', document, location)
\ No newline at end of file
+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/instagram.pug b/src/pages/options/widgets/instagram.pug
index 47cfcdbc..cc72f787 100644
--- a/src/pages/options/widgets/instagram.pug
+++ b/src/pages/options/widgets/instagram.pug
@@ -7,12 +7,6 @@ section#instagram_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#instagram-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#instagram-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
     #bibliogram
         hr
         .normal
@@ -21,6 +15,13 @@ section#instagram_page.option-block
             include ../../widgets/latency.pug
             +latency('bibliogram')
         .tor
+            include ../../widgets/instances.pug
             +instances('https://bibliogram.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://bibliogram.onion')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://bibliogram.loki')
 
-    script(type="module" src="./widgets/instagram.js")
\ No newline at end of file
+    script(type="module" src="./widgets/instagram.js")
diff --git a/src/pages/options/widgets/lbry.js b/src/pages/options/widgets/lbry.js
index 131aa566..645017ff 100644
--- a/src/pages/options/widgets/lbry.js
+++ b/src/pages/options/widgets/lbry.js
@@ -1,44 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
-const enable = document.getElementById("lbry-enable");
-const protocol = document.getElementById("lbry-protocol")
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("librarian")
+const protocols = new Array("normal", "tor", "i2p", "loki")
 
+const enable = document.getElementById("lbry-enable");
 const lbry = document.getElementById('lbry_page');
-const normalDiv = lbry.getElementsByClassName("normal")[0];
-const torDiv = lbry.getElementsByClassName("tor")[0];
+//const frontend = document.getElementById("lbry-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.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'
+        }
     }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+}
+*/
+
+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",
-        "lbryTargetsProtocol"
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableLbryTargets;
-        protocol.value = r.lbryTargetsProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
     }
 )
 
 lbry.addEventListener("change", () => {
-    changeProtocolSettings()
-    browser.storage.local.set({
-        disableLbryTargets: !enable.checked,
-        lbryTargetsProtocol: protocol.value,
-    });
+    browser.storage.local.set({ disableLbryTargets: !enable.checked });
 })
 
-utils.processDefaultCustomInstances('lbryTargets', 'librarian', 'normal', document);
-utils.processDefaultCustomInstances('lbryTargets', 'librarian', 'tor', document);
-
-utils.latency('lbryTargets', 'librarian', document, location)
\ No newline at end of file
+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/lbry.pug b/src/pages/options/widgets/lbry.pug
index 4e88d2bf..2bdccb5a 100644
--- a/src/pages/options/widgets/lbry.pug
+++ b/src/pages/options/widgets/lbry.pug
@@ -6,12 +6,6 @@ section#lbry_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#lbry-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#lbry-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
     #librarian
         hr
         .normal
@@ -22,5 +16,11 @@ section#lbry_page.option-block
         .tor
             include ../../widgets/instances.pug
             +instances('https://librarian.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://librarian.onion')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://librarian.loki')
 
-    script(type="module" src="./widgets/lbry.js")
\ No newline at end of file
+    script(type="module" src="./widgets/lbry.js")
diff --git a/src/pages/options/widgets/maps.js b/src/pages/options/widgets/maps.js
index b9825fb0..9e4be6d3 100644
--- a/src/pages/options/widgets/maps.js
+++ b/src/pages/options/widgets/maps.js
@@ -1,34 +1,64 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+const frontends = new Array("facil")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("maps-enable");
+const maps = document.getElementById('maps_page');
 const frontend = document.getElementById("maps-frontend");
+let protocol
 
-const maps = document.getElementById('maps_page');
-const facilDiv = document.getElementById("facil")
+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() {
-    if (frontend.value == 'facil') facilDiv.style.display = 'block';
-    else if (frontend.value == 'osm') facilDiv.style.display = 'none';
+    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",
-        "mapsFrontend",
+        "protocol",
+        "mapsFrontend"
     ],
     r => {
         enable.checked = !r.disableMaps;
+        protocol = r.protocol;
         frontend.value = r.mapsFrontend;
         changeFrontendsSettings();
+        changeProtocolSettings();
     }
 )
 
 maps.addEventListener("change", () => {
-    changeFrontendsSettings();
     browser.storage.local.set({
         disableMaps: !enable.checked,
-        mapsFrontend: frontend.value,
-    })
+        mapsFrontend: frontend.value
+    });
+    changeFrontendsSettings();
 })
 
-utils.processDefaultCustomInstances('maps', 'facil', 'normal', document);
\ No newline at end of file
+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/maps.pug b/src/pages/options/widgets/maps.pug
index 42c81d8e..f220e35e 100644
--- a/src/pages/options/widgets/maps.pug
+++ b/src/pages/options/widgets/maps.pug
@@ -19,5 +19,14 @@ section#maps_page.option-block
             +instances('https://facilmap.com')
             include ../../widgets/latency.pug
             +latency('facilmap')
+        .tor
+            +instances('http://facilmap.onion')
+            include ../../widgets/instances.pug
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://facilmap.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://facilmap.loki')
 
-    script(type="module" src="./widgets/maps.js")
\ No newline at end of file
+    script(type="module" src="./widgets/maps.js")
diff --git a/src/pages/options/widgets/medium.js b/src/pages/options/widgets/medium.js
index ef5965be..765a956c 100644
--- a/src/pages/options/widgets/medium.js
+++ b/src/pages/options/widgets/medium.js
@@ -1,42 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("scribe")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("medium-enable");
-const protocol = document.getElementById("medium-protocol")
 const medium = document.getElementById('medium_page');
+//const frontend = document.getElementById("medium-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    const normalDiv = medium.getElementsByClassName("normal")[0];
-    const torDiv = medium.getElementsByClassName("tor")[0];
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+/*
+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'
+        }
     }
 }
+*/
 
-medium.addEventListener("change", () => {
-    changeProtocolSettings();
-    browser.storage.local.set({
-        disableMedium: !enable.checked,
-        mediumProtocol: protocol.value,
-    })
-})
+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",
-        "mediumProtocol"
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableMedium;
-        protocol.value = r.mediumProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
     }
 )
 
-utils.processDefaultCustomInstances('medium', 'scribe', 'normal', document);
-utils.processDefaultCustomInstances('medium', 'scribe', 'tor', document);
-utils.latency('medium', 'scribe', document, location)
\ No newline at end of file
+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/medium.pug b/src/pages/options/widgets/medium.pug
index f0a1ad55..4eef0511 100644
--- a/src/pages/options/widgets/medium.pug
+++ b/src/pages/options/widgets/medium.pug
@@ -6,12 +6,6 @@ section#medium_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#medium-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#medium-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
     #scribe
         hr
         .normal
@@ -21,6 +15,12 @@ section#medium_page.option-block
             +latency('scribe')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://scribe.onion')
+            +instances('http://scribe.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://scribe.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://scribe.loki')
 
-    script(type="module" src="./widgets/medium.js")
\ No newline at end of file
+    script(type="module" src="./widgets/medium.js")
diff --git a/src/pages/options/widgets/peertube.js b/src/pages/options/widgets/peertube.js
index 01b4f6b5..9e994119 100644
--- a/src/pages/options/widgets/peertube.js
+++ b/src/pages/options/widgets/peertube.js
@@ -1,42 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("simpleertube")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("peertube-enable");
-const protocol = document.getElementById("peertube-protocol");
 const peertube = document.getElementById('peertube_page');
+//const frontend = document.getElementById("peertube-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    const normalDiv = peertube.getElementsByClassName("normal")[0];
-    const torDiv = peertube.getElementsByClassName("tor")[0];
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.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'
+        }
     }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+}
+*/
+
+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",
-        "peertubeTargetsProtocol"
+        "protocol"
     ],
     r => {
         enable.checked = !r.disablePeertubeTargets;
-        protocol.value = r.peertubeTargetsProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
     }
 )
 
 peertube.addEventListener("change", () => {
-    changeProtocolSettings();
-    browser.storage.local.set({
-        disablePeertubeTargets: !enable.checked,
-        peertubeTargetsProtocol: protocol.value
-    })
+    browser.storage.local.set({ disablePeertubeTargets: !enable.checked })
 })
 
-utils.processDefaultCustomInstances('peertube', 'simpleertube', 'normal', document);
-utils.processDefaultCustomInstances('peertube', 'simpleertube', 'tor', document);
-utils.latency('peertube', 'simpleertube', document, location)
\ No newline at end of file
+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/peertube.pug b/src/pages/options/widgets/peertube.pug
index 0beec59c..38690d04 100644
--- a/src/pages/options/widgets/peertube.pug
+++ b/src/pages/options/widgets/peertube.pug
@@ -6,12 +6,6 @@ section#peertube_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#peertube-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#peertube-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
     #simpleertube
         hr
         .normal
@@ -21,6 +15,12 @@ section#peertube_page.option-block
             +latency('simpleertube')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://simpleertube.onion')
+            +instances('http://simpleertube.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://simpleertube.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://simpleertube.loki')
 
-    script(type="module" src="./widgets/peertube.js")
\ No newline at end of file
+    script(type="module" src="./widgets/peertube.js")
diff --git a/src/pages/options/widgets/quora.js b/src/pages/options/widgets/quora.js
index dfa1b6aa..ded21e57 100644
--- a/src/pages/options/widgets/quora.js
+++ b/src/pages/options/widgets/quora.js
@@ -1,42 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("quetre")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("quora-enable");
-const protocol = document.getElementById("quora-protocol")
 const quora = document.getElementById('quora_page');
+//const frontend = document.getElementById("quora-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    const normalDiv = quora.getElementsByClassName("normal")[0];
-    const torDiv = quora.getElementsByClassName("tor")[0];
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+/*
+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'
+        }
     }
 }
+*/
 
-quora.addEventListener("change", () => {
-    changeProtocolSettings();
-    browser.storage.local.set({
-        disableQuora: !enable.checked,
-        quoraProtocol: protocol.value,
-    })
-})
+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",
-        "quoraProtocol"
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableQuora;
-        protocol.value = r.quoraProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
     }
 )
 
-utils.processDefaultCustomInstances('quora', 'quetre', 'normal', document);
-utils.processDefaultCustomInstances('quora', 'quetre', 'tor', document);
-utils.latency('quora', 'quetre', document, location)
\ No newline at end of file
+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/quora.pug b/src/pages/options/widgets/quora.pug
index 8f5fe639..9e45abc9 100644
--- a/src/pages/options/widgets/quora.pug
+++ b/src/pages/options/widgets/quora.pug
@@ -6,12 +6,6 @@ section#quora_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#quora-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#quora-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
     #quetre
         hr
         .normal
@@ -21,6 +15,12 @@ section#quora_page.option-block
             +latency('quetre')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://quetre.onion')
+            +instances('http://quetre.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://quetre.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://quetre.loki')
 
-    script(type="module" src="./widgets/quora.js")
\ No newline at end of file
+    script(type="module" src="./widgets/quora.js")
diff --git a/src/pages/options/widgets/reddit.js b/src/pages/options/widgets/reddit.js
index 9e4dfedd..a32632d2 100644
--- a/src/pages/options/widgets/reddit.js
+++ b/src/pages/options/widgets/reddit.js
@@ -1,52 +1,47 @@
 import utils from "../../../assets/javascripts/utils.js";
 
-const libredditDivElement = document.getElementById("libreddit")
-const tedditDivElement = document.getElementById("teddit")
+const frontends = new Array("libreddit", "teddit")
+const protocols = new Array("normal", "tor", "i2p", "loki")
 
 const enable = document.getElementById("reddit-enable");
-const frontend = document.getElementById("reddit-frontend");
-const protocol = document.getElementById("reddit-protocol");
 const reddit = document.getElementById('reddit_page');
+const frontend = document.getElementById("reddit-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    const normalLibredditDiv = libredditDivElement.getElementsByClassName("normal")[0];
-    const torLibredditDiv = libredditDivElement.getElementsByClassName("tor")[0];
-    const normalTedditDiv = tedditDivElement.getElementsByClassName("normal")[0];
-    const torTedditDiv = tedditDivElement.getElementsByClassName("tor")[0];
-    if (protocol.value == 'normal') {
-        normalLibredditDiv.style.display = 'block';
-        normalTedditDiv.style.display = 'block';
-        torTedditDiv.style.display = 'none';
-        torLibredditDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'tor') {
-        normalLibredditDiv.style.display = 'none';
-        normalTedditDiv.style.display = 'none';
-        torTedditDiv.style.display = 'block';
-        torLibredditDiv.style.display = 'block';
+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 changeFrontendsSettings() {
-    if (frontend.value == 'libreddit') {
-        libredditDivElement.style.display = 'block';
-        tedditDivElement.style.display = 'none';
-    }
-    else if (frontend.value == 'teddit') {
-        libredditDivElement.style.display = 'none';
-        tedditDivElement.style.display = 'block';
+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",
-        "redditProtocol",
+        "protocol",
         "redditFrontend",
     ],
     r => {
         enable.checked = !r.disableReddit
-        protocol.value = r.redditProtocol
+        protocol = r.protocol
         frontend.value = r.redditFrontend
         changeFrontendsSettings();
         changeProtocolSettings();
@@ -56,17 +51,14 @@ browser.storage.local.get(
 reddit.addEventListener("change", () => {
     browser.storage.local.set({
         disableReddit: !enable.checked,
-        redditProtocol: protocol.value,
-        redditFrontend: frontend.value,
+        redditFrontend: frontend.value
     });
     changeFrontendsSettings();
-    changeProtocolSettings();
 })
 
-utils.processDefaultCustomInstances('reddit', 'libreddit', 'normal', document);
-utils.processDefaultCustomInstances('reddit', 'libreddit', 'tor', document);
-utils.processDefaultCustomInstances('reddit', 'teddit', 'normal', document);
-utils.processDefaultCustomInstances('reddit', 'teddit', 'tor', document);
-
-utils.latency('reddit', 'libreddit', document, location, true)
-utils.latency('reddit', 'teddit', document, location, true)
\ No newline at end of file
+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/reddit.pug b/src/pages/options/widgets/reddit.pug
index 74b8d82e..1726f9ce 100644
--- a/src/pages/options/widgets/reddit.pug
+++ b/src/pages/options/widgets/reddit.pug
@@ -12,12 +12,6 @@ section#reddit_page.option-block
             option(value="libreddit") Libreddit
             option(value="teddit") Teddit
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#reddit-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
     #libreddit
         hr
         .normal
@@ -27,7 +21,13 @@ section#reddit_page.option-block
             +latency('libreddit')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://libreddit.onion')
+            +instances('http://libreddit.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://libreddit.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://libreddit.loki')
 
     #teddit
         hr
@@ -37,6 +37,12 @@ section#reddit_page.option-block
             +latency('teddit')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://teddit.onion')
+            +instances('http://teddit.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://teddit.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://teddit.loki')
 
-    script(type="module" src="./widgets/reddit.js")
\ No newline at end of file
+    script(type="module" src="./widgets/reddit.js")
diff --git a/src/pages/options/widgets/reuters.js b/src/pages/options/widgets/reuters.js
index 08e8f988..297e3e70 100644
--- a/src/pages/options/widgets/reuters.js
+++ b/src/pages/options/widgets/reuters.js
@@ -1,43 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("neuters")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("reuters-enable");
-const protocol = document.getElementById("reuters-protocol")
 const reuters = document.getElementById('reuters_page');
+//const frontend = document.getElementById("reuters-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    const normalDiv = reuters.getElementsByClassName("normal")[0];
-    const torDiv = reuters.getElementsByClassName("tor")[0];
-    if (protocol.value == 'normal') {
-        
-        normalDiv.style.display = 'block';
-        torDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+/*
+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'
+        }
     }
 }
+*/
 
-reuters.addEventListener("change", () => {
-    changeProtocolSettings();
-    browser.storage.local.set({
-        disableReuters: !enable.checked,
-        reutersProtocol: protocol.value,
-    })
-})
+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",
-        "reutersProtocol"
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableReuters;
-        protocol.value = r.reutersProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
     }
 )
 
-utils.processDefaultCustomInstances('reuters', 'neuters', 'normal', document);
-utils.processDefaultCustomInstances('reuters', 'neuters', 'tor', document);
-utils.latency('reuters', 'neuters', document, location)
\ No newline at end of file
+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/reuters.pug b/src/pages/options/widgets/reuters.pug
index c1a1ee43..08a37d50 100644
--- a/src/pages/options/widgets/reuters.pug
+++ b/src/pages/options/widgets/reuters.pug
@@ -6,12 +6,6 @@ section#reuters_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#reuters-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#reuters-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
     #neuters
         hr
         .normal
@@ -21,6 +15,12 @@ section#reuters_page.option-block
             +latency('neuters')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://neuters.onion')
+            +instances('http://neuters.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://neuters.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://neuters.loki')
 
-    script(type="module" src="./widgets/reuters.js")
\ No newline at end of file
+    script(type="module" src="./widgets/reuters.js")
diff --git a/src/pages/options/widgets/search.js b/src/pages/options/widgets/search.js
index 0af37343..7cadf143 100644
--- a/src/pages/options/widgets/search.js
+++ b/src/pages/options/widgets/search.js
@@ -5,7 +5,7 @@ import utils from "../../../assets/javascripts/utils.js";
 
 // 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("normal", "tor", "i2p")
+const protocols = new Array("normal", "tor", "i2p", "loki")
 //let frontendProtocols = (frontends.length)
 
 // I will leave comments of my privious attemps so that people can learn from my mistakes. :)
@@ -36,11 +36,9 @@ const whoogleDiv = document.getElementById("whoogle");
 */
 
 const enable = document.getElementById("search-enable");
-const frontend = document.getElementById("search-frontend");
-const protocol = document.getElementById("search-protocol");
-
 const search = document.getElementById('search_page');
-
+const frontend = document.getElementById("search-frontend");
+let protocol
 
 function changeFrontendsSettings() {
   for (let i = 0; i < frontends.length; i++) {
@@ -88,18 +86,20 @@ 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.
+    //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.value) { //if the frontend value equals the selected one, it will show. Otherwise, it will be hidden
+        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
     }
+    */
   }
 
 
@@ -172,12 +172,12 @@ browser.storage.local.get(
   [
     "disableSearch",
     "searchFrontend",
-    "searchProtocol",
+    "protocol",
   ],
   r => {
     enable.checked = !r.disableSearch;
     frontend.value = r.searchFrontend;
-    protocol.value = r.searchProtocol;
+    protocol = r.protocol;
 
     changeFrontendsSettings();
     changeProtocolSettings();
@@ -188,17 +188,15 @@ 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, true)
+  utils.latency('search', frontends[i], document, location)
 }
 
 search.addEventListener("change", () => {
   browser.storage.local.set({
     disableSearch: !enable.checked,
     searchFrontend: frontend.value,
-    searchProtocol: protocol.value,
   });
-  changeFrontendsSettings(frontend.value);
-  changeProtocolSettings(protocol.value);
+  changeFrontendsSettings();
 })
 
 /*
diff --git a/src/pages/options/widgets/search.pug b/src/pages/options/widgets/search.pug
index ec075f79..8f23350e 100644
--- a/src/pages/options/widgets/search.pug
+++ b/src/pages/options/widgets/search.pug
@@ -1,4 +1,3 @@
-
 section#search_page.option-block
     .some-block.option-block
         h1(data-localise="__MSG_search__") Search
@@ -15,13 +14,6 @@ section#search_page.option-block
             option(value="whoogle") Whoogle
             option(value="librex") LibreX
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#search-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-            option(value="i2p" data-localise="__MSG_i2p__") I2P
-
     .some-block
         h4(data-localise="__MSG_searchNote__") Note: To use Search, make LibRedirect the Default Search Engine
 
@@ -38,6 +30,9 @@ section#search_page.option-block
         .i2p
             include ../../widgets/instances.pug
             +instances('http://searx.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://searx.loki')
 
     #searxng
         hr
@@ -51,6 +46,9 @@ section#search_page.option-block
         .i2p
             include ../../widgets/instances.pug
             +instances('http://searxng.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://searxng.loki')
 
     #whoogle
         hr
@@ -64,6 +62,9 @@ section#search_page.option-block
         .i2p
             include ../../widgets/instances.pug
             +instances('http://whoogle.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://whoogle.loki')
 
     #librex
         hr
@@ -77,5 +78,8 @@ section#search_page.option-block
         .i2p
             include ../../widgets/instances.pug
             +instances('http://librex.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://librex.loki')
 
     script(type="module" src="./widgets/search.js")
diff --git a/src/pages/options/widgets/sendTargets.js b/src/pages/options/widgets/sendTargets.js
index 1cb1e74e..27c90d4e 100644
--- a/src/pages/options/widgets/sendTargets.js
+++ b/src/pages/options/widgets/sendTargets.js
@@ -1,43 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("send")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("sendTargets-enable");
-const protocol = document.getElementById("sendTargets-protocol")
 const sendTargets = document.getElementById('sendTargets_page');
+//const frontend = document.getElementById("sendTargets-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    let normalDiv = sendTargets.getElementsByClassName("normal")[0];
-    let torDiv = sendTargets.getElementsByClassName("tor")[0];
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.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'
+        }
     }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+}
+*/
+
+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",
-        "sendTargetsProtocol",
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableSendTarget;
-        protocol.value = r.sendTargetsProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
     }
 )
 
 sendTargets.addEventListener("change", () => {
-    changeProtocolSettings();
-    browser.storage.local.set({
-        disableSendTarget: !enable.checked,
-        sendTargetsProtocol: protocol.value,
-    })
+    browser.storage.local.set({ disableSendTarget: !enable.checked })
 })
 
-utils.processDefaultCustomInstances('sendTargets', 'send', 'normal', document);
-utils.processDefaultCustomInstances('sendTargets', 'send', 'tor', document);
-
-utils.latency('sendTargets', 'send', document, location)
\ No newline at end of file
+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/sendTargets.pug b/src/pages/options/widgets/sendTargets.pug
index 5b776b0a..fc2e9e73 100644
--- a/src/pages/options/widgets/sendTargets.pug
+++ b/src/pages/options/widgets/sendTargets.pug
@@ -6,12 +6,6 @@ section#sendTargets_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#sendTargets-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#sendTargets-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
     #send
         hr
         .normal
@@ -21,6 +15,12 @@ section#sendTargets_page.option-block
             +latency('send')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://send.onion')
+            +instances('http://send.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://send.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://send.loki')
 
-    script(type="module" src="./widgets/sendTargets.js")
\ No newline at end of file
+    script(type="module" src="./widgets/sendTargets.js")
diff --git a/src/pages/options/widgets/tiktok.js b/src/pages/options/widgets/tiktok.js
index f4c31832..37c36366 100644
--- a/src/pages/options/widgets/tiktok.js
+++ b/src/pages/options/widgets/tiktok.js
@@ -1,53 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("proxiTok")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("tiktok-enable");
-const protocol = document.getElementById("tiktok-protocol")
 const tiktok = document.getElementById('tiktok_page');
+//const frontend = document.getElementById("tiktok-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    let normalDiv = tiktok.getElementsByClassName("normal")[0];
-    let torDiv = tiktok.getElementsByClassName("tor")[0];
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+/*
+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'
+        }
     }
 }
+*/
 
-tiktok.addEventListener("change", () => {
-    browser.storage.local.set({
-        disableTiktok: !enable.checked,
-        tiktokProtocol: protocol.value,
-    });
-    changeProtocolSettings();
-})
+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",
-        "tiktokProtocol",
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableTiktok;
-        protocol.value = r.tiktokProtocol;
+        protocol = r.protocol;
         changeProtocolSettings();
-        let normalDiv = document.getElementsByClassName("normal")[0];
-        let torDiv = document.getElementsByClassName("tor")[0];
-        if (r.tiktokProtocol == 'normal') {
-            normalDiv.style.display = 'block';
-            torDiv.style.display = 'none';
-        }
-        else if (r.tiktokProtocol == 'tor') {
-            normalDiv.style.display = 'none';
-            torDiv.style.display = 'block';
-        }
-    }
+      }
 )
 
-utils.processDefaultCustomInstances('tiktok', 'proxiTok', 'normal', document);
-utils.processDefaultCustomInstances('tiktok', 'proxiTok', 'tor', document);
+tiktok.addEventListener("change", () => {
+    browser.storage.local.set({ disableTiktok: !enable.checked });
+})
 
-utils.latency('tiktok', 'proxiTok', document, location)
\ No newline at end of file
+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/tiktok.pug b/src/pages/options/widgets/tiktok.pug
index f0cc39c6..29ab5e2a 100644
--- a/src/pages/options/widgets/tiktok.pug
+++ b/src/pages/options/widgets/tiktok.pug
@@ -6,12 +6,6 @@ section#tiktok_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#tiktok-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#tiktok-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-    
     #proxiTok
         hr
         .normal
@@ -21,6 +15,12 @@ section#tiktok_page.option-block
             +latency('proxiTok')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://proxitok.onion')
+            +instances('http://proxitok.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://proxitok.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://proxitok.loki')
 
     script(type="module" src="./widgets/tiktok.js")
diff --git a/src/pages/options/widgets/translate.js b/src/pages/options/widgets/translate.js
index 04869b63..87b8bb8d 100644
--- a/src/pages/options/widgets/translate.js
+++ b/src/pages/options/widgets/translate.js
@@ -1,64 +1,35 @@
 import utils from "../../../assets/javascripts/utils.js";
 
-const enable = document.getElementById("translate-enable");
-const frontend = document.getElementById("translate-frontend");
-const protocol = document.getElementById("translate-protocol");
-const simplyTranslateDiv = document.getElementById("simplyTranslate");
-const lingvaDiv = document.getElementById("lingva");
+const frontends = new Array("simplyTranslate", "lingva")
+const protocols = new Array("normal", "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() {
-    if (frontend.value == 'simplyTranslate') {
-        simplyTranslateDiv.style.display = 'block';
-        lingvaDiv.style.display = 'none';
-    }
-    else if (frontend.value == 'lingva') {
-        simplyTranslateDiv.style.display = 'none';
-        lingvaDiv.style.display = 'block';
+    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() {
-    const normalSimplyTranslateDiv = document.getElementById("simplyTranslate").getElementsByClassName("normal")[0];
-    const torSimplyTranslateDiv = document.getElementById("simplyTranslate").getElementsByClassName("tor")[0];
-    const i2pSimplyTranslateDiv = document.getElementById("simplyTranslate").getElementsByClassName("i2p")[0];
-    const lokiSimplyTranslateDiv = document.getElementById("simplyTranslate").getElementsByClassName("loki")[0];
-
-    const normalLingvaDiv = document.getElementById("lingva").getElementsByClassName("normal")[0];
-    const torLingvaDiv = document.getElementById("lingva").getElementsByClassName("tor")[0];
-
-    if (protocol.value == 'normal') {
-        normalSimplyTranslateDiv.style.display = 'block';
-        normalLingvaDiv.style.display = 'block';
-        torSimplyTranslateDiv.style.display = 'none';
-        torLingvaDiv.style.display = 'none';
-        i2pSimplyTranslateDiv.style.display = 'none';
-        lokiSimplyTranslateDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'tor') {
-        normalSimplyTranslateDiv.style.display = 'none';
-        normalLingvaDiv.style.display = 'none';
-        torSimplyTranslateDiv.style.display = 'block';
-        torLingvaDiv.style.display = 'block';
-        i2pSimplyTranslateDiv.style.display = 'none';
-        lokiSimplyTranslateDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'i2p') {
-        normalSimplyTranslateDiv.style.display = 'none';
-        normalLingvaDiv.style.display = 'none';
-        torSimplyTranslateDiv.style.display = 'none';
-        torLingvaDiv.style.display = 'none';
-        i2pSimplyTranslateDiv.style.display = 'block';
-        lokiSimplyTranslateDiv.style.display = 'none';
-    }
-    else if (protocol.value == 'loki') {
-        normalSimplyTranslateDiv.style.display = 'none';
-        normalLingvaDiv.style.display = 'none';
-        torSimplyTranslateDiv.style.display = 'none';
-        torLingvaDiv.style.display = 'none';
-        i2pSimplyTranslateDiv.style.display = 'none';
-        lokiSimplyTranslateDiv.style.display = 'block';
+    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'
+            }
+        }
     }
 }
 
@@ -66,12 +37,12 @@ browser.storage.local.get(
     [
         "translateDisable",
         "translateFrontend",
-        "translateProtocol",
+        "protocol"
     ],
     r => {
         enable.checked = !r.translateDisable;
         frontend.value = r.translateFrontend;
-        protocol.value = r.translateProtocol;
+        protocol = r.protocol;
         changeFrontendsSettings();
         changeProtocolSettings();
     }
@@ -81,19 +52,13 @@ translate.addEventListener("change", () => {
     browser.storage.local.set({
         translateDisable: !enable.checked,
         translateFrontend: frontend.value,
-        translateProtocol: protocol.value,
     })
-    changeProtocolSettings();
     changeFrontendsSettings();
 })
 
-
-utils.processDefaultCustomInstances('translate', 'simplyTranslate', 'normal', document);
-utils.processDefaultCustomInstances('translate', 'simplyTranslate', 'tor', document);
-utils.processDefaultCustomInstances('translate', 'simplyTranslate', 'i2p', document);
-utils.processDefaultCustomInstances('translate', 'simplyTranslate', 'loki', document);
-utils.processDefaultCustomInstances('translate', 'lingva', 'normal', document);
-utils.processDefaultCustomInstances('translate', 'lingva', 'tor', document);
-
-utils.latency('translate', 'simplyTranslate', document, location, true)
-utils.latency('translate', 'lingva', document, location, true)
+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/translate.pug b/src/pages/options/widgets/translate.pug
index c29d75e1..4836c0f3 100644
--- a/src/pages/options/widgets/translate.pug
+++ b/src/pages/options/widgets/translate.pug
@@ -12,14 +12,6 @@ section#translate_page.option-block
             option(value="simplyTranslate") SimplyTranslate
             option(value="lingva") Lingva
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#translate-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-            option(value="i2p" data-localise="__MSG_i2p__") I2P
-            option(value="loki" data-localise="__MSG_loki__") Lokinet
-
     hr
     #simplyTranslate
         .normal
@@ -44,6 +36,13 @@ section#translate_page.option-block
             +latency('lingva')
         .tor
             include ../../widgets/instances.pug
-            +instances('http://tyzxppdeoojdnaux.onion')
+            +instances('http://lingvatranslate.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://lingvatranslate.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://lingvatranslate.loki')
+       
 
     script(type="module" src="./widgets/translate.js")
diff --git a/src/pages/options/widgets/twitter.js b/src/pages/options/widgets/twitter.js
index aff108c8..d54fc928 100644
--- a/src/pages/options/widgets/twitter.js
+++ b/src/pages/options/widgets/twitter.js
@@ -1,32 +1,52 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("nitter")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("twitter-enable");
-const protocol = document.getElementById("twitter-protocol");
-const redirectType = document.getElementById("twitter-redirect_type");
 const twitter = document.getElementById('twitter_page');
+const redirectType = document.getElementById("twitter-redirect_type");
+//const frontend = document.getElementById("twitter-frontend");
+let protocol
 
-function changeProtocolSettings() {
-    let normalDiv = twitter.getElementsByClassName("normal")[0];
-    let torDiv = twitter.getElementsByClassName("tor")[0];
-    if (protocol.value == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.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'
+        }
     }
-    else if (protocol.value == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
+}
+*/
+
+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",
-        "twitterProtocol",
-        "twitterRedirectType",
+        "protocol",
+        "twitterRedirectType"
     ],
     r => {
         enable.checked = !r.disableTwitter;
-        protocol.value = r.twitterProtocol;
+        protocol = r.protocol;
         redirectType.value = r.twitterRedirectType;
         changeProtocolSettings();
     }
@@ -35,13 +55,13 @@ browser.storage.local.get(
 twitter.addEventListener("change", () => {
     browser.storage.local.set({
         disableTwitter: !enable.checked,
-        twitterProtocol: protocol.value,
         twitterRedirectType: redirectType.value,
     });
-    changeProtocolSettings();
 })
 
-utils.processDefaultCustomInstances('twitter', 'nitter', 'normal', document);
-utils.processDefaultCustomInstances('twitter', 'nitter', 'tor', document)
-
-utils.latency('twitter', 'nitter', document, location, true)
\ No newline at end of file
+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/twitter.pug b/src/pages/options/widgets/twitter.pug
index c2e949ca..6e610545 100644
--- a/src/pages/options/widgets/twitter.pug
+++ b/src/pages/options/widgets/twitter.pug
@@ -7,12 +7,6 @@ section#twitter_page.option-block
         input#twitter-enable(type="checkbox")
 
     .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#twitter-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-
-    .some-block.option-block
         h4(data-localise="__MSG_redirectType__") Redirect Type
         select#twitter-redirect_type
             option(value="both" data-localise="__MSG_both__") both
@@ -27,6 +21,13 @@ section#twitter_page.option-block
             include ../../widgets/latency.pug
             +latency('nitter')
         .tor
-            +instances('https://nitter.onion')
+            include ../../widgets/instances.pug
+            +instances('http://nitter.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://nitter.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://nitter.loki')
 
     script(type="module" src="./widgets/twitter.js")
diff --git a/src/pages/options/widgets/wikipedia.js b/src/pages/options/widgets/wikipedia.js
index c9e582be..09b21d02 100644
--- a/src/pages/options/widgets/wikipedia.js
+++ b/src/pages/options/widgets/wikipedia.js
@@ -1,52 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("wikiless")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+
 const enable = document.getElementById("wikipedia-enable");
-const protocolElement = document.getElementById("wikipedia-protocol");
 const wikipedia = document.getElementById('wikipedia_page');
+//const frontend = document.getElementById("wikipedia-frontend");
+let protocol
 
-function changeProtocolSettings(protocol) {
-    const normalDiv = wikipedia.getElementsByClassName("normal")[0];
-    const torDiv = wikipedia.getElementsByClassName("tor")[0];
-    const i2pDiv = wikipedia.getElementsByClassName("i2p")[0];
-    if (protocol == 'normal') {
-        normalDiv.style.display = 'block';
-        torDiv.style.display = 'none';
-        i2pDiv.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'
+        }
     }
-    else if (protocol == 'tor') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'block';
-        i2pDiv.style.display = 'none';
-    }
-    else if (protocol == 'i2p') {
-        normalDiv.style.display = 'none';
-        torDiv.style.display = 'none';
-        i2pDiv.style.display = 'block';
+}
+*/
+
+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",
-        "wikipediaProtocol",
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableWikipedia;
-        protocolElement.value = r.wikipediaProtocol;
-        changeProtocolSettings(r.wikipediaProtocol);
+        protocol = r.protocol;
+        changeProtocolSettings();
     }
 )
 
 wikipedia.addEventListener("change", () => {
-    browser.storage.local.set({
-        disableWikipedia: !enable.checked,
-        wikipediaProtocol: protocolElement.value,
-    })
-    changeProtocolSettings(protocolElement.value)
+    browser.storage.local.set({ disableWikipedia: !enable.checked })
 })
 
-utils.processDefaultCustomInstances('wikipedia', 'wikiless', 'normal', document);
-utils.processDefaultCustomInstances('wikipedia', 'wikiless', 'tor', document);
-utils.processDefaultCustomInstances('wikipedia', 'wikiless', 'i2p', document);
-
-utils.latency('wikipedia', 'wikiless', document, location)
\ No newline at end of file
+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/wikipedia.pug b/src/pages/options/widgets/wikipedia.pug
index a0315739..c9aee64c 100644
--- a/src/pages/options/widgets/wikipedia.pug
+++ b/src/pages/options/widgets/wikipedia.pug
@@ -6,13 +6,6 @@ section#wikipedia_page.option-block
         h4(data-localise="__MSG_enable__") Enable
         input#wikipedia-enable(type="checkbox")
 
-    .some-block.option-block
-        h4(data-localise="__MSG_protocol__") Protocol
-        select#wikipedia-protocol
-            option(value="normal" data-localise="__MSG_normal__") Normal
-            option(value="tor" data-localise="__MSG_tor__") Tor
-            option(value="i2p" data-localise="__MSG_i2p__") I2P
-
     #wikiless
         hr
         .normal
@@ -22,10 +15,12 @@ section#wikipedia_page.option-block
             +latency('wikiless')
         .tor
             include ../../widgets/instances.pug
-            +instances('https://wikiless.onion')
-
+            +instances('http://wikiless.onion')
         .i2p
             include ../../widgets/instances.pug
             +instances('https://wikiless.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://wikiless.loki')
 
     script(type="module" src="./widgets/wikipedia.js")
diff --git a/src/pages/options/widgets/youtube.js b/src/pages/options/widgets/youtube.js
index 26867643..76b673bd 100644
--- a/src/pages/options/widgets/youtube.js
+++ b/src/pages/options/widgets/youtube.js
@@ -1,114 +1,66 @@
-import youtubeHelper from "../../../assets/javascripts/youtube/youtube.js";
 import utils from "../../../assets/javascripts/utils.js";
 
+const frontends = new Array("invidious", "piped", "pipedMaterial")
+const protocols = new Array("normal", "tor", "i2p", "loki")
+const singleInstanceFrontends = new Array("freetube", "yatte")
+
 const enable = document.getElementById("youtube-enable");
-const frontend = document.getElementById("youtube-frontend");
+const youtube = document.getElementById('youtube_page');
 const youtubeEmbedFrontend = document.getElementById("youtube-embed_frontend");
 const onlyEmbeddedVideo = document.getElementById("youtube-redirect_type");
-const protocol = document.getElementById("youtube-protocol");
-const youtube = document.getElementById('youtube_page');
-
-const invidiousDiv = document.getElementById("invidious");
-const pipedDiv = document.getElementById("piped");
-const pipedMaterialDiv = document.getElementById("pipedMaterial");
-const freetubeYatteeDiv = document.getElementById("freetube-yatte");
+const embeddedFrontendDiv = document.getElementById("youtube-embedded_frontend");
+const frontend = document.getElementById("youtube-frontend");
+let protocol
 
-function changeFrontendsSettings() {
-    if (frontend.value == 'invidious') {
-        invidiousDiv.style.display = 'block';
-        pipedDiv.style.display = 'none';
-        pipedMaterialDiv.style.display = 'none';
-        freetubeYatteeDiv.style.display = 'none';
-    }
-    else if (frontend.value == 'piped') {
-        invidiousDiv.style.display = 'none';
-        pipedDiv.style.display = 'block';
-        pipedMaterialDiv.style.display = 'none';
-        freetubeYatteeDiv.style.display = 'none';
-    }
-    else if (frontend.value == 'pipedMaterial') {
-        invidiousDiv.style.display = 'none';
-        pipedDiv.style.display = 'none';
-        pipedMaterialDiv.style.display = 'block';
-        freetubeYatteeDiv.style.display = 'none';
-    }
-    else if (frontend.value == 'freetube' || frontend.value == 'yatte') {
-        invidiousDiv.style.display = 'none';
-        pipedDiv.style.display = 'none';
-        pipedMaterialDiv.style.display = 'none';
-        freetubeYatteeDiv.style.display = 'block';
-        changeYoutubeEmbedFrontendsSettings();
+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 changeYoutubeEmbedFrontendsSettings() {
-    if (youtubeEmbedFrontend.value == 'invidious') {
-        pipedDiv.style.display = 'none';
-        pipedMaterialDiv.style.display = 'none';
-        invidiousDiv.style.display = 'block';
-    }
-    if (youtubeEmbedFrontend.value == 'piped') {
-        pipedDiv.style.display = 'block';
-        pipedMaterialDiv.style.display = 'none';
-        invidiousDiv.style.display = 'none';
-    }
-    if (youtubeEmbedFrontend.value == 'pipedMaterial') {
-        pipedDiv.style.display = 'none';
-        pipedMaterialDiv.style.display = 'block';
-        invidiousDiv.style.display = 'none';
-    }
-    else if (youtubeEmbedFrontend.value == 'youtube') {
-        pipedDiv.style.display = 'none';
-        pipedMaterialDiv.style.display = 'none';
-        invidiousDiv.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 changeProtocolSettings() {
-    const normalPipedDiv = document.getElementById('piped').getElementsByClassName("normal")[0];
-    const torPipedDiv = document.getElementById('piped').getElementsByClassName("tor")[0];
-
-    const normalPipedMaterialDiv = document.getElementById('pipedMaterial').getElementsByClassName("normal")[0];
-    const torPipedMaterialDiv = document.getElementById('pipedMaterial').getElementsByClassName("tor")[0];
-
-    const normalInvidiousDiv = document.getElementById('invidious').getElementsByClassName("normal")[0];
-    const torInvidiousDiv = document.getElementById('invidious').getElementsByClassName("tor")[0];
-
-    if (protocol.value == 'normal') {
-        normalInvidiousDiv.style.display = 'block';
-        torInvidiousDiv.style.display = 'none';
-
-        normalPipedDiv.style.display = 'block';
-        torPipedDiv.style.display = 'none';
-
-        normalPipedMaterialDiv.style.display = 'block';
-        torPipedMaterialDiv.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'
+        }
     }
-    else if (protocol.value == 'tor') {
-        normalInvidiousDiv.style.display = 'none';
-        torInvidiousDiv.style.display = 'block';
-
-        normalPipedDiv.style.display = 'none';
-        torPipedDiv.style.display = 'block';
-
-        normalPipedMaterialDiv.style.display = 'none';
-        torPipedMaterialDiv.style.display = 'block';
+    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'
     }
 }
 
-youtube.addEventListener("change", () => {
-    browser.storage.local.set({
-        disableYoutube: !enable.checked,
-        youtubeFrontend: frontend.value,
-        youtubeEmbedFrontend: youtubeEmbedFrontend.value,
-        onlyEmbeddedVideo: onlyEmbeddedVideo.value,
-        youtubeProtocol: protocol.value,
-    })
-    changeProtocolSettings();
-    changeYoutubeEmbedFrontendsSettings();
-    changeFrontendsSettings();
-})
-
 browser.storage.local.get(
     [
         "disableYoutube",
@@ -117,29 +69,33 @@ browser.storage.local.get(
         "youtubeFrontend",
 
         "youtubeEmbedFrontend",
-        "youtubeProtocol",
+        "protocol"
     ],
     r => {
         enable.checked = !r.disableYoutube;
         onlyEmbeddedVideo.value = r.onlyEmbeddedVideo;
         frontend.value = r.youtubeFrontend;
-        protocol.value = r.youtubeProtocol;
+        protocol = r.protocol;
 
         changeFrontendsSettings();
         changeProtocolSettings();
-
-        youtubeEmbedFrontend.value = youtubeEmbedFrontend.value
-        if (r.frontend == "freetube" || r.frontend == "yatte") changeYoutubeEmbedFrontendsSettings()
+        changeEmbedFrontendsSettings();
     }
 );
 
-utils.processDefaultCustomInstances('youtube', 'invidious', 'normal', document);
-utils.processDefaultCustomInstances('youtube', 'invidious', 'tor', document);
-utils.processDefaultCustomInstances('youtube', 'pipedMaterial', 'normal', document);
-utils.processDefaultCustomInstances('youtube', 'pipedMaterial', 'tor', document);
-utils.processDefaultCustomInstances('youtube', 'piped', 'normal', document);
-utils.processDefaultCustomInstances('youtube', 'piped', 'tor', document);
+youtube.addEventListener("change", () => {
+    browser.storage.local.set({
+        disableYoutube: !enable.checked,
+        youtubeEmbedFrontend: youtubeEmbedFrontend.value,
+        onlyEmbeddedVideo: onlyEmbeddedVideo.value
+    })
+    changeFrontendsSettings();
+    changeEmbedFrontendsSettings();
+})
 
-utils.latency('youtube', 'invidious', document, location, true)
-utils.latency('youtube', 'piped', document, location, true)
-utils.latency('youtube', 'pipedMaterial', document, location, true)
+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/youtube.pug b/src/pages/options/widgets/youtube.pug
index 7985244f..cf175629 100644
--- a/src/pages/options/widgets/youtube.pug
+++ b/src/pages/options/widgets/youtube.pug
@@ -15,38 +15,37 @@ section#youtube_page.option-block
             option(value="freetube") FreeTube
             option(value="yatte") Yattee
 
-    #freetube-yatte
+    #youtube-embedded_frontend
         .some-block.option-block
             h4(data-localise="__MSG_embeddedVids__") Embedded Videos Frontend
             select#youtube-embed_frontend
                 option(value="invidious") Invidious
                 option(value="piped") Piped
                 option(value="pipedMaterial") Piped-Material
-                option(value="youtube") Youtube
 
-    #invidious-piped-pipedMaterial
-        .some-block.option-block
-            h4(data-localise="__MSG_protocol__") Protocol
-            select#youtube-protocol
-                option(value="normal" data-localise="__MSG_normal__") Normal
-                option(value="tor" data-localise="__MSG_tor__") Tor
-
-        .some-block.option-block
-            h4(data-localise="__MSG_redirectType__") Redirect Type
-            select#youtube-redirect_type
-                option(value="both" data-localise="__MSG_both__") both
-                option(value="onlyEmbedded" data-localise="__MSG_onlyEmbedded__") Only Embedded
-                option(value="onlyNotEmbedded" data-localise="__MSG_onlyNotEmbedded__") Only Not Embedded
+    .some-block.option-block
+        h4(data-localise="__MSG_redirectType__") Redirect Type
+        select#youtube-redirect_type
+            option(value="both" data-localise="__MSG_both__") both
+            option(value="onlyEmbedded" data-localise="__MSG_onlyEmbedded__") Only Embedded
+            option(value="onlyNotEmbedded" data-localise="__MSG_onlyNotEmbedded__") Only Not Embedded
 
     #invidious
         hr
         .normal
             include ../../widgets/instances.pug
-            +instances('https://invidious.com')
+            +instances('http://invidious.com')
             include ../../widgets/latency.pug
             +latency('invidious')
         .tor
-            +instances('https://invidious.onion')
+            include ../../widgets/instances.pug
+            +instances('http://invidious.onion')
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://invidious.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://invidious.loki')
 
     #piped
         hr
@@ -54,7 +53,14 @@ section#youtube_page.option-block
             +instances('https://piped.com')
             +latency('piped')
         .tor
-            +instances('https://piped.onion')
+            +instances('http://piped.onion')
+            include ../../widgets/instances.pug
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://piped.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://piped.loki')
 
     #pipedMaterial
         hr
@@ -62,7 +68,13 @@ section#youtube_page.option-block
             +instances('https://piped-material.com')
             +latency('pipedMaterial')
         .tor
-            +instances('https://piped-material.onion')
-
+            +instances('http://piped-material.onion')
+            include ../../widgets/instances.pug
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://piped-material.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://piped-material.loki')
 
     script(type="module" src="./widgets/youtube.js")
diff --git a/src/pages/options/widgets/youtubeMusic.js b/src/pages/options/widgets/youtubeMusic.js
index cb5ab1d7..4d33c1fa 100644
--- a/src/pages/options/widgets/youtubeMusic.js
+++ b/src/pages/options/widgets/youtubeMusic.js
@@ -1,23 +1,61 @@
 import utils from "../../../assets/javascripts/utils.js";
 
+// UNCOMMENT ALL COMMENTS ONCE OTHER FRONTENDS EXIST
+
+const frontends = new Array("beatbump")
+const protocols = new Array("normal", "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",
+        "protocol"
     ],
     r => {
-        enable.checked = !r.disableYoutubeMusic;
+        enable.checked = !r.disableYoutubeMusic
+        protocol = r.protocol
+        changeProtocolSettings()
     }
 );
 
 youtubeMusic.addEventListener("change", () => {
-    browser.storage.local.set({
-        disableYoutubeMusic: !enable.checked,
-    })
+    browser.storage.local.set({ disableYoutubeMusic: !enable.checked })
 })
 
-utils.processDefaultCustomInstances('youtubeMusic', 'beatbump', 'normal', document);
-
-utils.latency('youtubeMusic', 'beatbump', document, location, true)
\ No newline at end of file
+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/options/widgets/youtubeMusic.pug b/src/pages/options/widgets/youtubeMusic.pug
index ac4d6403..f307ae9a 100644
--- a/src/pages/options/widgets/youtubeMusic.pug
+++ b/src/pages/options/widgets/youtubeMusic.pug
@@ -13,5 +13,14 @@ section#youtubeMusic_page.option-block
             +instances('https://beatbump.wewe')
             include ../../widgets/latency.pug
             +latency('beatbump')
+        .tor
+            +instances('http://beatbump.onion')
+            include ../../widgets/instances.pug
+        .i2p
+            include ../../widgets/instances.pug
+            +instances('http://beatbump.i2p')
+        .loki
+            include ../../widgets/instances.pug
+            +instances('http://beatbump.loki')
 
     script(type="module" src="./widgets/youtubeMusic.js")