Restart Voting button. Wiki links. SkipNotice Improvements

This commit is contained in:
FlorianZahn 2021-10-06 23:02:26 +02:00
parent 93f02877a7
commit 4afc2c153a
3 changed files with 154 additions and 53 deletions

View file

@ -810,5 +810,17 @@
}, },
"LearnMore": { "LearnMore": {
"message": "Learn More" "message": "Learn More"
},
"CopyDownvoteButtonInfo": {
"message": "Downvotes and creates a local copy for you to resubmit"
},
"OpenCategoryWikiPage": {
"message": "Open this category's wiki page."
},
"CopyAndDownvote": {
"message": "Copy and downvote"
},
"ContinueVoting": {
"message": "Continue Voting"
} }
} }

View file

@ -45,7 +45,7 @@ export interface SkipNoticeState {
skipButtonCallback?: (index: number) => void; skipButtonCallback?: (index: number) => void;
showSkipButton?: boolean; showSkipButton?: boolean;
downvoting?: boolean; editing?: boolean;
choosingCategory?: boolean; choosingCategory?: boolean;
thanksForVotingText?: string; //null until the voting buttons should be hidden thanksForVotingText?: string; //null until the voting buttons should be hidden
@ -117,7 +117,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
skipButtonCallback: (index) => this.unskip(index), skipButtonCallback: (index) => this.unskip(index),
showSkipButton: true, showSkipButton: true,
downvoting: false, editing: false,
choosingCategory: false, choosingCategory: false,
thanksForVotingText: null, thanksForVotingText: null,
@ -208,16 +208,15 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
style={{marginRight: "10px"}} style={{marginRight: "10px"}}
src={chrome.extension.getURL("icons/thumbs_down.svg")} src={chrome.extension.getURL("icons/thumbs_down.svg")}
title={chrome.i18n.getMessage("reportButtonInfo")} title={chrome.i18n.getMessage("reportButtonInfo")}
onClick={() => this.adjustDownvotingState(true)}> onClick={() => this.prepAction(SkipNoticeAction.Downvote)}>
</img> </img>
{/* Copy and Downvote Button */} {/* Copy and Downvote Button */}
<img id={"sponsorTimesDownvoteButtonsContainer" + this.idSuffix} <img id={"sponsorTimesDownvoteButtonsContainer" + this.idSuffix}
className="sponsorSkipObject voteButton voteButtonImageCopyDownvote" className="sponsorSkipObject voteButton voteButtonImageCopyDownvote"
title="Copy and downvote to create your own segment and downvote." title={chrome.i18n.getMessage("CopyDownvoteButtonInfo")}
src={chrome.extension.getURL("icons/clipboard.svg")} src={chrome.extension.getURL("icons/pencil.svg")}
onClick={() => this.prepAction(SkipNoticeAction.CopyDownvote)}> onClick={() => this.adjustEditingState(true)}>
</img> </img>
</td> </td>
@ -226,7 +225,17 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
<td id={"sponsorTimesVoteButtonInfoMessage" + this.idSuffix} <td id={"sponsorTimesVoteButtonInfoMessage" + this.idSuffix}
className="sponsorTimesInfoMessage sponsorTimesVoteButtonMessage" className="sponsorTimesInfoMessage sponsorTimesVoteButtonMessage"
style={{marginRight: "10px"}}> style={{marginRight: "10px"}}>
{/* Submitted string */}
{this.state.thanksForVotingText} {this.state.thanksForVotingText}
{/* Continue Voting Button */}
<button id={"sponsorTimesContinueVotingContainer" + this.idSuffix}
className="sponsorSkipObject sponsorSkipNoticeButton"
title={"Continue Voting"}
onClick={() => this.continueVoting()}>
{chrome.i18n.getMessage("ContinueVoting")}
</button>
</td> </td>
} }
@ -246,16 +255,16 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
} }
</tr>), </tr>),
/* Downvote Options Row */ /* Edit Segments Row */
(this.state.downvoting && (this.state.editing &&
<tr id={"sponsorSkipNoticeDownvoteOptionsRow" + this.idSuffix} <tr id={"sponsorSkipNoticeEditSegmentsRow" + this.idSuffix}
key={2}> key={2}>
<td id={"sponsorTimesDownvoteOptionsContainer" + this.idSuffix}> <td id={"sponsorTimesEditSegmentsContainer" + this.idSuffix}>
{/* Normal downvote */} {/* Copy Segment */}
<button className="sponsorSkipObject sponsorSkipNoticeButton" <button className="sponsorSkipObject sponsorSkipNoticeButton"
onClick={() => this.prepAction(SkipNoticeAction.Downvote)}> onClick={() => this.prepAction(SkipNoticeAction.CopyDownvote)}>
{chrome.i18n.getMessage("downvoteDescription")} {chrome.i18n.getMessage("CopyAndDownvote")}
</button> </button>
{/* Category vote */} {/* Category vote */}
@ -269,6 +278,8 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
</tr> </tr>
), ),
/* Category Chooser Row */ /* Category Chooser Row */
(this.state.choosingCategory && (this.state.choosingCategory &&
<tr id={"sponsorSkipNoticeCategoryChooserRow" + this.idSuffix} <tr id={"sponsorSkipNoticeCategoryChooserRow" + this.idSuffix}
@ -387,7 +398,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
} else { } else {
this.setState({ this.setState({
actionState: action, actionState: action,
downvoting: false, editing: false,
choosingCategory: isDownvotingCategory choosingCategory: isDownvotingCategory
}); });
} }
@ -401,33 +412,108 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
performAction(index: number, action?: SkipNoticeAction): void { performAction(index: number, action?: SkipNoticeAction): void {
switch (action ?? this.state.actionState) { switch (action ?? this.state.actionState) {
case SkipNoticeAction.None: case SkipNoticeAction.None:
this.SkipNoticeActionNone(index);
break; break;
case SkipNoticeAction.Upvote: case SkipNoticeAction.Upvote:
this.contentContainer().vote(1, this.segments[index].UUID, undefined, this); this.SkipNoticeActionUpvote(index);
break; break;
case SkipNoticeAction.Downvote: case SkipNoticeAction.Downvote:
this.contentContainer().vote(0, this.segments[index].UUID, undefined, this); this.SkipNoticeActionDownvote(index);
break; break;
case SkipNoticeAction.CategoryVote: case SkipNoticeAction.CategoryVote:
this.contentContainer().vote(undefined, this.segments[index].UUID, this.categoryOptionRef.current.value as Category, this) this.SkipNoticeActionCategoryVote(index);
break; break;
case SkipNoticeAction.CopyDownvote: case SkipNoticeAction.CopyDownvote:
this.copyDownvote(index); this.skipNoticeActionCopyDownvote(index);
break; break;
case SkipNoticeAction.Unskip: case SkipNoticeAction.Unskip:
this.state.skipButtonCallback(index); this.SkipNoticeActionUnskip(index);
break;
default:
this.setState({
actionState: SkipNoticeAction.None,
editing: false,
choosingCategory: false
});
break; break;
} }
}
SkipNoticeActionNone(index: number): void {
return;
}
SkipNoticeActionUpvote(index: number): void {
this.contentContainer().vote(1, this.segments[index].UUID, undefined, this);
this.segments[index].hidden = SponsorHideType.Visible; // This doesnt work D:
this.contentContainer().updatePreviewBar();
this.setState({ this.setState({
actionState: SkipNoticeAction.None, actionState: SkipNoticeAction.None,
downvoting: false, editing: false,
choosingCategory: false choosingCategory: false
}); });
} }
adjustDownvotingState(value: boolean): void { SkipNoticeActionDownvote(index: number): void {
this.contentContainer().vote(0, this.segments[index].UUID, undefined, this);
this.setState({ this.setState({
downvoting: value, actionState: SkipNoticeAction.None,
editing: false,
choosingCategory: false
});
}
SkipNoticeActionCategoryVote(index: number): void {
this.contentContainer().vote(undefined, this.segments[index].UUID, this.categoryOptionRef.current.value as Category, this)
this.setState({
actionState: SkipNoticeAction.None,
editing: false,
choosingCategory: false
});
}
skipNoticeActionCopyDownvote(index: number): void {
const sponsorVideoID = this.props.contentContainer().sponsorVideoID;
const sponsorTimesSubmitting : SponsorTime = {
segment: this.segments[index].segment,
UUID: null,
category: this.segments[index].category,
actionType: this.segments[index].actionType,
source: 2
};
let segmentTimes = Config.config.segmentTimes.get(sponsorVideoID) || [];
segmentTimes.push(sponsorTimesSubmitting);
Config.config.segmentTimes.set(sponsorVideoID, segmentTimes);
this.props.contentContainer().sponsorTimesSubmitting.push(sponsorTimesSubmitting);
this.props.contentContainer().updatePreviewBar();
this.props.contentContainer().resetSponsorSubmissionNotice();
this.props.contentContainer().updateEditButtonsOnPlayer();
this.contentContainer().vote(0, this.segments[index].UUID, undefined, this);
this.setState({
actionState: SkipNoticeAction.None,
editing: false,
choosingCategory: false
});
}
SkipNoticeActionUnskip(index: number): void {
this.state.skipButtonCallback(index);
this.setState({
actionState: SkipNoticeAction.None,
editing: false,
choosingCategory: false
});
}
adjustEditingState(value: boolean): void {
this.setState({
editing: value,
choosingCategory: false, choosingCategory: false,
actionState: SkipNoticeAction.None actionState: SkipNoticeAction.None
}); });
@ -436,7 +522,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
openCategoryChooser(): void { openCategoryChooser(): void {
this.setState({ this.setState({
choosingCategory: true, choosingCategory: true,
downvoting: false editing: false
}, () => { }, () => {
if (this.segments.length > 1) { if (this.segments.length > 1) {
// Use the action selectors as a submit button // Use the action selectors as a submit button
@ -445,6 +531,15 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
}); });
} }
continueVoting(): void {
this.setState({
actionState: SkipNoticeAction.None,
editing: false,
choosingCategory: false,
thanksForVotingText: null,
messages: []
});
}
getCategoryOptions(): React.ReactElement[] { getCategoryOptions(): React.ReactElement[] {
const elements = []; const elements = [];
@ -520,8 +615,14 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
this.addVoteButtonInfo(chrome.i18n.getMessage("voted")); this.addVoteButtonInfo(chrome.i18n.getMessage("voted"));
if (type === 0) { if (type === 0) {
this.setNoticeInfoMessage(chrome.i18n.getMessage("hitGoBack")); //this.setNoticeInfoMessage(chrome.i18n.getMessage("hitGoBack"));
this.adjustDownvotingState(false); const wikiLinkText = Config.config.wikiPages.get(segment.category);
this.setNoticeInfoMessageWithOnClick(() => window.open(wikiLinkText), chrome.i18n.getMessage("OpenCategoryWikiPage"));
this.setState({
editing: false,
choosingCategory: false,
actionState: SkipNoticeAction.None
});
} }
// Change the sponsor locally // Change the sponsor locally
@ -536,24 +637,6 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
} }
} }
copyDownvote(index: number): void {
const sponsorVideoID = this.props.contentContainer().sponsorVideoID;
const sponsorTimesSubmitting : SponsorTime = {
segment: this.segments[index].segment,
UUID: null,
category: this.segments[index].category,
actionType: this.segments[index].actionType,
source: 2
};
let segmentTimes = Config.config.segmentTimes.get(sponsorVideoID) || [];
segmentTimes.push(sponsorTimesSubmitting);
Config.config.segmentTimes.set(sponsorVideoID, segmentTimes);
this.props.contentContainer().sponsorTimesSubmitting.push(sponsorTimesSubmitting);
this.props.contentContainer().updatePreviewBar();
this.props.contentContainer().resetSponsorSubmissionNotice();
this.props.contentContainer().updateEditButtonsOnPlayer();
}
setNoticeInfoMessageWithOnClick(onClick: (event: React.MouseEvent) => unknown, ...messages: string[]): void { setNoticeInfoMessageWithOnClick(onClick: (event: React.MouseEvent) => unknown, ...messages: string[]): void {
this.setState({ this.setState({
messages, messages,

View file

@ -43,7 +43,8 @@ interface SBConfig {
showDonationLink: boolean, showDonationLink: boolean,
autoHideInfoButton: boolean, autoHideInfoButton: boolean,
autoSkipOnMusicVideos: boolean, autoSkipOnMusicVideos: boolean,
highlightCategoryUpdate: boolean highlightCategoryUpdate: boolean,
wikiPages: SBMap<string, string>
// What categories should be skipped // What categories should be skipped
categorySelections: CategorySelection[], categorySelections: CategorySelection[],
@ -120,14 +121,6 @@ class SBMap<T, U> extends Map {
this.update(); this.update();
return result; return result;
} }
addArray(key: T, value: U) {
// Expand an array by value
let result = super.get(key).concat(value);
this.set(key, result);
this.update();
return result;
}
delete(key) { delete(key) {
const result = super.delete(key); const result = super.delete(key);
@ -205,6 +198,19 @@ const Config: SBObject = {
option: CategorySkipOption.AutoSkip option: CategorySkipOption.AutoSkip
}], }],
wikiPages: new SBMap("wikiLinks", [
["sponsor", "https://wiki.sponsor.ajay.app/w/Sponsor"],
["selfpromo", "https://wiki.sponsor.ajay.app/w/Unpaid/Self_Promotion"],
["interaction", "https://wiki.sponsor.ajay.app/w/Interaction_Reminder_(Subscribe)"],
["intro", "https://wiki.sponsor.ajay.app/w/Intermission/Intro_Animation"],
["outro", "https://wiki.sponsor.ajay.app/w/Endcards/Credits"],
["preview", "https://wiki.sponsor.ajay.app/w/Preview/Recap"],
["music_offtopic", "https://wiki.sponsor.ajay.app/w/Music:_Non-Music_Section"],
["highlight_poi", "https://wiki.sponsor.ajay.app/w/Highlight"],
["guidelines", "https://wiki.sponsor.ajay.app/w/Guidelines"],
["mute", "https://wiki.sponsor.ajay.app/w/Mute_Segment"],
]),
// Preview bar // Preview bar
barTypes: { barTypes: {
"preview-chooseACategory": { "preview-chooseACategory": {