From 81d1e26aefd7c4ab9c70761494d8226032569426 Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Tue, 31 May 2022 06:29:15 +0300
Subject: Optimizing and fixing bugs #286

---
 src/pages/background/background.js         |   4 +-
 src/pages/background/reset_warning.html    |   9 +-
 src/pages/options/index.html               | 396 ++++++++++++++++-------------
 src/pages/options/widgets/general.js       |   2 +-
 src/pages/options/widgets/imgur.js         |  41 +--
 src/pages/options/widgets/imgur.pug        |   6 +-
 src/pages/options/widgets/instagram.js     |  29 ++-
 src/pages/options/widgets/instagram.pug    |   7 +-
 src/pages/options/widgets/lbry.js          |  27 +-
 src/pages/options/widgets/lbry.pug         |   6 +-
 src/pages/options/widgets/maps.js          |  24 +-
 src/pages/options/widgets/maps.pug         |   4 +-
 src/pages/options/widgets/medium.js        |  52 ++--
 src/pages/options/widgets/medium.pug       |   6 +-
 src/pages/options/widgets/peertube.js      |  46 ++--
 src/pages/options/widgets/peertube.pug     |   6 +-
 src/pages/options/widgets/reddit.js        |  62 ++---
 src/pages/options/widgets/reddit.pug       |   4 +-
 src/pages/options/widgets/search.js        |  98 +++----
 src/pages/options/widgets/search.pug       |   5 +-
 src/pages/options/widgets/sendTargets.js   |  42 +--
 src/pages/options/widgets/sendTargets.pug  |   6 +-
 src/pages/options/widgets/tiktok.js        |  38 +--
 src/pages/options/widgets/tiktok.pug       |   6 +-
 src/pages/options/widgets/translate.js     |  26 +-
 src/pages/options/widgets/translate.pug    |   4 +-
 src/pages/options/widgets/twitter.js       |  48 ++--
 src/pages/options/widgets/twitter.pug      |   7 +-
 src/pages/options/widgets/wikipedia.js     |  53 ++--
 src/pages/options/widgets/wikipedia.pug    |   7 +-
 src/pages/options/widgets/youtube.js       |  68 ++---
 src/pages/options/widgets/youtube.pug      |  13 +-
 src/pages/options/widgets/youtubeMusic.js  |  14 +-
 src/pages/options/widgets/youtubeMusic.pug |   4 +-
 src/pages/widgets/latency.pug              |  13 +-
 35 files changed, 583 insertions(+), 600 deletions(-)

(limited to 'src/pages')

