Closes #957

ParticleCore · Mar 8, 2024 · 43d756d · 43d756d
1 parent a394ba5
commit 43d756d
Show file tree

Hide file tree

Showing 10 changed files with 276 additions and 0 deletions.
diff --git a/src/chrome/html/options.html b/src/chrome/html/options.html
@@ -366,6 +366,16 @@
                             <div class="settingDescription">Allows the creator merch to be shown below the video details</div>
                         </div>
                     </div>
+                    <div class="setting" data-id="videoCount">
+                        <label class="switch">
+                            <input data-setting="videoCount" type="checkbox">
+                            <span class="slider"></span>
+                        </label>
+                        <div class="settingDescription">
+                            <div class="settingDescription highlight">Linked video count</div>
+                            <div class="settingDescription">Creates a link that shows the number of videos uploaded by the channel next to the subscriber count</div>
+                        </div>
+                    </div>
                 </div>
             </div>
             <div class="settingGroup">

diff --git a/src/chrome/js/background-inject.js b/src/chrome/js/background-inject.js
@@ -1881,6 +1881,109 @@ function mainScript(extensionId, SettingData, defaultSettings) {
 
     })();
 
+    const FeatureVideoCount = (() => {
+
+        const onEvent = () => {
+
+            const subCount = document.getElementById("owner-sub-count");
+
+            if (!subCount) {
+                return;
+            }
+
+            const channelId = document.getElementById("movie_player")?.["getPlayerResponse"]()?.["videoDetails"]?.["channelId"] || "";
+
+            let url = null;
+
+            if (channelId.startsWith("UC")) {
+                url = `/channel/${channelId}`;
+            } else if (channelId.startsWith("/@")) {
+                url = channelId;
+            } else {
+                return;
+            }
+
+            if (subCount.parentElement.nodeName !== "A") {
+
+                const link = document.createElement("a");
+
+                link.href = `${url}/videos`;
+                link.className = "yt-simple-endpoint";
+
+                subCount.parentElement.appendChild(link);
+                link.appendChild(subCount);
+
+            }
+
+            fetch(url).then(response => response.text().then(data => {
+
+                let matched = data.match(/var ytInitialData = (\{.*?});/)?.[1];
+
+                if (matched) {
+                    try {
+
+                        const pageData = JSON.parse(matched);
+                        const videosCountText = pageData?.header?.["c4TabbedHeaderRenderer"]?.["videosCountText"]?.["runs"]?.map((entry) => entry.text)?.join("");
+
+                        if (videosCountText && subCount["textChanged_"] && subCount?.["text"]?.["simpleText"]) {
+
+                            subCount["textChanged_"]?.({
+                                runs: [
+                                    {text: subCount["text"]["simpleText"]},
+                                    {text: " ‧ "},
+                                    {text: videosCountText},
+                                ]
+                            });
+
+                            const parent = subCount.parentElement;
+
+                            if (parent?.nodeName === "A") {
+                                parent.title = subCount.textContent;
+                            }
+
+                        }
+
+                    } catch (e) {
+                    }
+                }
+
+            }));
+
+        };
+
+        const update = () => {
+            if (iridiumSettings.videoCount) {
+                window.addEventListener("yt-page-data-updated", onEvent, true);
+                onEvent();
+            } else {
+
+                window.removeEventListener("yt-page-data-updated", onEvent, true);
+
+                const subCount = document.getElementById("owner-sub-count");
+                const link = subCount?.parentElement;
+
+                if (link?.nodeName === "A") {
+                    link?.parentElement?.appendChild(subCount);
+                    link?.remove();
+                }
+
+                if (subCount?.["textChanged_"] && subCount?.["text"]?.["simpleText"]) {
+                    subCount["textChanged_"]?.({
+                        runs: [
+                            {text: subCount["text"]["simpleText"]},
+                        ]
+                    });
+                }
+
+            }
+        };
+
+        FeatureUpdater.register(SettingData.videoCount.id, update);
+
+        return {};
+
+    })();
+
     const FeatureInfoCards = (() => {
 
         const listener = data => {

diff --git a/src/chrome/js/chrome-wrapper.js b/src/chrome/js/chrome-wrapper.js
@@ -82,6 +82,10 @@
             id: "creatorMerch",
             default: true,
         },
+        videoCount: {
+            id: "videoCount",
+            default: true,
+        },
         superTheater: {
             id: "superTheater",
             default: true,

diff --git a/src/chrome/js/content-script.js b/src/chrome/js/content-script.js
@@ -79,6 +79,10 @@ const SettingData = {
         id: "creatorMerch",
         default: true,
     },
+    videoCount: {
+        id: "videoCount",
+        default: true,
+    },
     superTheater: {
         id: "superTheater",
         default: true,

diff --git a/src/chrome/js/options.js b/src/chrome/js/options.js
@@ -267,6 +267,20 @@ const Manager = {
 
         Util.updateSingleSetting(settingId, newState);
 
+    },
+    updateVideoCount: (newState, userInteraction) => {
+
+        const settingId = SettingData.videoCount.id;
+        const ui = document.querySelector(`[data-setting=${settingId}]`);
+
+        if (ui != null && ui.checked !== newState) {
+            ui.checked = newState;
+        }
+
+        if (!userInteraction) return;
+
+        Util.updateSingleSetting(settingId, newState);
+
     },
     updateSuperTheater: (newState, userInteraction) => {
 
@@ -720,6 +734,9 @@ const Util = {
             case SettingData.creatorMerch.id:
                 Manager.updateCreatorMerch(value, userInteraction);
                 break;
+            case SettingData.videoCount.id:
+                Manager.updateVideoCount(value, userInteraction);
+                break;
             case SettingData.superTheater.id:
                 Manager.updateSuperTheater(value, userInteraction);
                 break;

diff --git a/src/chrome/js/setting-data.js b/src/chrome/js/setting-data.js
@@ -75,6 +75,10 @@ const SettingData = {
         id: "creatorMerch",
         default: true,
     },
+    videoCount: {
+        id: "videoCount",
+        default: true,
+    },
     superTheater: {
         id: "superTheater",
         default: true,

diff --git a/src/firefox/html/options.html b/src/firefox/html/options.html
@@ -366,6 +366,16 @@
                             <div class="settingDescription">Allows the creator merch to be shown below the video details</div>
                         </div>
                     </div>
+                    <div class="setting" data-id="videoCount">
+                        <label class="switch">
+                            <input data-setting="videoCount" type="checkbox">
+                            <span class="slider"></span>
+                        </label>
+                        <div class="settingDescription">
+                            <div class="settingDescription highlight">Linked video count</div>
+                            <div class="settingDescription">Creates a link that shows the number of videos uploaded by the channel next to the subscriber count</div>
+                        </div>
+                    </div>
                 </div>
             </div>
             <div class="settingGroup">

diff --git a/src/firefox/js/background-inject.js b/src/firefox/js/background-inject.js
@@ -1881,6 +1881,109 @@ function mainScript(extensionId, SettingData, defaultSettings) {
 
     })();
 
+    const FeatureVideoCount = (() => {
+
+        const onEvent = () => {
+
+            const subCount = document.getElementById("owner-sub-count");
+
+            if (!subCount) {
+                return;
+            }
+
+            const channelId = document.getElementById("movie_player")?.["getPlayerResponse"]()?.["videoDetails"]?.["channelId"] || "";
+
+            let url = null;
+
+            if (channelId.startsWith("UC")) {
+                url = `/channel/${channelId}`;
+            } else if (channelId.startsWith("/@")) {
+                url = channelId;
+            } else {
+                return;
+            }
+
+            if (subCount.parentElement.nodeName !== "A") {
+
+                const link = document.createElement("a");
+
+                link.href = `${url}/videos`;
+                link.className = "yt-simple-endpoint";
+
+                subCount.parentElement.appendChild(link);
+                link.appendChild(subCount);
+
+            }
+
+            fetch(url).then(response => response.text().then(data => {
+
+                let matched = data.match(/var ytInitialData = (\{.*?});/)?.[1];
+
+                if (matched) {
+                    try {
+
+                        const pageData = JSON.parse(matched);
+                        const videosCountText = pageData?.header?.["c4TabbedHeaderRenderer"]?.["videosCountText"]?.["runs"]?.map((entry) => entry.text)?.join("");
+
+                        if (videosCountText && subCount["textChanged_"] && subCount?.["text"]?.["simpleText"]) {
+
+                            subCount["textChanged_"]?.({
+                                runs: [
+                                    {text: subCount["text"]["simpleText"]},
+                                    {text: " ‧ "},
+                                    {text: videosCountText},
+                                ]
+                            });
+
+                            const parent = subCount.parentElement;
+
+                            if (parent?.nodeName === "A") {
+                                parent.title = subCount.textContent;
+                            }
+
+                        }
+
+                    } catch (e) {
+                    }
+                }
+
+            }));
+
+        };
+
+        const update = () => {
+            if (iridiumSettings.videoCount) {
+                window.addEventListener("yt-page-data-updated", onEvent, true);
+                onEvent();
+            } else {
+
+                window.removeEventListener("yt-page-data-updated", onEvent, true);
+
+                const subCount = document.getElementById("owner-sub-count");
+                const link = subCount?.parentElement;
+
+                if (link?.nodeName === "A") {
+                    link?.parentElement?.appendChild(subCount);
+                    link?.remove();
+                }
+
+                if (subCount?.["textChanged_"] && subCount?.["text"]?.["simpleText"]) {
+                    subCount["textChanged_"]?.({
+                        runs: [
+                            {text: subCount["text"]["simpleText"]},
+                        ]
+                    });
+                }
+
+            }
+        };
+
+        FeatureUpdater.register(SettingData.videoCount.id, update);
+
+        return {};
+
+    })();
+
     const FeatureInfoCards = (() => {
 
         const listener = data => {

diff --git a/src/firefox/js/options.js b/src/firefox/js/options.js
@@ -267,6 +267,20 @@ const Manager = {
 
         Util.updateSingleSetting(settingId, newState);
 
+    },
+    updateVideoCount: (newState, userInteraction) => {
+
+        const settingId = SettingData.videoCount.id;
+        const ui = document.querySelector(`[data-setting=${settingId}]`);
+
+        if (ui != null && ui.checked !== newState) {
+            ui.checked = newState;
+        }
+
+        if (!userInteraction) return;
+
+        Util.updateSingleSetting(settingId, newState);
+
     },
     updateSuperTheater: (newState, userInteraction) => {
 
@@ -720,6 +734,9 @@ const Util = {
             case SettingData.creatorMerch.id:
                 Manager.updateCreatorMerch(value, userInteraction);
                 break;
+            case SettingData.videoCount.id:
+                Manager.updateVideoCount(value, userInteraction);
+                break;
             case SettingData.superTheater.id:
                 Manager.updateSuperTheater(value, userInteraction);
                 break;

diff --git a/src/firefox/js/setting-data.js b/src/firefox/js/setting-data.js
@@ -75,6 +75,10 @@ const SettingData = {
         id: "creatorMerch",
         default: true,
     },
+    videoCount: {
+        id: "videoCount",
+        default: true,
+    },
     superTheater: {
         id: "superTheater",
         default: true,