Merge pull request #1521 from mini-bomba/popup

Update popup on segment updates + some code cleanup

Author: ajayyy

src/background.ts

@@ -24,7 +24,7 @@ if (utils.isFirefox()) {
     utils.wait(() => Config.config !== null).then(function() {
         if (Config.config.supportInvidious) utils.setupExtraSiteContentScripts();
     });
-} 
+}
 
 function onTabUpdatedListener(tabId: number) {
     chrome.tabs.sendMessage(tabId, {
@@ -77,17 +77,17 @@ chrome.runtime.onMessage.addListener(function (request, sender, callback) {
                     ok: response.ok
                 });
             });
-        
+
             return true;
         case "submitVote":
             submitVote(request.type, request.UUID, request.category).then(callback);
-        
+
             //this allows the callback to be called later
             return true;
-        case "registerContentScript": 
+        case "registerContentScript":
             registerFirefoxContentScript(request);
             return false;
-        case "unregisterContentScript": 
+        case "unregisterContentScript":
             unregisterFirefoxContentScript(request.id)
             return false;
         case "tabs": {
@@ -106,6 +106,8 @@ chrome.runtime.onMessage.addListener(function (request, sender, callback) {
             return true;
         }
         case "time":
+        case "infoUpdated":
+        case "videoChanged":
             if (sender.tab) {
                 popupPort[sender.tab.id]?.postMessage(request);
             }
@@ -156,8 +158,8 @@ chrome.runtime.onInstalled.addListener(function () {
 /**
  * Only works on Firefox.
  * Firefox requires that it be applied after every extension restart.
- * 
- * @param {JSON} options 
+ *
+ * @param {JSON} options
  */
 function registerFirefoxContentScript(options: Registration) {
     const oldRegistration = contentScriptRegistrations[options.id];
@@ -174,7 +176,7 @@ function registerFirefoxContentScript(options: Registration) {
 /**
  * Only works on Firefox.
  * Firefox requires that this is handled by the background script
- * 
+ *
  */
 function unregisterFirefoxContentScript(id: string) {
     contentScriptRegistrations[id].unregister();
@@ -225,10 +227,10 @@ async function asyncRequestToServer(type: string, address: string, data = {}) {
 
 /**
  * Sends a request to the specified url
- * 
+ *
  * @param type The request type "GET", "POST", etc.
  * @param address The address to add to the SponsorBlock server address
- * @param callback 
+ * @param callback
  */
 async function sendRequestToCustomServer(type: string, url: string, data = {}) {
     // If GET, convert JSON to parameters
@@ -248,4 +250,4 @@ async function sendRequestToCustomServer(type: string, url: string, data = {}) {
     });
 
     return response;
-}
+}

src/content.ts

@@ -215,7 +215,6 @@ function messageListener(request: Message, sender: unknown, sendResponse: (respo
         case "getVideoID":
             sendResponse({
                 videoID: sponsorVideoID,
-                creatingSegment: isSegmentCreationInProgress(),
             });
 
             break;
@@ -243,15 +242,9 @@ function messageListener(request: Message, sender: unknown, sendResponse: (respo
             // update video on refresh if videoID invalid
             if (!sponsorVideoID) videoIDChange(getYouTubeVideoID(document));
             // fetch segments
-            sponsorsLookup(false).then(() => sendResponse({
-                found: sponsorDataFound,
-                status: lastResponseStatus,
-                sponsorTimes: sponsorTimes,
-                time: video.currentTime,
-                onMobileYouTube
-            }));
+            sponsorsLookup(false);
 
-            return true;
+            break;
         case "unskip":
             unskipSponsorTime(sponsorTimes.find((segment) => segment.UUID === request.UUID), null, true);
             break;
@@ -384,7 +377,7 @@ function resetValues() {
     categoryPill?.setVisibility(false);
 }
 
-async function videoIDChange(id): Promise<void> {
+async function videoIDChange(id: string): Promise<void> {
     // don't switch to invalid value
     if (!id && sponsorVideoID && !document?.URL?.includes("youtube.com/clip/")) return;
     //if the id has not changed return unless the video element has changed
@@ -438,10 +431,14 @@ async function videoIDChange(id): Promise<void> {
         }
     }
 
-    //close popup
-    closeInfoMenu();
+    // Notify the popup about the video change
+    chrome.runtime.sendMessage({
+        message: "videoChanged",
+        videoID: sponsorVideoID,
+        whitelisted: channelWhitelisted
+    });
 
-    sponsorsLookup(id);
+    sponsorsLookup();
 
     // Make sure all player buttons are properly added
     updateVisibilityOfPlayerControlsButton();
@@ -1004,6 +1001,14 @@ async function sponsorsLookup(keepOldSubmissions = true) {
                     ?.sort((a, b) => a.segment[0] - b.segment[0]);
         if (!recievedSegments || !recievedSegments.length) {
             // return if no video found
+            chrome.runtime.sendMessage({
+                message: "infoUpdated",
+                found: false,
+                status: lastResponseStatus,
+                sponsorTimes: sponsorTimes,
+                time: video.currentTime,
+                onMobileYouTube
+            });
             retryFetch(404);
             return;
         }
@@ -1093,6 +1098,16 @@ async function sponsorsLookup(keepOldSubmissions = true) {
 
     importExistingChapters(true);
 
+    // notify popup of segment changes
+    chrome.runtime.sendMessage({
+        message: "infoUpdated",
+        found: sponsorDataFound,
+        status: lastResponseStatus,
+        sponsorTimes: sponsorTimes,
+        time: video.currentTime,
+        onMobileYouTube
+    });
+
     if (Config.config.isVip) {
         lockedCategoriesLookup();
     }
@@ -1138,8 +1153,8 @@ async function lockedCategoriesLookup(): Promise<void> {
 }
 
 function retryFetch(errorCode: number): void {
-    if (!Config.config.refetchWhenNotFound) return;
     sponsorDataFound = false;
+    if (!Config.config.refetchWhenNotFound) return;
 
     if (retryFetchTimeout) clearTimeout(retryFetchTimeout);
     if ((errorCode !== 404 && retryCount > 1) || (errorCode !== 404 && retryCount > 10)) {
@@ -1219,12 +1234,12 @@ function startSkipScheduleCheckingForStartSponsors() {
     }
 }
 
-function getYouTubeVideoID(document: Document, url?: string): string | boolean {
+function getYouTubeVideoID(document: Document, url?: string): string {
     url ||= document.URL;
     // pageType shortcut
-    if (pageType === PageType.Channel) return getYouTubeVideoIDFromDocument()
+    if (pageType === PageType.Channel) return getYouTubeVideoIDFromDocument();
     // clips should never skip, going from clip to full video has no indications.
-    if (url.includes("youtube.com/clip/")) return false;
+    if (url.includes("youtube.com/clip/")) return null;
     // skip to document and don't hide if on /embed/
     if (url.includes("/embed/") && url.includes("youtube.com")) return getYouTubeVideoIDFromDocument(false, PageType.Embed);
     // skip to URL if matches youtube watch or invidious or matches youtube pattern
@@ -1235,7 +1250,7 @@ function getYouTubeVideoID(document: Document, url?: string): string | boolean {
     return getYouTubeVideoIDFromURL(url) || getYouTubeVideoIDFromDocument(false);
 }
 
-function getYouTubeVideoIDFromDocument(hideIcon = true, pageHint = PageType.Watch): string | boolean {
+function getYouTubeVideoIDFromDocument(hideIcon = true, pageHint = PageType.Watch): string {
     const selector = "a.ytp-title-link[data-sessionlink='feature=player-title']";
     // get ID from document (channel trailer / embedded playlist)
     const element = pageHint === PageType.Embed ? document.querySelector(selector)
@@ -1247,11 +1262,11 @@ function getYouTubeVideoIDFromDocument(hideIcon = true, pageHint = PageType.Watc
         pageType = pageHint;
         return getYouTubeVideoIDFromURL(videoURL);
     } else {
-        return false;
+        return null;
     }
 }
 
-function getYouTubeVideoIDFromURL(url: string): string | boolean {
+function getYouTubeVideoIDFromURL(url: string): string {
     if(url.startsWith("https://www.youtube.com/tv#/")) url = url.replace("#", "");
 
     //Attempt to parse url
@@ -1260,7 +1275,7 @@ function getYouTubeVideoIDFromURL(url: string): string | boolean {
         urlObject = new URL(url);
     } catch (e) {
         console.error("[SB] Unable to parse URL: " + url);
-        return false;
+        return null;
     }
 
     // Check if valid hostname
@@ -1274,25 +1289,25 @@ function getYouTubeVideoIDFromURL(url: string): string | boolean {
             utils.wait(() => Config.config !== null).then(() => videoIDChange(getYouTubeVideoIDFromURL(url)));
         }
 
-        return false;
+        return null;
     } else {
         onInvidious = false;
     }
 
     //Get ID from searchParam
     if (urlObject.searchParams.has("v") && ["/watch", "/watch/"].includes(urlObject.pathname) || urlObject.pathname.startsWith("/tv/watch")) {
         const id = urlObject.searchParams.get("v");
-        return id.length == 11 ? id : false;
+        return id.length == 11 ? id : null;
     } else if (urlObject.pathname.startsWith("/embed/") || urlObject.pathname.startsWith("/shorts/")) {
         try {
             const id = urlObject.pathname.split("/")[2]
             if (id?.length >=11 ) return id.slice(0, 11);
         } catch (e) {
             console.error("[SB] Video ID not valid for " + url);
-            return false;
+            return null;
         }
     }
-    return false;
+    return null;
 }
 
 /**
@@ -1794,7 +1809,8 @@ async function updateVisibilityOfPlayerControlsButton(): Promise<void> {
     updateEditButtonsOnPlayer();
 
     // Don't show the info button on embeds
-    if (Config.config.hideInfoButtonPlayerControls || document.URL.includes("/embed/") || onInvidious) {
+    if (Config.config.hideInfoButtonPlayerControls || document.URL.includes("/embed/") || onInvidious
+        || document.getElementById("sponsorBlockPopupContainer") != null) {
         playerButtons.info.button.style.display = "none";
     } else {
         playerButtons.info.button.style.removeProperty("display");

src/messageTypes.ts

@@ -9,7 +9,7 @@ interface BaseMessage {
 }
 
 interface DefaultMessage {
-    message: 
+    message:
         "update"
         | "sponsorStart"
         | "getVideoID"
@@ -83,19 +83,19 @@ interface GetVideoIdResponse {
     videoID: string;
 }
 
-interface GetChannelIDResponse {
+export interface GetChannelIDResponse {
     channelID: string;
 }
 
-interface SponsorStartResponse {
+export interface SponsorStartResponse {
     creatingSegment: boolean;
 }
 
-interface IsChannelWhitelistedResponse {
+export interface IsChannelWhitelistedResponse {
     value: boolean;
 }
 
-export type MessageResponse = 
+export type MessageResponse =
     IsInfoFoundMessageResponse
     | GetVideoIdResponse
     | GetChannelIDResponse
@@ -111,7 +111,7 @@ export interface VoteResponse {
     responseText: string;
 }
 
-export interface ImportSegmentsResponse {
+interface ImportSegmentsResponse {
     importedSegments: SponsorTime[];
 }
 
@@ -120,4 +120,14 @@ export interface TimeUpdateMessage {
     time: number;
 }
 
-export type PopupMessage = TimeUpdateMessage;
+export type InfoUpdatedMessage = IsInfoFoundMessageResponse & {
+    message: "infoUpdated";
+}
+
+export interface VideoChangedPopupMessage {
+    message: "videoChanged";
+    videoID: string;
+    whitelisted: boolean;
+}
+
+export type PopupMessage = TimeUpdateMessage | InfoUpdatedMessage | VideoChangedPopupMessage;