add label to play list

hanydd · Jan 15, 2025 · 77c548e · 77c548e
1 parent bab2fbd
commit 77c548e
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 14 deletions.
diff --git a/public/content.css b/public/content.css
@@ -98,8 +98,8 @@
 	pointer-events: none;
 	font-size: 12px;
 	padding: 6px 8px;
-	line-height: 1.5; 
-	white-space: nowrap; 
+	line-height: 1.5;
+	white-space: nowrap;
 	color: var(--bpx-tooltip-color, #fff);
 	background-color: var(--bpx-tooltip-bgcolor, #000);
 	border-radius: 4px;
@@ -816,6 +816,12 @@ input::-webkit-inner-spin-button {
 	display: inline;
 }
 
+.pod-item #sponsorThumbnailLabel {
+	position: relative;
+	margin: 0 0 0 0.5em;
+	box-shadow: none;
+}
+
 .sponsorblock-chapter-visible {
 	display: inherit !important;
 }

diff --git a/src/thumbnail-utils/thumbnail-selectors.ts b/src/thumbnail-utils/thumbnail-selectors.ts
@@ -6,6 +6,7 @@ interface ThumbnailSelector {
     customLinkSelector?: string;
     customLinkAttribute?: string;
     labelAnchorSelector?: string;
+    waitForPageLoad?: boolean;
 }
 
 // TODO: support customLinkSelector
@@ -42,10 +43,18 @@ const thumbnailSelectors: { [key: string]: ThumbnailSelector } = {
     },
     "playerListCard": {
         // 播放页播放列表
-        // TODO: 无法获取视频链接
         containerSelector: "video-sections-v1",
         thumbnailSelector: ".video-episode-card",
     },
+    "playerListPod": {
+        // 播放页播放列表，文字形式
+        containerSelector: "div.video-pod",
+        thumbnailSelector: "div.pod-item",
+        customLinkSelector: "div.pod-item",
+        customLinkAttribute: "data-key",
+        labelAnchorSelector: "div.single-p .stats",
+        waitForPageLoad: true,
+    },
     "listPlayerListCard": {
         // 列表播放页播放列表
         // TODO: 无法获取视频链接
@@ -106,7 +115,7 @@ const pageTypeSepecialSelector: { [key in PageType]: string[] } = {
     [PageType.Main]: ["mainPageRecommendation"],
     [PageType.History]: ["history"],
     [PageType.OldHistory]: ["oldHistory"],
-    [PageType.Video]: ["playerSideRecommendation", "playerListCard"],
+    [PageType.Video]: ["playerSideRecommendation", "playerListCard", "playerListPod"],
     [PageType.List]: ["listPlayerSideRecommendation", "listPlayerListCard"],
     [PageType.Search]: ["search"],
     [PageType.Dynamic]: ["dynamic"],
@@ -156,3 +165,7 @@ export function getLabelAnchorSelector(containerType: string) {
         "div:not(.b-img--face) > picture img:not(.bili-avatar-img), div.bili-cover-card__thumbnail > img"
     );
 }
+
+export function shouldWaitForPageLoad(containerType: string): boolean {
+    return thumbnailSelectors[containerType].waitForPageLoad ?? false;
+}
diff --git a/src/thumbnail-utils/thumbnailManagement.ts b/src/thumbnail-utils/thumbnailManagement.ts
@@ -1,24 +1,26 @@
 import Config from "../config";
+import { getPageLoaded } from "../content";
 import { waitFor } from "../utils/";
 import { addCleanupListener } from "../utils/cleanup";
 import { getPageType } from "../utils/video";
-import { getThumbnailContainerElements, getThumbnailSelectors } from "./thumbnail-selectors";
+import { getThumbnailContainerElements, getThumbnailSelectors, shouldWaitForPageLoad } from "./thumbnail-selectors";
 import { insertSBIconDefinition, labelThumbnail } from "./thumbnails";
 
 export type ThumbnailListener = (newThumbnails: HTMLElement[]) => void;
 
 const handledThumbnailsObserverMap = new Map<HTMLElement, MutationObserver>();
 let thumbnailContainerObserver: MutationObserver | null = null;
 
+let lastThumbnailCheck = 0;
+
 export function setupThumbnailListener(): void {
     const onLoad = () => {
         onInitialLoad();
 
         // listen to container child changes
-        getThumbnailContainerElements(getPageType()).forEach(({ containerType, selector }) => {
+        getThumbnailContainerElements(getPageType()).forEach(({ selector }) => {
             void waitFor(() => document.querySelector(selector), 10000)
                 .then((thumbnailContainer) => {
-                    labelNewThumbnails(thumbnailContainer, containerType); // fire thumbnail check once when the container is loaded
                     if (!thumbnailContainer) return;
                     thumbnailContainerObserver ??= new MutationObserver(() => checkPageForNewThumbnails());
                     thumbnailContainerObserver?.observe(thumbnailContainer, { childList: true, subtree: true });
@@ -53,20 +55,16 @@ function onInitialLoad() {
     insertSBIconDefinition();
 }
 
-let lastThumbnailCheck = 0;
 let thumbnailCheckTimeout: NodeJS.Timer | null = null;
-
 export function checkPageForNewThumbnails() {
-    if (performance.now() - lastThumbnailCheck < 50 || thumbnailCheckTimeout) {
-        if (thumbnailCheckTimeout) {
-            return;
-        } else {
+    if (performance.now() - lastThumbnailCheck < 500 || thumbnailCheckTimeout) {
+        if (!thumbnailCheckTimeout) {
             thumbnailCheckTimeout = setTimeout(() => {
                 thumbnailCheckTimeout = null;
                 checkPageForNewThumbnails();
             }, 1000);
-            return;
         }
+        return;
     }
     lastThumbnailCheck = performance.now();
 
@@ -78,6 +76,9 @@ export function checkPageForNewThumbnails() {
 }
 
 async function labelNewThumbnails(container: Element, containerType: string) {
+    if (shouldWaitForPageLoad(containerType)) {
+        await waitFor(getPageLoaded, 30000, 1000);
+    }
     if (!container || !document.body.contains(container)) return;
     const thumbnails = container.querySelectorAll(getThumbnailSelectors(containerType)) as NodeListOf<HTMLElement>;
     thumbnails.forEach((t) => labelThumbnail(t as HTMLImageElement, containerType));

diff --git a/src/utils/parseVideoID.ts b/src/utils/parseVideoID.ts
@@ -28,10 +28,17 @@ export function getBvIDFromWindow(timeout = 200): Promise<VideoID | null> {
 }
 
 const BILIBILI_VIDEO_URL_REGEX = /^\/video\/((BV1[a-zA-Z0-9]{9})|(av\d+))\/?/;
+const BVID_REGEX = /^(BV1[a-zA-Z0-9]{9})$/;
 /**
  * Parse without side effects
  */
 export async function getBvIDFromURL(url: string): Promise<VideoID | null> {
+    url = url.trim();
+    // check if is bvid already
+    if (BVID_REGEX.test(url)) {
+        return url as VideoID;
+    }
+
     //Attempt to parse url
     let urlObject: URL | null = null;
     try {