bump version

Fix @typescript-eslint/no-unused-vars lint warnings

.eslintrc.js

@@ -21,6 +21,7 @@ module.exports = {
     },
     plugins: ["react", "@typescript-eslint"],
     rules: {
+        '@typescript-eslint/no-unused-vars': 'error',
         // TODO: Remove warn rules when not needed anymore
         "no-self-assign": "off",
         "@typescript-eslint/no-empty-interface": "off",

manifest/manifest.json

@@ -1,7 +1,7 @@
 {
     "name": "__MSG_fullName__",
     "short_name": "SponsorBlock",
-    "version": "4.4.1",
+    "version": "4.4.4",
     "default_locale": "en",
     "description": "__MSG_Description__",
     "homepage_url": "https://sponsor.ajay.app",
@@ -64,7 +64,12 @@
     ],
     "browser_action": {
         "default_title": "SponsorBlock",
-        "default_popup": "popup.html"
+        "default_popup": "popup.html",
+        "default_icon": {
+            "16": "icons/IconSponsorBlocker16px.png",
+            "32": "icons/IconSponsorBlocker32px.png",
+            "64": "icons/LogoSponsorBlocker64px.png"
+        }
     }, 
     "background": {
         "scripts":[

public/_locales/en/messages.json

@@ -101,7 +101,7 @@
         "message": "It seems the server is down. Contact the dev immediately."
     },
     "connectionError": {
-        "message": "A connection error has occured. Error code: "
+        "message": "A connection error has occurred. Error code: "
     },
     "clearTimes": {
         "message": "Clear Segments"
@@ -356,7 +356,7 @@
         "message": "Show Time With Skips Removed"
     },
     "showTimeWithSkipsDescription": {
-        "message": "This time appears in brackets next to the current time on below the seekbar. This shows the total video duration minus any segments. This includes segments marked as only \"Show In Seekbar\"."
+        "message": "This time appears in brackets next to the current time on below the Seek Bar. This shows the total video duration minus any segments. This includes segments marked as only \"Show In Seek Bar\"."
     },
     "youHaveSkipped": {
         "message": "You've skipped "
@@ -410,7 +410,7 @@
         "message": "Supported Sites: "
     },
     "optionsInfo": {
-        "message": "Enable Invidious support, disable autoskip, hide buttons and more."
+        "message": "Enable Invidious support, disable auto skip, hide buttons and more."
     },
     "addInvidiousInstance": {
         "message": "Add 3rd-Party Client Instance"
@@ -499,7 +499,7 @@
     "incorrectlyFormattedOptions": {
         "message": "This JSON is not formatted correctly. Your options have not been changed."
     },
-    "confirmNoticeTitle" : {
+    "confirmNoticeTitle": {
         "message": "Submit Segment"
     },
     "submit": {
@@ -947,5 +947,11 @@
     },
     "openOptionsPage": {
         "message": "Open options page"
+    },
+    "resetToDefault": {
+        "message": "Reset settings to default"
+    },
+    "confirmResetToDefault": {
+        "message": "Are you sure you want to reset all settings to their default values? This cannot be undone."
     }
 }

public/_locales/sv/messages.json

@@ -186,7 +186,7 @@
         "message": "Detta döljer knapparna på YouTube-spelaren som du kan skicka in segment med som ska hoppas över."
     },
     "showSkipButton": {
-        "message": "Behåll knappen hoppa till markerat på spelaren"
+        "message": "Behåll knappen hoppa till höjdpunkt på spelaren"
     },
     "showInfoButton": {
         "message": "Visa Infoknapp På YouTube-spelaren"
@@ -613,7 +613,7 @@
         "message": "Icke-musik"
     },
     "category_poi_highlight": {
-        "message": "Markera"
+        "message": "Höjdpunkt"
     },
     "category_poi_highlight_description": {
         "message": "Den del av videon som de flesta letar efter. Liknande kommentarer \"Video börjar på x\"."

public/options/options.html

@@ -368,6 +368,12 @@
 					</div>
 				</div>
 
+				<div data-type="button-press" data-sync="resetToDefault" data-confirm-message="confirmResetToDefault">
+					<div class="option-button trigger-button">
+						__MSG_resetToDefault__
+					</div>
+				</div>
+
 			</div>
 
 			<div id="advanced" class="option-group hidden">

src/components/SkipNoticeComponent.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import * as CompileConfig from "../../config.json";
 import Config from "../config"
-import { Category, ContentContainer, SponsorHideType, SponsorTime, NoticeVisbilityMode, ActionType, SponsorSourceType, SegmentUUID } from "../types";
+import { Category, ContentContainer, SponsorTime, NoticeVisbilityMode, ActionType, SponsorSourceType, SegmentUUID } from "../types";
 import NoticeComponent from "./NoticeComponent";
 import NoticeTextSelectionComponent from "./NoticeTextSectionComponent";
 import Utils from "../utils";
@@ -72,7 +72,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
 
     amountOfPreviousNotices: number;
     showInSecondSlot: boolean;
-    
+
     idSuffix: string;
 
     noticeRef: React.MutableRefObject<NoticeComponent>;
@@ -105,7 +105,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
         if (this.segments.length > 1) {
             this.segments.sort((a, b) => a.segment[0] - b.segment[0]);
         }
-    
+
         // This is the suffix added at the end of every id
         for (const segment of this.segments) {
             this.idSuffix += segment.UUID;
@@ -168,7 +168,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
             noticeStyle.transform = "scale(0.8) translate(10%, 10%)";
         }
 
-        // If it started out as smaller, always keep the 
+        // If it started out as smaller, always keep the
         // skip button there
         const showFirstSkipButton = this.props.smaller || this.segments[0].actionType === ActionType.Mute;
         const firstColumn = showFirstSkipButton ? (
@@ -181,7 +181,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
                 showInSecondSlot={this.showInSecondSlot}
                 idSuffix={this.idSuffix}
                 fadeIn={true}
-                startFaded={Config.config.noticeVisibilityMode >= NoticeVisbilityMode.FadedForAll 
+                startFaded={Config.config.noticeVisibilityMode >= NoticeVisbilityMode.FadedForAll
                     || (Config.config.noticeVisibilityMode >= NoticeVisbilityMode.FadedForAutoSkip && this.autoSkip)}
                 timed={true}
                 maxCountdownTime={this.state.maxCountdownTime}
@@ -205,7 +205,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
                 key={0}>
 
                 {/* Vote Button Container */}
-                {!this.state.thanksForVotingText ? 
+                {!this.state.thanksForVotingText ?
                     <td id={"sponsorTimesVoteButtonsContainer" + this.idSuffix}
                         className="sponsorTimesVoteButtonsContainer">
 
@@ -268,7 +268,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
                     ? this.getSkipButton(1) : null}
 
                 {/* Never show button */}
-                {!this.autoSkip || this.props.startReskip ? "" : 
+                {!this.autoSkip || this.props.startReskip ? "" :
                     <td className="sponsorSkipNoticeRightSection"
                         key={1}>
                         <button className="sponsorSkipObject sponsorSkipNoticeButton sponsorSkipNoticeRightButton"
@@ -343,7 +343,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
     }
 
     getSkipButton(buttonIndex: number): JSX.Element {
-        if (this.state.showSkipButton[buttonIndex] && (this.segments.length > 1 
+        if (this.state.showSkipButton[buttonIndex] && (this.segments.length > 1
                 || this.segments[0].actionType !== ActionType.Poi
                 || this.props.unskipTime)) {
 
@@ -365,8 +365,8 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
                             className="sponsorSkipObject sponsorSkipNoticeButton"
                             style={style}
                             onClick={() => this.prepAction(buttonIndex === 1 ? SkipNoticeAction.Unskip1 : SkipNoticeAction.Unskip0)}>
-                        {this.getSkipButtonText(buttonIndex, forceSeek ? ActionType.Skip : null) 
+                        {this.getSkipButtonText(buttonIndex, forceSeek ? ActionType.Skip : null)
-                            + (!forceSeek && this.state.showKeybindHint 
+                            + (!forceSeek && this.state.showKeybindHint
                                 ? " (" + keybindToString(Config.config.skipKeybind) + ")" : "")}
                     </button>
                 </span>
@@ -379,7 +379,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
         for (let i = 0; i < this.segments.length; i++) {
             elements.push(
                 <button className="sponsorSkipObject sponsorSkipNoticeButton"
-                        style={{opacity: this.getSubmissionChooserOpacity(i), 
+                        style={{opacity: this.getSubmissionChooserOpacity(i),
                                 color: this.getSubmissionChooserColor(i)}}
                         onClick={() => this.performAction(i)}
                         key={"submission" + i + this.segments[i].category + this.idSuffix}>
@@ -404,7 +404,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
     getSubmissionChooserColor(index: number): string {
         const isDownvote = this.state.actionState == SkipNoticeAction.Downvote;
         const isCopyDownvote = this.state.actionState == SkipNoticeAction.CopyDownvote;
-        const shouldWarnUser = Config.config.isVip && (isDownvote || isCopyDownvote) 
+        const shouldWarnUser = Config.config.isVip && (isDownvote || isCopyDownvote)
                                         && this.segments[index].locked === 1;
 
         return shouldWarnUser ? this.lockedColor : this.unselectedColor;
@@ -480,8 +480,8 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
 
     /**
      * Performs the action from the current state
-     * 
+     *
-     * @param index 
+     * @param index
      */
     performAction(index: number, action?: SkipNoticeAction): void {
         switch (action ?? this.state.actionState) {
@@ -620,7 +620,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
         // See if the title should be changed
         if (!this.autoSkip) {
             newState.noticeTitle = chrome.i18n.getMessage("noticeTitle");
-        }       
+        }
 
         //reset countdown
         this.setState(newState, () => {
@@ -723,7 +723,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
             messages
         });
     }
-    
+
     addVoteButtonInfo(message: string): void {
         this.setState({
             thanksForVotingText: message
@@ -786,7 +786,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
             case ActionType.Mute: {
                 return chrome.i18n.getMessage("unmute");
             }
-            case ActionType.Skip: 
+            case ActionType.Skip:
             default: {
                 return chrome.i18n.getMessage("unskip");
             }
@@ -799,7 +799,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
             case ActionType.Mute: {
                 return chrome.i18n.getMessage("mute");
             }
-            case ActionType.Skip: 
+            case ActionType.Skip:
             default: {
                 return chrome.i18n.getMessage("reskip");
             }
@@ -812,7 +812,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
             case ActionType.Mute: {
                 return chrome.i18n.getMessage("mute");
             }
-            case ActionType.Skip: 
+            case ActionType.Skip:
             default: {
                 return chrome.i18n.getMessage("skip");
             }

src/components/TooltipComponent.tsx

@@ -1,6 +1,4 @@
 import * as React from "react";
-import Config from "../config";
-import { Category, SegmentUUID, SponsorTime } from "../types";
 
 export interface TooltipProps {
     text: string;

src/config.ts

@@ -1,6 +1,6 @@
 import * as CompileConfig from "../config.json";
 import * as invidiousList from "../ci/invidiouslist.json";
-import { Category, CategorySelection, CategorySkipOption, NoticeVisbilityMode, PreviewBarOption, SponsorTime, StorageChangesObject, UnEncodedSegmentTimes as UnencodedSegmentTimes, Keybind, HashedValue, VideoID, SponsorHideType } from "./types";
+import { Category, CategorySelection, CategorySkipOption, NoticeVisbilityMode, PreviewBarOption, SponsorTime, StorageChangesObject, Keybind, HashedValue, VideoID, SponsorHideType } from "./types";
 import { keybindEquals } from "./utils/configUtils";
 
 interface SBConfig {
@@ -113,6 +113,7 @@ export interface SBObject {
     local: SBStorage;
     forceSyncUpdate(prop: string): void;
     forceLocalUpdate(prop: string): void;
+    resetToDefault(): void;
 }
 
 const Config: SBObject = {
@@ -289,7 +290,8 @@ const Config: SBObject = {
     config: null,
     local: null,
     forceSyncUpdate,
-    forceLocalUpdate
+    forceLocalUpdate,
+    resetToDefault
 };
 
 // Function setup
@@ -300,7 +302,7 @@ function configProxy(): { sync: SBConfig, local: SBStorage } {
             for (const key in changes) {
                 Config.cachedSyncConfig[key] = changes[key].newValue;
             }
-    
+
             for (const callback of Config.configSyncListeners) {
                 callback(changes);
             }
@@ -310,7 +312,7 @@ function configProxy(): { sync: SBConfig, local: SBStorage } {
             }
         }
     });
-	
+
     const syncHandler: ProxyHandler<SBConfig> = {
         set<K extends keyof SBConfig>(obj: SBConfig, prop: K, value: SBConfig[K]) {
             Config.cachedSyncConfig[prop] = value;
@@ -327,10 +329,10 @@ function configProxy(): { sync: SBConfig, local: SBStorage } {
 
             return obj[prop] || data;
         },
-	
+
         deleteProperty(obj: SBConfig, prop: keyof SBConfig) {
             chrome.storage.sync.remove(<string> prop);
-            
+
             return true;
         }
 
@@ -352,10 +354,10 @@ function configProxy(): { sync: SBConfig, local: SBStorage } {
 
             return obj[prop] || data;
         },
-	
+
         deleteProperty(obj: SBStorage, prop: keyof SBStorage) {
             chrome.storage.local.remove(<string> prop);
-            
+
             return true;
         }
 
@@ -379,7 +381,7 @@ function forceLocalUpdate(prop: string): void {
     });
 }
 
-async function fetchConfig(): Promise<void> { 
+async function fetchConfig(): Promise<void> {
     await Promise.all([new Promise<void>((resolve) => {
         chrome.storage.sync.get(null, function(items) {
             Config.cachedSyncConfig = <SBConfig> <unknown> items;
@@ -387,7 +389,7 @@ async function fetchConfig(): Promise<void> {
         });
     }), new Promise<void>((resolve) => {
         chrome.storage.local.get(null, function(items) {
-            Config.cachedLocalStorage = <SBStorage> <unknown> items; 
+            Config.cachedLocalStorage = <SBStorage> <unknown> items;
             resolve();
         });
     })]);
@@ -431,9 +433,9 @@ function migrateOldSyncFormats(config: SBConfig) {
     if (!config["autoSkipOnMusicVideosUpdate"]) {
         config["autoSkipOnMusicVideosUpdate"] = true;
         for (const selection of config.categorySelections) {
-            if (selection.name === "music_offtopic" 
+            if (selection.name === "music_offtopic"
                     && selection.option === CategorySkipOption.AutoSkip) {
-                
+
                 config.autoSkipOnMusicVideos = true;
                 break;
             }
@@ -522,6 +524,16 @@ function addDefaults() {
     }
 }
 
+function resetToDefault() {
+    chrome.storage.sync.set({
+        ...Config.syncDefaults,
+        userID: Config.config.userID,
+        minutesSaved: Config.config.minutesSaved,
+        skipCount: Config.config.skipCount,
+        sponsorTimesContributed: Config.config.sponsorTimesContributed
+    });
+}
+
 // Sync config
 setupConfig();
 

src/content.ts

@@ -20,6 +20,7 @@ import { isSafari, keybindEquals } from "./utils/configUtils";
 import { CategoryPill } from "./render/CategoryPill";
 import { AnimationUtils } from "./utils/animationUtils";
 import { GenericUtils } from "./utils/genericUtils";
+import { logDebug } from "./utils/logger";
 
 // Hack to get the CSS loaded on permission-based sites (Invidious)
 utils.wait(() => Config.config !== null, 5000, 10).then(addCSS);
@@ -275,6 +276,7 @@ function resetValues() {
         switchingVideos = false;
     } else {
         switchingVideos = true;
+        logDebug("Setting switching videos to true (reset data)");
     }
 
     firstEvent = true;
@@ -319,9 +321,6 @@ async function videoIDChange(id) {
         }
     }
 
-    // Get new video info
-    // getVideoInfo(); // Seems to have been replaced
-
     // Update whitelist data when the video data is loaded
     whitelistCheck();
 
@@ -448,6 +447,8 @@ function videoOnReadyListener(): void {
 }
 
 function cancelSponsorSchedule(): void {
+    logDebug("Pausing skipping");
+
     if (currentSkipSchedule !== null) {
         clearTimeout(currentSkipSchedule);
         currentSkipSchedule = null;
@@ -470,11 +471,13 @@ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?:
         // Reset lastCheckVideoTime
         lastCheckVideoTime = -1;
         lastCheckTime = 0;
-        console.warn("[SB] Ad playing, pausing skipping");
+        logDebug("[SB] Ad playing, pausing skipping");
 
         return;
     }
 
+    logDebug(`Considering to start skipping: ${!video}, ${video?.paused}`);
+
     if (!video || video.paused) return;
     if (currentTime === undefined || currentTime === null) {
         const virtualTime = lastTimeFromWaitingEvent ?? (lastKnownVideoTime.videoTime ?
@@ -506,6 +509,7 @@ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?:
 
     const skipInfo = getNextSkipIndex(currentTime, includeIntersectingSegments, includeNonIntersectingSegments);
 
+    logDebug(`Ready to start skipping: ${skipInfo.index} at ${currentTime}`);
     if (skipInfo.index === -1) return;
 
     const currentSkip = skipInfo.array[skipInfo.index];
@@ -526,6 +530,8 @@ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?:
         }
     }
 
+    logDebug(`Next step in starting skipping: ${!shouldSkip(currentSkip)}, ${!sponsorTimesSubmitting?.some((segment) => segment.segment === currentSkip.segment)}`);
+
     // Don't skip if this category should not be skipped
     if (!shouldSkip(currentSkip) && !sponsorTimesSubmitting?.some((segment) => segment.segment === currentSkip.segment)) return;
 
@@ -566,6 +572,8 @@ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?:
             // Use interval instead of timeout near the end to combat imprecise video time
             const startIntervalTime = performance.now();
             const startVideoTime = Math.max(currentTime, video.currentTime);
+            logDebug(`Starting setInterval skipping ${video.currentTime} to skip at ${skipTime[0]}`);
+
             currentSkipInterval = setInterval(() => {
                 const intervalDuration = performance.now() - startIntervalTime;
                 if (intervalDuration >= delayTime || video.currentTime >= skipTime[0]) {
@@ -580,6 +588,8 @@ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?:
                 }
             }, 1);
         } else {
+            logDebug(`Starting timeout to skip ${video.currentTime} to skip at ${skipTime[0]}`);
+            
             // Schedule for right before to be more precise than normal timeout
             currentSkipSchedule = setTimeout(skippingFunction, Math.max(0, delayTime - 100));
         }
@@ -669,6 +679,8 @@ function setupVideoListeners() {
 
             if (switchingVideos) {
                 switchingVideos = false;
+                logDebug("Setting switching videos to false");
+
                 // If already segments loaded before video, retry to skip starting segments
                 if (sponsorTimes) startSkipScheduleCheckingForStartSponsors();
             }
@@ -691,7 +703,7 @@ function setupVideoListeners() {
             
             if (startedWaiting) {
                 startedWaiting = false;
-                console.warn(`[SB] Starting schedule after buffering: ${Math.abs(lastCheckVideoTime - video.currentTime) > 0.3
+                logDebug(`[SB] Playing event after buffering: ${Math.abs(lastCheckVideoTime - video.currentTime) > 0.3
                     || (lastCheckVideoTime !== video.currentTime && Date.now() - lastCheckTime > 2000)}`);
             }
 
@@ -734,7 +746,7 @@ function setupVideoListeners() {
         };
         video.addEventListener('pause', () => paused());
         video.addEventListener('waiting', () => {
-            console.warn("[SB] Not skipping due to buffering");
+            logDebug("[SB] Not skipping due to buffering");
             startedWaiting = true;
 
             paused();
@@ -927,12 +939,10 @@ function startSkipScheduleCheckingForStartSponsors() {
         // See if there are any starting sponsors
         let startingSegmentTime = getStartTimeFromUrl(document.URL) || -1;
         let found = false;
-        let startingSegment: SponsorTime = null;
         for (const time of sponsorTimes) {
             if (time.segment[0] <= video.currentTime && time.segment[0] > startingSegmentTime && time.segment[1] > video.currentTime
                     && time.actionType !== ActionType.Poi) {
                         startingSegmentTime = time.segment[0];
-                        startingSegment = time;
                         found = true;
                 break;
             }
@@ -942,7 +952,6 @@ function startSkipScheduleCheckingForStartSponsors() {
                 if (time.segment[0] <= video.currentTime && time.segment[0] > startingSegmentTime && time.segment[1] > video.currentTime
                         && time.actionType !== ActionType.Poi) {
                             startingSegmentTime = time.segment[0];
-                            startingSegment = time;
                             found = true;
                     break;
                 }
@@ -980,26 +989,6 @@ function startSkipScheduleCheckingForStartSponsors() {
     }
 }
 
-/**
- * Get the video info for the current tab from YouTube
- *
- * TODO: Replace
- */
-async function getVideoInfo(): Promise<void> {
-    const result = await utils.asyncRequestToCustomServer("GET", "https://www.youtube.com/get_video_info?video_id=" + sponsorVideoID + "&html5=1&c=TVHTML5&cver=7.20190319");
-
-    if (result.ok) {
-        const decodedData = decodeURIComponent(result.responseText).match(/player_response=([^&]*)/)[1];
-        if (!decodedData) {
-            console.error("[SB] Failed at getting video info from YouTube.");
-            console.error("[SB] Data returned from YouTube: " + result.responseText);
-            return;
-        }
-
-        videoInfo = JSON.parse(decodedData);
-    }
-}
-
 function getYouTubeVideoID(document: Document): string | boolean {
     const url = document.URL;
     // clips should never skip, going from clip to full video has no indications.
@@ -1134,7 +1123,7 @@ async function whitelistCheck() {
         ?? document.querySelector("a.ytp-title-channel-logo") // YouTube Embed
         ?? document.querySelector(".channel-profile #channel-name")?.parentElement.parentElement // Invidious
         ?? document.querySelector("a.slim-owner-icon-and-title")) // Mobile YouTube
-            ?.getAttribute("href")?.match(/\/channel\/(UC[a-zA-Z0-9_-]{22})/)?.[1];
+            ?.getAttribute("href")?.match(/(?:\/c\/|\/channel\/)(UC[a-zA-Z0-9_-]{22}|[a-zA-Z0-9_-]+)/)?.[1];
 
     try {
         await utils.wait(() => !!getChannelID(), 6000, 20);
@@ -1142,14 +1131,12 @@ async function whitelistCheck() {
         channelIDInfo = {
             status: ChannelIDStatus.Found,
             id: getChannelID().match(/^\/?([^\s/]+)/)[0]
-        }
+        };
     } catch (e) {
         channelIDInfo = {
             status: ChannelIDStatus.Failed,
             id: null
-        }
+        };
-
-        return;
     }
 
     //see if this is a whitelisted channel

src/js-components/skipButtonControlBar.ts

@@ -2,10 +2,7 @@ import Config from "../config";
 import { SponsorTime } from "../types";
 import { getSkippingText } from "../utils/categoryUtils";
 import { keybindToString } from "../utils/configUtils";
-
-import Utils from "../utils";
 import { AnimationUtils } from "../utils/animationUtils";
-const utils = new Utils();
 
 export interface SkipButtonControlBarProps {
     skip: (segment: SponsorTime) => void;
@@ -53,7 +50,7 @@ export class SkipButtonControlBar {
         this.skipIcon.id = "sbSkipIconControlBarImage";
 
         this.textContainer = document.createElement("div");
-        
+
         this.container.appendChild(this.skipIcon);
         this.container.appendChild(this.textContainer);
         this.container.addEventListener("click", () => this.toggleSkip());
@@ -73,7 +70,7 @@ export class SkipButtonControlBar {
     attachToPage(): void {
         const mountingContainer = this.getMountingContainer();
         this.chapterText = document.querySelector(".ytp-chapter-container");
-    
+
         if (mountingContainer && !mountingContainer.contains(this.container)) {
             if (this.onMobileYouTube) {
                 mountingContainer.appendChild(this.container);
@@ -172,10 +169,10 @@ export class SkipButtonControlBar {
         const overlay = document.getElementById("player-control-overlay");
 
         if (overlay && this.enabled) {
-            if (overlay?.classList?.contains("pointer-events-off")) {
+            if (overlay?.classList?.contains("fadein")) {
-                this.hideButton();
-            } else {
                 this.showButton();
+            } else {
+                this.hideButton();
             }
         }
     }
@@ -220,4 +217,3 @@ export class SkipButtonControlBar {
         this.container.style.left = this.left + "px";
     }
 }
-

src/options.ts

@@ -232,12 +232,22 @@ async function init() {
             }
             case "button-press": {
                 const actionButton = optionsElements[i].querySelector(".trigger-button");
+                const confirmMessage = optionsElements[i].getAttribute("data-confirm-message");
 
-                switch(optionsElements[i].getAttribute("data-sync")) {
+                actionButton.addEventListener("click", () => {
-                    case "copyDebugInformation":
+                    if (confirmMessage !== null && !confirm(chrome.i18n.getMessage(confirmMessage))) {
-                        actionButton.addEventListener("click", copyDebugOutputToClipboard);
+                        return;
-                        break;
+                    }
-                }
+                    switch (optionsElements[i].getAttribute("data-sync")) {
+                        case "copyDebugInformation":
+                            copyDebugOutputToClipboard();
+                            break;
+                        case "resetToDefault":
+                            Config.resetToDefault();
+                            window.location.reload();
+                            break;
+                    }
+                });
 
                 break;
             }

src/utils/logger.ts

@@ -0,0 +1,12 @@
+window["SBLogs"] = {
+    debug: [],
+    warn: []
+};
+
+export function logDebug(message: string) {
+    window["SBLogs"].debug.push(message);
+}
+
+export function logWarn(message: string) {
+    window["SBLogs"].warn.push(message);
+}