Merge pull request #12 from Yamboy1/master

Rewrite with a few extra features
kodxana · Jan 11, 2020 · 1907339 · 1907339
2 parents 7cfb3c8 + 345bf47
commit 1907339
Show file tree

Hide file tree

Showing 8 changed files with 147 additions and 121 deletions.
diff --git a/background.js b/background.js
diff --git a/manifest.json b/manifest.json
@@ -1,21 +1,28 @@
-{
-  "name": "Watch on LBRY",
-  "version": "1.4",
-  "permissions": [
-    "https://www.youtube.com/watch?v=*",
-    "https://www.youtube.com/channel/*",
-    "tabs"
-  ],
-  "background": {
-    "scripts": ["background.js"],
-    "persistent": false
-  },
-  "browser_action": {
-    "default_title": "Watch on LBRY"
-  },
-  "icons": { "16": "icons/icon16.png",
-           "48": "icons/icon48.png",
-          "128": "icons/icon128.png" 
-           },
-  "manifest_version": 2
-}
+{
+  "name": "Watch on LBRY",
+  "version": "1.4",
+  "permissions": [
+    "https://www.youtube.com/watch?v=*",
+    "https://www.youtube.com/channel/*",
+    "tabs",
+    "storage"
+  ],
+  "background": {
+    "scripts": [
+      "scripts/runtimeOnStartup.js",
+      "scripts/storageOnChanged.js",
+      "scripts/tabOnUpdated.js"
+    ],
+    "persistent": false
+  },
+  "browser_action": {
+    "default_title": "Watch on LBRY",
+    "default_popup": "popup/popup.html"
+  },
+  "icons": {
+    "16": "icons/icon16.png",
+    "48": "icons/icon48.png",
+    "128": "icons/icon128.png"
+  },
+  "manifest_version": 2
+}
diff --git a/popup/popup.css b/popup/popup.css
@@ -0,0 +1,9 @@
+body {
+    width: 200px;
+    text-align: center;
+}
+
+.container {
+    display: inline-block;
+    text-align: left;
+}
diff --git a/popup/popup.html b/popup/popup.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <link rel="stylesheet" href="popup.css" />
+</head>
+<body>
+<div class="container">
+<label>
+    Enable:
+    <input class="enable" type="checkbox" />
+</label>
+<br>
+<br>
+<label>
+    Redirect to: <br>
+    <input type="radio" name="redirect" value="lbry.tv" /> LBRY.tv <br>
+    <input type="radio" name="redirect" value="app"/> LBRY App
+</label>
+</div>
+<script src="popup.js"></script>
+</body>
+</html>
diff --git a/popup/popup.js b/popup/popup.js
@@ -0,0 +1,19 @@
+const checkbox = document.querySelector('input.enable');
+const radios = [...document.querySelectorAll('input[name="redirect"]').values()];
+console.log(radios);
+
+chrome.storage.local.get(['enabled', 'redirect'], ({ enabled, redirect }) => {
+  checkbox.checked = enabled;
+  const currentRadio = radios.find(x => x.getAttribute("value") === redirect) || radios[0];
+  currentRadio.checked = true;
+});
+
+checkbox.addEventListener("input", () => {
+  chrome.storage.local.set({ enabled: checkbox.checked });
+});
+
+radios.forEach(radio => {
+  radio.addEventListener("input", () => {
+    chrome.storage.local.set({ redirect: radio.getAttribute("value") });
+  });
+});
diff --git a/scripts/runtimeOnStartup.js b/scripts/runtimeOnStartup.js
@@ -0,0 +1,12 @@
+const func = () => {
+  chrome.storage.local.get(['enabled', 'redirect'], ({ enabled, redirect }) => {
+    if (enabled === null || enabled === undefined) enabled = true;
+    if (!redirect) redirect = 'lbry.tv';
+    chrome.storage.local.set({ enabled, redirect });
+    // have to set this manually as the trigger doesn't work for `onInstalled`
+    chrome.browserAction.setBadgeText({ text: enabled ? 'ON' : 'OFF' });
+  });
+};
+
+chrome.runtime.onStartup.addListener(func);
+chrome.runtime.onInstalled.addListener(func);
diff --git a/scripts/storageOnChanged.js b/scripts/storageOnChanged.js
@@ -0,0 +1,7 @@
+chrome.storage.onChanged.addListener((changes, areaName) => {
+  if (areaName !== "local") return;
+  if (!changes.enabled) return;
+  const { newValue } = changes.enabled;
+  console.log(newValue);
+  chrome.browserAction.setBadgeText({ text: newValue ? "ON" : "OFF" });
+});
diff --git a/scripts/tabOnUpdated.js b/scripts/tabOnUpdated.js
@@ -0,0 +1,50 @@
+chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
+  chrome.storage.local.get(async ({ enabled }) => {
+    if (!enabled) return;
+    if (!changeInfo.url) return;
+    const { id, type } = getId(tab.url);
+    if (!id) return;
+
+    const url = `https://cors-anywhere.herokuapp.com/https://api.lbry.com/yt/resolve?${type}_ids=${id}`;
+    const response = await fetch(url, { headers: { 'Content-Type': 'application/json' } });
+    const json = await response.json();
+    console.log(json);
+    const title = json.data[`${type}s`][id];
+    if (!title) return;
+    console.log(title);
+
+    chrome.storage.local.get('redirect', ({ redirect }) => {
+      console.log(redirect);
+      let newUrl;
+      if (redirect === "lbry.tv") {
+        newUrl = `https://lbry.tv/${title.replace(/^lbry:\/\//, "").replace(/#/g, ":")}`;
+      } else if (redirect === "app") {
+        newUrl = `lbry://${title.replace(/^lbry:\/\//, "")}`;
+      }
+      chrome.tabs.update(tabId, { url: newUrl });
+    });
+  });
+});
+
+function getId(url) {
+  const videoId = getVideoId(url);
+  if (videoId) return { id: videoId, type: "video" };
+  const channelId = getChannelId(url);
+  if (channelId) return { id: channelId, type: "channel" };
+  return {}; // Equivalent of returning null
+}
+
+function getVideoId(url) {
+  const regex = /watch\/?\?.*v=([^\s&]*)/;
+  const match = url.match(regex);
+  return match ? match[1] : null; // match[1] is the videoId
+}
+
+function getChannelId(url) {
+  const regex = /channel\/([^\s?]*)/;
+  const match = url.match(regex);
+  return match ? match[1] : null; // match[1] is the channelId
+}
+
+function getNewUrl(title) {
+}