diff --git a/src/pages/background/background.js b/src/pages/background/background.js
index ca358118..bf992161 100644
--- a/src/pages/background/background.js
+++ b/src/pages/background/background.js
@@ -25,7 +25,7 @@ browser.runtime.onInstalled.addListener(
   async details => {
     // if (details.reason == 'install') {
     if (details.reason == 'install' || details.reason == "update") {
-      if (details.reason == "update") browser.tabs.create({ url: browser.extension.getURL("/pages/background/reset_warning.html") });
+      if (details.reason == "update") browser.tabs.create({ url: browser.runtime.getURL("/pages/background/reset_warning.html") });
       fetch('/instances/blocklist.json').then(response => response.text()).then(async data => {
         await browser.storage.local.clear();
         await browser.storage.local.set({ cloudflareList: JSON.parse(data) })
@@ -64,7 +64,7 @@ let incognitoInit = false;
 browser.tabs.onCreated.addListener(
   tab => {
     if (!incognitoInit && tab.incognito) {
-      browser.tabs.create({ url: browser.extension.getURL("/pages/background/incognito.html") });
+      browser.tabs.create({ url: browser.runtime.getURL("/pages/background/incognito.html") });
       incognitoInit = true;
     }
   }
diff --git a/src/pages/background/reset_warning.html b/src/pages/background/reset_warning.html
index bee174e8..a3feee72 100644
--- a/src/pages/background/reset_warning.html
+++ b/src/pages/background/reset_warning.html
@@ -5,7 +5,7 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title data-localise="__MSG_instanceIsOff__">Instance is offline</title>
+    <title data-localise="__MSG_instanceIsOff__">Reset Warning</title>
     <link href="../stylesheets/styles.css" rel="stylesheet" />
     <style>
         body {
@@ -24,7 +24,7 @@
             width: 80%;
         }
 
-        div.logo{
+        div.logo {
             display: flex;
         }
 
@@ -46,11 +46,8 @@
         <p data-localise="__MSG_instanceOffline__">All settings have been reset as they're incompatible with the
             previous version.</p>
         <p>Sorry for the inconvenience, but we're going in a fast development process and can't
-            support nor convert older settings. It will reach at the end a stable plateau  though.</p>
+            support nor convert older settings. It will reach a stable plateau though.</p>
     </div>
-
-    <script src="instance_offline.js"></script>
-    <script src="../../assets/javascripts/localise.js"></script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/src/pages/options/index.html b/src/pages/options/index.html
index 42553e37..f4837998 100644
--- a/src/pages/options/index.html
+++ b/src/pages/options/index.html
@@ -235,7 +235,7 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-invidious" type="checkbox">
+          <input id="youtube-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_frontend__">Frontend</h4>
@@ -250,7 +250,7 @@
         <div id="freetube-yatte">
           <div class="some-block option-block">
             <h4 data-localise="__MSG_embeddedVids__">Embedded Videos Frontend</h4>
-            <select id="youtube-embed-frontend">
+            <select id="youtube-embed_frontend">
               <option value="invidious">Invidious</option>
               <option value="piped">Piped</option>
               <option value="pipedMaterial">Piped-Material</option>
@@ -261,14 +261,14 @@
         <div id="invidious-piped-pipedMaterial">
           <div class="some-block option-block">
             <h4 data-localise="__MSG_protocol__">Protocol</h4>
-            <select id="protocol">
+            <select id="youtube-protocol">
               <option value="normal" data-localise="__MSG_normal__">Normal</option>
               <option value="tor" data-localise="__MSG_tor__">Tor</option>
             </select>
           </div>
           <div class="some-block option-block">
             <h4 data-localise="__MSG_redirectType__">Redirect Type</h4>
-            <select id="only-embed">
+            <select id="youtube-redirect_type">
               <option value="both" data-localise="__MSG_both__">both</option>
               <option value="onlyEmbedded" data-localise="__MSG_onlyEmbedded__">Only Embedded</option>
               <option value="onlyNotEmbedded" data-localise="__MSG_onlyNotEmbedded__">Only Not Embedded</option>
@@ -297,13 +297,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-invidious-label" for="latency-invidious"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-invidious" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-invidious-label" for="latency-invidious"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-invidious" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -349,13 +351,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-piped-label" for="latency-piped"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-piped" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-piped-label" for="latency-piped"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-piped" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -401,13 +405,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-pipedMaterial-label" for="latency-pipedMaterial"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-pipedMaterial" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-pipedMaterial-label" for="latency-pipedMaterial"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-pipedMaterial" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -440,7 +446,7 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-beatbump" type="checkbox">
+          <input id="youtubeMusic-enable" type="checkbox">
         </div>
         <div id="beatbump">
           <hr>
@@ -464,13 +470,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-beatbump-label" for="latency-beatbump"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-beatbump" style="display:none;">
+                        </div>
           </div>
         </div>
         <script type="module" src="./widgets/youtubeMusic.js"></script>
@@ -482,11 +490,11 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-nitter" type="checkbox">
+          <input id="twitter-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="twitter-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
           </select>
@@ -513,13 +521,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-nitter-label" for="latency-nitter"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-nitter" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -552,11 +562,11 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-bibliogram" type="checkbox">
+          <input id="instagram-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="instagram-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
           </select>
@@ -583,13 +593,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-bibliogram-label" for="latency-bibliogram"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-bibliogram" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -622,11 +634,11 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-tiktok" type="checkbox">
+          <input id="tiktok-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="tiktok-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
           </select>
@@ -653,13 +665,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-proxiTok-label" for="latency-proxiTok"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-proxiTok" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -692,7 +706,7 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-reddit" type="checkbox">
+          <input id="reddit-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 id="frontend" data-localise="__MSG_frontend__">Frontend</h4>
@@ -703,7 +717,7 @@
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="reddit-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
           </select>
@@ -730,13 +744,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-libreddit-label" for="latency-libreddit"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-libreddit" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-libreddit-label" for="latency-libreddit"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-libreddit" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -782,13 +798,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-teddit-label" for="latency-teddit"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-teddit" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-teddit-label" for="latency-teddit"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-teddit" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -821,11 +839,11 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-imgur" type="checkbox">
+          <input id="imgur-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="imgur-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
             <option value="i2p" data-localise="__MSG_i2p__">I2P</option>
@@ -853,13 +871,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-rimgo-label" for="latency-rimgo"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-rimgo" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -913,11 +933,11 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-wikipedia" type="checkbox">
+          <input id="wikipedia-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="wikipedia-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
             <option value="i2p" data-localise="__MSG_i2p__">I2P</option>
@@ -945,13 +965,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-wikiless-label" for="latency-wikiless"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-wikiless" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -1005,11 +1027,11 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-medium" type="checkbox">
+          <input id="medium-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="medium-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
           </select>
@@ -1036,13 +1058,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-scribe-label" for="latency-scribe"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-scribe" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -1075,11 +1099,11 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-peertube" type="checkbox">
+          <input id="peertube-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="peertube-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
           </select>
@@ -1106,13 +1130,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-simpleertube-label" for="latency-simpleertube"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-simpleertube" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -1145,11 +1171,11 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-lbry" type="checkbox">
+          <input id="lbry-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="lbry-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
           </select>
@@ -1176,13 +1202,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-librarian-label" for="latency-librarian"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-librarian" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -1215,7 +1243,7 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-search" type="checkbox">
+          <input id="search-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_frontend__">Frontend</h4>
@@ -1228,7 +1256,7 @@
         <div id="searx-whoogle">
           <div class="some-block option-block">
             <h4 data-localise="__MSG_protocol__">Protocol</h4>
-            <select id="protocol">
+            <select id="search-protocol">
               <option value="normal" data-localise="__MSG_normal__">Normal</option>
               <option value="tor" data-localise="__MSG_tor__">Tor</option>
               <option value="i2p" data-localise="__MSG_i2p__">I2P</option>
@@ -1260,13 +1288,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-searx-label" for="latency-searx"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-searx" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-searx-label" for="latency-searx"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-searx" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -1333,13 +1363,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-searxng-label" for="latency-searxng"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-searxng" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-searxng-label" for="latency-searxng"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-searxng" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -1406,13 +1438,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-whoogle-label" for="latency-whoogle"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-whoogle" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-whoogle-label" for="latency-whoogle"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-whoogle" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -1466,7 +1500,7 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-simplyTranslate" type="checkbox">
+          <input id="translate-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_frontend__">Frontend</h4>
@@ -1477,7 +1511,7 @@
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="translate-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
           </select>
@@ -1504,13 +1538,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-simplyTranslate-label" for="latency-simplyTranslate"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-simplyTranslate" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-simplyTranslate-label" for="latency-simplyTranslate"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-simplyTranslate" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -1555,13 +1591,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-lingva-label" for="latency-lingva"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency-lingva" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-lingva-label" for="latency-lingva"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-lingva" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
@@ -1594,7 +1632,7 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-osm" type="checkbox">
+          <input id="maps-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_frontend__">Frontend</h4>
@@ -1625,13 +1663,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-facilmap-label" for="latency-facilmap"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-facilmap" style="display:none;">
+                        </div>
           </div>
         </div>
         <script type="module" src="./widgets/maps.js"></script>
@@ -1643,11 +1683,11 @@
         <hr>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_enable__">Enable</h4>
-          <input id="disable-sendTargets" type="checkbox">
+          <input id="sendTargets-enable" type="checkbox">
         </div>
         <div class="some-block option-block">
           <h4 data-localise="__MSG_protocol__">Protocol</h4>
-          <select id="protocol">
+          <select id="sendTargets-protocol">
             <option value="normal" data-localise="__MSG_normal__">Normal</option>
             <option value="tor" data-localise="__MSG_tor__">Tor</option>
           </select>
@@ -1674,13 +1714,15 @@
                           </div>
                         </form>
                         <div class="checklist custom-checklist"></div>
-                        <label class="button button-inline" id="latency-label" for="latency"> 
-                          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-                            <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
-                          </svg>&nbsp;
-                          <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
-                        </label>
-                        <input class="button button-inline" id="latency" style="display:none;">
+                        <div class="buttons buttons-inline">
+                          <label class="button button-inline" id="latency-send-label" for="latency-send"> 
+                            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
+                              <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
+                            </svg>&nbsp;
+                            <x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
+                          </label>
+                          <input class="button button-inline" id="latency-send" style="display:none;">
+                        </div>
           </div>
           <div class="tor">
                         <div class="some-block option-block">
diff --git a/src/pages/options/widgets/general.js b/src/pages/options/widgets/general.js
index c810fb8a..6ca1e190 100644
--- a/src/pages/options/widgets/general.js
+++ b/src/pages/options/widgets/general.js
@@ -65,7 +65,7 @@ importSettingsElement.addEventListener("change",
         "cloudflareList" in data &&
         "imgurRedirects" in data
       ) {
-        console.log('importing a valid file...');
+        await browser.storage.local.clear();
         await browser.storage.local.set({ ...data })
         location.reload();
       } else
diff --git a/src/pages/options/widgets/imgur.js b/src/pages/options/widgets/imgur.js
index 036f33ed..ffb28405 100644
--- a/src/pages/options/widgets/imgur.js
+++ b/src/pages/options/widgets/imgur.js
@@ -1,32 +1,25 @@
-import imgurHelper from "../../../assets/javascripts/imgur.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disableImgurElement = document.getElementById("disable-imgur");
-let protocolElement = document.getElementById("protocol")
+const enable = document.getElementById("imgur-enable");
+const protocol = document.getElementById("imgur-protocol")
+const imgur = document.getElementById('imgur_page');
 
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disableImgur: !disableImgurElement.checked,
-        imgurProtocol: protocolElement.value,
-    });
-    changeProtocolSettings(protocolElement.value);
-})
+const normalDiv = imgur.getElementsByClassName("normal")[0];
+const torDiv = imgur.getElementsByClassName("tor")[0];
+const i2pDiv = imgur.getElementsByClassName("i2p")[0];
 
-function changeProtocolSettings(protocol) {
-    let normalDiv = document.getElementsByClassName("normal")[0];
-    let torDiv = document.getElementsByClassName("tor")[0];
-    let i2pDiv = document.getElementsByClassName("i2p")[0];
-    if (protocol == 'normal') {
+function changeProtocolSettings() {
+    if (protocol.value == 'normal') {
         normalDiv.style.display = 'block';
         torDiv.style.display = 'none';
         i2pDiv.style.display = 'none';
     }
-    else if (protocol == 'tor') {
+    else if (protocol.value == 'tor') {
         normalDiv.style.display = 'none';
         torDiv.style.display = 'block';
         i2pDiv.style.display = 'none';
     }
-    else if (protocol == 'i2p') {
+    else if (protocol.value == 'i2p') {
         normalDiv.style.display = 'none';
         torDiv.style.display = 'none';
         i2pDiv.style.display = 'block';
@@ -39,12 +32,20 @@ browser.storage.local.get(
         "imgurProtocol",
     ],
     r => {
-        disableImgurElement.checked = !r.disableImgur;
-        protocolElement.value = r.imgurProtocol;
-        changeProtocolSettings(r.imgurProtocol);
+        enable.checked = !r.disableImgur;
+        protocol.value = r.imgurProtocol;
+        changeProtocolSettings();
     }
 );
 
+imgur.addEventListener("change", () => {
+    changeProtocolSettings();
+    browser.storage.local.set({
+        disableImgur: !enable.checked,
+        imgurProtocol: protocol.value,
+    });
+})
+
 utils.processDefaultCustomInstances('imgur', 'rimgo', 'normal', document);
 utils.processDefaultCustomInstances('imgur', 'rimgo', 'tor', document);
 utils.processDefaultCustomInstances('imgur', 'rimgo', 'i2p', document);
diff --git a/src/pages/options/widgets/imgur.pug b/src/pages/options/widgets/imgur.pug
index 45104cd3..5e514341 100644
--- a/src/pages/options/widgets/imgur.pug
+++ b/src/pages/options/widgets/imgur.pug
@@ -5,11 +5,11 @@ section#imgur_page.option-block
 
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-imgur(type="checkbox")
+        input#imgur-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#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
@@ -20,7 +20,7 @@ section#imgur_page.option-block
             include ../../widgets/instances.pug
             +instances('https://rimgo.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('rimgo')
         .tor
             include ../../widgets/instances.pug
             +instances('https://rimgo.onion')
diff --git a/src/pages/options/widgets/instagram.js b/src/pages/options/widgets/instagram.js
index f04fc8c5..97b237c3 100644
--- a/src/pages/options/widgets/instagram.js
+++ b/src/pages/options/widgets/instagram.js
@@ -1,20 +1,13 @@
-import instagramHelper from "../../../assets/javascripts/instagram.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-const disable = document.getElementById("disable-bibliogram");
-const protocol = document.getElementById("protocol");
+const enable = document.getElementById("instagram-enable");
+const protocol = document.getElementById("instagram-protocol");
 
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disableInstagram: disable.checked,
-        instagramProtocol: protocol.value,
-    })
-    changeProtocolSettings();
-})
+const instagram = document.getElementById('instagram_page')
+const normalDiv = instagram.getElementsByClassName("normal")[0];
+const torDiv = instagram.getElementsByClassName("tor")[0];
 
 function changeProtocolSettings() {
-    let normalDiv = document.getElementsByClassName("normal")[0];
-    let torDiv = document.getElementsByClassName("tor")[0];
     if (protocol.value == 'normal') {
         normalDiv.style.display = 'block';
         torDiv.style.display = 'none';
@@ -31,10 +24,20 @@ browser.storage.local.get(
         "instagramProtocol"
     ],
     r => {
-        disable.checked = !r.disableInstagram;
+        enable.checked = !r.disableInstagram;
         protocol.value = r.instagramProtocol;
         changeProtocolSettings();
+    }
+)
+
+instagram.addEventListener("change", () => {
+    changeProtocolSettings();
+    browser.storage.local.set({
+        disableInstagram: enable.checked,
+        instagramProtocol: protocol.value,
     })
+})
+
 
 utils.processDefaultCustomInstances('instagram', 'bibliogram', 'normal', document);
 utils.processDefaultCustomInstances('instagram', 'bibliogram', 'tor', document);
diff --git a/src/pages/options/widgets/instagram.pug b/src/pages/options/widgets/instagram.pug
index e5698b41..47cfcdbc 100644
--- a/src/pages/options/widgets/instagram.pug
+++ b/src/pages/options/widgets/instagram.pug
@@ -5,11 +5,11 @@ section#instagram_page.option-block
 
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-bibliogram(type="checkbox")
+        input#instagram-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#protocol
+        select#instagram-protocol
             option(value="normal" data-localise="__MSG_normal__") Normal
             option(value="tor" data-localise="__MSG_tor__") Tor
 
@@ -19,9 +19,8 @@ section#instagram_page.option-block
             include ../../widgets/instances.pug
             +instances('https://bibliogram.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('bibliogram')
         .tor
-            include ../../widgets/instances.pug
             +instances('https://bibliogram.onion')
 
     script(type="module" src="./widgets/instagram.js")
\ No newline at end of file
diff --git a/src/pages/options/widgets/lbry.js b/src/pages/options/widgets/lbry.js
index 2aac362f..131aa566 100644
--- a/src/pages/options/widgets/lbry.js
+++ b/src/pages/options/widgets/lbry.js
@@ -1,20 +1,13 @@
-import lbryHelper from "../../../assets/javascripts/lbry.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disable = document.getElementById("disable-lbry");
-let protocol = document.getElementById("protocol")
+const enable = document.getElementById("lbry-enable");
+const protocol = document.getElementById("lbry-protocol")
 
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disableLbryTargets: !lbryHelper.checked,
-        lbryTargetsProtocol: protocol.value,
-    });
-    changeProtocolSettings()
-})
+const lbry = document.getElementById('lbry_page');
+const normalDiv = lbry.getElementsByClassName("normal")[0];
+const torDiv = lbry.getElementsByClassName("tor")[0];
 
 function changeProtocolSettings() {
-    let normalDiv = document.getElementsByClassName("normal")[0];
-    let torDiv = document.getElementsByClassName("tor")[0];
     if (protocol.value == 'normal') {
         normalDiv.style.display = 'block';
         torDiv.style.display = 'none';
@@ -31,12 +24,20 @@ browser.storage.local.get(
         "lbryTargetsProtocol"
     ],
     r => {
-        disable.checked = !r.disableLbryTargets;
+        enable.checked = !r.disableLbryTargets;
         protocol.value = r.lbryTargetsProtocol;
         changeProtocolSettings();
     }
 )
 
+lbry.addEventListener("change", () => {
+    changeProtocolSettings()
+    browser.storage.local.set({
+        disableLbryTargets: !enable.checked,
+        lbryTargetsProtocol: protocol.value,
+    });
+})
+
 utils.processDefaultCustomInstances('lbryTargets', 'librarian', 'normal', document);
 utils.processDefaultCustomInstances('lbryTargets', 'librarian', 'tor', document);
 
diff --git a/src/pages/options/widgets/lbry.pug b/src/pages/options/widgets/lbry.pug
index 21c4f497..4e88d2bf 100644
--- a/src/pages/options/widgets/lbry.pug
+++ b/src/pages/options/widgets/lbry.pug
@@ -4,11 +4,11 @@ section#lbry_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-lbry(type="checkbox")
+        input#lbry-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#protocol
+        select#lbry-protocol
             option(value="normal" data-localise="__MSG_normal__") Normal
             option(value="tor" data-localise="__MSG_tor__") Tor
 
@@ -18,7 +18,7 @@ section#lbry_page.option-block
             include ../../widgets/instances.pug
             +instances('https://librarian.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('librarian')
         .tor
             include ../../widgets/instances.pug
             +instances('https://librarian.onion')
diff --git a/src/pages/options/widgets/maps.js b/src/pages/options/widgets/maps.js
index ddfa8345..b9825fb0 100644
--- a/src/pages/options/widgets/maps.js
+++ b/src/pages/options/widgets/maps.js
@@ -1,18 +1,11 @@
-import mapsHelper from "../../../assets/javascripts/maps.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-const disable = document.getElementById("disable-osm");
+const enable = document.getElementById("maps-enable");
 const frontend = document.getElementById("maps-frontend");
 
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disableMaps: !disable.checked,
-        mapsFrontend: frontend.value,
-    })
-    changeFrontendsSettings();
-})
-
+const maps = document.getElementById('maps_page');
 const facilDiv = document.getElementById("facil")
+
 function changeFrontendsSettings() {
     if (frontend.value == 'facil') facilDiv.style.display = 'block';
     else if (frontend.value == 'osm') facilDiv.style.display = 'none';
@@ -24,9 +17,18 @@ browser.storage.local.get(
         "mapsFrontend",
     ],
     r => {
-        disable.checked = !r.disableMaps;
+        enable.checked = !r.disableMaps;
         frontend.value = r.mapsFrontend;
         changeFrontendsSettings();
     }
 )
+
+maps.addEventListener("change", () => {
+    changeFrontendsSettings();
+    browser.storage.local.set({
+        disableMaps: !enable.checked,
+        mapsFrontend: frontend.value,
+    })
+})
+
 utils.processDefaultCustomInstances('maps', 'facil', 'normal', document);
\ No newline at end of file
diff --git a/src/pages/options/widgets/maps.pug b/src/pages/options/widgets/maps.pug
index b36c3521..42c81d8e 100644
--- a/src/pages/options/widgets/maps.pug
+++ b/src/pages/options/widgets/maps.pug
@@ -4,7 +4,7 @@ section#maps_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-osm(type="checkbox")
+        input#maps-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_frontend__") Frontend
@@ -18,6 +18,6 @@ section#maps_page.option-block
             include ../../widgets/instances.pug
             +instances('https://facilmap.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('facilmap')
 
     script(type="module" src="./widgets/maps.js")
\ No newline at end of file
diff --git a/src/pages/options/widgets/medium.js b/src/pages/options/widgets/medium.js
index 085d6804..43c2700d 100644
--- a/src/pages/options/widgets/medium.js
+++ b/src/pages/options/widgets/medium.js
@@ -1,8 +1,29 @@
-import mediumHelper from "../../../assets/javascripts/medium.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disable = document.getElementById("disable-medium");
-let protocol = document.getElementById("protocol")
+const enable = document.getElementById("medium-enable");
+const protocol = document.getElementById("medium-protocol")
+const medium = document.getElementById('medium_page');
+
+function changeProtocolSettings() {
+    const normalDiv = document.getElementsByClassName("normal")[0];
+    const torDiv = document.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';
+    }
+}
+
+medium.addEventListener("change", () => {
+    changeProtocolSettings();
+    browser.storage.local.set({
+        disableMedium: !enable.checked,
+        mediumProtocol: protocol.value,
+    })
+})
 
 browser.storage.local.get(
     [
@@ -10,33 +31,12 @@ browser.storage.local.get(
         "mediumProtocol"
     ],
     r => {
-        disable.checked = !r.disableMedium;
+        enable.checked = !r.disableMedium;
         protocol.value = r.mediumProtocol;
         changeProtocolSettings();
     }
 )
+
 utils.processDefaultCustomInstances('medium', 'scribe', 'normal', document);
 utils.processDefaultCustomInstances('medium', 'scribe', 'tor', document);
-
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disableMedium: !disable.checked,
-        mediumProtocol: protocol.value,
-    })
-    changeProtocolSettings();
-})
-
-function changeProtocolSettings() {
-    let normalDiv = document.getElementsByClassName("normal")[0];
-    let torDiv = document.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';
-    }
-}
-
 utils.latency('medium', 'scribe', document, location)
