Add option to hide autogenerated chapters by YouTube

ajayyy · Dec 9, 2024 · 1597677 · 1597677
1 parent 9ad636f
commit 1597677
Show file tree

Hide file tree

Showing 6 changed files with 50 additions and 8 deletions.
diff --git a/public/_locales b/public/_locales
diff --git a/src/components/options/CategorySkipOptionsComponent.tsx b/src/components/options/CategorySkipOptionsComponent.tsx
@@ -234,6 +234,10 @@ class CategorySkipOptionsComponent extends React.Component<CategorySkipOptionsPr
                     configKey: "showSegmentNameInChapterBar",
                     label: chrome.i18n.getMessage("showSegmentNameInChapterBar"),
                     dontDisable: true
+                }, {
+                    configKey: "showAutogeneratedChapters",
+                    label: chrome.i18n.getMessage("showAutogeneratedChapters"),
+                    dontDisable: true
                 }];
             case "music_offtopic":
                 return [{

diff --git a/src/config.ts b/src/config.ts
@@ -70,6 +70,7 @@ interface SBConfig {
     showCategoryGuidelines: boolean;
     showCategoryWithoutPermission: boolean;
     showSegmentNameInChapterBar: boolean;
+    showAutogeneratedChapters: boolean;
     useVirtualTime: boolean;
     showSegmentFailedToFetchWarning: boolean;
     allowScrollingToEdit: boolean;
@@ -328,6 +329,7 @@ const syncDefaults = {
     showCategoryGuidelines: true,
     showCategoryWithoutPermission: false,
     showSegmentNameInChapterBar: true,
+    showAutogeneratedChapters: true,
     useVirtualTime: true,
     showSegmentFailedToFetchWarning: true,
     allowScrollingToEdit: true,

diff --git a/src/content.ts b/src/content.ts
@@ -25,7 +25,7 @@ import SubmissionNotice from "./render/SubmissionNotice";
 import { Message, MessageResponse, VoteResponse } from "./messageTypes";
 import { SkipButtonControlBar } from "./js-components/skipButtonControlBar";
 import { getStartTimeFromUrl } from "./utils/urlParser";
-import { getControls, getExistingChapters, getHashParams, isPlayingPlaylist, isVisible } from "./utils/pageUtils";
+import { getControls, getExistingChapters, getHashParams, hasAutogeneratedChapters, isPlayingPlaylist, isVisible } from "./utils/pageUtils";
 import { CategoryPill } from "./render/CategoryPill";
 import { AnimationUtils } from "../maze-utils/src/animationUtils";
 import { GenericUtils } from "./utils/genericUtils";
@@ -1287,7 +1287,13 @@ function importExistingChapters(wait: boolean) {
                         existingChaptersImported = true;
                         updatePreviewBar();
                     }
-                }).catch(() => { importingChaptersWaiting = false; }); // eslint-disable-line @typescript-eslint/no-empty-function
+                }).catch(() => { importingChaptersWaiting = false; });
+
+            if (!Config.config.showAutogeneratedChapters) {
+                waitFor(() => hasAutogeneratedChapters(), wait ? 15000 : 0, 400).then(() => {
+                    updateActiveSegment(getCurrentTime());
+                }).catch(() => { }); // eslint-disable-line @typescript-eslint/no-empty-function
+            }
         }
     }
 }

diff --git a/src/js-components/previewBar.ts b/src/js-components/previewBar.ts
@@ -13,7 +13,7 @@ import { DEFAULT_CATEGORY, shortCategoryName } from "../utils/categoryUtils";
 import { normalizeChapterName } from "../utils/exporter";
 import { findValidElement } from "../../maze-utils/src/dom";
 import { addCleanupListener } from "../../maze-utils/src/cleanup";
-import { isVisible } from "../utils/pageUtils";
+import { hasAutogeneratedChapters, isVisible } from "../utils/pageUtils";
 import { isVorapisInstalled } from "../utils/compatibility";
 
 const TOOLTIP_VISIBLE_CLASS = 'sponsorCategoryTooltipVisible';
@@ -365,11 +365,13 @@ class PreviewBar {
             // Merge overlapping chapters
             this.unfilteredChapterGroups = this.createChapterRenderGroups(segments);
         }
