Add UI for submitting mute segments and request mute segments

This commit is contained in:
Ajay Ramachandran
2021-09-01 16:30:17 -04:00
parent 3774ef9756
commit 34cfd14e74
6 changed files with 53 additions and 8 deletions

View File

@@ -302,6 +302,9 @@
"skip": { "skip": {
"message": "Skip" "message": "Skip"
}, },
"mute": {
"message": "Mute"
},
"skip_category": { "skip_category": {
"message": "Skip {0}?" "message": "Skip {0}?"
}, },

View File

@@ -467,7 +467,7 @@ input::-webkit-inner-spin-button {
text-decoration: underline; text-decoration: underline;
} }
.sponsorTimeCategories { .sponsorTimeEditSelector {
margin-top: 5px; margin-top: 5px;
margin-bottom: 5px; margin-bottom: 5px;

View File

@@ -1,12 +1,12 @@
import * as React from "react"; import * as React from "react";
import Config from "../config";
import * as CompileConfig from "../../config.json"; import * as CompileConfig from "../../config.json";
import Config from "../config";
import { ActionType, ActionTypes, Category, CategoryActionType, ContentContainer, SponsorTime } from "../types";
import Utils from "../utils"; import Utils from "../utils";
import { Category, CategoryActionType, ContentContainer, SponsorTime } from "../types";
import SubmissionNoticeComponent from "./SubmissionNoticeComponent";
import { getCategoryActionType } from "../utils/categoryUtils"; import { getCategoryActionType } from "../utils/categoryUtils";
import SubmissionNoticeComponent from "./SubmissionNoticeComponent";
const utils = new Utils(); const utils = new Utils();
export interface SponsorTimeEditProps { export interface SponsorTimeEditProps {
@@ -32,6 +32,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
idSuffix: string; idSuffix: string;
categoryOptionRef: React.RefObject<HTMLSelectElement>; categoryOptionRef: React.RefObject<HTMLSelectElement>;
actionTypeOptionRef: React.RefObject<HTMLSelectElement>;
configUpdateListener: () => void; configUpdateListener: () => void;
@@ -39,6 +40,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
super(props); super(props);
this.categoryOptionRef = React.createRef(); this.categoryOptionRef = React.createRef();
this.actionTypeOptionRef = React.createRef();
this.idSuffix = this.props.idSuffix; this.idSuffix = this.props.idSuffix;
@@ -171,7 +173,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
{/* Category */} {/* Category */}
<div style={{position: "relative"}}> <div style={{position: "relative"}}>
<select id={"sponsorTimeCategories" + this.idSuffix} <select id={"sponsorTimeCategories" + this.idSuffix}
className="sponsorTimeCategories" className="sponsorTimeEditSelector sponsorTimeCategories"
defaultValue={sponsorTime.category} defaultValue={sponsorTime.category}
ref={this.categoryOptionRef} ref={this.categoryOptionRef}
onChange={this.categorySelectionChange.bind(this)}> onChange={this.categorySelectionChange.bind(this)}>
@@ -188,6 +190,17 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
</a> </a>
</div> </div>
{/* Action Type */}
<div style={{position: "relative"}}>
<select id={"sponsorTimeActionTypes" + this.idSuffix}
className="sponsorTimeEditSelector sponsorTimeActionTypes"
defaultValue={sponsorTime.actionType}
ref={this.actionTypeOptionRef}
onChange={() => this.saveEditTimes()}>
{this.getActionTypeOptions()}
</select>
</div>
<br/> <br/>
{/* Editing Tools */} {/* Editing Tools */}
@@ -269,6 +282,21 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
this.saveEditTimes(); this.saveEditTimes();
} }
getActionTypeOptions(): React.ReactElement[] {
const elements = [];
for (const actionType of ActionTypes) {
elements.push(
<option value={actionType}
key={actionType}>
{chrome.i18n.getMessage(actionType)}
</option>
);
}
return elements;
}
setTimeToNow(index: number): void { setTimeToNow(index: number): void {
this.setTimeTo(index, this.props.contentContainer().getRealCurrentTime()); this.setTimeTo(index, this.props.contentContainer().getRealCurrentTime());
} }
@@ -331,6 +359,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
} }
sponsorTimesSubmitting[this.props.index].category = this.categoryOptionRef.current.value as Category; sponsorTimesSubmitting[this.props.index].category = this.categoryOptionRef.current.value as Category;
sponsorTimesSubmitting[this.props.index].actionType = this.actionTypeOptionRef.current.value as ActionType;
Config.config.segmentTimes.set(this.props.contentContainer().sponsorVideoID, sponsorTimesSubmitting); Config.config.segmentTimes.set(this.props.contentContainer().sponsorVideoID, sponsorTimesSubmitting);

