Add redirect options to chrome

chrome/css/main.css

@@ -3,6 +3,8 @@ html[remove_sidebar="true"] #secondary > div.circle,
 html[remove_sidebar="true"] #related,
 html[remove_end_of_video="true"] .html5-endscreen,
 
+html[remove_info_cards="true"] .ytp-ce-element.ytp-ce-element,
+
 html[remove_trending="true"] a[href="/feed/trending"],
 html[remove_trending="true"] a[href="/feed/explore"],
 
@@ -10,10 +12,6 @@ html[remove_comments="true"] #comments,
 
 html[remove_chat="true"] #chat,
 
-html[remove_embedded_video="true"] .ytp-ce-element.ytp-ce-video,
-
-html[remove_embedded_channel="true"] .ytp-ce-element.ytp-ce-channel,
-
 html[foo=bar]
 
 {

chrome/js/background.js

@@ -1,27 +1,21 @@
 /*
- * Homepage Redirect to Subscriptions
+ * Redirect logic
  */
-const subscriptionsUrl = 'https://www.youtube.com/feed/subscriptions';
-let redirect_home_to_subs = false;
-chrome.storage.local.get('redirect_home_to_subs', result => {
-  redirect_home_to_subs = result['redirect_home_to_subs'];
+let redirectUrl;
+chrome.storage.local.get('redirectUrl', setting => {
+  redirectUrl = setting['redirectUrl'];
 });
 
 chrome.webRequest.onBeforeRequest.addListener(details => {
-    if (redirect_home_to_subs) {
-      return { redirectUrl: subscriptionsUrl };
-    }
+    if (redirectUrl) return { redirectUrl };
   },
-  { urls: [ '*://*.youtube.com/' ] },
-  ['blocking']
+  { urls: [
+      "*://youtube.com/",
+      "*://www.youtube.com/",
+    ] },
+  ["blocking"]
 );
 
-function loadRedirectSetting() {
-  return new Promise(resolve => {
-  });
-}
-
-
 /*
  * Message Handlers
  */
@@ -43,10 +37,8 @@ chrome.extension.onMessage.addListener((request, sender, sendResponse) => {
     });
   }
 
-  // Listen for changes to the redirect_home_to_subs option
-  if (request.message === 'key_change') {
-    if (request.key === 'redirect_home_to_subs') {
-      redirect_home_to_subs = request.value;
-    }
+  // Listen for changes to redirectUrl
+  if (request.message === 'change_redirect') {
+    redirectUrl = request.redirectUrl;
   }
 });

chrome/js/main.js

@@ -3,21 +3,23 @@ const DEFAULT_SETTINGS = {
   "remove_homepage": true,
   "remove_sidebar": true,
   "remove_end_of_video": true,
-  "remove_embedded_video": true,
-  "remove_embedded_channel": true,
+  "remove_info_cards": false,
   "remove_trending": false,
   "remove_comments": false,
   "remove_chat": false,
-  "redirect_home_to_subs": false,
+  "redirect_off": true,
+  "redirect_to_subs": false,
+  "redirect_to_wl": false,
 }
 
+// Populate options menu with local settings.
 try {
   chrome.storage.local.get(localSettings => {
-    Object.keys(DEFAULT_SETTINGS).forEach(settingKey => {
-      const isLocal = localSettings.hasOwnProperty(settingKey);
-      const settingValue = isLocal ? localSettings[settingKey] : DEFAULT_SETTINGS[settingKey];
-      if (!isLocal) chrome.storage.local.set({ [settingKey] : settingValue });
-      HTML.setAttribute(settingKey, settingValue);
+    Object.keys(DEFAULT_SETTINGS).forEach(key => {
+      const isLocal = localSettings.hasOwnProperty(key);
+      const value = isLocal ? localSettings[key] : DEFAULT_SETTINGS[key];
+      if (!isLocal) chrome.storage.local.set({ [key] : value });
+      HTML.setAttribute(key, value);
     });
   });
 } catch (e) {
@@ -26,7 +28,5 @@ try {
 
 // Update in real time, by receiving change events from the options menu
 chrome.runtime.onMessage.addListener((data, sender) => {
-  const settingKey = data.key;
-  const settingValue = data.value;
-  HTML.setAttribute(settingKey, settingValue);
+  data.forEach(({ key, value }) => HTML.setAttribute(key, value));
 });

chrome/js/options.js

@@ -3,42 +3,77 @@ const DEFAULT_SETTINGS = {
   "remove_homepage": true,
   "remove_sidebar": true,
   "remove_end_of_video": true,
-  "remove_embedded_video": true,
-  "remove_embedded_channel": true,
+  "remove_info_cards": false,
   "remove_trending": false,
   "remove_comments": false,
   "remove_chat": false,
-  "redirect_home_to_subs": false,
-}
+  "redirect_off": true,
+  "redirect_to_subs": false,
+  "redirect_to_wl": false,
+};
+
+const REDIRECT_KEYS = Object.keys(DEFAULT_SETTINGS).
+  filter(key => key.includes('redirect'));
+
+const REDIRECT_URLS = {
+  "redirect_to_subs": 'https://www.youtube.com/feed/subscriptions',
+  "redirect_to_wl": 'https://www.youtube.com/playlist/?list=WL',
+};
 
 // Make checkboxes reflect local settings
 document.addEventListener("DOMContentLoaded", () => {
   chrome.storage.local.get(localSettings => {
-    Object.keys(localSettings).forEach(settingKey => {
-      if (!Object.keys(DEFAULT_SETTINGS).includes(settingKey)) return;
-      document.getElementById(settingKey).checked = localSettings[settingKey];
+    Object.keys(localSettings).forEach(key => {
+      if (!Object.keys(DEFAULT_SETTINGS).includes(key)) return;
+      document.getElementById(key).checked = localSettings[key];
     });
   });
 });
 
 // Handle check/uncheck events
-Object.keys(DEFAULT_SETTINGS).forEach(settingKey => {
-  const settingCheckbox = document.getElementById(settingKey);
+//    Save changes to local storage
+Object.keys(DEFAULT_SETTINGS).forEach(key => {
+  const settingCheckbox = document.getElementById(key);
   settingCheckbox.addEventListener("change", async e => {
-    const settingKey = e.target.id;
-    const settingValue = e.target.checked;
+    const key = e.target.id;
+    const value = e.target.checked;
+    let saveObj = {}
+    let messageObj;
 
-    // 1. Save changes to local storage
-    const saveObj = { [settingKey]: settingValue };
+    // Handle "redirect" radio buttons
+    if (key.includes('redirect')) {
+      
+      // Only one redirect can be active at a time.
+      REDIRECT_KEYS.forEach(key => saveObj[key] = false);
+      saveObj[key] = true;
+
+      saveObj['redirectUrl'] = REDIRECT_URLS[key] || false;
+
+      messageObj = Object.entries(saveObj).
+        map(([key, value]) => [{ key, value }]);
+
+    // Handle "remove" checkbox buttons
+    } else {
+      saveObj[key] = value;
+      messageObj = [{ key, value }];
+    }
+
+    // Update local storage with changed settings.
     chrome.storage.local.set(saveObj);
 
-    // 2. Update running tabs with the changed setting
-    const messageObj = { key: settingKey, value: settingValue };
-    chrome.runtime.sendMessage({ "message": "key_change", ...messageObj });
+    // Update running tabs with changed settings.
     chrome.tabs.query({}, tabs => {
       tabs.forEach(tab => {
         chrome.tabs.sendMessage(tab.id, messageObj);
       });
     });
+
+    // Update background script with changed redirectUrl.
+    if ('redirectUrl' in saveObj) {
+      chrome.runtime.sendMessage({
+        "message": "change_redirect",
+        "redirectUrl": saveObj['redirectUrl']
+      });
+    }
   });
 });

chrome/js/reload.js

@@ -1,5 +1,6 @@
-const sendReloadMessage = () => {
-	chrome.runtime.sendMessage({ "message": "reload_page" });
-}
 const reloadButton = document.getElementById("reload_button");
 reloadButton.addEventListener("click", sendReloadMessage);
+
+async function sendReloadMessage() {
+	chrome.runtime.sendMessage({ "message": "reload_page" });
+}

chrome/manifest.json

@@ -3,7 +3,7 @@
   "description": "Stop the \"YouTube rabbit hole\", customize YouTube's UI for fewer distractions.",
   "homepage_url": "https://github.com/lawrencehook/remove-youtube-suggestions",
   "manifest_version": 2,
-  "version": "1.3.0",
+  "version": "2.0.0",
 
   "content_scripts": [
     {

chrome/options.html

@@ -27,31 +27,21 @@
                  value="remove_end_of_video" checked />
           <label for="remove_end_of_video">End of Video</label>
       </div>
-
-    </fieldset>
-
-    <fieldset>
-      <legend>Near end-of-video embedded overlays</legend>
-      <div>
-          <input type="checkbox" id="remove_embedded_video" name="feature"
-                 value="remove_embedded_video" checked />
-          <label for="remove_embedded_video">More Videos</label>
-      </div>
-
-      <div>
-          <input type="checkbox" id="remove_embedded_channel" name="feature"
-                 value="remove_embedded_channel" checked />
-          <label for="remove_embedded_channel">Channel</label>
-      </div>
     </fieldset>
 
     <fieldset>
       <legend>More removal options</legend>
 
+      <div>
+          <input type="checkbox" id="remove_info_cards" name="feature"
+                 value="remove_info_cards" unchecked />
+          <label for="remove_info_cards">In-Video Info Cards</label>
+      </div>
+
       <div>
           <input type="checkbox" id="remove_trending" name="feature"
                  value="remove_trending" unchecked />
-          <label for="remove_trending">Link to Trending/Explore Page</label>
+          <label for="remove_trending">Link to Explore Page</label>
       </div>
 
       <div>
@@ -65,15 +55,26 @@
                  value="remove_chat" unchecked />
           <label for="remove_chat">Live-Stream Chat</label>
       </div>
-
     </fieldset>
 
     <fieldset>
-      <legend>Redirects (beta)</legend>
+      <legend>Redirect Homepage</legend>
       <div>
-          <input type="checkbox" id="redirect_home_to_subs" name="feature"
-                 value="redirect_home_to_subs" unchecked />
-          <label for="redirect_home_to_subs">Redirect Homepage to Subscriptions</label>
+          <input type="radio" id="redirect_off" name="redirect"
+                 value="redirect_off" checked />
+          <label for="redirect_off">Off</label>
+      </div>
+
+      <div>
+          <input type="radio" id="redirect_to_subs" name="redirect"
+                 value="redirect_to_subs" unchecked />
+          <label for="redirect_to_subs">to Subscriptions</label>
+      </div>
+
+      <div>
+          <input type="radio" id="redirect_to_wl" name="redirect"
+                 value="redirect_to_wl" unchecked />
+          <label for="redirect_to_wl">to Watch Later</label>
       </div>
     </fieldset>