\ No newline at end of file
diff --git a/src/pages/options/widgets/medium.pug b/src/pages/options/widgets/medium.pug
index 10c18f6d..f0a1ad55 100644
--- a/src/pages/options/widgets/medium.pug
+++ b/src/pages/options/widgets/medium.pug
@@ -4,11 +4,11 @@ section#medium_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-medium(type="checkbox")
+        input#medium-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#protocol
+        select#medium-protocol
             option(value="normal" data-localise="__MSG_normal__") Normal
             option(value="tor" data-localise="__MSG_tor__") Tor
 
@@ -18,7 +18,7 @@ section#medium_page.option-block
             include ../../widgets/instances.pug
             +instances('https://scribe.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('scribe')
         .tor
             include ../../widgets/instances.pug
             +instances('https://scribe.onion')
diff --git a/src/pages/options/widgets/peertube.js b/src/pages/options/widgets/peertube.js
index f2cede89..01b4f6b5 100644
--- a/src/pages/options/widgets/peertube.js
+++ b/src/pages/options/widgets/peertube.js
@@ -1,40 +1,42 @@
-import peertubeHelper from "../../../assets/javascripts/peertube.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disable = document.getElementById("disable-peertube");
-let protocol = document.getElementById("protocol")
+const enable = document.getElementById("peertube-enable");
+const protocol = document.getElementById("peertube-protocol");
+const peertube = document.getElementById('peertube_page');
+
+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';
+    }
+    else if (protocol.value == 'tor') {
+        normalDiv.style.display = 'none';
+        torDiv.style.display = 'block';
+    }
+}
+
 browser.storage.local.get(
     [
         "disablePeertubeTargets",
         "peertubeTargetsProtocol"
     ],
     r => {
-        disable.checked = !r.disablePeertubeTargets;
+        enable.checked = !r.disablePeertubeTargets;
         protocol.value = r.peertubeTargetsProtocol;
         changeProtocolSettings();
     }
 )