View File

@@ -17,6 +17,7 @@ interface SBConfig {
submissionCountSinceCategories: number, // New count used to show the "Read The Guidelines!!" message submissionCountSinceCategories: number, // New count used to show the "Read The Guidelines!!" message
showTimeWithSkips: boolean, showTimeWithSkips: boolean,
disableSkipping: boolean, disableSkipping: boolean,
muteSegments: boolean,
trackViewCount: boolean, trackViewCount: boolean,
trackViewCountInPrivate: boolean, trackViewCountInPrivate: boolean,
dontShowNotice: boolean, dontShowNotice: boolean,
@@ -162,6 +163,7 @@ const Config: SBObject = {
submissionCountSinceCategories: 0, submissionCountSinceCategories: 0,
showTimeWithSkips: true, showTimeWithSkips: true,
disableSkipping: false, disableSkipping: false,
muteSegments: true,
trackViewCount: true, trackViewCount: true,
trackViewCountInPrivate: true, trackViewCountInPrivate: true,
dontShowNotice: false, dontShowNotice: false,

View File

@@ -1,5 +1,5 @@
import Config from "./config"; import Config from "./config";
import { SponsorTime, CategorySkipOption, VideoID, SponsorHideType, VideoInfo, StorageChangesObject, CategoryActionType, ChannelIDInfo, ChannelIDStatus, SponsorSourceType, SegmentUUID, Category, SkipToTimeParams, ToggleSkippable } from "./types"; import { SponsorTime, CategorySkipOption, VideoID, SponsorHideType, VideoInfo, StorageChangesObject, CategoryActionType, ChannelIDInfo, ChannelIDStatus, SponsorSourceType, SegmentUUID, Category, SkipToTimeParams, ToggleSkippable, ActionType } from "./types";
import { ContentContainer } from "./types"; import { ContentContainer } from "./types";
import Utils from "./utils"; import Utils from "./utils";
@@ -644,6 +644,7 @@ async function sponsorsLookup(id: string, keepOldSubmissions = true) {
const hashPrefix = (await utils.getHash(id, 1)).substr(0, 4); const hashPrefix = (await utils.getHash(id, 1)).substr(0, 4);
const response = await utils.asyncRequestToServer('GET', "/api/skipSegments/" + hashPrefix, { const response = await utils.asyncRequestToServer('GET', "/api/skipSegments/" + hashPrefix, {
categories, categories,
actionTypes: Config.config.muteSegments ? [ActionType.Skip, ActionType.Mute] : [ActionType.Skip],
userAgent: `${chrome.runtime.id}` userAgent: `${chrome.runtime.id}`
}); });
@@ -1333,6 +1334,7 @@ function startOrEndTimingNewSegment() {
segment: [getRealCurrentTime()], segment: [getRealCurrentTime()],
UUID: null, UUID: null,
category: Config.config.defaultCategory, category: Config.config.defaultCategory,
actionType: ActionType.Skip,
source: SponsorSourceType.Local source: SponsorSourceType.Local
}); });
} else { } else {
@@ -1389,6 +1391,7 @@ function updateSponsorTimesSubmitting(getFromConfig = true) {
segment: segmentTime.segment, segment: segmentTime.segment,
UUID: segmentTime.UUID, UUID: segmentTime.UUID,
category: segmentTime.category, category: segmentTime.category,
actionType: segmentTime.actionType,
source: segmentTime.source source: segmentTime.source
}); });
} }

View File

@@ -56,6 +56,13 @@ export enum CategoryActionType {
POI = "_POI" POI = "_POI"
} }
export enum ActionType {
Skip = "skip",
Mute = "mute"
}
export const ActionTypes = [ActionType.Skip, ActionType.Mute];
export type SegmentUUID = string & { __segmentUUIDBrand: unknown }; export type SegmentUUID = string & { __segmentUUIDBrand: unknown };
export type Category = string & { __categoryBrand: unknown }; export type Category = string & { __categoryBrand: unknown };
@@ -69,6 +76,7 @@ export interface SponsorTime {
UUID: SegmentUUID; UUID: SegmentUUID;
category: Category; category: Category;
actionType: ActionType;
hidden?: SponsorHideType; hidden?: SponsorHideType;
source?: SponsorSourceType; source?: SponsorSourceType;