-
-        if (segments.every((segments) => segments.source === SponsorSourceType.YouTube)
+        
+        if ((segments.every((segments) => segments.source === SponsorSourceType.YouTube)
             || (!Config.config.renderSegmentsAsChapters
                 && segments.every((segment) => segment.actionType !== ActionType.Chapter
-                    || segment.source === SponsorSourceType.YouTube))) {
+                    || segment.source === SponsorSourceType.YouTube)))
+            && !(hasAutogeneratedChapters() && !Config.config.showAutogeneratedChapters)) {
+
             if (this.customChaptersBar) this.customChaptersBar.style.display = "none";
             this.originalChapterBar.style.removeProperty("display");
             return;
@@ -395,6 +397,15 @@ class PreviewBar {
             this.chapterGroups = this.unfilteredChapterGroups;
         }
 
+        if (this.chapterGroups.length === 0 && !Config.config.showAutogeneratedChapters && hasAutogeneratedChapters()) {
+            // Add placeholder chapter group for whole video
+            this.chapterGroups = [{
+                segment: [0, this.videoDuration],
+                originalDuration: 0,
+                actionType: null
+            }];
+        }
+
         if (!this.chapterGroups || this.chapterGroups.length <= 0) {
             if (this.customChaptersBar) this.customChaptersBar.style.display = "none";
             this.originalChapterBar.style.removeProperty("display");
@@ -787,7 +798,8 @@ class PreviewBar {
     updateChapterText(segments: SponsorTime[], submittingSegments: SponsorTime[], currentTime: number): SponsorTime[] {
         if (!Config.config.showSegmentNameInChapterBar
                 || Config.config.disableSkipping
-                || ((!segments || segments.length <= 0) && submittingSegments?.length <= 0)) {
+                || ((!segments || segments.length <= 0) && submittingSegments?.length <= 0 
+                    && (Config.config.showAutogeneratedChapters || !hasAutogeneratedChapters()))) {
             const chaptersContainer = this.getChaptersContainer();
             if (chaptersContainer) {
                 chaptersContainer.querySelector(".sponsorChapterText")?.remove();
@@ -875,6 +887,18 @@ class PreviewBar {
                 } else {
                     this.chapterVote.setVisibility(false);
                 }
+            } else if (!Config.config.showAutogeneratedChapters && hasAutogeneratedChapters()) {
+                // Keep original hidden
+                chaptersContainer.querySelector(".sponsorChapterText")?.remove();
+                const chapterTitle = chaptersContainer.querySelector(".ytp-chapter-title-content") as HTMLDivElement;
+
+                chapterTitle.style.display = "none";
+                chaptersContainer.classList.remove("sponsorblock-chapter-visible");
+
+                const titlePrefixDot = chaptersContainer.querySelector(".ytp-chapter-title-prefix") as HTMLElement;
+                if (titlePrefixDot) titlePrefixDot.style.display = "none";
+
+                this.chapterVote.setVisibility(false);
             } else {
                 chaptersContainer.querySelector(".sponsorChapterText")?.remove();
                 const chapterTitle = chaptersContainer.querySelector(".ytp-chapter-title-content") as HTMLDivElement;

diff --git a/src/utils/pageUtils.ts b/src/utils/pageUtils.ts
@@ -1,5 +1,6 @@
 import { ActionType, Category, SponsorSourceType, SponsorTime, VideoID } from "../types";
 import { getFormattedTimeToSeconds } from "../../maze-utils/src/formating";
+import Config from "../config";
 
 export function getControls(): HTMLElement {
     const controlsSelectors = [
@@ -55,10 +56,15 @@ export function getHashParams(): Record<string, unknown> {
     return {};
 }
 
+export function hasAutogeneratedChapters(): boolean {
+    return !!document.querySelector("ytd-engagement-panel-section-list-renderer ytd-macro-markers-list-renderer #menu");
+}
+
 export function getExistingChapters(currentVideoID: VideoID, duration: number): SponsorTime[] {
     const chaptersBox = document.querySelector("ytd-macro-markers-list-renderer");
     const title = chaptersBox?.closest("ytd-engagement-panel-section-list-renderer")?.querySelector("#title-text.ytd-engagement-panel-title-header-renderer");
     if (title?.textContent?.includes("Key moment")) return [];
+    if (!Config.config.showAutogeneratedChapters && hasAutogeneratedChapters()) return [];
 
     const chapters: SponsorTime[] = [];
     // .ytp-timed-markers-container indicates that key-moments are present, which should not be divided