-utils.processDefaultCustomInstances('peertube', 'simpleertube', 'normal', document);
-utils.processDefaultCustomInstances('peertube', 'simpleertube', 'tor', document);
 
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disablePeertubeTargets: !disable.checked,
+peertube.addEventListener("change", () => {
+    changeProtocolSettings();
+    browser.storage.local.set({
+        disablePeertubeTargets: !enable.checked,
         peertubeTargetsProtocol: protocol.value
     })
-    changeProtocolSettings();
 })
 
-function changeProtocolSettings() {
-    const normalDiv = document.getElementsByClassName("normal")[0];
-    const torDiv = document.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';
-    }
-}
+utils.processDefaultCustomInstances('peertube', 'simpleertube', 'normal', document);
+utils.processDefaultCustomInstances('peertube', 'simpleertube', 'tor', document);
 utils.latency('peertube', 'simpleertube', document, location)
\ No newline at end of file
diff --git a/src/pages/options/widgets/peertube.pug b/src/pages/options/widgets/peertube.pug
index 496fb2df..0beec59c 100644
--- a/src/pages/options/widgets/peertube.pug
+++ b/src/pages/options/widgets/peertube.pug
@@ -4,11 +4,11 @@ section#peertube_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-peertube(type="checkbox")
+        input#peertube-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#protocol
+        select#peertube-protocol
             option(value="normal" data-localise="__MSG_normal__") Normal
             option(value="tor" data-localise="__MSG_tor__") Tor
 
