diff --git a/src/components/SkipNoticeComponent.tsx b/src/components/SkipNoticeComponent.tsx index 37ded10f..8a96bede 100644 --- a/src/components/SkipNoticeComponent.tsx +++ b/src/components/SkipNoticeComponent.tsx @@ -14,6 +14,12 @@ import ThumbsDownSvg from "../svg-icons/thumbs_down_svg"; import PencilSvg from "../svg-icons/pencil_svg"; import { downvoteButtonColor, SkipNoticeAction } from "../utils/noticeUtils"; +enum SkipButtonState { + Undo, // Unskip + Redo, // Reskip + Start // Skip +} + export interface SkipNoticeProps { segments: SponsorTime[]; @@ -39,8 +45,8 @@ export interface SkipNoticeState { maxCountdownTime?: () => number; countdownText?: string; - skipButtonText?: string; - skipButtonCallback?: (index: number) => void; + skipButtonState?: SkipButtonState; + skipButtonCallback?: (index: number, forceSeek: boolean) => void; showSkipButton?: boolean; editing?: boolean; @@ -121,10 +127,10 @@ class SkipNoticeComponent extends React.Component this.reskip(index) : (index) => this.unskip(index), + ? this.reskip.bind(this) : this.unskip.bind(this), showSkipButton: true, editing: false, @@ -144,7 +150,7 @@ class SkipNoticeComponent extends React.Component 1 || this.segments[0].actionType !== ActionType.Poi || this.props.unskipTime)) { const style: React.CSSProperties = { marginLeft: "4px", - color: (this.state.actionState === SkipNoticeAction.Unskip) ? this.selectedColor : this.unselectedColor + color: ([SkipNoticeAction.Unskip, SkipNoticeAction.UnskipForceSeek].includes(this.state.actionState)) + ? this.selectedColor : this.unselectedColor }; if (this.contentContainer().onMobileYouTube) { style.padding = "20px"; @@ -346,8 +354,8 @@ class SkipNoticeComponent extends React.Component this.prepAction(SkipNoticeAction.Unskip)}> - {this.state.skipButtonText + (this.state.showKeybindHint ? " (" + keybindToString(Config.config.skipKeybind) + ")" : "")} + onClick={() => this.prepAction(forceSeek ? SkipNoticeAction.UnskipForceSeek : SkipNoticeAction.Unskip)}> + {this.getSkipButtonText(forceSeek ? ActionType.Skip : null) + (!forceSeek && this.state.showKeybindHint ? " (" + keybindToString(Config.config.skipKeybind) + ")" : "")} ); @@ -451,6 +459,9 @@ class SkipNoticeComponent extends React.Component Config.config.skipNoticeDuration, @@ -597,14 +611,14 @@ class SkipNoticeComponent extends React.Component { + this.setState(this.getUnskippedModeInfo(index, skipButtonState), () => { this.noticeRef.current.resetCountdown(); }); } - getUnskippedModeInfo(index: number, buttonText: string): SkipNoticeState { + getUnskippedModeInfo(index: number, skipButtonState: SkipButtonState): SkipNoticeState { const changeCountdown = this.segments[index].actionType !== ActionType.Poi; const maxCountdownTime = changeCountdown ? () => { @@ -615,8 +629,8 @@ class SkipNoticeComponent extends React.Component this.reskip(index), + skipButtonState: skipButtonState, + skipButtonCallback: this.reskip.bind(this), // change max duration to however much of the sponsor is left maxCountdownTime: maxCountdownTime, countdownTime: maxCountdownTime() @@ -713,8 +727,20 @@ class SkipNoticeComponent extends React.Component void, dontShowNoticeAgain: () => void, - unskipSponsorTime: (segment: SponsorTime, unskipTime: number) => void, + unskipSponsorTime: (segment: SponsorTime, unskipTime: number, forceSeek?: boolean) => void, sponsorTimes: SponsorTime[], sponsorTimesSubmitting: SponsorTime[], skipNotices: SkipNotice[], v: HTMLVideoElement, sponsorVideoID, - reskipSponsorTime: (segment: SponsorTime) => void, + reskipSponsorTime: (segment: SponsorTime, forceSeek?: boolean) => void, updatePreviewBar: () => void, onMobileYouTube: boolean, sponsorSubmissionNotice: SubmissionNotice, diff --git a/src/utils/noticeUtils.ts b/src/utils/noticeUtils.ts index e2489f74..ade41240 100644 --- a/src/utils/noticeUtils.ts +++ b/src/utils/noticeUtils.ts @@ -7,7 +7,8 @@ export enum SkipNoticeAction { Downvote, CategoryVote, CopyDownvote, - Unskip + Unskip, + UnskipForceSeek } export function downvoteButtonColor(segments: SponsorTime[], actionState: SkipNoticeAction, downvoteType: SkipNoticeAction): string {