From 6ca6689936b11570a82bcffa704e8eda35223b2a Mon Sep 17 00:00:00 2001
From: ManeraKai <manerakai@protonmail.com>
Date: Fri, 25 Feb 2022 19:43:10 +0300
Subject: Added youtube embed exceptions #46

---
 src/pages/background/background.js            |  3 +-
 src/pages/options/youtube/embed-exceptions.js | 80 +++++++++++++++++++++++++++
 src/pages/options/youtube/youtube.html        | 29 ++++++++++
 3 files changed, 110 insertions(+), 2 deletions(-)
 create mode 100644 src/pages/options/youtube/embed-exceptions.js

(limited to 'src/pages')

diff --git a/src/pages/background/background.js b/src/pages/background/background.js
index 71ae568a..1f91ad4d 100644
--- a/src/pages/background/background.js
+++ b/src/pages/background/background.js
@@ -50,8 +50,7 @@ browser.webRequest.onBeforeRequest.addListener(
     if (exceptionsHelper.isException(url, initiator)) newUrl = null;
 
     else if (youtubeMusicHelper.isYoutubeMusic(url, initiator)) newUrl = youtubeMusicHelper.redirect(url, details.type)
-
-    else if (youtubeHelper.isYoutube(url, initiator)) newUrl = youtubeHelper.redirect(url, details.type)
+    else if (youtubeHelper.isYoutube(url, initiator)) newUrl = youtubeHelper.redirect(url, details.type, details)
 
     else if (twitterHelper.isTwitter(url, initiator)) newUrl = twitterHelper.redirect(url);
 
diff --git a/src/pages/options/youtube/embed-exceptions.js b/src/pages/options/youtube/embed-exceptions.js
new file mode 100644
index 00000000..ca2900d4
--- /dev/null
+++ b/src/pages/options/youtube/embed-exceptions.js
@@ -0,0 +1,80 @@
+"use strict";
+window.browser = window.browser || window.chrome;
+
+import youtubeHelper from "../../../assets/javascripts/helpers/youtube/youtube.js";
+
+let nameCustomInstanceInput = document.getElementById("exceptions-custom-instance");
+let instanceTypeElement = document.getElementById("exceptions-custom-instance-type");
+let instanceType = "url"
+
+youtubeHelper.init().then(() => {
+    instanceTypeElement.addEventListener("change",
+        (event) => {
+            instanceType = event.target.options[instanceTypeElement.selectedIndex].value
+            if (instanceType == 'url') {
+                nameCustomInstanceInput.setAttribute("type", "url");
+                nameCustomInstanceInput.setAttribute("placeholder", "https://www.google.com");
+            }
+            else if (instanceType == 'regex') {
+                nameCustomInstanceInput.setAttribute("type", "text");
+                nameCustomInstanceInput.setAttribute("placeholder", "https?:\/\/(www\.|music|)youtube\.com\/watch\?v\=..*");
+            }
+        }
+    )
+    let exceptionsCustomInstances = youtubeHelper.getExceptions();
+    function calcExceptionsCustomInstances() {
+        console.log("exceptionsCustomInstances", exceptionsCustomInstances)
+        document.getElementById("exceptions-custom-checklist").innerHTML =
+            [...exceptionsCustomInstances.url, ...exceptionsCustomInstances.regex].map(
+                (x) => `<div>${x}<button class="add" id="clear-${x}">
+                      <svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px"
+                      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>
+                <hr>`
+            ).join('\n');
+
+        for (const x of [...exceptionsCustomInstances.url, ...exceptionsCustomInstances.regex]) {
+            document.getElementById(`clear-${x}`).addEventListener("click",
+                () => {
+                    console.log(x);
+                    let index;
+                    index = exceptionsCustomInstances.url.indexOf(x);
+                    if (index > -1)
+                        exceptionsCustomInstances.url.splice(index, 1);
+                    else {
+                        index = exceptionsCustomInstances.regex.indexOf(x);
+                        if (index > -1)
+                            exceptionsCustomInstances.regex.splice(index, 1);
+                    }
+                    youtubeHelper.setExceptions(exceptionsCustomInstances);
+                    calcExceptionsCustomInstances();
+                });
+        }
+    }
+    calcExceptionsCustomInstances();
+    document.getElementById("custom-exceptions-instance-form").addEventListener("submit", (event) => {
+        event.preventDefault();
+
+        let val
+        if (instanceType == 'url') {
+            if (nameCustomInstanceInput.validity.valid) {
+                let url = new URL(nameCustomInstanceInput.value);
+                val = `${url.protocol}//${url.host}`
+                if (!exceptionsCustomInstances.url.includes(val)) exceptionsCustomInstances.url.push(val)
+            }
+        } else if (instanceType == 'regex') {
+            val = nameCustomInstanceInput.value
+            if (val.trim() != '' && !exceptionsCustomInstances.regex.includes(val)) exceptionsCustomInstances.regex.push(val)
+        }
+        if (val) {
+            youtubeHelper.setExceptions(exceptionsCustomInstances);
+            console.log("exceptionsCustomInstances", exceptionsCustomInstances)
+            nameCustomInstanceInput.value = '';
+        }
+        calcExceptionsCustomInstances();
+    })
+})
\ No newline at end of file
diff --git a/src/pages/options/youtube/youtube.html b/src/pages/options/youtube/youtube.html
index d35c5c91..0fb4f195 100644
--- a/src/pages/options/youtube/youtube.html
+++ b/src/pages/options/youtube/youtube.html
@@ -346,12 +346,41 @@
       </div>
     </div>
 
+    <hr>
+
+    <div class="some-block option-block">
+      <h4>Embed Exceptions</h4>
+    </div>
+    <form id="custom-exceptions-instance-form">
+      <div class="some-block option-block">
+        <div class="some-block" style="padding:0;">
+          <input id="exceptions-custom-instance" placeholder="https://www.google.com" type="url" />
+          &nbsp;
+          <select id="exceptions-custom-instance-type">
+            <option value="url">URL</option>
+            <option value="regex">Regex</option>
+          </select>
+          &nbsp;
+        </div>
+        <button type="submit" class="add" id="exceptions-add-instance">
+          <svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor">
+            <path d="M0 0h24v24H0V0z" fill="none" />
+            <path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
+          </svg>
+        </button>
+      </div>
+    </form>
+    <div class="checklist" id="exceptions-custom-checklist"></div>
+    </a>
+  </section>
+
   </section>
 
   <script type="module" src="../init.js"></script>
   <script type="module" src="./youtube.js"></script>
   <script type="module" src="./invidious.js"></script>
   <script type="module" src="./piped.js"></script>
+  <script type="module" src="./embed-exceptions.js"></script>
   <!-- <script src="../../assets/javascripts/localise.js"></script> -->
 </body>
 
-- 
cgit 1.4.1