Added a button for enabling cookies #104

4 files changed, 574 insertions, 598 deletions

diff --git a/src/pages/options/youtube/invidious.js b/src/pages/options/youtube/invidious.js
index 90361342..d8486e7a 100644
--- a/src/pages/options/youtube/invidious.js
+++ b/src/pages/options/youtube/invidious.js
@@ -3,7 +3,7 @@ import commonHelper from "../../../assets/javascripts/helpers/common.js";
 
 let invidiousAlwaysProxyElement = document.getElementById("invidious-local");
 invidiousAlwaysProxyElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousAlwaysProxy(event.target.options[invidiousAlwaysProxyElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousAlwaysProxy(event.target.checked)
 );
 
 let invidiousPlayerStyleElement = document.getElementById("invidious-player_style");
@@ -18,22 +18,22 @@ invidiousQualityElement.addEventListener("change",
 
 let invidiousVideoLoopElement = document.getElementById("invidious-video_loop");
 invidiousVideoLoopElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousVideoLoop(event.target.options[invidiousVideoLoopElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousVideoLoop(event.target.checked)
 );
 
 let invidiousContinueAutoplayElement = document.getElementById("invidious-continue_autoplay");
 invidiousContinueAutoplayElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousContinueAutoplay(event.target.options[invidiousContinueAutoplayElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousContinueAutoplay(event.target.checked)
 );
 
 let invidiousContinueElement = document.getElementById("invidious-continue");
 invidiousContinueElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousContinue(event.target.options[invidiousContinueElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousContinue(event.target.checked)
 );
 
 let invidiousListenElement = document.getElementById("invidious-listen");
 invidiousListenElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousListen(event.target.options[invidiousListenElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousListen(event.target.checked)
 );
 
 let invidiousSpeedElement = document.getElementById("invidious-speed");
@@ -90,28 +90,28 @@ invidiousCaptions2Element.addEventListener("change",
 
 let invidiousRelatedVideoElement = document.getElementById("invidious-related_videos");
 invidiousRelatedVideoElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousRelatedVideos(event.target.options[invidiousRelatedVideoElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousRelatedVideos(event.target.checked)
 );
 
 let invidiousAnnotationsElement = document.getElementById("invidious-annotations");
 invidiousAnnotationsElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousAnnotations(event.target.options[invidiousAnnotationsElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousAnnotations(event.target.checked)
 );
 
 
 let invidiousExtendDescElement = document.getElementById("invidious-extend_desc");
 invidiousExtendDescElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousExtendDesc(event.target.options[invidiousExtendDescElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousExtendDesc(event.target.checked)
 );
 
 let invidiousVrModeElement = document.getElementById("invidious-vr_mode");
 invidiousVrModeElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousVrMode(event.target.options[invidiousVrModeElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousVrMode(event.target.checked)
 );
 
 let invidiousSavePlayerPosElement = document.getElementById("invidious-save_player_pos");
 invidiousSavePlayerPosElement.addEventListener("change",
-    event => youtubeHelper.setInvidiousSavePlayerPos(event.target.options[invidiousSavePlayerPosElement.selectedIndex].value)
+    event => youtubeHelper.setInvidiousSavePlayerPos(event.target.checked)
 );
 
 youtubeHelper.init().then(() => {
diff --git a/src/pages/options/youtube/youtube.html b/src/pages/options/youtube/youtube.html
index 492843d7..ce4ebf50 100644
--- a/src/pages/options/youtube/youtube.html
+++ b/src/pages/options/youtube/youtube.html
@@ -101,7 +101,7 @@
   <section class="option-block">
     <div class="some-block option-block">
       <h4>Enable</h4>
-      <input id="disable-invidious" type="checkbox" checked />
+      <input id="disable-invidious" type="checkbox" />
     </div>
 
     <div class="some-block option-block">
@@ -151,608 +151,560 @@
 
       <div class="some-block option-block">
         <h4>Bypass Watch On YouTube</h4>
-        <input id="bypass-watch-on-youtube" type="checkbox" checked />
+        <input id="bypass-watch-on-youtube" type="checkbox" />
       </div>
 
+      <hr>
+
       <div class="some-block option-block">
-        <h4>Autoplay Video</h4>
-        <select id="invidious-autoplay">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-        </select>
+        <h4>Enable Custom Settings (will use cookies and localStorage)</h4>
+        <input id="enable-youtube-custom-settings" type="checkbox" />
       </div>
 
-      <div class="some-block option-block">
-        <h4>Volume: <span id="volume-value">--%</span></h4>
-        <input id="invidious-volume" name="invidious-volume" type="range" min="0" max="100" step="1" />
-        <button type="button" class="default" id="clear-invidious-volume">
-          <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
-            <path d="M0 0h24v24H0V0z" fill="none" />
-            <path
-              d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" />
-          </svg>
-        </button>
+      <div class="custom-settings">
+
+        <div class="some-block option-block">
+          <h4>Autoplay Video</h4>
+          <input id="invidious-autoplay" type="checkbox" />
+        </div>
+
+        <div class="some-block option-block">
+          <h4>Volume: <span id="volume-value">--%</span></h4>
+          <input id="invidious-volume" name="invidious-volume" type="range" min="0" max="100" step="1" />
+        </div>
+
       </div>
+
     </div>
 
+
+
     <div id="invidious">
-      <div class="some-block option-block">
-        <h4>Player Style</h4>
-        <select id="invidious-player_style">
-          <option value="DEFAULT">Default</option>
-          <option value="invidious">Invidious</option>
-          <option value="youtube">YouTube</option>
-        </select>
-      </div>
+      <div class="custom-settings">
+        <div class="some-block option-block">
+          <h4>Player Style</h4>
+          <select id="invidious-player_style">
+            <option value="invidious">Invidious</option>
+            <option value="youtube">YouTube</option>
+          </select>
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Always loop</h4>
-        <select id="invidious-video_loop">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Always loop</h4>
+          <input id="invidious-video_loop" type="checkbox" />
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Autoplay next video</h4>
-        <select id="invidious-continue_autoplay">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Autoplay next video</h4>
+          <input id="invidious-continue_autoplay" type="checkbox" />
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Play next by default</h4>
-        <select id="invidious-continue">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Play next by default</h4>
+          <input id="invidious-continue" type="checkbox" />
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Always proxy videos</h4>
-        <select id="invidious-local">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Always proxy videos</h4>
+          <input id="invidious-local" type="checkbox" />
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Listen by default</h4>
-        <select id="invidious-listen">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Listen by default</h4>
+          <input id="invidious-listen" type="checkbox" />
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Default speed</h4>
-        <select id="invidious-speed">
-          <option value="DEFAULT">Default</option>
-          <option>2.0</option>
-          <option>1.75</option>
-          <option>1.5</option>
-          <option>1.25</option>
-          <option>1.0</option>
-          <option>0.75</option>
-          <option>0.5</option>
-          <option>0.25</option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Default speed</h4>
+          <select id="invidious-speed">
+            <option>2.0</option>
+            <option>1.75</option>
+            <option>1.5</option>
+            <option>1.25</option>
+            <option>1.0</option>
+            <option>0.75</option>
+            <option>0.5</option>
+            <option>0.25</option>
+          </select>
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Preferred video quality</h4>
-        <select id="invidious-quality">
-          <option value="DEFAULT">Default</option>
-          <option value="hd720">720p</option>
-          <option value="medium">480p</option>
-          <option value="dash">DASH (adaptive quality)</option>
-          </option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Preferred video quality</h4>
+          <select id="invidious-quality">
+            <option value="hd720">720p</option>
+            <option value="medium">480p</option>
+            <option value="dash">DASH (adaptive quality)</option>
+            </option>
+          </select>
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Preferred DASH video quality</h4>
-        <select id="invidious-quality_dash">
-          <option value="DEFAULT">Default</option>
-          <option value="auto">Auto</option>
-          <option value="best">Best</option>
-          <option value="4320p">4320p</option>
-          <option value="2160p">2160p</option>
-          <option value="1440p">1440p</option>
-          <option value="1080p" selected="">1080p</option>
-          <option value="720p">720p</option>
-          <option value="480p">480p</option>
-          <option value="360p">360p</option>
-          <option value="240p">240p</option>
-          <option value="144p">144p</option>
-          <option value="worst">Worst</option>
-          </option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Preferred DASH video quality</h4>
+          <select id="invidious-quality_dash">
+            <option value="auto">Auto</option>
+            <option value="best">Best</option>
+            <option value="4320p">4320p</option>
+            <option value="2160p">2160p</option>
+            <option value="1440p">1440p</option>
+            <option value="1080p" selected="">1080p</option>
+            <option value="720p">720p</option>
+            <option value="480p">480p</option>
+            <option value="360p">360p</option>
+            <option value="240p">240p</option>
+            <option value="144p">144p</option>
+            <option value="worst">Worst</option>
+            </option>
+          </select>
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Default comments</h4>
-        <select id="invidious-comments[0]">
-          <option value="DEFAULT">Default</option>
-          <option value="">none</option>
-          <option value="youtube">YouTube</option>
-          <option value="reddit">Reddit</option>
-          </option>
-        </select>
-        &nbsp;
-        <select id="invidious-comments[1]">
-          <option value="DEFAULT">Default</option>
-          <option value="">none</option>
-          <option value="youtube">YouTube</option>
-          <option value="reddit">Reddit</option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Default comments</h4>
+          <select id="invidious-comments[0]">
+            <option value="">none</option>
+            <option value="youtube">YouTube</option>
+            <option value="reddit">Reddit</option>
+            </option>
+          </select>
+          &nbsp;
+          <select id="invidious-comments[1]">
+            <option value="">none</option>
+            <option value="youtube">YouTube</option>
+            <option value="reddit">Reddit</option>
+          </select>
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Default captions</h4>
-        <select id="invidious-captions[0]">
-          <option value="DEFAULT">Default</option>
-          <option value="">none</option>
-          <option value="English">English</option>
-          <option value="English (auto-generated)">English (auto-generated)</option>
-          <option value="English (United Kingdom)">English (United Kingdom)</option>
-          <option value="English (United States)">English (United States)</option>
-          <option value="Afrikaans">Afrikaans</option>
-          <option value="Albanian">Albanian</option>
-          <option value="Amharic">Amharic</option>
-          <option value="Arabic">Arabic</option>
-          <option value="Armenian">Armenian</option>
-          <option value="Azerbaijani">Azerbaijani</option>
-          <option value="Bangla">Bangla</option>
-          <option value="Basque">Basque</option>
-          <option value="Belarusian">Belarusian</option>
-          <option value="Bosnian">Bosnian</option>
-          <option value="Bulgarian">Bulgarian</option>
-          <option value="Burmese">Burmese</option>
-          <option value="Cantonese (Hong Kong)">Cantonese (Hong Kong)</option>
-          <option value="Catalan">Catalan</option>
-          <option value="Cebuano">Cebuano</option>
-          <option value="Chinese">Chinese</option>
-          <option value="Chinese (China)">Chinese (China)</option>
-          <option value="Chinese (Hong Kong)">Chinese (Hong Kong)</option>
-          <option value="Chinese (Simplified)">Chinese (Simplified)</option>
-          <option value="Chinese (Taiwan)">Chinese (Taiwan)</option>
-          <option value="Chinese (Traditional)">Chinese (Traditional)</option>
-          <option value="Corsican">Corsican</option>
-          <option value="Croatian">Croatian</option>
-          <option value="Czech">Czech</option>
-          <option value="Danish">Danish</option>
-          <option value="Dutch">Dutch</option>
-          <option value="Dutch (auto-generated)">Dutch (auto-generated)</option>
-          <option value="Esperanto">Esperanto</option>
-          <option value="Estonian">Estonian</option>
-          <option value="Filipino">Filipino</option>
-          <option value="Finnish">Finnish</option>
-          <option value="French">French</option>
-          <option value="French (auto-generated)">French (auto-generated)</option>
-          <option value="Galician">Galician</option>
-          <option value="Georgian">Georgian</option>
-          <option value="German">German</option>
-          <option value="German (auto-generated)">German (auto-generated)</option>
-          <option value="Greek">Greek</option>
-          <option value="Gujarati">Gujarati</option>
-          <option value="Haitian Creole">Haitian Creole</option>
-          <option value="Hausa">Hausa</option>
-          <option value="Hawaiian">Hawaiian</option>
-          <option value="Hebrew">Hebrew</option>
-          <option value="Hindi">Hindi</option>
-          <option value="Hmong">Hmong</option>
-          <option value="Hungarian">Hungarian</option>
-          <option value="Icelandic">Icelandic</option>
-          <option value="Igbo">Igbo</option>
-          <option value="Indonesian">Indonesian</option>
-          <option value="Indonesian (auto-generated)">Indonesian (auto-generated)</option>
-          <option value="Interlingue">Interlingue</option>
-          <option value="Irish">Irish</option>
-          <option value="Italian">Italian</option>
-          <option value="Italian (auto-generated)">Italian (auto-generated)</option>
-          <option value="Japanese">Japanese</option>
-          <option value="Japanese (auto-generated)">Japanese (auto-generated)</option>
-          <option value="Javanese">Javanese</option>
-          <option value="Kannada">Kannada</option>
-          <option value="Kazakh">Kazakh</option>
-          <option value="Khmer">Khmer</option>
-          <option value="Korean">Korean</option>
-          <option value="Korean (auto-generated)">Korean (auto-generated)</option>
-          <option value="Kurdish">Kurdish</option>
-          <option value="Kyrgyz">Kyrgyz</option>
-          <option value="Lao">Lao</option>
-          <option value="Latin">Latin</option>
-          <option value="Latvian">Latvian</option>
-          <option value="Lithuanian">Lithuanian</option>
-          <option value="Luxembourgish">Luxembourgish</option>
-          <option value="Macedonian">Macedonian</option>
-          <option value="Malagasy">Malagasy</option>
-          <option value="Malay">Malay</option>
-          <option value="Malayalam">Malayalam</option>
-          <option value="Maltese">Maltese</option>
-          <option value="Maori">Maori</option>
-          <option value="Marathi">Marathi</option>
-          <option value="Mongolian">Mongolian</option>
-          <option value="Nepali">Nepali</option>
-          <option value="Norwegian Bokmål">Norwegian Bokmål</option>
-          <option value="Nyanja">Nyanja</option>
-          <option value="Pashto">Pashto</option>
-          <option value="Persian">Persian</option>
-          <option value="Polish">Polish</option>
-          <option value="Portuguese">Portuguese</option>
-          <option value="Portuguese (auto-generated)">Portuguese (auto-generated)</option>
-          <option value="Portuguese (Brazil)">Portuguese (Brazil)</option>
-          <option value="Punjabi">Punjabi</option>
-          <option value="Romanian">Romanian</option>
-          <option value="Russian">Russian</option>
-          <option value="Russian (auto-generated)">Russian (auto-generated)</option>
-          <option value="Samoan">Samoan</option>
-          <option value="Scottish Gaelic">Scottish Gaelic</option>
-          <option value="Serbian">Serbian</option>
-          <option value="Shona">Shona</option>
-          <option value="Sindhi">Sindhi</option>
-          <option value="Sinhala">Sinhala</option>
-          <option value="Slovak">Slovak</option>
-          <option value="Slovenian">Slovenian</option>
-          <option value="Somali">Somali</option>
-          <option value="Southern Sotho">Southern Sotho</option>
-          <option value="Spanish">Spanish</option>
-          <option value="Spanish (auto-generated)">Spanish (auto-generated)</option>
-          <option value="Spanish (Latin America)">Spanish (Latin America)</option>
-          <option value="Spanish (Mexico)">Spanish (Mexico)</option>
-          <option value="Spanish (Spain)">Spanish (Spain)</option>
-          <option value="Sundanese">Sundanese</option>
-          <option value="Swahili">Swahili</option>
-          <option value="Swedish">Swedish</option>
-          <option value="Tajik">Tajik</option>
-          <option value="Tamil">Tamil</option>
-          <option value="Telugu">Telugu</option>
-          <option value="Thai">Thai</option>
-          <option value="Turkish">Turkish</option>
-          <option value="Turkish (auto-generated)">Turkish (auto-generated)</option>
-          <option value="Ukrainian">Ukrainian</option>
-          <option value="Urdu">Urdu</option>
-          <option value="Uzbek">Uzbek</option>
-          <option value="Vietnamese">Vietnamese</option>
-          <option value="Vietnamese (auto-generated)">Vietnamese (auto-generated)</option>
-          <option value="Welsh">Welsh</option>
-          <option value="Western Frisian">Western Frisian</option>
-          <option value="Xhosa">Xhosa</option>
-          <option value="Yiddish">Yiddish</option>
-          <option value="Yoruba">Yoruba</option>
-          <option value="Zulu">Zulu</option>
-        </select>
-        &nbsp;
-        <select id="invidious-captions[1]">
-          <option value="DEFAULT">Default</option>
-          <option value="">none</option>
-          <option value="English">English</option>
-          <option value="English (auto-generated)">English (auto-generated)</option>
-          <option value="English (United Kingdom)">English (United Kingdom)</option>
-          <option value="English (United States)">English (United States)</option>
-          <option value="Afrikaans">Afrikaans</option>
-          <option value="Albanian">Albanian</option>
-          <option value="Amharic">Amharic</option>
-          <option value="Arabic">Arabic</option>
-          <option value="Armenian">Armenian</option>
-          <option value="Azerbaijani">Azerbaijani</option>
-          <option value="Bangla">Bangla</option>
-          <option value="Basque">Basque</option>
-          <option value="Belarusian">Belarusian</option>
-          <option value="Bosnian">Bosnian</option>
-          <option value="Bulgarian">Bulgarian</option>
-          <option value="Burmese">Burmese</option>
-          <option value="Cantonese (Hong Kong)">Cantonese (Hong Kong)</option>
-          <option value="Catalan">Catalan</option>
-          <option value="Cebuano">Cebuano</option>
-          <option value="Chinese">Chinese</option>
-          <option value="Chinese (China)">Chinese (China)</option>
-          <option value="Chinese (Hong Kong)">Chinese (Hong Kong)</option>
-          <option value="Chinese (Simplified)">Chinese (Simplified)</option>
-          <option value="Chinese (Taiwan)">Chinese (Taiwan)</option>
-          <option value="Chinese (Traditional)">Chinese (Traditional)</option>
-          <option value="Corsican">Corsican</option>
-          <option value="Croatian">Croatian</option>
-          <option value="Czech">Czech</option>
-          <option value="Danish">Danish</option>
-          <option value="Dutch">Dutch</option>
-          <option value="Dutch (auto-generated)">Dutch (auto-generated)</option>
-          <option value="Esperanto">Esperanto</option>
-          <option value="Estonian">Estonian</option>
-          <option value="Filipino">Filipino</option>
-          <option value="Finnish">Finnish</option>
-          <option value="French">French</option>
-          <option value="French (auto-generated)">French (auto-generated)</option>
-          <option value="Galician">Galician</option>
-          <option value="Georgian">Georgian</option>
-          <option value="German">German</option>
-          <option value="German (auto-generated)">German (auto-generated)</option>
-          <option value="Greek">Greek</option>
-          <option value="Gujarati">Gujarati</option>
-          <option value="Haitian Creole">Haitian Creole</option>
-          <option value="Hausa">Hausa</option>
-          <option value="Hawaiian">Hawaiian</option>
-          <option value="Hebrew">Hebrew</option>
-          <option value="Hindi">Hindi</option>
-          <option value="Hmong">Hmong</option>
-          <option value="Hungarian">Hungarian</option>
-          <option value="Icelandic">Icelandic</option>
-          <option value="Igbo">Igbo</option>
-          <option value="Indonesian">Indonesian</option>
-          <option value="Indonesian (auto-generated)">Indonesian (auto-generated)</option>
-          <option value="Interlingue">Interlingue</option>
-          <option value="Irish">Irish</option>
-          <option value="Italian">Italian</option>
-          <option value="Italian (auto-generated)">Italian (auto-generated)</option>
-          <option value="Japanese">Japanese</option>
-          <option value="Japanese (auto-generated)">Japanese (auto-generated)</option>
-          <option value="Javanese">Javanese</option>
-          <option value="Kannada">Kannada</option>
-          <option value="Kazakh">Kazakh</option>
-          <option value="Khmer">Khmer</option>
-          <option value="Korean">Korean</option>
-          <option value="Korean (auto-generated)">Korean (auto-generated)</option>
-          <option value="Kurdish">Kurdish</option>
-          <option value="Kyrgyz">Kyrgyz</option>
-          <option value="Lao">Lao</option>
-          <option value="Latin">Latin</option>
-          <option value="Latvian">Latvian</option>
-          <option value="Lithuanian">Lithuanian</option>
-          <option value="Luxembourgish">Luxembourgish</option>
-          <option value="Macedonian">Macedonian</option>
-          <option value="Malagasy">Malagasy</option>
-          <option value="Malay">Malay</option>
-          <option value="Malayalam">Malayalam</option>
-          <option value="Maltese">Maltese</option>
-          <option value="Maori">Maori</option>
-          <option value="Marathi">Marathi</option>
-          <option value="Mongolian">Mongolian</option>
-          <option value="Nepali">Nepali</option>
-          <option value="Norwegian Bokmål">Norwegian Bokmål</option>
-          <option value="Nyanja">Nyanja</option>
-          <option value="Pashto">Pashto</option>
-          <option value="Persian">Persian</option>
-          <option value="Polish">Polish</option>
-          <option value="Portuguese">Portuguese</option>
-          <option value="Portuguese (auto-generated)">Portuguese (auto-generated)</option>
-          <option value="Portuguese (Brazil)">Portuguese (Brazil)</option>
-          <option value="Punjabi">Punjabi</option>
-          <option value="Romanian">Romanian</option>
-          <option value="Russian">Russian</option>
-          <option value="Russian (auto-generated)">Russian (auto-generated)</option>
-          <option value="Samoan">Samoan</option>
-          <option value="Scottish Gaelic">Scottish Gaelic</option>
-          <option value="Serbian">Serbian</option>
-          <option value="Shona">Shona</option>
-          <option value="Sindhi">Sindhi</option>
-          <option value="Sinhala">Sinhala</option>
-          <option value="Slovak">Slovak</option>
-          <option value="Slovenian">Slovenian</option>
-          <option value="Somali">Somali</option>
-          <option value="Southern Sotho">Southern Sotho</option>
-          <option value="Spanish">Spanish</option>
-          <option value="Spanish (auto-generated)">Spanish (auto-generated)</option>
-          <option value="Spanish (Latin America)">Spanish (Latin America)</option>
-          <option value="Spanish (Mexico)">Spanish (Mexico)</option>
-          <option value="Spanish (Spain)">Spanish (Spain)</option>
-          <option value="Sundanese">Sundanese</option>
-          <option value="Swahili">Swahili</option>
-          <option value="Swedish">Swedish</option>
-          <option value="Tajik">Tajik</option>
-          <option value="Tamil">Tamil</option>
-          <option value="Telugu">Telugu</option>
-          <option value="Thai">Thai</option>
-          <option value="Turkish">Turkish</option>
-          <option value="Turkish (auto-generated)">Turkish (auto-generated)</option>
-          <option value="Ukrainian">Ukrainian</option>
-          <option value="Urdu">Urdu</option>
-          <option value="Uzbek">Uzbek</option>
-          <option value="Vietnamese">Vietnamese</option>
-          <option value="Vietnamese (auto-generated)">Vietnamese (auto-generated)</option>
-          <option value="Welsh">Welsh</option>
-          <option value="Western Frisian">Western Frisian</option>
-          <option value="Xhosa">Xhosa</option>
-          <option value="Yiddish">Yiddish</option>
-          <option value="Yoruba">Yoruba</option>
-          <option value="Zulu">Zulu</option>
-        </select>
-        &nbsp;
-        <select id="invidious-captions[2]">
-          <option value="DEFAULT">Default</option>
-          <option value="">none</option>
-          <option value="English">English</option>
-          <option value="English (auto-generated)">English (auto-generated)</option>
-          <option value="English (United Kingdom)">English (United Kingdom)</option>
-          <option value="English (United States)">English (United States)</option>
-          <option value="Afrikaans">Afrikaans</option>
-          <option value="Albanian">Albanian</option>
-          <option value="Amharic">Amharic</option>
-          <option value="Arabic">Arabic</option>
-          <option value="Armenian">Armenian</option>
-          <option value="Azerbaijani">Azerbaijani</option>
-          <option value="Bangla">Bangla</option>
-          <option value="Basque">Basque</option>
-          <option value="Belarusian">Belarusian</option>
-          <option value="Bosnian">Bosnian</option>
-          <option value="Bulgarian">Bulgarian</option>
-          <option value="Burmese">Burmese</option>
-          <option value="Cantonese (Hong Kong)">Cantonese (Hong Kong)</option>
-          <option value="Catalan">Catalan</option>
-          <option value="Cebuano">Cebuano</option>
-          <option value="Chinese">Chinese</option>
-          <option value="Chinese (China)">Chinese (China)</option>
-          <option value="Chinese (Hong Kong)">Chinese (Hong Kong)</option>
-          <option value="Chinese (Simplified)">Chinese (Simplified)</option>
-          <option value="Chinese (Taiwan)">Chinese (Taiwan)</option>
-          <option value="Chinese (Traditional)">Chinese (Traditional)</option>
-          <option value="Corsican">Corsican</option>
-          <option value="Croatian">Croatian</option>
-          <option value="Czech">Czech</option>
-          <option value="Danish">Danish</option>
-          <option value="Dutch">Dutch</option>
-          <option value="Dutch (auto-generated)">Dutch (auto-generated)</option>
-          <option value="Esperanto">Esperanto</option>
-          <option value="Estonian">Estonian</option>
-          <option value="Filipino">Filipino</option>
-          <option value="Finnish">Finnish</option>
-          <option value="French">French</option>
-          <option value="French (auto-generated)">French (auto-generated)</option>
-          <option value="Galician">Galician</option>
-          <option value="Georgian">Georgian</option>
-          <option value="German">German</option>
-          <option value="German (auto-generated)">German (auto-generated)</option>
-          <option value="Greek">Greek</option>
-          <option value="Gujarati">Gujarati</option>
-          <option value="Haitian Creole">Haitian Creole</option>
-          <option value="Hausa">Hausa</option>
-          <option value="Hawaiian">Hawaiian</option>
-          <option value="Hebrew">Hebrew</option>
-          <option value="Hindi">Hindi</option>
-          <option value="Hmong">Hmong</option>
-          <option value="Hungarian">Hungarian</option>
-          <option value="Icelandic">Icelandic</option>
-          <option value="Igbo">Igbo</option>
-          <option value="Indonesian">Indonesian</option>
-          <option value="Indonesian (auto-generated)">Indonesian (auto-generated)</option>
-          <option value="Interlingue">Interlingue</option>
-          <option value="Irish">Irish</option>
-          <option value="Italian">Italian</option>
-          <option value="Italian (auto-generated)">Italian (auto-generated)</option>
-          <option value="Japanese">Japanese</option>
-          <option value="Japanese (auto-generated)">Japanese (auto-generated)</option>
-          <option value="Javanese">Javanese</option>
-          <option value="Kannada">Kannada</option>
-          <option value="Kazakh">Kazakh</option>
-          <option value="Khmer">Khmer</option>
-          <option value="Korean">Korean</option>
-          <option value="Korean (auto-generated)">Korean (auto-generated)</option>
-          <option value="Kurdish">Kurdish</option>
-          <option value="Kyrgyz">Kyrgyz</option>
-          <option value="Lao">Lao</option>
-          <option value="Latin">Latin</option>
-          <option value="Latvian">Latvian</option>
-          <option value="Lithuanian">Lithuanian</option>
-          <option value="Luxembourgish">Luxembourgish</option>
-          <option value="Macedonian">Macedonian</option>
-          <option value="Malagasy">Malagasy</option>
-          <option value="Malay">Malay</option>
-          <option value="Malayalam">Malayalam</option>
-          <option value="Maltese">Maltese</option>
-          <option value="Maori">Maori</option>
-          <option value="Marathi">Marathi</option>
-          <option value="Mongolian">Mongolian</option>
-          <option value="Nepali">Nepali</option>
-          <option value="Norwegian Bokmål">Norwegian Bokmål</option>
-          <option value="Nyanja">Nyanja</option>
-          <option value="Pashto">Pashto</option>
-          <option value="Persian">Persian</option>
-          <option value="Polish">Polish</option>
-          <option value="Portuguese">Portuguese</option>
-          <option value="Portuguese (auto-generated)">Portuguese (auto-generated)</option>
-          <option value="Portuguese (Brazil)">Portuguese (Brazil)</option>
-          <option value="Punjabi">Punjabi</option>
-          <option value="Romanian">Romanian</option>
-          <option value="Russian">Russian</option>
-          <option value="Russian (auto-generated)">Russian (auto-generated)</option>
-          <option value="Samoan">Samoan</option>
-          <option value="Scottish Gaelic">Scottish Gaelic</option>
-          <option value="Serbian">Serbian</option>
-          <option value="Shona">Shona</option>
-          <option value="Sindhi">Sindhi</option>
-          <option value="Sinhala">Sinhala</option>
-          <option value="Slovak">Slovak</option>
-          <option value="Slovenian">Slovenian</option>
-          <option value="Somali">Somali</option>
-          <option value="Southern Sotho">Southern Sotho</option>
-          <option value="Spanish">Spanish</option>
-          <option value="Spanish (auto-generated)">Spanish (auto-generated)</option>
-          <option value="Spanish (Latin America)">Spanish (Latin America)</option>
-          <option value="Spanish (Mexico)">Spanish (Mexico)</option>
-          <option value="Spanish (Spain)">Spanish (Spain)</option>
-          <option value="Sundanese">Sundanese</option>
-          <option value="Swahili">Swahili</option>
-          <option value="Swedish">Swedish</option>
-          <option value="Tajik">Tajik</option>
-          <option value="Tamil">Tamil</option>
-          <option value="Telugu">Telugu</option>
-          <option value="Thai">Thai</option>
-          <option value="Turkish">Turkish</option>
-          <option value="Turkish (auto-generated)">Turkish (auto-generated)</option>
-          <option value="Ukrainian">Ukrainian</option>
-          <option value="Urdu">Urdu</option>
-          <option value="Uzbek">Uzbek</option>
-          <option value="Vietnamese">Vietnamese</option>
-          <option value="Vietnamese (auto-generated)">Vietnamese (auto-generated)</option>
-          <option value="Welsh">Welsh</option>
-          <option value="Western Frisian">Western Frisian</option>
-          <option value="Xhosa">Xhosa</option>
-          <option value="Yiddish">Yiddish</option>
-          <option value="Yoruba">Yoruba</option>
-          <option value="Zulu">Zulu</option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Default captions</h4>
+          <select id="invidious-captions[0]">
+            <option value="">none</option>
+            <option value="English">English</option>
+            <option value="English (auto-generated)">English (auto-generated)</option>
+            <option value="English (United Kingdom)">English (United Kingdom)</option>
+            <option value="English (United States)">English (United States)</option>
+            <option value="Afrikaans">Afrikaans</option>
+            <option value="Albanian">Albanian</option>
+            <option value="Amharic">Amharic</option>
+            <option value="Arabic">Arabic</option>
+            <option value="Armenian">Armenian</option>
+            <option value="Azerbaijani">Azerbaijani</option>
+            <option value="Bangla">Bangla</option>
+            <option value="Basque">Basque</option>
+            <option value="Belarusian">Belarusian</option>
+            <option value="Bosnian">Bosnian</option>
+            <option value="Bulgarian">Bulgarian</option>
+            <option value="Burmese">Burmese</option>
+            <option value="Cantonese (Hong Kong)">Cantonese (Hong Kong)</option>
+            <option value="Catalan">Catalan</option>
+            <option value="Cebuano">Cebuano</option>
+            <option value="Chinese">Chinese</option>
+            <option value="Chinese (China)">Chinese (China)</option>
+            <option value="Chinese (Hong Kong)">Chinese (Hong Kong)</option>
+            <option value="Chinese (Simplified)">Chinese (Simplified)</option>
+            <option value="Chinese (Taiwan)">Chinese (Taiwan)</option>
+            <option value="Chinese (Traditional)">Chinese (Traditional)</option>
+            <option value="Corsican">Corsican</option>
+            <option value="Croatian">Croatian</option>
+            <option value="Czech">Czech</option>
+            <option value="Danish">Danish</option>
+            <option value="Dutch">Dutch</option>
+            <option value="Dutch (auto-generated)">Dutch (auto-generated)</option>
+            <option value="Esperanto">Esperanto</option>
+            <option value="Estonian">Estonian</option>
+            <option value="Filipino">Filipino</option>
+            <option value="Finnish">Finnish</option>
+            <option value="French">French</option>
+            <option value="French (auto-generated)">French (auto-generated)</option>
+            <option value="Galician">Galician</option>
+            <option value="Georgian">Georgian</option>
+            <option value="German">German</option>
+            <option value="German (auto-generated)">German (auto-generated)</option>
+            <option value="Greek">Greek</option>
+            <option value="Gujarati">Gujarati</option>
+            <option value="Haitian Creole">Haitian Creole</option>
+            <option value="Hausa">Hausa</option>
+            <option value="Hawaiian">Hawaiian</option>
+            <option value="Hebrew">Hebrew</option>
+            <option value="Hindi">Hindi</option>
+            <option value="Hmong">Hmong</option>
+            <option value="Hungarian">Hungarian</option>
+            <option value="Icelandic">Icelandic</option>
+            <option value="Igbo">Igbo</option>
+            <option value="Indonesian">Indonesian</option>
+            <option value="Indonesian (auto-generated)">Indonesian (auto-generated)</option>
+            <option value="Interlingue">Interlingue</option>
+            <option value="Irish">Irish</option>
+            <option value="Italian">Italian</option>
+            <option value="Italian (auto-generated)">Italian (auto-generated)</option>
+            <option value="Japanese">Japanese</option>
+            <option value="Japanese (auto-generated)">Japanese (auto-generated)</option>
+            <option value="Javanese">Javanese</option>
+            <option value="Kannada">Kannada</option>
+            <option value="Kazakh">Kazakh</option>
+            <option value="Khmer">Khmer</option>
+            <option value="Korean">Korean</option>
+            <option value="Korean (auto-generated)">Korean (auto-generated)</option>
+            <option value="Kurdish">Kurdish</option>
+            <option value="Kyrgyz">Kyrgyz</option>
+            <option value="Lao">Lao</option>
+            <option value="Latin">Latin</option>
+            <option value="Latvian">Latvian</option>
+            <option value="Lithuanian">Lithuanian</option>
+            <option value="Luxembourgish">Luxembourgish</option>
+            <option value="Macedonian">Macedonian</option>
+            <option value="Malagasy">Malagasy</option>
+            <option value="Malay">Malay</option>
+            <option value="Malayalam">Malayalam</option>
+            <option value="Maltese">Maltese</option>
+            <option value="Maori">Maori</option>
+            <option value="Marathi">Marathi</option>
+            <option value="Mongolian">Mongolian</option>
+            <option value="Nepali">Nepali</option>
+            <option value="Norwegian Bokmål">Norwegian Bokmål</option>
+            <option value="Nyanja">Nyanja</option>
+            <option value="Pashto">Pashto</option>
+            <option value="Persian">Persian</option>
+            <option value="Polish">Polish</option>
+            <option value="Portuguese">Portuguese</option>
+            <option value="Portuguese (auto-generated)">Portuguese (auto-generated)</option>
+            <option value="Portuguese (Brazil)">Portuguese (Brazil)</option>
+            <option value="Punjabi">Punjabi</option>
+            <option value="Romanian">Romanian</option>
+            <option value="Russian">Russian</option>
+            <option value="Russian (auto-generated)">Russian (auto-generated)</option>
+            <option value="Samoan">Samoan</option>
+            <option value="Scottish Gaelic">Scottish Gaelic</option>
+            <option value="Serbian">Serbian</option>
+            <option value="Shona">Shona</option>
+            <option value="Sindhi">Sindhi</option>
+            <option value="Sinhala">Sinhala</option>
+            <option value="Slovak">Slovak</option>
+            <option value="Slovenian">Slovenian</option>
+            <option value="Somali">Somali</option>
+            <option value="Southern Sotho">Southern Sotho</option>
+            <option value="Spanish">Spanish</option>
+            <option value="Spanish (auto-generated)">Spanish (auto-generated)</option>
+            <option value="Spanish (Latin America)">Spanish (Latin America)</option>
+            <option value="Spanish (Mexico)">Spanish (Mexico)</option>
+            <option value="Spanish (Spain)">Spanish (Spain)</option>
+            <option value="Sundanese">Sundanese</option>
+            <option value="Swahili">Swahili</option>
+            <option value="Swedish">Swedish</option>
+            <option value="Tajik">Tajik</option>
+            <option value="Tamil">Tamil</option>
+            <option value="Telugu">Telugu</option>
+            <option value="Thai">Thai</option>
+            <option value="Turkish">Turkish</option>
+            <option value="Turkish (auto-generated)">Turkish (auto-generated)</option>
+            <option value="Ukrainian">Ukrainian</option>
+            <option value="Urdu">Urdu</option>
+            <option value="Uzbek">Uzbek</option>
+            <option value="Vietnamese">Vietnamese</option>
+            <option value="Vietnamese (auto-generated)">Vietnamese (auto-generated)</option>
+            <option value="Welsh">Welsh</option>
+            <option value="Western Frisian">Western Frisian</option>
+            <option value="Xhosa">Xhosa</option>
+            <option value="Yiddish">Yiddish</option>
+            <option value="Yoruba">Yoruba</option>
+            <option value="Zulu">Zulu</option>
+          </select>
+          &nbsp;
+          <select id="invidious-captions[1]">
+            <option value="">none</option>
+            <option value="English">English</option>
+            <option value="English (auto-generated)">English (auto-generated)</option>
+            <option value="English (United Kingdom)">English (United Kingdom)</option>
+            <option value="English (United States)">English (United States)</option>
+            <option value="Afrikaans">Afrikaans</option>
+            <option value="Albanian">Albanian</option>
+            <option value="Amharic">Amharic</option>
+            <option value="Arabic">Arabic</option>
+            <option value="Armenian">Armenian</option>
+            <option value="Azerbaijani">Azerbaijani</option>
+            <option value="Bangla">Bangla</option>
+            <option value="Basque">Basque</option>
+            <option value="Belarusian">Belarusian</option>
+            <option value="Bosnian">Bosnian</option>
+            <option value="Bulgarian">Bulgarian</option>
+            <option value="Burmese">Burmese</option>
+            <option value="Cantonese (Hong Kong)">Cantonese (Hong Kong)</option>
+            <option value="Catalan">Catalan</option>
+            <option value="Cebuano">Cebuano</option>
+            <option value="Chinese">Chinese</option>
+            <option value="Chinese (China)">Chinese (China)</option>
+            <option value="Chinese (Hong Kong)">Chinese (Hong Kong)</option>
+            <option value="Chinese (Simplified)">Chinese (Simplified)</option>
+            <option value="Chinese (Taiwan)">Chinese (Taiwan)</option>
+            <option value="Chinese (Traditional)">Chinese (Traditional)</option>
+            <option value="Corsican">Corsican</option>
+            <option value="Croatian">Croatian</option>
+            <option value="Czech">Czech</option>
+            <option value="Danish">Danish</option>
+            <option value="Dutch">Dutch</option>
+            <option value="Dutch (auto-generated)">Dutch (auto-generated)</option>
+            <option value="Esperanto">Esperanto</option>
+            <option value="Estonian">Estonian</option>
+            <option value="Filipino">Filipino</option>
+            <option value="Finnish">Finnish</option>
+            <option value="French">French</option>
+            <option value="French (auto-generated)">French (auto-generated)</option>
+            <option value="Galician">Galician</option>
+            <option value="Georgian">Georgian</option>
+            <option value="German">German</option>
+            <option value="German (auto-generated)">German (auto-generated)</option>
+            <option value="Greek">Greek</option>
+            <option value="Gujarati">Gujarati</option>
+            <option value="Haitian Creole">Haitian Creole</option>
+            <option value="Hausa">Hausa</option>
+            <option value="Hawaiian">Hawaiian</option>
+            <option value="Hebrew">Hebrew</option>
+            <option value="Hindi">Hindi</option>
+            <option value="Hmong">Hmong</option>
+            <option value="Hungarian">Hungarian</option>
+            <option value="Icelandic">Icelandic</option>
+            <option value="Igbo">Igbo</option>
+            <option value="Indonesian">Indonesian</option>
+            <option value="Indonesian (auto-generated)">Indonesian (auto-generated)</option>
+            <option value="Interlingue">Interlingue</option>
+            <option value="Irish">Irish</option>
+            <option value="Italian">Italian</option>
+            <option value="Italian (auto-generated)">Italian (auto-generated)</option>
+            <option value="Japanese">Japanese</option>
+            <option value="Japanese (auto-generated)">Japanese (auto-generated)</option>
+            <option value="Javanese">Javanese</option>
+            <option value="Kannada">Kannada</option>
+            <option value="Kazakh">Kazakh</option>
+            <option value="Khmer">Khmer</option>
+            <option value="Korean">Korean</option>
+            <option value="Korean (auto-generated)">Korean (auto-generated)</option>
+            <option value="Kurdish">Kurdish</option>
+            <option value="Kyrgyz">Kyrgyz</option>
+            <option value="Lao">Lao</option>
+            <option value="Latin">Latin</option>
+            <option value="Latvian">Latvian</option>
+            <option value="Lithuanian">Lithuanian</option>
+            <option value="Luxembourgish">Luxembourgish</option>
+            <option value="Macedonian">Macedonian</option>
+            <option value="Malagasy">Malagasy</option>
+            <option value="Malay">Malay</option>
+            <option value="Malayalam">Malayalam</option>
+            <option value="Maltese">Maltese</option>
+            <option value="Maori">Maori</option>
+            <option value="Marathi">Marathi</option>
+            <option value="Mongolian">Mongolian</option>
+            <option value="Nepali">Nepali</option>
+            <option value="Norwegian Bokmål">Norwegian Bokmål</option>
+            <option value="Nyanja">Nyanja</option>
+            <option value="Pashto">Pashto</option>
+            <option value="Persian">Persian</option>
+            <option value="Polish">Polish</option>
+            <option value="Portuguese">Portuguese</option>
+            <option value="Portuguese (auto-generated)">Portuguese (auto-generated)</option>
+            <option value="Portuguese (Brazil)">Portuguese (Brazil)</option>
+            <option value="Punjabi">Punjabi</option>
+            <option value="Romanian">Romanian</option>
+            <option value="Russian">Russian</option>
+            <option value="Russian (auto-generated)">Russian (auto-generated)</option>
+            <option value="Samoan">Samoan</option>
+            <option value="Scottish Gaelic">Scottish Gaelic</option>
+            <option value="Serbian">Serbian</option>
+            <option value="Shona">Shona</option>
+            <option value="Sindhi">Sindhi</option>
+            <option value="Sinhala">Sinhala</option>
+            <option value="Slovak">Slovak</option>
+            <option value="Slovenian">Slovenian</option>
+            <option value="Somali">Somali</option>
+            <option value="Southern Sotho">Southern Sotho</option>
+            <option value="Spanish">Spanish</option>
+            <option value="Spanish (auto-generated)">Spanish (auto-generated)</option>
+            <option value="Spanish (Latin America)">Spanish (Latin America)</option>
+            <option value="Spanish (Mexico)">Spanish (Mexico)</option>
+            <option value="Spanish (Spain)">Spanish (Spain)</option>
+            <option value="Sundanese">Sundanese</option>
+            <option value="Swahili">Swahili</option>
+            <option value="Swedish">Swedish</option>
+            <option value="Tajik">Tajik</option>
+            <option value="Tamil">Tamil</option>
+            <option value="Telugu">Telugu</option>
+            <option value="Thai">Thai</option>
+            <option value="Turkish">Turkish</option>
+            <option value="Turkish (auto-generated)">Turkish (auto-generated)</option>
+            <option value="Ukrainian">Ukrainian</option>
+            <option value="Urdu">Urdu</option>
+            <option value="Uzbek">Uzbek</option>
+            <option value="Vietnamese">Vietnamese</option>
+            <option value="Vietnamese (auto-generated)">Vietnamese (auto-generated)</option>
+            <option value="Welsh">Welsh</option>
+            <option value="Western Frisian">Western Frisian</option>
+            <option value="Xhosa">Xhosa</option>
+            <option value="Yiddish">Yiddish</option>
+            <option value="Yoruba">Yoruba</option>
+            <option value="Zulu">Zulu</option>
+          </select>
+          &nbsp;
+          <select id="invidious-captions[2]">
+            <option value="">none</option>
+            <option value="English">English</option>
+            <option value="English (auto-generated)">English (auto-generated)</option>
+            <option value="English (United Kingdom)">English (United Kingdom)</option>
+            <option value="English (United States)">English (United States)</option>
+            <option value="Afrikaans">Afrikaans</option>
+            <option value="Albanian">Albanian</option>
+            <option value="Amharic">Amharic</option>
+            <option value="Arabic">Arabic</option>
+            <option value="Armenian">Armenian</option>
+            <option value="Azerbaijani">Azerbaijani</option>
+            <option value="Bangla">Bangla</option>
+            <option value="Basque">Basque</option>
+            <option value="Belarusian">Belarusian</option>
+            <option value="Bosnian">Bosnian</option>
+            <option value="Bulgarian">Bulgarian</option>
+            <option value="Burmese">Burmese</option>
+            <option value="Cantonese (Hong Kong)">Cantonese (Hong Kong)</option>
+            <option value="Catalan">Catalan</option>
+            <option value="Cebuano">Cebuano</option>
+            <option value="Chinese">Chinese</option>
+            <option value="Chinese (China)">Chinese (China)</option>
+            <option value="Chinese (Hong Kong)">Chinese (Hong Kong)</option>
+            <option value="Chinese (Simplified)">Chinese (Simplified)</option>
+            <option value="Chinese (Taiwan)">Chinese (Taiwan)</option>
+            <option value="Chinese (Traditional)">Chinese (Traditional)</option>
+            <option value="Corsican">Corsican</option>
+            <option value="Croatian">Croatian</option>
+            <option value="Czech">Czech</option>
+            <option value="Danish">Danish</option>
+            <option value="Dutch">Dutch</option>
+            <option value="Dutch (auto-generated)">Dutch (auto-generated)</option>
+            <option value="Esperanto">Esperanto</option>
+            <option value="Estonian">Estonian</option>
+            <option value="Filipino">Filipino</option>
+            <option value="Finnish">Finnish</option>
+            <option value="French">French</option>
+            <option value="French (auto-generated)">French (auto-generated)</option>
+            <option value="Galician">Galician</option>
+            <option value="Georgian">Georgian</option>
+            <option value="German">German</option>
+            <option value="German (auto-generated)">German (auto-generated)</option>
+            <option value="Greek">Greek</option>
+            <option value="Gujarati">Gujarati</option>
+            <option value="Haitian Creole">Haitian Creole</option>
+            <option value="Hausa">Hausa</option>
+            <option value="Hawaiian">Hawaiian</option>
+            <option value="Hebrew">Hebrew</option>
+            <option value="Hindi">Hindi</option>
+            <option value="Hmong">Hmong</option>
+            <option value="Hungarian">Hungarian</option>
+            <option value="Icelandic">Icelandic</option>
+            <option value="Igbo">Igbo</option>
+            <option value="Indonesian">Indonesian</option>
+            <option value="Indonesian (auto-generated)">Indonesian (auto-generated)</option>
+            <option value="Interlingue">Interlingue</option>
+            <option value="Irish">Irish</option>
+            <option value="Italian">Italian</option>
+            <option value="Italian (auto-generated)">Italian (auto-generated)</option>
+            <option value="Japanese">Japanese</option>
+            <option value="Japanese (auto-generated)">Japanese (auto-generated)</option>
+            <option value="Javanese">Javanese</option>
+            <option value="Kannada">Kannada</option>
+            <option value="Kazakh">Kazakh</option>
+            <option value="Khmer">Khmer</option>
+            <option value="Korean">Korean</option>
+            <option value="Korean (auto-generated)">Korean (auto-generated)</option>
+            <option value="Kurdish">Kurdish</option>
+            <option value="Kyrgyz">Kyrgyz</option>
+            <option value="Lao">Lao</option>
+            <option value="Latin">Latin</option>
+            <option value="Latvian">Latvian</option>
+            <option value="Lithuanian">Lithuanian</option>
+            <option value="Luxembourgish">Luxembourgish</option>
+            <option value="Macedonian">Macedonian</option>
+            <option value="Malagasy">Malagasy</option>
+            <option value="Malay">Malay</option>
+            <option value="Malayalam">Malayalam</option>
+            <option value="Maltese">Maltese</option>
+            <option value="Maori">Maori</option>
+            <option value="Marathi">Marathi</option>
+            <option value="Mongolian">Mongolian</option>
+            <option value="Nepali">Nepali</option>
+            <option value="Norwegian Bokmål">Norwegian Bokmål</option>
+            <option value="Nyanja">Nyanja</option>
+            <option value="Pashto">Pashto</option>
+            <option value="Persian">Persian</option>
+            <option value="Polish">Polish</option>
+            <option value="Portuguese">Portuguese</option>
+            <option value="Portuguese (auto-generated)">Portuguese (auto-generated)</option>
+            <option value="Portuguese (Brazil)">Portuguese (Brazil)</option>
+            <option value="Punjabi">Punjabi</option>
+            <option value="Romanian">Romanian</option>
+            <option value="Russian">Russian</option>
+            <option value="Russian (auto-generated)">Russian (auto-generated)</option>
+            <option value="Samoan">Samoan</option>
+            <option value="Scottish Gaelic">Scottish Gaelic</option>
+            <option value="Serbian">Serbian</option>
+            <option value="Shona">Shona</option>
+            <option value="Sindhi">Sindhi</option>
+            <option value="Sinhala">Sinhala</option>
+            <option value="Slovak">Slovak</option>
+            <option value="Slovenian">Slovenian</option>
+            <option value="Somali">Somali</option>
+            <option value="Southern Sotho">Southern Sotho</option>
+            <option value="Spanish">Spanish</option>
+            <option value="Spanish (auto-generated)">Spanish (auto-generated)</option>
+            <option value="Spanish (Latin America)">Spanish (Latin America)</option>
+            <option value="Spanish (Mexico)">Spanish (Mexico)</option>
+            <option value="Spanish (Spain)">Spanish (Spain)</option>
+            <option value="Sundanese">Sundanese</option>
+            <option value="Swahili">Swahili</option>
+            <option value="Swedish">Swedish</option>
+            <option value="Tajik">Tajik</option>
+            <option value="Tamil">Tamil</option>
+            <option value="Telugu">Telugu</option>
+            <option value="Thai">Thai</option>
+            <option value="Turkish">Turkish</option>
+            <option value="Turkish (auto-generated)">Turkish (auto-generated)</option>
+            <option value="Ukrainian">Ukrainian</option>
+            <option value="Urdu">Urdu</option>
+            <option value="Uzbek">Uzbek</option>
+            <option value="Vietnamese">Vietnamese</option>
+            <option value="Vietnamese (auto-generated)">Vietnamese (auto-generated)</option>
+            <option value="Welsh">Welsh</option>
+            <option value="Western Frisian">Western Frisian</option>
+            <option value="Xhosa">Xhosa</option>
+            <option value="Yiddish">Yiddish</option>
+            <option value="Yoruba">Yoruba</option>
+            <option value="Zulu">Zulu</option>
+          </select>
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Show related videos</h4>
-        <select id="invidious-related_videos">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-          </option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Show related videos</h4>
+          <input id="invidious-related_videos" type="checkbox" />
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Show annotations by default</h4>
-        <select id="invidious-annotations">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-          </option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Show annotations by default</h4>
+          <input id="invidious-annotations" type="checkbox" />
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Automatically extend video description</h4>
-        <select id="invidious-extend_desc">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-          </option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Automatically extend video description</h4>
+          <input id="invidious-extend_desc" type="checkbox" />
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Interactive 360 degree videos (requires WebGL)</h4>
-        <select id="invidious-vr_mode">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-          </option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Interactive 360 degree videos (requires WebGL)</h4>
+          <input id="invidious-vr_mode" type="checkbox" />
+        </div>
 
-      <div class="some-block option-block">
-        <h4>Save playback position</h4>
-        <select id="invidious-save_player_pos">
-          <option value="DEFAULT">Default</option>
-          <option value="true">True</option>
-          <option value="false">False</option>
-          </option>
-        </select>
-      </div>
+        <div class="some-block option-block">
+          <h4>Save playback position</h4>
+          <input id="invidious-save_player_pos" type="checkbox" />
+        </div>
 
+      </div>
       <hr>
 
       <div id="invidious-normal">
+        
         <div class="some-block option-block">
           <h4>Default Instances</h4>
         </div>
diff --git a/src/pages/options/youtube/youtube.js b/src/pages/options/youtube/youtube.js
index cd8e22c0..97bfd44a 100644
--- a/src/pages/options/youtube/youtube.js
+++ b/src/pages/options/youtube/youtube.js
@@ -1,6 +1,6 @@
 import youtubeHelper from "../../../assets/javascripts/helpers/youtube/youtube.js";
 
-let disableYoutubeElement = document.getElementById("disable-invidious");
+
 
 let youtubeFrontendElement = document.getElementById("youtube-frontend");
 let invidiousDivElement = document.getElementById("invidious");
@@ -8,8 +8,20 @@ let pipedDivElement = document.getElementById("piped");
 let pipedMaterialDivElement = document.getElementById("pipedMaterial");
 let invidiousPipedPipedMaterialDivElement = document.getElementById("invidious-piped-pipedMaterial");
 let freetubeYatteeDivElement = document.getElementById("freetube-yatte");
+let customSettingsDivElement = document.getElementsByClassName("custom-settings");
+
+function changeFrontendsSettings() {
+    console.log('changeFrontendsSettings()');
+    let frontend = youtubeFrontendElement.value;
+
+    console.log("customSettingsDivElement", customSettingsDivElement[0].style.display);
+    if (enableYoutubeCustomSettingsElement.checked)
+        for (const item of customSettingsDivElement) item.style.display = 'block';
+    else {
+        console.log("setting it to none");
+        for (const item of customSettingsDivElement) item.style.display = 'none';
+    }
 
-function changeFrontendsSettings(frontend) {
     if (frontend == 'invidious') {
         invidiousPipedPipedMaterialDivElement.style.display = 'block'
         invidiousDivElement.style.display = 'block';
@@ -62,7 +74,7 @@ youtubeFrontendElement.addEventListener("change",
     event => {
         let frontend = event.target.options[youtubeFrontendElement.selectedIndex].value
         youtubeHelper.setFrontend(frontend);
-        changeFrontendsSettings(frontend);
+        changeFrontendsSettings();
     }
 );
 
@@ -75,10 +87,20 @@ youtubeEmbedFrontendElement.addEventListener("change",
     }
 );
 
+let disableYoutubeElement = document.getElementById("disable-invidious");
 disableYoutubeElement.addEventListener("change",
     event => youtubeHelper.setDisable(!event.target.checked)
 );
 
+let enableYoutubeCustomSettingsElement = document.getElementById("enable-youtube-custom-settings");
+enableYoutubeCustomSettingsElement.addEventListener("change",
+    event => {
+        youtubeHelper.setEnableCustomSettings(event.target.checked)
+        changeFrontendsSettings();
+    }
+);
+
+
 let volumeElement = document.getElementById("invidious-volume");
 let volumeValueElement = document.getElementById("volume-value");
 volumeElement.addEventListener("input",
@@ -87,18 +109,10 @@ volumeElement.addEventListener("input",
         volumeValueElement.textContent = `${volumeElement.value}%`;
     }
 );
-let invidiousClearVolumeElement = document.getElementById("clear-invidious-volume");
-invidiousClearVolumeElement.addEventListener("click",
-    (_) => {
-        youtubeHelper.setVolume('--');
-        volumeValueElement.textContent = `--%`;
-        volumeElement.value = null;
-    }
-);
 
 let autoplayElement = document.getElementById("invidious-autoplay");
 autoplayElement.addEventListener("change",
-    event => youtubeHelper.setAutoplay(event.target.options[autoplayElement.selectedIndex].value)
+    event => youtubeHelper.setAutoplay(event.target.checked)
 );
 
 let OnlyEmbeddedVideoElement = document.getElementById("only-embed");
@@ -154,6 +168,7 @@ function changeProtocolSettings(protocol) {
 
 youtubeHelper.init().then(() => {
     disableYoutubeElement.checked = !youtubeHelper.getDisable();
+    enableYoutubeCustomSettingsElement.checked = youtubeHelper.getEnableCustomSettings();
     volumeElement.value = youtubeHelper.getVolume();
     volumeValueElement.textContent = `${youtubeHelper.getVolume()}%`;
     OnlyEmbeddedVideoElement.value = youtubeHelper.getOnlyEmbeddedVideo();
@@ -161,7 +176,7 @@ youtubeHelper.init().then(() => {
     autoplayElement.value = youtubeHelper.getAutoplay();
     let frontend = youtubeHelper.getFrontend();
     youtubeFrontendElement.value = frontend;
-    changeFrontendsSettings(frontend);
+    changeFrontendsSettings();
 
     let protocol = youtubeHelper.getProtocol();
     protocolElement.value = protocol;
diff --git a/src/pages/stylesheets/styles.css b/src/pages/stylesheets/styles.css
index d5452c3d..999b5afd 100644
--- a/src/pages/stylesheets/styles.css
+++ b/src/pages/stylesheets/styles.css
@@ -328,6 +328,15 @@ button.add {
   cursor: pointer;
 }
 
+div.disabled {
+  background-color: rgb(39, 39, 39);
+  position: absolute;
+  top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+}
+
 .light-theme.popup,
 .light-theme .popup {
   background-color: var(--bg-secondary);