@@ -18,7 +18,7 @@ section#peertube_page.option-block
             include ../../widgets/instances.pug
             +instances('https://simpleertube.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('simpleertube')
         .tor
             include ../../widgets/instances.pug
             +instances('https://simpleertube.onion')
diff --git a/src/pages/options/widgets/reddit.js b/src/pages/options/widgets/reddit.js
index da4221aa..9e4dfedd 100644
--- a/src/pages/options/widgets/reddit.js
+++ b/src/pages/options/widgets/reddit.js
@@ -1,45 +1,18 @@
-import redditHelper from "../../../assets/javascripts/reddit.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let libredditDivElement = document.getElementById("libreddit")
-let tedditDivElement = document.getElementById("teddit")
+const libredditDivElement = document.getElementById("libreddit")
+const tedditDivElement = document.getElementById("teddit")
 
-let disableRedditElement = document.getElementById("disable-reddit");
-let frontend = document.getElementById("reddit-frontend");
-let protocol = document.getElementById("protocol")
-
-document.addEventListener("change", () => {
-    browser.storage.local.set({
-        disableReddit: !disableRedditElement.checked,
-        redditProtocol: protocol.value,
-        redditFrontend: frontend.value,
-    });
-    changeFrontendsSettings();
-    changeProtocolSettings();
-})
-
-const libredditForm = libredditDivElement.getElementsByTagName('form')[0];
-const libredditCookies = libredditForm.getElementsByTagName('input')[0];
-libredditForm.addEventListener('submit', async event => {
-    event.preventDefault();
-    const url = new URL(libredditCookies.value);
-    redditHelper.initLibredditCookies(url);
-});
-
-const tedditForm = tedditDivElement.getElementsByTagName('form')[0];
-const tedditCookies = tedditForm.getElementsByTagName('input')[0];
-tedditForm.addEventListener('submit', async event => {
-    event.preventDefault();
-    const url = new URL(tedditCookies.value);
-    redditHelper.initTedditCookies(url);
-});
+const enable = document.getElementById("reddit-enable");
+const frontend = document.getElementById("reddit-frontend");
+const protocol = document.getElementById("reddit-protocol");
+const reddit = document.getElementById('reddit_page');
 
 function changeProtocolSettings() {
-    let normalLibredditDiv = libredditDivElement.getElementsByClassName("normal")[0];
-    let torLibredditDiv = libredditDivElement.getElementsByClassName("tor")[0];
-
-    let normalTedditDiv = tedditDivElement.getElementsByClassName("normal")[0];
-    let torTedditDiv = tedditDivElement.getElementsByClassName("tor")[0];
+    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';
@@ -53,6 +26,7 @@ function changeProtocolSettings() {
         torLibredditDiv.style.display = 'block';
     }
 }
+
 function changeFrontendsSettings() {
     if (frontend.value == 'libreddit') {
         libredditDivElement.style.display = 'block';
@@ -69,11 +43,9 @@ browser.storage.local.get(
         "disableReddit",
         "redditProtocol",
         "redditFrontend",
-
-        "enableLibredditCustomSettings",
     ],
     r => {
-        disableRedditElement.checked = !r.disableReddit
+        enable.checked = !r.disableReddit
         protocol.value = r.redditProtocol
         frontend.value = r.redditFrontend
         changeFrontendsSettings();
@@ -81,6 +53,16 @@ browser.storage.local.get(
     }
 )
 
+reddit.addEventListener("change", () => {
+    browser.storage.local.set({
+        disableReddit: !enable.checked,
+        redditProtocol: protocol.value,
+        redditFrontend: frontend.value,
+    });
+    changeFrontendsSettings();
+    changeProtocolSettings();
+})
+
 utils.processDefaultCustomInstances('reddit', 'libreddit', 'normal', document);
 utils.processDefaultCustomInstances('reddit', 'libreddit', 'tor', document);
 utils.processDefaultCustomInstances('reddit', 'teddit', 'normal', document);
diff --git a/src/pages/options/widgets/reddit.pug b/src/pages/options/widgets/reddit.pug
index ae72b31f..74b8d82e 100644
--- a/src/pages/options/widgets/reddit.pug
+++ b/src/pages/options/widgets/reddit.pug
@@ -4,7 +4,7 @@ section#reddit_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-reddit(type="checkbox")
+        input#reddit-enable(type="checkbox")
 
     .some-block.option-block
         h4#frontend(data-localise="__MSG_frontend__") Frontend
@@ -14,7 +14,7 @@ section#reddit_page.option-block
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#protocol
+        select#reddit-protocol
             option(value="normal" data-localise="__MSG_normal__") Normal
             option(value="tor" data-localise="__MSG_tor__") Tor
 
diff --git a/src/pages/options/widgets/search.js b/src/pages/options/widgets/search.js
index 2506279a..62b8bd78 100644
--- a/src/pages/options/widgets/search.js
+++ b/src/pages/options/widgets/search.js
@@ -1,55 +1,15 @@
-import searchHelper from "../../../assets/javascripts/search.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let searxDiv = document.getElementById("searx");
-let searxngDiv = document.getElementById("searxng");
-let whoogleDiv = document.getElementById("whoogle");
-
-let disable = document.getElementById("disable-search");
-let frontend = document.getElementById("search-frontend");
-let protocol = document.getElementById("protocol")
-
-const searxngForm = searxngDiv.getElementsByTagName('form')[0];
-const searxngCookies = searxngForm.getElementsByTagName('input')[0];
-searxngForm.addEventListener('submit', async event => {
-  event.preventDefault();
-  const url = new URL(searxngCookies.value);
-  searchHelper.initSearxngCookies(url);
-});
-
-const searxForm = searxDiv.getElementsByTagName('form')[0];
-const searxCookies = searxForm.getElementsByTagName('input')[0];
-searxForm.addEventListener('submit', async event => {
-  event.preventDefault();
-  const url = new URL(searxCookies.value);
-  searchHelper.initSearxCookies(url);
-});
+const searxDiv = document.getElementById("searx");
+const searxngDiv = document.getElementById("searxng");
+const whoogleDiv = document.getElementById("whoogle");
 
-browser.storage.local.get(
-  [
-    "disableSearch",
-    "searchFrontend",
-    "searchProtocol",
-  ],
-  r => {
-    disable.checked = !r.disableSearch;
-    frontend.value = r.searchFrontend;
-    protocol.value = r.searchProtocol;
+const enable = document.getElementById("search-enable");
+const frontend = document.getElementById("search-frontend");
+const protocol = document.getElementById("search-protocol");
 
-    changeFrontendsSettings();
-    changeProtocolSettings();
-  }
-);
+const search = document.getElementById('search_page');
 
-document.addEventListener("change", async () => {
-  await browser.storage.local.set({
-    disableSearch: !disable.checked,
-    searchFrontend: frontend.value,
-    searchProtocol: protocol.value,
-  });
-  changeFrontendsSettings(frontend.value);
-  changeProtocolSettings(protocol.value);
-})
 
 function changeFrontendsSettings() {
   let SearxWhoogleElement = document.getElementById("searx-whoogle");
@@ -74,17 +34,17 @@ function changeFrontendsSettings() {
 }
 
 function changeProtocolSettings() {
-  let normalsearxDiv = searxDiv.getElementsByClassName("normal")[0];
-  let torsearxDiv = searxDiv.getElementsByClassName("tor")[0];
-  let i2psearxDiv = searxDiv.getElementsByClassName("i2p")[0];
+  const normalsearxDiv = searxDiv.getElementsByClassName("normal")[0];
+  const torsearxDiv = searxDiv.getElementsByClassName("tor")[0];
+  const i2psearxDiv = searxDiv.getElementsByClassName("i2p")[0];
 
-  let normalsearxngDiv = searxngDiv.getElementsByClassName("normal")[0];
-  let torsearxngDiv = searxngDiv.getElementsByClassName("tor")[0];
-  let i2psearxngDiv = searxngDiv.getElementsByClassName("i2p")[0];
+  const normalsearxngDiv = searxngDiv.getElementsByClassName("normal")[0];
+  const torsearxngDiv = searxngDiv.getElementsByClassName("tor")[0];
+  const i2psearxngDiv = searxngDiv.getElementsByClassName("i2p")[0];
 
-  let normalwhoogleDiv = whoogleDiv.getElementsByClassName("normal")[0];
-  let torwhoogleDiv = whoogleDiv.getElementsByClassName("tor")[0];
-  let i2pwhoogleDiv = whoogleDiv.getElementsByClassName("i2p")[0];
+  const normalwhoogleDiv = whoogleDiv.getElementsByClassName("normal")[0];
+  const torwhoogleDiv = whoogleDiv.getElementsByClassName("tor")[0];
+  const i2pwhoogleDiv = whoogleDiv.getElementsByClassName("i2p")[0];
 
   if (protocol.value == 'normal') {
     normalsearxDiv.style.display = 'block';
@@ -127,6 +87,32 @@ function changeProtocolSettings() {
   }
 }
 
+browser.storage.local.get(
+  [
+    "disableSearch",
+    "searchFrontend",
+    "searchProtocol",
+  ],
+  r => {
+    enable.checked = !r.disableSearch;
+    frontend.value = r.searchFrontend;
+    protocol.value = r.searchProtocol;
+
+    changeFrontendsSettings();
+    changeProtocolSettings();
+  }
+);
+
+search.addEventListener("change", () => {
+  browser.storage.local.set({
+    disableSearch: !enable.checked,
+    searchFrontend: frontend.value,
+    searchProtocol: protocol.value,
+  });
+  changeFrontendsSettings(frontend.value);
+  changeProtocolSettings(protocol.value);
+})
+
 utils.processDefaultCustomInstances('search', 'searx', 'normal', document);
 utils.processDefaultCustomInstances('search', 'searx', 'tor', document);
 utils.processDefaultCustomInstances('search', 'searx', 'i2p', document);
diff --git a/src/pages/options/widgets/search.pug b/src/pages/options/widgets/search.pug
index feea4b0d..7e16e74f 100644
--- a/src/pages/options/widgets/search.pug
+++ b/src/pages/options/widgets/search.pug
@@ -5,7 +5,7 @@ section#search_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-search(type="checkbox")
+        input#search-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_frontend__") Frontend
@@ -14,11 +14,10 @@ section#search_page.option-block
             option(value="searx") SearX
             option(value="whoogle") Whoogle
 
-
     #searx-whoogle
         .some-block.option-block
             h4(data-localise="__MSG_protocol__") Protocol
-            select#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
diff --git a/src/pages/options/widgets/sendTargets.js b/src/pages/options/widgets/sendTargets.js
index 37e2588e..1cb1e74e 100644
--- a/src/pages/options/widgets/sendTargets.js
+++ b/src/pages/options/widgets/sendTargets.js
@@ -1,8 +1,21 @@
-import sendTargetsHelper from "../../../assets/javascripts/sendTargets.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disable = document.getElementById("disable-sendTargets");
-let protocol = document.getElementById("protocol")
+const enable = document.getElementById("sendTargets-enable");
+const protocol = document.getElementById("sendTargets-protocol")
+const sendTargets = document.getElementById('sendTargets_page');
+
+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';
+    }
+    else if (protocol.value == 'tor') {
+        normalDiv.style.display = 'none';
+        torDiv.style.display = 'block';
+    }
+}
 
 browser.storage.local.get(
     [
@@ -10,33 +23,20 @@ browser.storage.local.get(
         "sendTargetsProtocol",
     ],
     r => {
-        disable.checked = !r.disableSendTarget;
+        enable.checked = !r.disableSendTarget;
         protocol.value = r.sendTargetsProtocol;
         changeProtocolSettings();
     }
 )
 
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disableSendTarget: !disable.checked,
+sendTargets.addEventListener("change", () => {
+    changeProtocolSettings();
+    browser.storage.local.set({
+        disableSendTarget: !enable.checked,
         sendTargetsProtocol: protocol.value,
     })
-    changeProtocolSettings();
 })
 
-function changeProtocolSettings() {
-    let normalDiv = document.getElementsByClassName("normal")[0];
-    let torDiv = document.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';
-    }
-}
-
 utils.processDefaultCustomInstances('sendTargets', 'send', 'normal', document);
 utils.processDefaultCustomInstances('sendTargets', 'send', 'tor', document);
 
diff --git a/src/pages/options/widgets/sendTargets.pug b/src/pages/options/widgets/sendTargets.pug
index c4a933d1..5b776b0a 100644
--- a/src/pages/options/widgets/sendTargets.pug
+++ b/src/pages/options/widgets/sendTargets.pug
@@ -4,11 +4,11 @@ section#sendTargets_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-sendTargets(type="checkbox")
+        input#sendTargets-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#protocol
+        select#sendTargets-protocol
             option(value="normal" data-localise="__MSG_normal__") Normal
             option(value="tor" data-localise="__MSG_tor__") Tor
 
@@ -18,7 +18,7 @@ section#sendTargets_page.option-block
             include ../../widgets/instances.pug
             +instances('https://send.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('send')
         .tor
             include ../../widgets/instances.pug
             +instances('https://send.onion')
diff --git a/src/pages/options/widgets/tiktok.js b/src/pages/options/widgets/tiktok.js
index 6b5702e1..f4c31832 100644
--- a/src/pages/options/widgets/tiktok.js
+++ b/src/pages/options/widgets/tiktok.js
@@ -1,12 +1,25 @@
-import tiktokHelper from "../../../assets/javascripts/tiktok.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disable = document.getElementById("disable-tiktok");
-let protocol = document.getElementById("protocol")
+const enable = document.getElementById("tiktok-enable");
+const protocol = document.getElementById("tiktok-protocol")
+const tiktok = document.getElementById('tiktok_page');
 
-document.addEventListener("change", () => {
+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';
+    }
+}
+
+tiktok.addEventListener("change", () => {
     browser.storage.local.set({
-        disableTiktok: !disable.checked,
+        disableTiktok: !enable.checked,
         tiktokProtocol: protocol.value,
     });
     changeProtocolSettings();
@@ -18,7 +31,7 @@ browser.storage.local.get(
         "tiktokProtocol",
     ],
     r => {
-        disable.checked = !r.disableTiktok;
+        enable.checked = !r.disableTiktok;
         protocol.value = r.tiktokProtocol;
         changeProtocolSettings();
         let normalDiv = document.getElementsByClassName("normal")[0];
@@ -34,19 +47,6 @@ browser.storage.local.get(
     }
 )
 
-function changeProtocolSettings() {
-    let normalDiv = document.getElementsByClassName("normal")[0];
-    let torDiv = document.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';
-    }
-}
-
 utils.processDefaultCustomInstances('tiktok', 'proxiTok', 'normal', document);
 utils.processDefaultCustomInstances('tiktok', 'proxiTok', 'tor', document);
 
diff --git a/src/pages/options/widgets/tiktok.pug b/src/pages/options/widgets/tiktok.pug
index ec55671c..f0cc39c6 100644
--- a/src/pages/options/widgets/tiktok.pug
+++ b/src/pages/options/widgets/tiktok.pug
@@ -4,11 +4,11 @@ section#tiktok_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-tiktok(type="checkbox")
+        input#tiktok-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#protocol
+        select#tiktok-protocol
             option(value="normal" data-localise="__MSG_normal__") Normal
             option(value="tor" data-localise="__MSG_tor__") Tor
     
@@ -18,7 +18,7 @@ section#tiktok_page.option-block
             include ../../widgets/instances.pug
             +instances('https://proxitok.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('proxiTok')
         .tor
             include ../../widgets/instances.pug
             +instances('https://proxitok.onion')
diff --git a/src/pages/options/widgets/translate.js b/src/pages/options/widgets/translate.js
index 3e1990f4..3e1f53eb 100644
--- a/src/pages/options/widgets/translate.js
+++ b/src/pages/options/widgets/translate.js
@@ -1,12 +1,12 @@
-import translateHelper from "../../../assets/javascripts/translate/translate.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disable = document.getElementById("disable-simplyTranslate");
-let simplyTranslateDiv = document.getElementById("simplyTranslate");
-let lingvaDiv = document.getElementById("lingva");
-let frontend = document.getElementById("translate-frontend");
-let protocol = document.getElementById("protocol");
+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 translate = document.getElementById('translate_page');
 
 function changeFrontendsSettings() {
     if (frontend.value == 'simplyTranslate') {
@@ -20,11 +20,11 @@ function changeFrontendsSettings() {
 }
 
 function changeProtocolSettings() {
-    let normalSimplyTranslateDiv = document.getElementById("simplyTranslate").getElementsByClassName("normal")[0];
-    let torSimplyTranslateDiv = document.getElementById("simplyTranslate").getElementsByClassName("tor")[0];
+    const normalSimplyTranslateDiv = document.getElementById("simplyTranslate").getElementsByClassName("normal")[0];
+    const torSimplyTranslateDiv = document.getElementById("simplyTranslate").getElementsByClassName("tor")[0];
 
-    let normalLingvaDiv = document.getElementById("lingva").getElementsByClassName("normal")[0];
-    let torLingvaDiv = document.getElementById("lingva").getElementsByClassName("tor")[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';
@@ -47,7 +47,7 @@ browser.storage.local.get(
         "translateProtocol",
     ],
     r => {
-        disable.checked = !r.translateDisable;
+        enable.checked = !r.translateDisable;
         frontend.value = r.translateFrontend;
         protocol.value = r.translateProtocol;
         changeFrontendsSettings();
@@ -55,9 +55,9 @@ browser.storage.local.get(
     }
 );
 
-document.addEventListener("change", () => {
+translate.addEventListener("change", () => {
     browser.storage.local.set({
-        translateDisable: !disable.checked,
+        translateDisable: !enable.checked,
         translateFrontend: frontend.value,
         translateProtocol: protocol.value,
     })
diff --git a/src/pages/options/widgets/translate.pug b/src/pages/options/widgets/translate.pug
index a97a4245..6fc9b38c 100644
--- a/src/pages/options/widgets/translate.pug
+++ b/src/pages/options/widgets/translate.pug
@@ -4,7 +4,7 @@ section#translate_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-simplyTranslate(type="checkbox")
+        input#translate-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_frontend__") Frontend
@@ -14,7 +14,7 @@ section#translate_page.option-block
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#protocol
+        select#translate-protocol
             option(value="normal" data-localise="__MSG_normal__") Normal
             option(value="tor" data-localise="__MSG_tor__") Tor
 
diff --git a/src/pages/options/widgets/twitter.js b/src/pages/options/widgets/twitter.js
index 266fd027..25356733 100644
--- a/src/pages/options/widgets/twitter.js
+++ b/src/pages/options/widgets/twitter.js
@@ -1,18 +1,21 @@
-import twitterHelper from "../../../assets/javascripts/twitter.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disable = document.getElementById("disable-nitter");
-let protocol = document.getElementById("protocol");
+const enable = document.getElementById("twitter-enable");
+const protocol = document.getElementById("twitter-protocol");
+const twitter = document.getElementById('twitter_page');
 
-let nitterDiv = document.getElementById('nitter');
-
-const nitterForm = nitterDiv.getElementsByTagName('form')[0];
-const nitterCookies = nitterForm.getElementsByTagName('input')[0];
-nitterForm.addEventListener('submit', event => {
-  event.preventDefault();
-  const url = new URL(nitterCookies.value);
-  twitterHelper.initNitterCookies(url);
-});
+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';
+    }
+    else if (protocol.value == 'tor') {
+        normalDiv.style.display = 'none';
+        torDiv.style.display = 'block';
+    }
+}
 
 browser.storage.local.get(
     [
@@ -20,34 +23,21 @@ browser.storage.local.get(
         "twitterProtocol",
     ],
     r => {
-        disable.checked = !r.disableTwitter;
+        enable.checked = !r.disableTwitter;
         protocol.value = r.twitterProtocol;
         changeProtocolSettings();
     }
 )
 
-document.addEventListener("change", () => {
+twitter.addEventListener("change", () => {
     browser.storage.local.set({
-        disableTwitter: !disable.checked,
+        disableTwitter: !enable.checked,
         twitterProtocol: protocol.value,
     });
     changeProtocolSettings();
 })
 
-function changeProtocolSettings() {
-    let normalDiv = nitterDiv.getElementsByClassName("normal")[0];
-    let torDiv = nitterDiv.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';
-    }
-}
-
 utils.processDefaultCustomInstances('twitter', 'nitter', 'normal', document);
 utils.processDefaultCustomInstances('twitter', 'nitter', 'tor', document)
 
-utils.latency('twitter', 'nitter', document, location)
\ No newline at end of file
+utils.latency('twitter', 'nitter', document, location, true)
\ No newline at end of file
diff --git a/src/pages/options/widgets/twitter.pug b/src/pages/options/widgets/twitter.pug
index af743dcd..36835e8a 100644
--- a/src/pages/options/widgets/twitter.pug
+++ b/src/pages/options/widgets/twitter.pug
@@ -4,11 +4,11 @@ section#twitter_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-nitter(type="checkbox")
+        input#twitter-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#protocol
+        select#twitter-protocol
             option(value="normal" data-localise="__MSG_normal__") Normal
             option(value="tor" data-localise="__MSG_tor__") Tor
 
@@ -18,9 +18,8 @@ section#twitter_page.option-block
             include ../../widgets/instances.pug
             +instances('https://nitter.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('nitter')
         .tor
-            include ../../widgets/instances.pug
             +instances('https://nitter.onion')
 
     script(type="module" src="./widgets/twitter.js")
diff --git a/src/pages/options/widgets/wikipedia.js b/src/pages/options/widgets/wikipedia.js
index 6e847c8d..c9e582be 100644
--- a/src/pages/options/widgets/wikipedia.js
+++ b/src/pages/options/widgets/wikipedia.js
@@ -1,33 +1,13 @@
-import wikipediaHelper from "../../../assets/javascripts/wikipedia.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disableWikipediaElement = document.getElementById("disable-wikipedia");
-let protocolElement = document.getElementById("protocol");
-
-browser.storage.local.get(
-    [
-        "disableWikipedia",
-        "wikipediaProtocol",
-    ],
-    r => {
-        disableWikipediaElement.checked = !r.disableWikipedia;
-        protocolElement.value = r.wikipediaProtocol;
-        changeProtocolSettings(r.wikipediaProtocol);
-    }
-)
-
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disableWikipedia: !disableWikipediaElement.checked,
-        wikipediaProtocol: protocolElement.value,
-    })
-    changeProtocolSettings(protocolElement.value)
-})
+const enable = document.getElementById("wikipedia-enable");
+const protocolElement = document.getElementById("wikipedia-protocol");
+const wikipedia = document.getElementById('wikipedia_page');
 
 function changeProtocolSettings(protocol) {
-    let normalDiv = document.getElementsByClassName("normal")[0];
-    let torDiv = document.getElementsByClassName("tor")[0];
-    let i2pDiv = document.getElementsByClassName("i2p")[0];
+    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';
@@ -44,6 +24,27 @@ function changeProtocolSettings(protocol) {
         i2pDiv.style.display = 'block';
     }
 }
+
+browser.storage.local.get(
+    [
+        "disableWikipedia",
+        "wikipediaProtocol",
+    ],
+    r => {
+        enable.checked = !r.disableWikipedia;
+        protocolElement.value = r.wikipediaProtocol;
+        changeProtocolSettings(r.wikipediaProtocol);
+    }
+)
+
+wikipedia.addEventListener("change", () => {
+    browser.storage.local.set({
+        disableWikipedia: !enable.checked,
+        wikipediaProtocol: protocolElement.value,
+    })
+    changeProtocolSettings(protocolElement.value)
+})
+
 utils.processDefaultCustomInstances('wikipedia', 'wikiless', 'normal', document);
 utils.processDefaultCustomInstances('wikipedia', 'wikiless', 'tor', document);
 utils.processDefaultCustomInstances('wikipedia', 'wikiless', 'i2p', document);
diff --git a/src/pages/options/widgets/wikipedia.pug b/src/pages/options/widgets/wikipedia.pug
index 79d1e323..a0315739 100644
--- a/src/pages/options/widgets/wikipedia.pug
+++ b/src/pages/options/widgets/wikipedia.pug
@@ -4,11 +4,11 @@ section#wikipedia_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-wikipedia(type="checkbox")
+        input#wikipedia-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_protocol__") Protocol
-        select#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
@@ -19,7 +19,7 @@ section#wikipedia_page.option-block
             include ../../widgets/instances.pug
             +instances('https://wikiless.com')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('wikiless')
         .tor
             include ../../widgets/instances.pug
             +instances('https://wikiless.onion')
@@ -29,4 +29,3 @@ section#wikipedia_page.option-block
             +instances('https://wikiless.i2p')
 
     script(type="module" src="./widgets/wikipedia.js")
-    
\ No newline at end of file
diff --git a/src/pages/options/widgets/youtube.js b/src/pages/options/widgets/youtube.js
index 423a30c5..26867643 100644
--- a/src/pages/options/widgets/youtube.js
+++ b/src/pages/options/widgets/youtube.js
@@ -1,38 +1,38 @@
 import youtubeHelper from "../../../assets/javascripts/youtube/youtube.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disableYoutube = document.getElementById("disable-invidious");
-let youtubeFrontend = document.getElementById("youtube-frontend");
-let invidiousDiv = document.getElementById("invidious");
-let pipedDiv = document.getElementById("piped");
-let pipedMaterialDiv = document.getElementById("pipedMaterial");
-let freetubeYatteeDiv = document.getElementById("freetube-yatte");
-let youtubeEmbedFrontend = document.getElementById("youtube-embed-frontend");
-let onlyEmbeddedVideo = document.getElementById("only-embed");
-let protoco = document.getElementById("protocol");
+const enable = document.getElementById("youtube-enable");
+const frontend = document.getElementById("youtube-frontend");
+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");
 
 function changeFrontendsSettings() {
-    let frontend = youtubeFrontend.value;
-
-    if (frontend == 'invidious') {
+    if (frontend.value == 'invidious') {
         invidiousDiv.style.display = 'block';
         pipedDiv.style.display = 'none';
         pipedMaterialDiv.style.display = 'none';
         freetubeYatteeDiv.style.display = 'none';
     }
-    else if (frontend == 'piped') {
+    else if (frontend.value == 'piped') {
         invidiousDiv.style.display = 'none';
         pipedDiv.style.display = 'block';
         pipedMaterialDiv.style.display = 'none';
         freetubeYatteeDiv.style.display = 'none';
     }
-    else if (frontend == 'pipedMaterial') {
+    else if (frontend.value == 'pipedMaterial') {
         invidiousDiv.style.display = 'none';
         pipedDiv.style.display = 'none';
         pipedMaterialDiv.style.display = 'block';
         freetubeYatteeDiv.style.display = 'none';
     }
-    else if (frontend == 'freetube' || frontend == 'yatte') {
+    else if (frontend.value == 'freetube' || frontend.value == 'yatte') {
         invidiousDiv.style.display = 'none';
         pipedDiv.style.display = 'none';
         pipedMaterialDiv.style.display = 'none';
@@ -74,7 +74,7 @@ function changeProtocolSettings() {
     const normalInvidiousDiv = document.getElementById('invidious').getElementsByClassName("normal")[0];
     const torInvidiousDiv = document.getElementById('invidious').getElementsByClassName("tor")[0];
 
-    if (protoco.value == 'normal') {
+    if (protocol.value == 'normal') {
         normalInvidiousDiv.style.display = 'block';
         torInvidiousDiv.style.display = 'none';
 
@@ -84,7 +84,7 @@ function changeProtocolSettings() {
         normalPipedMaterialDiv.style.display = 'block';
         torPipedMaterialDiv.style.display = 'none';
     }
-    else if (protoco.value == 'tor') {
+    else if (protocol.value == 'tor') {
         normalInvidiousDiv.style.display = 'none';
         torInvidiousDiv.style.display = 'block';
 
@@ -96,13 +96,13 @@ function changeProtocolSettings() {
     }
 }
 
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disableYoutube: !disableYoutube.checked,
-        youtubeFrontend: youtubeFrontend.value,
+youtube.addEventListener("change", () => {
+    browser.storage.local.set({
+        disableYoutube: !enable.checked,
+        youtubeFrontend: frontend.value,
         youtubeEmbedFrontend: youtubeEmbedFrontend.value,
         onlyEmbeddedVideo: onlyEmbeddedVideo.value,
-        youtubeProtocol: protoco.value,
+        youtubeProtocol: protocol.value,
     })
     changeProtocolSettings();
     changeYoutubeEmbedFrontendsSettings();
@@ -120,35 +120,19 @@ browser.storage.local.get(
         "youtubeProtocol",
     ],
     r => {
-        disableYoutube.checked = !r.disableYoutube;
+        enable.checked = !r.disableYoutube;
         onlyEmbeddedVideo.value = r.onlyEmbeddedVideo;
-        youtubeFrontend.value = r.youtubeFrontend;
-        protoco.value = r.youtubeProtocol;
+        frontend.value = r.youtubeFrontend;
+        protocol.value = r.youtubeProtocol;
 
         changeFrontendsSettings();
         changeProtocolSettings();
 
         youtubeEmbedFrontend.value = youtubeEmbedFrontend.value
-        if (r.youtubeFrontend == "freetube" || r.youtubeFrontend == "yatte") changeYoutubeEmbedFrontendsSettings()
+        if (r.frontend == "freetube" || r.frontend == "yatte") changeYoutubeEmbedFrontendsSettings()
     }
 );
 
-const invidiousForm = invidiousDiv.getElementsByTagName('form')[0];
-const invidiousCookies = invidiousForm.getElementsByTagName('input')[0];
-invidiousForm.addEventListener('submit', async event => {
-    event.preventDefault();
-    const url = new URL(invidiousCookies.value);
-    youtubeHelper.initInvidiousCookies(url);
-});
-
-// const pipedForm = pipedDiv.getElementsByTagName('form')[0];
-// const pipedCookies = pipedForm.getElementsByTagName('input')[0];
-// pipedForm.addEventListener('submit', async event => {
-//     event.preventDefault();
-//     const url = new URL(pipedCookies.value);
-//     youtubeHelper.applyPipedLocalStorage(url);
-// });
-
 utils.processDefaultCustomInstances('youtube', 'invidious', 'normal', document);
 utils.processDefaultCustomInstances('youtube', 'invidious', 'tor', document);
 utils.processDefaultCustomInstances('youtube', 'pipedMaterial', 'normal', document);
diff --git a/src/pages/options/widgets/youtube.pug b/src/pages/options/widgets/youtube.pug
index 71bf104b..7985244f 100644
--- a/src/pages/options/widgets/youtube.pug
+++ b/src/pages/options/widgets/youtube.pug
@@ -4,7 +4,7 @@ section#youtube_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-invidious(type="checkbox")
+        input#youtube-enable(type="checkbox")
 
     .some-block.option-block
         h4(data-localise="__MSG_frontend__") Frontend
@@ -18,7 +18,7 @@ section#youtube_page.option-block
     #freetube-yatte
         .some-block.option-block
             h4(data-localise="__MSG_embeddedVids__") Embedded Videos Frontend
-            select#youtube-embed-frontend
+            select#youtube-embed_frontend
                 option(value="invidious") Invidious
                 option(value="piped") Piped
                 option(value="pipedMaterial") Piped-Material
@@ -27,13 +27,13 @@ section#youtube_page.option-block
     #invidious-piped-pipedMaterial
         .some-block.option-block
             h4(data-localise="__MSG_protocol__") Protocol
-            select#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#only-embed
+            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
@@ -46,27 +46,22 @@ section#youtube_page.option-block
             include ../../widgets/latency.pug
             +latency('invidious')
         .tor
-            include ../../widgets/instances.pug
             +instances('https://invidious.onion')
 
     #piped
         hr
         .normal
-            include ../../widgets/instances.pug
             +instances('https://piped.com')
             +latency('piped')
         .tor
-            include ../../widgets/instances.pug
             +instances('https://piped.onion')
 
     #pipedMaterial
         hr
         .normal
-            include ../../widgets/instances.pug
             +instances('https://piped-material.com')
             +latency('pipedMaterial')
         .tor
-            include ../../widgets/instances.pug
             +instances('https://piped-material.onion')
 
 
diff --git a/src/pages/options/widgets/youtubeMusic.js b/src/pages/options/widgets/youtubeMusic.js
index 9a9bf8fb..cb5ab1d7 100644
--- a/src/pages/options/widgets/youtubeMusic.js
+++ b/src/pages/options/widgets/youtubeMusic.js
@@ -1,23 +1,23 @@
-import youtubeMusicHelper from "../../../assets/javascripts/youtubeMusic.js";
 import utils from "../../../assets/javascripts/utils.js";
 
-let disableYoutubeMusicElement = document.getElementById("disable-beatbump");
+let enable = document.getElementById("youtubeMusic-enable");
+const youtubeMusic = document.getElementById('youtubeMusic_page');
 
 browser.storage.local.get(
     [
         "disableYoutubeMusic",
     ],
     r => {
-        disableYoutubeMusicElement.checked = !r.disableYoutubeMusic;
+        enable.checked = !r.disableYoutubeMusic;
     }
 );
 
-document.addEventListener("change", async () => {
-    await browser.storage.local.set({
-        disableYoutubeMusic: !disableYoutubeMusicElement.checked,
+youtubeMusic.addEventListener("change", () => {
+    browser.storage.local.set({
+        disableYoutubeMusic: !enable.checked,
     })
 })
 
 utils.processDefaultCustomInstances('youtubeMusic', 'beatbump', 'normal', document);
 
-utils.latency('youtubeMusic', 'beatbump', document, location)
\ No newline at end of file
+utils.latency('youtubeMusic', 'beatbump', document, location, true)
\ No newline at end of file
diff --git a/src/pages/options/widgets/youtubeMusic.pug b/src/pages/options/widgets/youtubeMusic.pug
index 231b6caf..ac4d6403 100644
--- a/src/pages/options/widgets/youtubeMusic.pug
+++ b/src/pages/options/widgets/youtubeMusic.pug
@@ -4,7 +4,7 @@ section#youtubeMusic_page.option-block
     hr
     .some-block.option-block
         h4(data-localise="__MSG_enable__") Enable
-        input#disable-beatbump(type="checkbox")
+        input#youtubeMusic-enable(type="checkbox")
 
     #beatbump
         hr
@@ -12,6 +12,6 @@ section#youtubeMusic_page.option-block
             include ../../widgets/instances.pug
             +instances('https://beatbump.wewe')
             include ../../widgets/latency.pug
-            +latency()
+            +latency('beatbump')
 
     script(type="module" src="./widgets/youtubeMusic.js")
diff --git a/src/pages/widgets/latency.pug b/src/pages/widgets/latency.pug
index 0069ca74..e5bf53b2 100644
--- a/src/pages/widgets/latency.pug
+++ b/src/pages/widgets/latency.pug
@@ -5,9 +5,10 @@ mixin latency(service)
     else
         - latencyVal = `latency`
 
-    label.button.button-inline(id=`${latencyVal}-label` for=latencyVal) 
-        svg(xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor")
-            path(d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z")
-        |&nbsp;
-        x(data-localise="__MSG_testInstancesLatency__") Test Instances Latency
-    input.button.button-inline(id=latencyVal style="display:none;")
\ No newline at end of file
+    .buttons.buttons-inline
+        label.button.button-inline(id=`${latencyVal}-label` for=latencyVal) 
+            svg(xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor")
+                path(d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z")
+            |&nbsp;
+            x(data-localise="__MSG_testInstancesLatency__") Test Instances Latency
+        input.button.button-inline(id=latencyVal style="display:none;")
\ No newline at end of file
-- 
cgit 1.4.1