mirror of
https://github.com/ajayyy/SponsorBlock.git
synced 2025-12-14 15:37:12 +03:00
Merge branch 'master' into loop-chapters
This commit is contained in:
@@ -13,5 +13,8 @@
|
||||
},
|
||||
"browser_action": {
|
||||
"default_area": "navbar"
|
||||
}
|
||||
},
|
||||
"permissions": [
|
||||
"unlimitedStorage"
|
||||
]
|
||||
}
|
||||
|
||||
Submodule maze-utils updated: e2f19e21c2...2c6822ec85
4291
package-lock.json
generated
4291
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -38,7 +38,7 @@
|
||||
"ts-loader": "^9.4.2",
|
||||
"ts-node": "^10.9.1",
|
||||
"typescript": "4.9",
|
||||
"web-ext": "^8.2.0",
|
||||
"web-ext": "^8.9.0",
|
||||
"webpack": "^5.94.0",
|
||||
"webpack-cli": "^4.10.0",
|
||||
"webpack-merge": "^5.8.0"
|
||||
|
||||
Submodule public/_locales updated: c9dcf1ec21...0285b87951
@@ -116,14 +116,26 @@ html, body {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.option-group > div {
|
||||
.option-group > div, .extraOptionGroup {
|
||||
min-height: 50px;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
border-image: linear-gradient(to right, var(--border-color), #00000000 80%) 1;
|
||||
}
|
||||
.option-group > div {
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
.extraOptionGroup {
|
||||
border-top: 1px solid var(--border-color);
|
||||
}
|
||||
.extraOptionGroup tr:not(:last-child) {
|
||||
padding-bottom: 15px;
|
||||
display: block;
|
||||
}
|
||||
#category-type {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.categoryExtraOptions {
|
||||
.categoryChooserTable .categoryExtraOptions {
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
@@ -364,6 +376,11 @@ input[type='number'] {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.sb-number-input {
|
||||
margin-left: 4px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.switch-label {
|
||||
width: inherit;
|
||||
}
|
||||
@@ -745,3 +762,39 @@ svg {
|
||||
margin-bottom: 10px;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.categoryChooserTopRow {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.partiallyHidden {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.partiallyHidden:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.reset-button svg {
|
||||
margin-left: 5px;
|
||||
width: 10px;
|
||||
fill: var(--white);
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.skipProfileMenu {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.configurationInfo > *:not(:last-child) {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.configurationInfo .option-text-box {
|
||||
width: 100%;
|
||||
}
|
||||
@@ -80,66 +80,6 @@
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div data-type="toggle" data-sync="muteSegments">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
<input id="muteSegments" type="checkbox" checked>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<label class="switch-label" for="muteSegments">
|
||||
__MSG_muteSegments__
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-type="toggle" data-sync="fullVideoSegments" class="no-bottom-border">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
<input id="fullVideoSegments" type="checkbox" checked>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<label class="switch-label" for="fullVideoSegments">
|
||||
__MSG_fullVideoSegments__
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-type="toggle" data-sync="fullVideoLabelsOnThumbnails"
|
||||
data-dependent-on="fullVideoSegments">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
<input id="fullVideoLabelsOnThumbnails" type="checkbox" checked>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<label class="switch-label" for="fullVideoLabelsOnThumbnails">
|
||||
__MSG_fullVideoLabelsOnThumbnails__
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-type="number-change" data-sync="minDuration">
|
||||
<label class="number-container">
|
||||
<span class="optionLabel">__MSG_minDuration__</span>
|
||||
<input type="number" step="0.1" min="0">
|
||||
</label>
|
||||
|
||||
<div class="small-description">__MSG_minDurationDescription__</div>
|
||||
</div>
|
||||
|
||||
<div data-type="toggle" data-sync="manualSkipOnFullVideo">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
<input id="manualSkipOnFullVideo" type="checkbox" checked>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<label class="switch-label" for="manualSkipOnFullVideo">
|
||||
__MSG_enableManualSkipOnFullVideo__
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="small-description">__MSG_whatManualSkipOnFullVideo__</div>
|
||||
</div>
|
||||
|
||||
<div data-type="react-AdvancedSkipOptionsComponent"></div>
|
||||
|
||||
<div data-type="toggle" data-sync="forceChannelCheck">
|
||||
|
||||
@@ -298,8 +298,8 @@
|
||||
border-radius: 8px;
|
||||
background-color: var(--sb-grey-bg-color);
|
||||
justify-content: space-evenly;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
.sbControlsMenu-item {
|
||||
display: flex;
|
||||
@@ -649,3 +649,61 @@
|
||||
width: 16px;
|
||||
fill: var(--sb-main-fg-color);
|
||||
}
|
||||
|
||||
#skipProfileMenu {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
left: 50%;
|
||||
|
||||
background-color: #292828;
|
||||
border-radius: 10px;
|
||||
padding: 10px;
|
||||
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
#skipProfileActions {
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.skipOptionAction {
|
||||
transition: border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
|
||||
font-size: 14px;
|
||||
padding: 5px;
|
||||
margin: 5px;
|
||||
|
||||
background-color: #222;
|
||||
border-radius: 5px;
|
||||
|
||||
cursor: help;
|
||||
user-select: none;
|
||||
|
||||
border-color: transparent;
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
}
|
||||
.skipOptionAction:not(.highlighted, .disabled):hover {
|
||||
background-color: var(--sb-grey-bg-color);
|
||||
}
|
||||
.skipOptionAction.selected {
|
||||
border-color: var(--sb-red-bg-color);
|
||||
}
|
||||
.skipOptionAction.highlighted {
|
||||
border-color: rgb(127, 0, 0);
|
||||
}
|
||||
.skipOptionAction:not(.highlighted, .disabled) {
|
||||
cursor: pointer;
|
||||
}
|
||||
.skipOptionAction.disabled {
|
||||
color: #808080
|
||||
}
|
||||
|
||||
.optionsSelector {
|
||||
background-color: #c00000;
|
||||
color: white;
|
||||
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
padding: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
@@ -3,7 +3,7 @@ import * as CompileConfig from "../config.json";
|
||||
import Config from "./config";
|
||||
import { Registration } from "./types";
|
||||
import "content-scripts-register-polyfill";
|
||||
import { sendRealRequestToCustomServer, setupBackgroundRequestProxy } from "../maze-utils/src/background-request-proxy";
|
||||
import { sendRealRequestToCustomServer, serializeOrStringify, setupBackgroundRequestProxy } from "../maze-utils/src/background-request-proxy";
|
||||
import { setupTabUpdates } from "../maze-utils/src/tab-updates";
|
||||
import { generateUserID } from "../maze-utils/src/setup";
|
||||
|
||||
@@ -228,32 +228,15 @@ async function submitVote(type: number, UUID: string, category: string, videoID:
|
||||
try {
|
||||
const response = await asyncRequestToServer("POST", "/api/voteOnSponsorTime?UUID=" + UUID + "&videoID=" + videoID + "&userID=" + userID + typeSection);
|
||||
|
||||
if (response.ok) {
|
||||
return {
|
||||
successType: 1,
|
||||
responseText: await response.text()
|
||||
};
|
||||
} else if (response.status == 405) {
|
||||
//duplicate vote
|
||||
return {
|
||||
successType: 0,
|
||||
statusCode: response.status,
|
||||
responseText: await response.text()
|
||||
};
|
||||
} else {
|
||||
//error while connect
|
||||
return {
|
||||
successType: -1,
|
||||
statusCode: response.status,
|
||||
responseText: await response.text()
|
||||
};
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
return {
|
||||
successType: -1,
|
||||
statusCode: -1,
|
||||
responseText: ""
|
||||
status: response.status,
|
||||
ok: response.ok,
|
||||
responseText: await response.text(),
|
||||
};
|
||||
} catch (e) {
|
||||
console.error("Error while voting:", e);
|
||||
return {
|
||||
error: serializeOrStringify(e),
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,7 +8,8 @@ import { downvoteButtonColor, SkipNoticeAction } from "../utils/noticeUtils";
|
||||
import { VoteResponse } from "../messageTypes";
|
||||
import { AnimationUtils } from "../../maze-utils/src/animationUtils";
|
||||
import { Tooltip } from "../render/Tooltip";
|
||||
import { getErrorMessage } from "../../maze-utils/src/formating";
|
||||
import { formatJSErrorMessage, getLongErrorMessage } from "../../maze-utils/src/formating";
|
||||
import { logRequest } from "../../maze-utils/src/background-request-proxy";
|
||||
|
||||
export interface CategoryPillProps {
|
||||
vote: (type: number, UUID: SegmentUUID, category?: Category) => Promise<VoteResponse>;
|
||||
@@ -127,15 +128,19 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
|
||||
const response = await this.props.vote(type, this.state.segment.UUID);
|
||||
await stopAnimation();
|
||||
|
||||
if (response.successType == 1 || (response.successType == -1 && response.statusCode == 429)) {
|
||||
if ("error" in response) {
|
||||
console.error("[SB] Caught error while attempting to vote on a FV label", response.error);
|
||||
alert(formatJSErrorMessage(response.error));
|
||||
} else if (response.ok || response.status === 429) {
|
||||
this.setState({
|
||||
open: false,
|
||||
show: type === 1
|
||||
});
|
||||
|
||||
this.closeTooltip();
|
||||
} else if (response.statusCode !== 403) {
|
||||
alert(getErrorMessage(response.statusCode, response.responseText));
|
||||
} else if (response.status !== 403) {
|
||||
logRequest({headers: null, ...response}, "SB", "vote on FV label");
|
||||
alert(getLongErrorMessage(response.status, response.responseText));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,7 +8,8 @@ import { downvoteButtonColor, SkipNoticeAction } from "../utils/noticeUtils";
|
||||
import { VoteResponse } from "../messageTypes";
|
||||
import { AnimationUtils } from "../../maze-utils/src/animationUtils";
|
||||
import { Tooltip } from "../render/Tooltip";
|
||||
import { getErrorMessage } from "../../maze-utils/src/formating";
|
||||
import { formatJSErrorMessage, getLongErrorMessage } from "../../maze-utils/src/formating";
|
||||
import { logRequest } from "../../maze-utils/src/background-request-proxy";
|
||||
|
||||
export interface ChapterVoteProps {
|
||||
vote: (type: number, UUID: SegmentUUID, category?: Category) => Promise<VoteResponse>;
|
||||
@@ -119,12 +120,16 @@ class ChapterVoteComponent extends React.Component<ChapterVoteProps, ChapterVote
|
||||
const response = await this.props.vote(type, this.state.segment.UUID);
|
||||
await stopAnimation();
|
||||
|
||||
if (response.successType == 1 || (response.successType == -1 && response.statusCode == 429)) {
|
||||
if ("error" in response){
|
||||
console.error("[SB] Caught error while attempting to vote on a chapter", response.error);
|
||||
alert(formatJSErrorMessage(response.error));
|
||||
} else if (response.ok || response.status == 429) {
|
||||
this.setState({
|
||||
show: type === 1
|
||||
});
|
||||
} else if (response.statusCode !== 403) {
|
||||
alert(getErrorMessage(response.statusCode, response.responseText));
|
||||
} else if (response.status !== 403) {
|
||||
logRequest({headers: null, ...response}, "SB", "vote on chapter");
|
||||
alert(getLongErrorMessage(response.status, response.responseText));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -12,6 +12,7 @@ import { defaultPreviewTime } from "../utils/constants";
|
||||
import { getVideo, getVideoDuration } from "../../maze-utils/src/video";
|
||||
import { AnimationUtils } from "../../maze-utils/src/animationUtils";
|
||||
import { Tooltip } from "../render/Tooltip";
|
||||
import { logRequest } from "../../maze-utils/src/background-request-proxy";
|
||||
|
||||
export interface SponsorTimeEditProps {
|
||||
index: number;
|
||||
@@ -781,23 +782,26 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
|
||||
if (this.props.contentContainer().channelIDInfo.status !== ChannelIDStatus.Found) return;
|
||||
|
||||
this.fetchingSuggestions = true;
|
||||
const result = await asyncRequestToServer("GET", "/api/chapterNames", {
|
||||
description,
|
||||
channelID: this.props.contentContainer().channelIDInfo.id
|
||||
});
|
||||
|
||||
if (result.ok) {
|
||||
try {
|
||||
try {
|
||||
const result = await asyncRequestToServer("GET", "/api/chapterNames", {
|
||||
description,
|
||||
channelID: this.props.contentContainer().channelIDInfo.id
|
||||
});
|
||||
if (result.ok) {
|
||||
const names = JSON.parse(result.responseText) as {description: string}[];
|
||||
this.setState({
|
||||
suggestedNames: names.map(n => ({
|
||||
label: n.description
|
||||
}))
|
||||
});
|
||||
} catch (e) {} //eslint-disable-line no-empty
|
||||
} else if (result.status !== 404) {
|
||||
logRequest(result, "SB", "chapter suggestion")
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn("[SB] Caught error while fetching chapter suggestions", e);
|
||||
} finally {
|
||||
this.fetchingSuggestions = false;
|
||||
}
|
||||
|
||||
this.fetchingSuggestions = false;
|
||||
}
|
||||
|
||||
configUpdate(): void {
|
||||
|
||||
@@ -1,30 +1,160 @@
|
||||
import * as React from "react";
|
||||
|
||||
import * as CompileConfig from "../../../config.json";
|
||||
import { Category } from "../../types";
|
||||
import CategorySkipOptionsComponent from "./CategorySkipOptionsComponent";
|
||||
import { Category, CategorySelection, CategorySkipOption } from "../../types";
|
||||
import { CategorySkipOptionsComponent, ExtraOptionComponent, ToggleOption } from "./CategorySkipOptionsComponent";
|
||||
import { SelectOptionComponent } from "./SelectOptionComponent";
|
||||
import Config, { ConfigurationID, CustomConfiguration } from "../../config";
|
||||
import { generateUserID } from "../../../maze-utils/src/setup";
|
||||
|
||||
export interface CategoryChooserProps {
|
||||
let forceUpdateSkipProfilesTimeout: NodeJS.Timeout | null = null;
|
||||
let forceUpdateSkipProfileIDsTimeout: NodeJS.Timeout | null = null;
|
||||
|
||||
}
|
||||
export function CategoryChooserComponent() {
|
||||
const [configurations, setConfigurations] = React.useState(Config.local!.skipProfiles);
|
||||
const [selectedConfigurationID, setSelectedConfigurationID] = React.useState<ConfigurationID | null>(null);
|
||||
const [channelListText, setChannelListText] = React.useState("");
|
||||
|
||||
export interface CategoryChooserState {
|
||||
const [configurationName, setConfigurationName] = React.useState("");
|
||||
const [selections, setSelections] = React.useState<CategorySelection[]>([]);
|
||||
|
||||
}
|
||||
React.useEffect(() => {
|
||||
setConfigurationName(getConfigurationValue(selectedConfigurationID, "name", ""));
|
||||
|
||||
class CategoryChooserComponent extends React.Component<CategoryChooserProps, CategoryChooserState> {
|
||||
|
||||
constructor(props: CategoryChooserProps) {
|
||||
super(props);
|
||||
|
||||
// Setup state
|
||||
this.state = {
|
||||
updateChannelList(setChannelListText, selectedConfigurationID!);
|
||||
setSelections(getConfigurationValue<CategorySelection[]>(selectedConfigurationID, "categorySelections"));
|
||||
}, [selectedConfigurationID]);
|
||||
|
||||
const createNewConfig = () => {
|
||||
let newID = generateUserID().substring(0, 5);
|
||||
while (Config.local.skipProfiles[newID]) {
|
||||
newID = generateUserID().substring(0, 5);
|
||||
}
|
||||
}
|
||||
|
||||
render(): React.ReactElement {
|
||||
return (
|
||||
const newConfiguration: CustomConfiguration = {
|
||||
name: `${chrome.i18n.getMessage("NewConfiguration")} ${Object.keys(Config.local.skipProfiles).length}`,
|
||||
categorySelections: [],
|
||||
showAutogeneratedChapters: null,
|
||||
autoSkipOnMusicVideos: null,
|
||||
skipNonMusicOnlyOnYoutubeMusic: null,
|
||||
muteSegments: null,
|
||||
fullVideoSegments: null,
|
||||
manualSkipOnFullVideo: null,
|
||||
minDuration: null
|
||||
};
|
||||
|
||||
Config.local!.skipProfiles[newID] = newConfiguration;
|
||||
forceUpdateConfigurations();
|
||||
setConfigurations(Config.local!.skipProfiles);
|
||||
setSelectedConfigurationID(newID as ConfigurationID);
|
||||
|
||||
updateChannelList(setChannelListText, newID as ConfigurationID);
|
||||
};
|
||||
React.useEffect(() => {
|
||||
if (window.location.hash === "#newProfile") {
|
||||
createNewConfig();
|
||||
}
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="categoryChooserTopRow">
|
||||
<SelectOptionComponent
|
||||
id="channelProfiles"
|
||||
onChange={(value) => {
|
||||
if (value === "null") value = null;
|
||||
|
||||
setSelectedConfigurationID(value as ConfigurationID);
|
||||
updateChannelList(setChannelListText, value as ConfigurationID);
|
||||
}}
|
||||
value={selectedConfigurationID!}
|
||||
options={[{
|
||||
value: "null",
|
||||
label: chrome.i18n.getMessage("DefaultConfiguration")
|
||||
}].concat(Object.entries(configurations).map(([key, value]) => ({
|
||||
value: key,
|
||||
label: value.name
|
||||
})))}
|
||||
/>
|
||||
|
||||
<div
|
||||
className="option-button trigger-button"
|
||||
onClick={() => createNewConfig()}>
|
||||
{chrome.i18n.getMessage("NewConfiguration")}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{
|
||||
selectedConfigurationID &&
|
||||
<div className="configurationInfo">
|
||||
<input
|
||||
type="text"
|
||||
id="configurationName"
|
||||
value={configurationName}
|
||||
placeholder={chrome.i18n.getMessage("ConfigurationName")}
|
||||
onChange={(e) => {
|
||||
const newName = e.target.value;
|
||||
getConfig(selectedConfigurationID)!.name = newName;
|
||||
setConfigurationName(newName);
|
||||
|
||||
forceUpdateConfigurations();
|
||||
setConfigurations(Config.local!.skipProfiles);
|
||||
}}/>
|
||||
|
||||
<div>
|
||||
{chrome.i18n.getMessage("ChannelListInstructionsSB")}
|
||||
</div>
|
||||
|
||||
<textarea
|
||||
className="option-text-box"
|
||||
rows={10}
|
||||
value={channelListText}
|
||||
onChange={(e) => {
|
||||
const newText = e.target.value;
|
||||
setChannelListText(newText);
|
||||
|
||||
const channels = newText.split("\n").map((channel) => channel.trim()).filter((channel) => channel !== "");
|
||||
if (channels.length > 0) {
|
||||
for (const [channelID, id] of Object.entries(Config.local!.channelSkipProfileIDs)) {
|
||||
if (id === selectedConfigurationID) {
|
||||
if (!channels.includes(channelID)) {
|
||||
delete Config.local!.channelSkipProfileIDs[channelID];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for (const channel of channels) {
|
||||
Config.local!.channelSkipProfileIDs[channel] = selectedConfigurationID;
|
||||
}
|
||||
}
|
||||
|
||||
forceUpdateConfigurationIDs();
|
||||
}}/>
|
||||
|
||||
<div
|
||||
className="option-button trigger-button"
|
||||
onClick={() => {
|
||||
if (confirm(chrome.i18n.getMessage("areYouSureDeleteConfig"))) {
|
||||
delete Config.local.skipProfiles[selectedConfigurationID];
|
||||
forceUpdateConfigurations();
|
||||
|
||||
for (const [channelID, id] of Object.entries(Config.local.channelSkipProfileIDs)) {
|
||||
if (id === selectedConfigurationID) {
|
||||
delete Config.local.channelSkipProfileIDs[channelID];
|
||||
}
|
||||
}
|
||||
forceUpdateConfigurationIDs();
|
||||
|
||||
setConfigurations(Config.local!.skipProfiles);
|
||||
const newID = Object.keys(Config.local!.skipProfiles)[0] as ConfigurationID;
|
||||
setSelectedConfigurationID(newID);
|
||||
}
|
||||
}}>
|
||||
{chrome.i18n.getMessage("DeleteConfiguration")}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<table id="categoryChooserTable"
|
||||
className="categoryChooserTable">
|
||||
<tbody>
|
||||
@@ -51,25 +181,170 @@ class CategoryChooserComponent extends React.Component<CategoryChooserProps, Cat
|
||||
</th>
|
||||
</tr>
|
||||
|
||||
{this.getCategorySkipOptions()}
|
||||
<CategorySkipOptions
|
||||
selectedConfigurationID={selectedConfigurationID}
|
||||
selections={selections}
|
||||
setSelections={setSelections}
|
||||
/>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<ExtraOptionsComponent
|
||||
selectedConfigurationID={selectedConfigurationID!}/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function CategorySkipOptions({ selectedConfigurationID, selections, setSelections}: { selectedConfigurationID: ConfigurationID | null;
|
||||
selections: CategorySelection[]; setSelections: (s: CategorySelection[]) => void; }): JSX.Element {
|
||||
const elements: JSX.Element[] = [];
|
||||
const defaultSkipOption = selectedConfigurationID === null ? CategorySkipOption.Disabled : CategorySkipOption.FallbackToDefault;
|
||||
|
||||
for (const category of CompileConfig.categoryList) {
|
||||
elements.push(
|
||||
<CategorySkipOptionsComponent
|
||||
category={category as Category}
|
||||
selection={selections.find(selection => selection.name === category)?.option ?? defaultSkipOption}
|
||||
updateSelection={(option: CategorySkipOption) => {
|
||||
const existingSelection = selections.find(selection => selection.name === category);
|
||||
const deletingSelection = (option === CategorySkipOption.Disabled && selectedConfigurationID === null)
|
||||
|| (option === CategorySkipOption.FallbackToDefault && selectedConfigurationID !== null);
|
||||
if (existingSelection) {
|
||||
existingSelection.option = option;
|
||||
|
||||
if (deletingSelection) {
|
||||
selections.splice(selections.indexOf(existingSelection), 1);
|
||||
}
|
||||
} else if (!deletingSelection) {
|
||||
selections.push({
|
||||
name: category as Category,
|
||||
option: option
|
||||
});
|
||||
}
|
||||
|
||||
// Clone so React notices the change
|
||||
selections = [...selections];
|
||||
|
||||
updateConfigurationValue(selectedConfigurationID, "categorySelections", selections, setSelections);
|
||||
}}
|
||||
isDefaultConfig={selectedConfigurationID === null}
|
||||
selectedConfigurationID={selectedConfigurationID}
|
||||
key={category}>
|
||||
</CategorySkipOptionsComponent>
|
||||
);
|
||||
}
|
||||
|
||||
getCategorySkipOptions(): JSX.Element[] {
|
||||
const elements: JSX.Element[] = [];
|
||||
return <>
|
||||
{elements}
|
||||
</>;
|
||||
}
|
||||
|
||||
for (const category of CompileConfig.categoryList) {
|
||||
elements.push(
|
||||
<CategorySkipOptionsComponent category={category as Category}
|
||||
key={category}>
|
||||
</CategorySkipOptionsComponent>
|
||||
);
|
||||
function forceUpdateConfigurations() {
|
||||
if (forceUpdateSkipProfilesTimeout) {
|
||||
clearTimeout(forceUpdateSkipProfilesTimeout);
|
||||
}
|
||||
|
||||
forceUpdateSkipProfilesTimeout = setTimeout(() => {
|
||||
Config.forceLocalUpdate("skipProfiles");
|
||||
}, 50);
|
||||
}
|
||||
|
||||
function forceUpdateConfigurationIDs() {
|
||||
if (forceUpdateSkipProfileIDsTimeout) {
|
||||
clearTimeout(forceUpdateSkipProfileIDsTimeout);
|
||||
}
|
||||
|
||||
forceUpdateSkipProfileIDsTimeout = setTimeout(() => {
|
||||
Config.forceLocalUpdate("channelSkipProfileIDs");
|
||||
}, 50);
|
||||
}
|
||||
|
||||
function updateChannelList(setChannelListText: (value: string) => void, selectedConfigurationID: ConfigurationID) {
|
||||
setChannelListText(Object.entries(Config.local!.channelSkipProfileIDs)
|
||||
.filter(([, id]) => id === selectedConfigurationID)
|
||||
.map(([channelID]) => channelID).join("\n"))
|
||||
}
|
||||
|
||||
function getConfig(selectedConfigurationID: ConfigurationID | null) {
|
||||
return selectedConfigurationID ? Config.local!.skipProfiles[selectedConfigurationID] : null;
|
||||
}
|
||||
|
||||
export function getConfigurationValue<T>(selectedConfigurationID: ConfigurationID | null, option: string, defaultValue?: T): T {
|
||||
if (selectedConfigurationID === null) {
|
||||
if (defaultValue !== undefined) {
|
||||
return defaultValue;
|
||||
} else {
|
||||
return Config.config[option];
|
||||
}
|
||||
|
||||
return elements;
|
||||
} else {
|
||||
return getConfig(selectedConfigurationID)[option];
|
||||
}
|
||||
}
|
||||
|
||||
export default CategoryChooserComponent;
|
||||
export function updateConfigurationValue(selectedConfigurationID: ConfigurationID | null, option: string, value: unknown, setFunction?: (value: unknown) => void) {
|
||||
if (selectedConfigurationID === null) {
|
||||
Config.config[option] = value;
|
||||
} else {
|
||||
const config = getConfig(selectedConfigurationID);
|
||||
if (value !== null) {
|
||||
config[option] = value;
|
||||
} else {
|
||||
delete config[option];
|
||||
}
|
||||
|
||||
forceUpdateConfigurations();
|
||||
}
|
||||
|
||||
if (setFunction) setFunction(value);
|
||||
}
|
||||
|
||||
function ExtraOptionsComponent(props: {selectedConfigurationID: ConfigurationID}): JSX.Element {
|
||||
const options: ToggleOption[][] = [[{
|
||||
configKey: "muteSegments",
|
||||
label: chrome.i18n.getMessage("muteSegments"),
|
||||
type: "toggle"
|
||||
}], [{
|
||||
configKey: "fullVideoSegments",
|
||||
label: chrome.i18n.getMessage("fullVideoSegments"),
|
||||
type: "toggle"
|
||||
}, {
|
||||
configKey: "fullVideoLabelsOnThumbnails",
|
||||
label: chrome.i18n.getMessage("fullVideoLabelsOnThumbnails"),
|
||||
type: "toggle",
|
||||
dontShowOnCustomConfigs: true
|
||||
}, {
|
||||
configKey: "manualSkipOnFullVideo",
|
||||
label: chrome.i18n.getMessage("enableManualSkipOnFullVideo"),
|
||||
description: chrome.i18n.getMessage("whatManualSkipOnFullVideo"),
|
||||
type: "toggle"
|
||||
}], [{
|
||||
configKey: "minDuration",
|
||||
label: chrome.i18n.getMessage("minDuration"),
|
||||
description: chrome.i18n.getMessage("minDurationDescription"),
|
||||
type: "number"
|
||||
}]];
|
||||
|
||||
const result: JSX.Element[] = [];
|
||||
|
||||
for (const optionGroup of options) {
|
||||
const groupResult: JSX.Element[] = [];
|
||||
for (const option of optionGroup) {
|
||||
groupResult.push(
|
||||
<ExtraOptionComponent
|
||||
option={option}
|
||||
selectedConfigurationID={props.selectedConfigurationID}
|
||||
key={option.configKey}/>
|
||||
);
|
||||
}
|
||||
|
||||
result.push(
|
||||
<div className="extraOptionGroup" key={optionGroup.map(o => o.configKey).join("-")}>
|
||||
{groupResult}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (<>
|
||||
{result}
|
||||
</>);
|
||||
}
|
||||
@@ -1,256 +1,295 @@
|
||||
import * as React from "react";
|
||||
|
||||
import Config from "../../config"
|
||||
import Config, { ConfigurationID } from "../../config"
|
||||
import * as CompileConfig from "../../../config.json";
|
||||
import { Category, CategorySkipOption } from "../../types";
|
||||
|
||||
import { getCategorySuffix } from "../../utils/categoryUtils";
|
||||
import ToggleOptionComponent from "./ToggleOptionComponent";
|
||||
import { ToggleOptionComponent } from "./ToggleOptionComponent";
|
||||
import { getConfigurationValue, updateConfigurationValue } from "./CategoryChooserComponent";
|
||||
import { NumberInputOptionComponent } from "./NumberInputOptionComponent";
|
||||
|
||||
export interface CategorySkipOptionsProps {
|
||||
category: Category;
|
||||
selection: CategorySkipOption;
|
||||
updateSelection(selection: CategorySkipOption): void;
|
||||
isDefaultConfig: boolean;
|
||||
selectedConfigurationID: ConfigurationID;
|
||||
defaultColor?: string;
|
||||
defaultPreviewColor?: string;
|
||||
children?: React.ReactNode;
|
||||
}
|
||||
|
||||
export interface CategorySkipOptionsState {
|
||||
color: string;
|
||||
previewColor: string;
|
||||
}
|
||||
|
||||
export interface ToggleOption {
|
||||
configKey: string;
|
||||
label: string;
|
||||
type: "toggle" | "number";
|
||||
description?: string;
|
||||
dontDisable?: boolean;
|
||||
dontShowOnCustomConfigs?: boolean;
|
||||
}
|
||||
|
||||
class CategorySkipOptionsComponent extends React.Component<CategorySkipOptionsProps, CategorySkipOptionsState> {
|
||||
setBarColorTimeout: NodeJS.Timeout;
|
||||
export function CategorySkipOptionsComponent(props: CategorySkipOptionsProps): React.ReactElement {
|
||||
const [color, setColor] = React.useState(props.defaultColor || Config.config.barTypes[props.category]?.color);
|
||||
const [previewColor, setPreviewColor] = React.useState(props.defaultPreviewColor || Config.config.barTypes["preview-" + props.category]?.color);
|
||||
|
||||
constructor(props: CategorySkipOptionsProps) {
|
||||
super(props);
|
||||
const selectedOption = React.useMemo(() => {
|
||||
switch (props.selection) {
|
||||
case CategorySkipOption.ShowOverlay:
|
||||
return "showOverlay";
|
||||
case CategorySkipOption.ManualSkip:
|
||||
return "manualSkip";
|
||||
case CategorySkipOption.AutoSkip:
|
||||
return "autoSkip";
|
||||
case CategorySkipOption.FallbackToDefault:
|
||||
return "fallbackToDefault";
|
||||
default:
|
||||
return "disable";
|
||||
}
|
||||
}, [props.selection]);
|
||||
|
||||
// Setup state
|
||||
this.state = {
|
||||
color: props.defaultColor || Config.config.barTypes[this.props.category]?.color,
|
||||
previewColor: props.defaultPreviewColor || Config.config.barTypes["preview-" + this.props.category]?.color
|
||||
};
|
||||
}
|
||||
const setBarColorTimeout = React.useRef<NodeJS.Timeout | null>(null);
|
||||
|
||||
render(): React.ReactElement {
|
||||
let defaultOption = "disable";
|
||||
// Set the default opton properly
|
||||
for (const categorySelection of Config.config.categorySelections) {
|
||||
if (categorySelection.name === this.props.category) {
|
||||
switch (categorySelection.option) {
|
||||
case CategorySkipOption.ShowOverlay:
|
||||
defaultOption = "showOverlay";
|
||||
break;
|
||||
case CategorySkipOption.ManualSkip:
|
||||
defaultOption = "manualSkip";
|
||||
break;
|
||||
case CategorySkipOption.AutoSkip:
|
||||
defaultOption = "autoSkip";
|
||||
break;
|
||||
return (
|
||||
<>
|
||||
<tr id={props.category + "OptionsRow"}
|
||||
className={`categoryTableElement`} >
|
||||
<td id={props.category + "OptionName"}
|
||||
className="categoryTableLabel">
|
||||
{chrome.i18n.getMessage("category_" + props.category)}
|
||||
</td>
|
||||
|
||||
<td id={props.category + "SkipOption"}
|
||||
className="skipOption">
|
||||
<select
|
||||
className="optionsSelector"
|
||||
value={selectedOption}
|
||||
onChange={(e) => skipOptionSelected(e, props.category, props.updateSelection)}>
|
||||
{getCategorySkipOptions(props.category, props.isDefaultConfig)}
|
||||
</select>
|
||||
</td>
|
||||
|
||||
{props.category !== "chapter" &&
|
||||
<td id={props.category + "ColorOption"}
|
||||
className="colorOption">
|
||||
<input
|
||||
className="categoryColorTextBox option-text-box"
|
||||
type="color"
|
||||
disabled={!props.isDefaultConfig}
|
||||
onChange={(event) => {
|
||||
if (setBarColorTimeout.current) {
|
||||
clearTimeout(setBarColorTimeout.current);
|
||||
}
|
||||
|
||||
setColor(event.currentTarget.value);
|
||||
Config.config.barTypes[props.category].color = event.currentTarget.value;
|
||||
|
||||
// Make listener get called
|
||||
setBarColorTimeout.current = setTimeout(() => {
|
||||
Config.config.barTypes = Config.config.barTypes;
|
||||
}, 50);
|
||||
}}
|
||||
value={color} />
|
||||
</td>
|
||||
}
|
||||
|
||||
break;
|
||||
{!["chapter", "exclusive_access"].includes(props.category) &&
|
||||
<td id={props.category + "PreviewColorOption"}
|
||||
className="previewColorOption">
|
||||
<input
|
||||
className="categoryColorTextBox option-text-box"
|
||||
type="color"
|
||||
disabled={!props.isDefaultConfig}
|
||||
onChange={(event) => {
|
||||
if (setBarColorTimeout.current) {
|
||||
clearTimeout(setBarColorTimeout.current);
|
||||
}
|
||||
|
||||
setPreviewColor(event.currentTarget.value);
|
||||
Config.config.barTypes["preview-" + props.category].color = event.currentTarget.value;
|
||||
|
||||
// Make listener get called
|
||||
setBarColorTimeout.current = setTimeout(() => {
|
||||
Config.config.barTypes = Config.config.barTypes;
|
||||
}, 50);
|
||||
}}
|
||||
value={previewColor} />
|
||||
</td>
|
||||
}
|
||||
|
||||
</tr>
|
||||
|
||||
<tr id={props.category + "DescriptionRow"}
|
||||
className={`small-description categoryTableDescription`}>
|
||||
<td
|
||||
colSpan={2}>
|
||||
{chrome.i18n.getMessage("category_" + props.category + "_description")}
|
||||
{' '}
|
||||
<a href={CompileConfig.wikiLinks[props.category]} target="_blank" rel="noreferrer">
|
||||
{`${chrome.i18n.getMessage("LearnMore")}`}
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<ExtraOptionComponents
|
||||
category={props.category}
|
||||
selectedConfigurationID={props.selectedConfigurationID}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function skipOptionSelected(event: React.ChangeEvent<HTMLSelectElement>,
|
||||
category: Category, updateSelection: (selection: CategorySkipOption) => void): void {
|
||||
let option: CategorySkipOption;
|
||||
switch (event.target.value) {
|
||||
case "fallbackToDefault":
|
||||
option = CategorySkipOption.FallbackToDefault;
|
||||
break;
|
||||
case "disable":
|
||||
option = CategorySkipOption.Disabled;
|
||||
break;
|
||||
case "showOverlay":
|
||||
option = CategorySkipOption.ShowOverlay;
|
||||
break;
|
||||
case "manualSkip":
|
||||
option = CategorySkipOption.ManualSkip;
|
||||
break;
|
||||
case "autoSkip":
|
||||
option = CategorySkipOption.AutoSkip;
|
||||
|
||||
if (category === "filler" && !Config.config.isVip) {
|
||||
if (!confirm(chrome.i18n.getMessage("FillerWarning"))) {
|
||||
event.target.value = "disable";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<tr id={this.props.category + "OptionsRow"}
|
||||
className={`categoryTableElement`} >
|
||||
<td id={this.props.category + "OptionName"}
|
||||
className="categoryTableLabel">
|
||||
{chrome.i18n.getMessage("category_" + this.props.category)}
|
||||
</td>
|
||||
break;
|
||||
}
|
||||
|
||||
<td id={this.props.category + "SkipOption"}
|
||||
className="skipOption">
|
||||
<select
|
||||
className="optionsSelector"
|
||||
defaultValue={defaultOption}
|
||||
onChange={this.skipOptionSelected.bind(this)}>
|
||||
{this.getCategorySkipOptions()}
|
||||
</select>
|
||||
</td>
|
||||
updateSelection(option);
|
||||
}
|
||||
|
||||
{this.props.category !== "chapter" &&
|
||||
<td id={this.props.category + "ColorOption"}
|
||||
className="colorOption">
|
||||
<input
|
||||
className="categoryColorTextBox option-text-box"
|
||||
type="color"
|
||||
onChange={(event) => this.setColorState(event, false)}
|
||||
value={this.state.color} />
|
||||
</td>
|
||||
}
|
||||
function getCategorySkipOptions(category: Category, isDefaultConfig: boolean): JSX.Element[] {
|
||||
const elements: JSX.Element[] = [];
|
||||
|
||||
{!["chapter", "exclusive_access"].includes(this.props.category) &&
|
||||
<td id={this.props.category + "PreviewColorOption"}
|
||||
className="previewColorOption">
|
||||
<input
|
||||
className="categoryColorTextBox option-text-box"
|
||||
type="color"
|
||||
onChange={(event) => this.setColorState(event, true)}
|
||||
value={this.state.previewColor} />
|
||||
</td>
|
||||
}
|
||||
let optionNames = ["disable", "showOverlay", "manualSkip", "autoSkip"];
|
||||
if (category === "chapter") optionNames = ["disable", "showOverlay"]
|
||||
else if (category === "exclusive_access") optionNames = ["disable", "showOverlay"];
|
||||
|
||||
</tr>
|
||||
if (!isDefaultConfig) {
|
||||
optionNames = ["fallbackToDefault"].concat(optionNames);
|
||||
}
|
||||
|
||||
<tr id={this.props.category + "DescriptionRow"}
|
||||
className={`small-description categoryTableDescription`}>
|
||||
<td
|
||||
colSpan={2}>
|
||||
{chrome.i18n.getMessage("category_" + this.props.category + "_description")}
|
||||
{' '}
|
||||
<a href={CompileConfig.wikiLinks[this.props.category]} target="_blank" rel="noreferrer">
|
||||
{`${chrome.i18n.getMessage("LearnMore")}`}
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{this.getExtraOptionComponents(this.props.category)}
|
||||
|
||||
</>
|
||||
for (const optionName of optionNames) {
|
||||
elements.push(
|
||||
<option key={optionName} value={optionName}>
|
||||
{chrome.i18n.getMessage(optionName !== "disable" ? optionName + getCategorySuffix(category)
|
||||
: optionName) || chrome.i18n.getMessage(optionName)}
|
||||
</option>
|
||||
);
|
||||
}
|
||||
|
||||
skipOptionSelected(event: React.ChangeEvent<HTMLSelectElement>): void {
|
||||
let option: CategorySkipOption;
|
||||
|
||||
switch (event.target.value) {
|
||||
case "disable":
|
||||
Config.config.categorySelections = Config.config.categorySelections.filter(
|
||||
categorySelection => categorySelection.name !== this.props.category);
|
||||
return;
|
||||
case "showOverlay":
|
||||
option = CategorySkipOption.ShowOverlay;
|
||||
|
||||
break;
|
||||
case "manualSkip":
|
||||
option = CategorySkipOption.ManualSkip;
|
||||
|
||||
break;
|
||||
case "autoSkip":
|
||||
option = CategorySkipOption.AutoSkip;
|
||||
|
||||
if (this.props.category === "filler" && !Config.config.isVip) {
|
||||
if (!confirm(chrome.i18n.getMessage("FillerWarning"))) {
|
||||
event.target.value = "disable";
|
||||
}
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
const existingSelection = Config.config.categorySelections.find(selection => selection.name === this.props.category);
|
||||
if (existingSelection) {
|
||||
existingSelection.option = option;
|
||||
} else {
|
||||
Config.config.categorySelections.push({
|
||||
name: this.props.category,
|
||||
option: option
|
||||
});
|
||||
}
|
||||
|
||||
Config.forceSyncUpdate("categorySelections");
|
||||
}
|
||||
|
||||
getCategorySkipOptions(): JSX.Element[] {
|
||||
const elements: JSX.Element[] = [];
|
||||
|
||||
let optionNames = ["disable", "showOverlay", "manualSkip", "autoSkip"];
|
||||
if (this.props.category === "chapter") optionNames = ["disable", "showOverlay"]
|
||||
else if (this.props.category === "exclusive_access") optionNames = ["disable", "showOverlay"];
|
||||
|
||||
for (const optionName of optionNames) {
|
||||
elements.push(
|
||||
<option key={optionName} value={optionName}>
|
||||
{chrome.i18n.getMessage(optionName !== "disable" ? optionName + getCategorySuffix(this.props.category)
|
||||
: optionName)}
|
||||
</option>
|
||||
);
|
||||
}
|
||||
|
||||
return elements;
|
||||
}
|
||||
|
||||
setColorState(event: React.FormEvent<HTMLInputElement>, preview: boolean): void {
|
||||
clearTimeout(this.setBarColorTimeout);
|
||||
|
||||
if (preview) {
|
||||
this.setState({
|
||||
previewColor: event.currentTarget.value
|
||||
});
|
||||
|
||||
Config.config.barTypes["preview-" + this.props.category].color = event.currentTarget.value;
|
||||
|
||||
} else {
|
||||
this.setState({
|
||||
color: event.currentTarget.value
|
||||
});
|
||||
|
||||
Config.config.barTypes[this.props.category].color = event.currentTarget.value;
|
||||
}
|
||||
|
||||
// Make listener get called
|
||||
this.setBarColorTimeout = setTimeout(() => {
|
||||
Config.config.barTypes = Config.config.barTypes;
|
||||
}, 50);
|
||||
}
|
||||
|
||||
getExtraOptionComponents(category: string): JSX.Element[] {
|
||||
const result = [];
|
||||
for (const option of this.getExtraOptions(category)) {
|
||||
result.push(
|
||||
<tr key={option.configKey}>
|
||||
<td id={`${category}_${option.configKey}`} className="categoryExtraOptions">
|
||||
<ToggleOptionComponent
|
||||
configKey={option.configKey}
|
||||
label={option.label}
|
||||
style={{width: "inherit"}}
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
)
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
getExtraOptions(category: string): ToggleOption[] {
|
||||
switch (category) {
|
||||
case "chapter":
|
||||
return [{
|
||||
configKey: "renderSegmentsAsChapters",
|
||||
label: chrome.i18n.getMessage("renderAsChapters"),
|
||||
dontDisable: true
|
||||
}, {
|
||||
configKey: "showSegmentNameInChapterBar",
|
||||
label: chrome.i18n.getMessage("showSegmentNameInChapterBar"),
|
||||
dontDisable: true
|
||||
}, {
|
||||
configKey: "showAutogeneratedChapters",
|
||||
label: chrome.i18n.getMessage("showAutogeneratedChapters"),
|
||||
dontDisable: true
|
||||
}];
|
||||
case "music_offtopic":
|
||||
return [{
|
||||
configKey: "autoSkipOnMusicVideos",
|
||||
label: chrome.i18n.getMessage("autoSkipOnMusicVideos"),
|
||||
}, {
|
||||
configKey: "skipNonMusicOnlyOnYoutubeMusic",
|
||||
label: chrome.i18n.getMessage("skipNonMusicOnlyOnYoutubeMusic"),
|
||||
}];
|
||||
default:
|
||||
return [];
|
||||
}
|
||||
}
|
||||
return elements;
|
||||
}
|
||||
|
||||
export default CategorySkipOptionsComponent;
|
||||
|
||||
function ExtraOptionComponents(props: {category: string; selectedConfigurationID: ConfigurationID}): JSX.Element {
|
||||
const result = [];
|
||||
for (const option of getExtraOptions(props.category)) {
|
||||
result.push(
|
||||
<ExtraOptionComponent
|
||||
key={option.configKey}
|
||||
option={option}
|
||||
selectedConfigurationID={props.selectedConfigurationID}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{result}
|
||||
</>);
|
||||
}
|
||||
|
||||
export function ExtraOptionComponent({option, selectedConfigurationID}: {option: ToggleOption; selectedConfigurationID: ConfigurationID}): JSX.Element {
|
||||
const [value, setValue] = React.useState(getConfigurationValue(selectedConfigurationID, option.configKey));
|
||||
React.useEffect(() => {
|
||||
setValue(getConfigurationValue(selectedConfigurationID, option.configKey));
|
||||
}, [selectedConfigurationID]);
|
||||
|
||||
return (
|
||||
<tr key={option.configKey} className={`${option.dontShowOnCustomConfigs && selectedConfigurationID !== null ? "hidden" : ""}`}>
|
||||
<td id={`${option.configKey}`} className="categoryExtraOptions">
|
||||
{
|
||||
option.type === "toggle" ?
|
||||
<ToggleOptionComponent
|
||||
checked={value ?? Config.config[option.configKey]}
|
||||
partiallyHidden={value === null}
|
||||
showResetButton={value !== null && selectedConfigurationID !== null}
|
||||
onChange={(checked) => {
|
||||
updateConfigurationValue(selectedConfigurationID, option.configKey, checked, setValue);
|
||||
}}
|
||||
onReset={() => {
|
||||
updateConfigurationValue(selectedConfigurationID, option.configKey, null, setValue);
|
||||
}}
|
||||
label={option.label}
|
||||
description={option.description}
|
||||
style={{width: "inherit"}}
|
||||
/>
|
||||
:
|
||||
<NumberInputOptionComponent
|
||||
value={value ?? Config.config[option.configKey]}
|
||||
partiallyHidden={value === null}
|
||||
showResetButton={value !== null && selectedConfigurationID !== null}
|
||||
onChange={(value) => {
|
||||
updateConfigurationValue(selectedConfigurationID, option.configKey, value, setValue);
|
||||
}}
|
||||
onReset={() => {
|
||||
updateConfigurationValue(selectedConfigurationID, option.configKey, null, setValue);
|
||||
}}
|
||||
label={option.label}
|
||||
description={option.description}
|
||||
style={{width: "inherit"}}
|
||||
/>
|
||||
}
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
}
|
||||
|
||||
function getExtraOptions(category: string): ToggleOption[] {
|
||||
switch (category) {
|
||||
case "chapter":
|
||||
return [{
|
||||
configKey: "renderSegmentsAsChapters",
|
||||
label: chrome.i18n.getMessage("renderAsChapters"),
|
||||
type: "toggle",
|
||||
dontDisable: true,
|
||||
dontShowOnCustomConfigs: true
|
||||
}, {
|
||||
configKey: "showSegmentNameInChapterBar",
|
||||
label: chrome.i18n.getMessage("showSegmentNameInChapterBar"),
|
||||
type: "toggle",
|
||||
dontDisable: true,
|
||||
dontShowOnCustomConfigs: true
|
||||
}, {
|
||||
configKey: "showAutogeneratedChapters",
|
||||
label: chrome.i18n.getMessage("showAutogeneratedChapters"),
|
||||
type: "toggle",
|
||||
dontDisable: true
|
||||
}];
|
||||
case "music_offtopic":
|
||||
return [{
|
||||
configKey: "autoSkipOnMusicVideos",
|
||||
label: chrome.i18n.getMessage("autoSkipOnMusicVideos"),
|
||||
type: "toggle"
|
||||
}, {
|
||||
configKey: "skipNonMusicOnlyOnYoutubeMusic",
|
||||
label: chrome.i18n.getMessage("skipNonMusicOnlyOnYoutubeMusic"),
|
||||
type: "toggle"
|
||||
}];
|
||||
default:
|
||||
return [];
|
||||
}
|
||||
}
|
||||
52
src/components/options/NumberInputOptionComponent.tsx
Normal file
52
src/components/options/NumberInputOptionComponent.tsx
Normal file
@@ -0,0 +1,52 @@
|
||||
import * as React from "react";
|
||||
import ResetIcon from "../../svg-icons/resetIcon";
|
||||
|
||||
export interface NumberInputOptionProps {
|
||||
label: string;
|
||||
description?: string;
|
||||
disabled?: boolean;
|
||||
style?: React.CSSProperties;
|
||||
value: number;
|
||||
onChange(value: number): void;
|
||||
partiallyHidden?: boolean;
|
||||
showResetButton?: boolean;
|
||||
onReset?(): void;
|
||||
}
|
||||
|
||||
export function NumberInputOptionComponent(props: NumberInputOptionProps): React.ReactElement {
|
||||
return (
|
||||
<div className={`sb-number-option ${props.disabled ? "disabled" : ""} ${props.partiallyHidden ? "partiallyHidden" : ""}`}>
|
||||
<div style={props.style}>
|
||||
<label className="number-container">
|
||||
<span className="optionLabel">
|
||||
{props.label}
|
||||
</span>
|
||||
<input id={props.label}
|
||||
className="sb-number-input"
|
||||
type="number"
|
||||
step="0.1"
|
||||
min="0"
|
||||
value={props.value}
|
||||
disabled={props.disabled}
|
||||
onChange={(e) => props.onChange(Number(e.target.value))}/>
|
||||
</label>
|
||||
|
||||
{
|
||||
props.showResetButton &&
|
||||
<span className="reset-button sb-switch-label" title={chrome.i18n.getMessage("fallbackToDefault")} onClick={() => {
|
||||
props.onReset?.();
|
||||
}}>
|
||||
<ResetIcon/>
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
|
||||
{
|
||||
props.description &&
|
||||
<div className="small-description">
|
||||
{props.description}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
60
src/components/options/SelectOptionComponent.tsx
Normal file
60
src/components/options/SelectOptionComponent.tsx
Normal file
@@ -0,0 +1,60 @@
|
||||
import * as React from "react";
|
||||
import ResetIcon from "../../svg-icons/resetIcon";
|
||||
|
||||
export interface SelectOption {
|
||||
value: string;
|
||||
label: string;
|
||||
}
|
||||
|
||||
export interface SelectOptionComponentProps {
|
||||
id: string;
|
||||
onChange: (value: string) => void;
|
||||
value: string;
|
||||
label?: string;
|
||||
title?: string;
|
||||
options: SelectOption[];
|
||||
style?: React.CSSProperties;
|
||||
className?: string;
|
||||
showResetButton?: boolean;
|
||||
onReset?: () => void;
|
||||
applyFormattingToOptions?: boolean;
|
||||
}
|
||||
|
||||
export const SelectOptionComponent = (props: SelectOptionComponentProps) => {
|
||||
return (
|
||||
<div className={`sb-optionContainer ${props.className ?? ""}`} style={props.style}>
|
||||
{
|
||||
props.label &&
|
||||
<label className="sb-optionLabel" htmlFor={props.id}>
|
||||
{props.label}
|
||||
</label>
|
||||
}
|
||||
<select id={props.id}
|
||||
className="sb-selector-element optionsSelector"
|
||||
value={props.value}
|
||||
title={props.title}
|
||||
onChange={(e) => {
|
||||
props.onChange(e.target.value);
|
||||
}}>
|
||||
{getOptions(props.options)}
|
||||
</select>
|
||||
|
||||
{
|
||||
props.showResetButton &&
|
||||
<div className="reset-button" onClick={() => {
|
||||
props.onReset?.();
|
||||
}}>
|
||||
<ResetIcon/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
function getOptions(options: SelectOption[]): React.ReactNode[] {
|
||||
return options.map((option) => {
|
||||
return (
|
||||
<option value={option.value} key={option.value}>{option.label}</option>
|
||||
);
|
||||
});
|
||||
}
|
||||
@@ -1,57 +1,50 @@
|
||||
import * as React from "react";
|
||||
|
||||
import Config from "../../config";
|
||||
import ResetIcon from "../../svg-icons/resetIcon";
|
||||
|
||||
export interface ToggleOptionProps {
|
||||
configKey: string;
|
||||
label: string;
|
||||
description?: string;
|
||||
disabled?: boolean;
|
||||
style?: React.CSSProperties;
|
||||
checked: boolean | null;
|
||||
onChange(checked: boolean): void;
|
||||
partiallyHidden?: boolean;
|
||||
showResetButton?: boolean;
|
||||
onReset?(): void;
|
||||
}
|
||||
|
||||
export interface ToggleOptionState {
|
||||
enabled: boolean;
|
||||
}
|
||||
export function ToggleOptionComponent(props: ToggleOptionProps): React.ReactElement {
|
||||
return (
|
||||
<div className={`sb-toggle-option ${props.disabled ? "disabled" : ""} ${props.partiallyHidden ? "partiallyHidden" : ""}`}>
|
||||
<div className="switch-container" style={props.style}>
|
||||
<label className="switch">
|
||||
<input id={props.label}
|
||||
type="checkbox"
|
||||
checked={props.checked}
|
||||
disabled={props.disabled}
|
||||
onChange={(e) => props.onChange(e.target.checked)}/>
|
||||
<span className="slider round"></span>
|
||||
</label>
|
||||
<label className="switch-label" htmlFor={props.label}>
|
||||
{props.label}
|
||||
</label>
|
||||
|
||||
class ToggleOptionComponent extends React.Component<ToggleOptionProps, ToggleOptionState> {
|
||||
|
||||
constructor(props: ToggleOptionProps) {
|
||||
super(props);
|
||||
|
||||
// Setup state
|
||||
this.state = {
|
||||
enabled: Config.config[props.configKey]
|
||||
}
|
||||
}
|
||||
|
||||
render(): React.ReactElement {
|
||||
return (
|
||||
<div className={`sb-toggle-option ${this.props.disabled ? "disabled" : ""}`}>
|
||||
<div className="switch-container" style={this.props.style}>
|
||||
<label className="switch">
|
||||
<input id={this.props.configKey}
|
||||
type="checkbox"
|
||||
checked={this.state.enabled}
|
||||
disabled={this.props.disabled}
|
||||
onChange={(e) => this.clicked(e)}/>
|
||||
<span className="slider round"></span>
|
||||
</label>
|
||||
<label className="switch-label" htmlFor={this.props.configKey}>
|
||||
{this.props.label}
|
||||
</label>
|
||||
</div>
|
||||
{
|
||||
props.showResetButton &&
|
||||
<div className="reset-button sb-switch-label" title={chrome.i18n.getMessage("fallbackToDefault")} onClick={() => {
|
||||
props.onReset?.();
|
||||
}}>
|
||||
<ResetIcon/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
clicked(event: React.ChangeEvent<HTMLInputElement>): void {
|
||||
Config.config[this.props.configKey] = event.target.checked;
|
||||
|
||||
this.setState({
|
||||
enabled: event.target.checked
|
||||
});
|
||||
}
|
||||
|
||||
{
|
||||
props.description &&
|
||||
<div className="small-description">
|
||||
{props.description}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default ToggleOptionComponent;
|
||||
@@ -11,7 +11,6 @@ interface SBConfig {
|
||||
permissions: Record<Category, Permission>;
|
||||
defaultCategory: Category;
|
||||
renderSegmentsAsChapters: boolean;
|
||||
whitelistedChannels: string[];
|
||||
forceChannelCheck: boolean;
|
||||
minutesSaved: number;
|
||||
skipCount: number;
|
||||
@@ -138,6 +137,20 @@ interface SBConfig {
|
||||
|
||||
export type VideoDownvotes = { segments: { uuid: HashedValue; hidden: SponsorHideType }[]; lastAccess: number };
|
||||
|
||||
export type ConfigurationID = string & { __configurationID: never };
|
||||
|
||||
export interface CustomConfiguration {
|
||||
name: string;
|
||||
categorySelections: CategorySelection[];
|
||||
showAutogeneratedChapters: boolean | null;
|
||||
autoSkipOnMusicVideos: boolean | null;
|
||||
skipNonMusicOnlyOnYoutubeMusic: boolean | null;
|
||||
muteSegments: boolean | null;
|
||||
fullVideoSegments: boolean | null;
|
||||
manualSkipOnFullVideo: boolean | null;
|
||||
minDuration: number | null;
|
||||
}
|
||||
|
||||
interface SBStorage {
|
||||
/* VideoID prefixes to UUID prefixes */
|
||||
downvotedSegments: Record<VideoID & HashedValue, VideoDownvotes>;
|
||||
@@ -149,6 +162,10 @@ interface SBStorage {
|
||||
/* Contains unsubmitted segments that the user has created. */
|
||||
unsubmittedSegments: Record<string, SponsorTime[]>;
|
||||
|
||||
channelSkipProfileIDs: Record<string, ConfigurationID>;
|
||||
skipProfileTemp: { time: number; configID: ConfigurationID } | null;
|
||||
skipProfiles: Record<ConfigurationID, CustomConfiguration>;
|
||||
|
||||
skipRules: AdvancedSkipRuleSet[];
|
||||
}
|
||||
|
||||
@@ -168,7 +185,38 @@ class ConfigClass extends ProtoConfig<SBConfig, SBStorage> {
|
||||
}
|
||||
}
|
||||
|
||||
function migrateOldSyncFormats(config: SBConfig) {
|
||||
function migrateOldSyncFormats(config: SBConfig, local: SBStorage) {
|
||||
if (config["whitelistedChannels"]) {
|
||||
// convert to skipProfiles
|
||||
const whitelistedChannels = config["whitelistedChannels"] as string[];
|
||||
const skipProfileID: ConfigurationID = "default-whitelist" as ConfigurationID;
|
||||
|
||||
local.skipProfiles[skipProfileID] = {
|
||||
name: chrome.i18n.getMessage("WhitelistedChannels"),
|
||||
categorySelections: config.categorySelections
|
||||
.filter((s) => !["exclusive_access", "chapter"].includes(s.name))
|
||||
.map(s => ({
|
||||
name: s.name,
|
||||
option: CategorySkipOption.ShowOverlay
|
||||
})),
|
||||
showAutogeneratedChapters: null,
|
||||
autoSkipOnMusicVideos: null,
|
||||
skipNonMusicOnlyOnYoutubeMusic: null,
|
||||
muteSegments: null,
|
||||
fullVideoSegments: null,
|
||||
manualSkipOnFullVideo: null,
|
||||
minDuration: null
|
||||
};
|
||||
local.skipProfiles = local.skipProfiles;
|
||||
|
||||
for (const channelID of whitelistedChannels) {
|
||||
local.channelSkipProfileIDs[channelID] = skipProfileID;
|
||||
}
|
||||
local.channelSkipProfileIDs = local.channelSkipProfileIDs;
|
||||
|
||||
chrome.storage.sync.remove("whitelistedChannels");
|
||||
}
|
||||
|
||||
if (!config["changeChapterColor"]) {
|
||||
config.barTypes["chapter"].color = "#ffd983";
|
||||
config["changeChapterColor"] = true;
|
||||
@@ -290,7 +338,6 @@ const syncDefaults = {
|
||||
permissions: {},
|
||||
defaultCategory: "chooseACategory" as Category,
|
||||
renderSegmentsAsChapters: false,
|
||||
whitelistedChannels: [],
|
||||
forceChannelCheck: false,
|
||||
minutesSaved: 0,
|
||||
skipCount: 0,
|
||||
@@ -506,7 +553,11 @@ const localDefaults = {
|
||||
alreadyInstalled: false,
|
||||
|
||||
unsubmittedSegments: {},
|
||||
skipRules: []
|
||||
skipRules: [],
|
||||
|
||||
channelSkipProfileIDs: {},
|
||||
skipProfiles: {},
|
||||
skipProfileTemp: null
|
||||
};
|
||||
|
||||
const Config = new ConfigClass(syncDefaults, localDefaults, migrateOldSyncFormats);
|
||||
@@ -529,7 +580,7 @@ export function generateDebugDetails(): string {
|
||||
output.config.serverAddress = (output.config.serverAddress === CompileConfig.serverAddress)
|
||||
? "Default server address" : "Custom server address";
|
||||
output.config.invidiousInstances = output.config.invidiousInstances.length;
|
||||
output.config.whitelistedChannels = output.config.whitelistedChannels.length;
|
||||
output.config.skipRules = output.config.skipRules.length;
|
||||
|
||||
return JSON.stringify(output, null, 4);
|
||||
}
|
||||
|
||||
166
src/content.ts
166
src/content.ts
@@ -3,7 +3,6 @@ import {
|
||||
ActionType,
|
||||
Category,
|
||||
CategorySkipOption,
|
||||
ChannelIDInfo,
|
||||
ChannelIDStatus,
|
||||
ContentContainer,
|
||||
ScheduledTime,
|
||||
@@ -34,7 +33,7 @@ import { importTimes } from "./utils/exporter";
|
||||
import { ChapterVote } from "./render/ChapterVote";
|
||||
import { openWarningDialog } from "./utils/warnings";
|
||||
import { extensionUserAgent, isFirefoxOrSafari, waitFor } from "../maze-utils/src";
|
||||
import { getErrorMessage, getFormattedTime } from "../maze-utils/src/formating";
|
||||
import { formatJSErrorMessage, getFormattedTime, getLongErrorMessage } from "../maze-utils/src/formating";
|
||||
import { getChannelIDInfo, getVideo, getIsAdPlaying, getIsLivePremiere, setIsAdPlaying, checkVideoIDChange, getVideoID, getYouTubeVideoID, setupVideoModule, checkIfNewVideoID, isOnInvidious, isOnMobileYouTube, isOnYouTubeMusic, isOnYTTV, getLastNonInlineVideoID, triggerVideoIDChange, triggerVideoElementChange, getIsInline, getCurrentTime, setCurrentTime, getVideoDuration, verifyCurrentTime, waitForVideo } from "../maze-utils/src/video";
|
||||
import { Keybind, StorageChangesObject, isSafari, keybindEquals, keybindToString } from "../maze-utils/src/config";
|
||||
import { findValidElement } from "../maze-utils/src/dom"
|
||||
@@ -53,6 +52,8 @@ import { defaultPreviewTime } from "./utils/constants";
|
||||
import { onVideoPage } from "../maze-utils/src/pageInfo";
|
||||
import { getSegmentsForVideo } from "./utils/segmentData";
|
||||
import { getCategoryDefaultSelection, getCategorySelection } from "./utils/skipRule";
|
||||
import { getSkipProfileBool, getSkipProfileIDForTab, hideTooShortSegments, setCurrentTabSkipProfile } from "./utils/skipProfiles";
|
||||
import { FetchResponse, logRequest } from "../maze-utils/src/background-request-proxy";
|
||||
|
||||
cleanPage();
|
||||
|
||||
@@ -146,7 +147,6 @@ let lastCheckVideoTime = -1;
|
||||
// To determine if a video resolution change is happening
|
||||
let firstPlay = true;
|
||||
|
||||
//is this channel whitelised from getting sponsors skipped
|
||||
let channelWhitelisted = false;
|
||||
|
||||
let previewBar: PreviewBar = null;
|
||||
@@ -173,7 +173,7 @@ let popupInitialised = false;
|
||||
|
||||
let submissionNotice: SubmissionNotice = null;
|
||||
|
||||
let lastResponseStatus: number;
|
||||
let lastResponseStatus: number | Error | string;
|
||||
|
||||
// Contains all of the functions and variables needed by the skip notice
|
||||
const skipNoticeContentContainer: ContentContainer = () => ({
|
||||
@@ -227,7 +227,9 @@ function messageListener(request: Message, sender: unknown, sendResponse: (respo
|
||||
onMobileYouTube: isOnMobileYouTube(),
|
||||
videoID: getVideoID(),
|
||||
loopedChapter: loopedChapter?.UUID,
|
||||
channelWhitelisted
|
||||
channelID: getChannelIDInfo().id,
|
||||
channelAuthor: getChannelIDInfo().author,
|
||||
currentTabSkipProfileID: getSkipProfileIDForTab()
|
||||
});
|
||||
|
||||
if (!request.updating && popupInitialised && document.getElementById("sponsorBlockPopupContainer") != null) {
|
||||
@@ -355,6 +357,10 @@ function messageListener(request: Message, sender: unknown, sendResponse: (respo
|
||||
warn: window["SBLogs"].warn
|
||||
});
|
||||
break;
|
||||
case "setCurrentTabSkipProfile":
|
||||
setCurrentTabSkipProfile(request.configID);
|
||||
channelIDChange();
|
||||
break;
|
||||
}
|
||||
|
||||
sendResponse({});
|
||||
@@ -372,7 +378,7 @@ function contentConfigUpdateListener(changes: StorageChangesObject) {
|
||||
updateVisibilityOfPlayerControlsButton()
|
||||
break;
|
||||
case "categorySelections":
|
||||
sponsorsLookup(true, true);
|
||||
channelIDChange();
|
||||
break;
|
||||
case "barTypes":
|
||||
setCategoryColorCSSVariables();
|
||||
@@ -384,11 +390,26 @@ function contentConfigUpdateListener(changes: StorageChangesObject) {
|
||||
}
|
||||
}
|
||||
}
|
||||
function contentLocalConfigUpdateListener(changes: StorageChangesObject) {
|
||||
for (const key in changes) {
|
||||
switch(key) {
|
||||
case "channelSkipProfileIDs":
|
||||
case "skipProfiles":
|
||||
case "skipProfileTemp":
|
||||
channelIDChange();
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (!Config.configSyncListeners.includes(contentConfigUpdateListener)) {
|
||||
Config.configSyncListeners.push(contentConfigUpdateListener);
|
||||
}
|
||||
|
||||
if (!Config.configLocalListeners.includes(contentLocalConfigUpdateListener)) {
|
||||
Config.configLocalListeners.push(contentLocalConfigUpdateListener);
|
||||
}
|
||||
|
||||
function resetValues() {
|
||||
lastCheckTime = 0;
|
||||
lastCheckVideoTime = -1;
|
||||
@@ -465,7 +486,8 @@ function videoIDChange(): void {
|
||||
chrome.runtime.sendMessage({
|
||||
message: "videoChanged",
|
||||
videoID: getVideoID(),
|
||||
whitelisted: channelWhitelisted
|
||||
channelID: getChannelIDInfo().id,
|
||||
channelAuthor: getChannelIDInfo().author
|
||||
});
|
||||
|
||||
sponsorsLookup();
|
||||
@@ -1209,16 +1231,6 @@ async function sponsorsLookup(keepOldSubmissions = true, ignoreCache = false) {
|
||||
sponsorTimes = receivedSegments;
|
||||
existingChaptersImported = false;
|
||||
|
||||
// Hide all submissions smaller than the minimum duration
|
||||
if (Config.config.minDuration !== 0) {
|
||||
for (const segment of sponsorTimes) {
|
||||
const duration = segment.segment[1] - segment.segment[0];
|
||||
if (duration > 0 && duration < Config.config.minDuration) {
|
||||
segment.hidden = SponsorHideType.MinimumDuration;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (keepOldSubmissions) {
|
||||
for (const segment of oldSegments) {
|
||||
const otherSegment = sponsorTimes.find((other) => segment.UUID === other.UUID);
|
||||
@@ -1243,6 +1255,8 @@ async function sponsorsLookup(keepOldSubmissions = true, ignoreCache = false) {
|
||||
}
|
||||
}
|
||||
|
||||
hideTooShortSegments(sponsorTimes);
|
||||
|
||||
if (!getVideo()) {
|
||||
//there is still no video here
|
||||
await waitForVideo();
|
||||
@@ -1275,7 +1289,9 @@ function notifyPopupOfSegments(): void {
|
||||
onMobileYouTube: isOnMobileYouTube(),
|
||||
videoID: getVideoID(),
|
||||
loopedChapter: loopedChapter?.UUID,
|
||||
channelWhitelisted
|
||||
channelID: getChannelIDInfo().id,
|
||||
channelAuthor: getChannelIDInfo().author,
|
||||
currentTabSkipProfileID: getSkipProfileIDForTab()
|
||||
});
|
||||
}
|
||||
|
||||
@@ -1303,7 +1319,7 @@ function importExistingChapters(wait: boolean) {
|
||||
}
|
||||
}).catch(() => { importingChaptersWaiting = false; });
|
||||
|
||||
if (!Config.config.showAutogeneratedChapters) {
|
||||
if (!getSkipProfileBool("showAutogeneratedChapters")) {
|
||||
waitFor(() => hasAutogeneratedChapters(), wait ? 15000 : 0, 400).then(() => {
|
||||
updateActiveSegment(getCurrentTime());
|
||||
}).catch(() => { }); // eslint-disable-line @typescript-eslint/no-empty-function
|
||||
@@ -1312,17 +1328,27 @@ function importExistingChapters(wait: boolean) {
|
||||
}
|
||||
}
|
||||
|
||||
function handleExistingChaptersChannelChange() {
|
||||
if (existingChaptersImported && hasAutogeneratedChapters() && !getSkipProfileBool("showAutogeneratedChapters")) {
|
||||
sponsorTimes = sponsorTimes.filter((segment) => segment.source !== SponsorSourceType.Autogenerated);
|
||||
}
|
||||
}
|
||||
|
||||
async function lockedCategoriesLookup(): Promise<void> {
|
||||
const hashPrefix = (await getHash(getVideoID(), 1)).slice(0, 4);
|
||||
const response = await asyncRequestToServer("GET", "/api/lockCategories/" + hashPrefix);
|
||||
try {
|
||||
const response = await asyncRequestToServer("GET", "/api/lockCategories/" + hashPrefix);
|
||||
|
||||
if (response.ok) {
|
||||
try {
|
||||
if (response.ok) {
|
||||
const categoriesResponse = JSON.parse(response.responseText).filter((lockInfo) => lockInfo.videoID === getVideoID())[0]?.categories;
|
||||
if (Array.isArray(categoriesResponse)) {
|
||||
lockedCategories = categoriesResponse;
|
||||
}
|
||||
} catch (e) { } //eslint-disable-line no-empty
|
||||
} else if (response.status !== 404) {
|
||||
logRequest(response, "SB", "locked categories")
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn(`[SB] Caught error while looking up category locks for hashprefix ${hashPrefix}`, e)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1377,13 +1403,6 @@ function startSkipScheduleCheckingForStartSponsors() {
|
||||
}
|
||||
}
|
||||
|
||||
const fullVideoSegment = sponsorTimes.filter((time) => time.actionType === ActionType.Full)[0];
|
||||
if (fullVideoSegment) {
|
||||
waitFor(() => categoryPill).then(() => {
|
||||
categoryPill?.setSegment(fullVideoSegment);
|
||||
});
|
||||
}
|
||||
|
||||
if (startingSegmentTime !== -1) {
|
||||
startSponsorSchedule(undefined, startingSegmentTime);
|
||||
} else {
|
||||
@@ -1455,20 +1474,24 @@ function updatePreviewBar(): void {
|
||||
}
|
||||
}
|
||||
|
||||
//checks if this channel is whitelisted, should be done only after the channelID has been loaded
|
||||
async function channelIDChange(channelIDInfo: ChannelIDInfo) {
|
||||
const whitelistedChannels = Config.config.whitelistedChannels;
|
||||
|
||||
//see if this is a whitelisted channel
|
||||
if (whitelistedChannels != undefined &&
|
||||
channelIDInfo.status === ChannelIDStatus.Found && whitelistedChannels.includes(channelIDInfo.id)) {
|
||||
channelWhitelisted = true;
|
||||
function updateCategoryPill() {
|
||||
const fullVideoSegment = sponsorTimes.filter((time) => time.actionType === ActionType.Full)[0];
|
||||
if (fullVideoSegment && getSkipProfileBool("fullVideoSegments")) {
|
||||
categoryPill?.setSegment(fullVideoSegment);
|
||||
} else {
|
||||
categoryPill?.setVisibility(false);
|
||||
}
|
||||
}
|
||||
|
||||
//checks if this channel is whitelisted, should be done only after the channelID has been loaded
|
||||
async function channelIDChange() {
|
||||
// check if the start of segments were missed
|
||||
if (Config.config.forceChannelCheck && sponsorTimes?.length > 0) startSkipScheduleCheckingForStartSponsors();
|
||||
|
||||
hideTooShortSegments(sponsorTimes);
|
||||
handleExistingChaptersChannelChange();
|
||||
updatePreviewBar();
|
||||
updateCategoryPill();
|
||||
notifyPopupOfSegments();
|
||||
}
|
||||
|
||||
@@ -1724,7 +1747,11 @@ function sendTelemetryAndCount(skippingSegments: SponsorTime[], secondsSkipped:
|
||||
counted = true;
|
||||
}
|
||||
|
||||
if (fullSkip) asyncRequestToServer("POST", "/api/viewedVideoSponsorTime?UUID=" + segment.UUID + "&videoID=" + getVideoID());
|
||||
if (fullSkip) asyncRequestToServer("POST", "/api/viewedVideoSponsorTime?UUID=" + segment.UUID + "&videoID=" + getVideoID())
|
||||
.then(r => {
|
||||
if (!r.ok) logRequest(r, "SB", "segment skip log");
|
||||
})
|
||||
.catch(e => console.warn("[SB] Caught error while attempting to log segment skip", e));
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1934,9 +1961,9 @@ function shouldAutoSkip(segment: SponsorTime): boolean {
|
||||
return false;
|
||||
}
|
||||
|
||||
return (!Config.config.manualSkipOnFullVideo || !sponsorTimes?.some((s) => s.category === segment.category && s.actionType === ActionType.Full))
|
||||
return (!getSkipProfileBool("manualSkipOnFullVideo") || !sponsorTimes?.some((s) => s.category === segment.category && s.actionType === ActionType.Full))
|
||||
&& (getCategorySelection(segment)?.option === CategorySkipOption.AutoSkip ||
|
||||
(Config.config.autoSkipOnMusicVideos && canSkipNonMusic && sponsorTimes?.some((s) => s.category === "music_offtopic")
|
||||
(getSkipProfileBool("autoSkipOnMusicVideos") && canSkipNonMusic && sponsorTimes?.some((s) => s.category === "music_offtopic")
|
||||
&& segment.actionType === ActionType.Skip)
|
||||
|| sponsorTimesSubmitting.some((s) => s.segment === segment.segment))
|
||||
|| isLoopedChapter(segment);
|
||||
@@ -1945,7 +1972,7 @@ function shouldAutoSkip(segment: SponsorTime): boolean {
|
||||
function shouldSkip(segment: SponsorTime): boolean {
|
||||
return segment.hidden === SponsorHideType.Visible && (segment.actionType !== ActionType.Full
|
||||
&& getCategorySelection(segment)?.option > CategorySkipOption.ShowOverlay)
|
||||
|| (Config.config.autoSkipOnMusicVideos && sponsorTimes?.some((s) => s.category === "music_offtopic")
|
||||
|| (getSkipProfileBool("autoSkipOnMusicVideos") && sponsorTimes?.some((s) => s.category === "music_offtopic")
|
||||
&& segment.actionType === ActionType.Skip)
|
||||
|| isLoopedChapter(segment);
|
||||
}
|
||||
@@ -2284,25 +2311,29 @@ function clearSponsorTimes() {
|
||||
async function vote(type: number, UUID: SegmentUUID, category?: Category, skipNotice?: SkipNoticeComponent): Promise<VoteResponse> {
|
||||
if (skipNotice !== null && skipNotice !== undefined) {
|
||||
//add loading info
|
||||
skipNotice.addVoteButtonInfo.bind(skipNotice)(chrome.i18n.getMessage("Loading"))
|
||||
skipNotice.setNoticeInfoMessage.bind(skipNotice)();
|
||||
skipNotice.addVoteButtonInfo(chrome.i18n.getMessage("Loading"))
|
||||
skipNotice.setNoticeInfoMessage();
|
||||
}
|
||||
|
||||
const response = await voteAsync(type, UUID, category);
|
||||
if (response != undefined) {
|
||||
//see if it was a success or failure
|
||||
if (skipNotice != null) {
|
||||
if (response.successType == 1 || (response.successType == -1 && response.statusCode == 429)) {
|
||||
if ("error" in response) {
|
||||
skipNotice.setNoticeInfoMessage(formatJSErrorMessage(response.error))
|
||||
skipNotice.resetVoteButtonInfo();
|
||||
} else if (response.ok || response.status === 429) {
|
||||
//success (treat rate limits as a success)
|
||||
skipNotice.afterVote.bind(skipNotice)(utils.getSponsorTimeFromUUID(sponsorTimes, UUID), type, category);
|
||||
} else if (response.successType == -1) {
|
||||
if (response.statusCode === 403 && response.responseText.startsWith("Vote rejected due to a tip from a moderator.")) {
|
||||
skipNotice.afterVote(utils.getSponsorTimeFromUUID(sponsorTimes, UUID), type, category);
|
||||
} else {
|
||||
logRequest({headers: null, ...response}, "SB", "vote on segment");
|
||||
if (response.status === 403 && response.responseText.startsWith("Vote rejected due to a tip from a moderator.")) {
|
||||
openWarningDialog(skipNoticeContentContainer);
|
||||
} else {
|
||||
skipNotice.setNoticeInfoMessage.bind(skipNotice)(getErrorMessage(response.statusCode, response.responseText))
|
||||
skipNotice.setNoticeInfoMessage(getLongErrorMessage(response.status, response.responseText))
|
||||
}
|
||||
|
||||
skipNotice.resetVoteButtonInfo.bind(skipNotice)();
|
||||
skipNotice.resetVoteButtonInfo();
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -2339,7 +2370,7 @@ async function voteAsync(type: number, UUID: SegmentUUID, category?: Category):
|
||||
category: category,
|
||||
videoID: getVideoID()
|
||||
}, (response) => {
|
||||
if (response.successType === 1) {
|
||||
if (response.ok === true) {
|
||||
// Change the sponsor locally
|
||||
const segment = utils.getSponsorTimeFromUUID(sponsorTimes, UUID);
|
||||
if (segment) {
|
||||
@@ -2468,13 +2499,23 @@ async function sendSubmitMessage(): Promise<boolean> {
|
||||
}
|
||||
}
|
||||
|
||||
const response = await asyncRequestToServer("POST", "/api/skipSegments", {
|
||||
videoID: getVideoID(),
|
||||
userID: Config.config.userID,
|
||||
segments: sponsorTimesSubmitting,
|
||||
videoDuration: getVideoDuration(),
|
||||
userAgent: extensionUserAgent(),
|
||||
});
|
||||
let response: FetchResponse;
|
||||
try {
|
||||
response = await asyncRequestToServer("POST", "/api/skipSegments", {
|
||||
videoID: getVideoID(),
|
||||
userID: Config.config.userID,
|
||||
segments: sponsorTimesSubmitting,
|
||||
videoDuration: getVideoDuration(),
|
||||
userAgent: extensionUserAgent(),
|
||||
});
|
||||
} catch (e) {
|
||||
console.error("[SB] Caught error while attempting to submit segments", e);
|
||||
// Show that the upload failed
|
||||
playerButtons.submit.button.style.animation = "unset";
|
||||
playerButtons.submit.image.src = chrome.runtime.getURL("icons/PlayerUploadFailedIconSponsorBlocker.svg");
|
||||
alert(formatJSErrorMessage(e));
|
||||
return false;
|
||||
}
|
||||
|
||||
if (response.status === 200) {
|
||||
stopAnimation();
|
||||
@@ -2508,11 +2549,7 @@ async function sendSubmitMessage(): Promise<boolean> {
|
||||
sponsorTimesSubmitting = [];
|
||||
|
||||
updatePreviewBar();
|
||||
|
||||
const fullVideoSegment = sponsorTimes.filter((time) => time.actionType === ActionType.Full)[0];
|
||||
if (fullVideoSegment) {
|
||||
categoryPill?.setSegment(fullVideoSegment);
|
||||
}
|
||||
updateCategoryPill();
|
||||
|
||||
return true;
|
||||
} else {
|
||||
@@ -2523,7 +2560,8 @@ async function sendSubmitMessage(): Promise<boolean> {
|
||||
if (response.status === 403 && response.responseText.startsWith("Submission rejected due to a tip from a moderator.")) {
|
||||
openWarningDialog(skipNoticeContentContainer);
|
||||
} else {
|
||||
alert(getErrorMessage(response.status, response.responseText));
|
||||
logRequest(response, "SB", "segment submission");
|
||||
alert(getLongErrorMessage(response.status, response.responseText));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -15,6 +15,7 @@ import { hasAutogeneratedChapters, isVisible } from "../utils/pageUtils";
|
||||
import { isVorapisInstalled } from "../utils/compatibility";
|
||||
import { isOnYTTV } from "../../maze-utils/src/video";
|
||||
import { getCategorySelection } from "../utils/skipRule";
|
||||
import { getSkipProfileBool } from "../utils/skipProfiles";
|
||||
|
||||
const TOOLTIP_VISIBLE_CLASS = 'sponsorCategoryTooltipVisible';
|
||||
const MIN_CHAPTER_SIZE = 0.003;
|
||||
@@ -185,7 +186,7 @@ class PreviewBar {
|
||||
}
|
||||
|
||||
const hasAYouTubeChapterRemoved = this.hasYouTubeChapters
|
||||
|| (!Config.config.showAutogeneratedChapters && hasAutogeneratedChapters());
|
||||
|| (!getSkipProfileBool("showAutogeneratedChapters") && hasAutogeneratedChapters());
|
||||
if (hasAYouTubeChapterRemoved) {
|
||||
// Hide original tooltip if some chapter has been filtered out
|
||||
originalTooltip.style.display = "none";
|
||||
@@ -461,7 +462,7 @@ class PreviewBar {
|
||||
|| (!Config.config.renderSegmentsAsChapters
|
||||
&& segments.every((segment) => segment.actionType !== ActionType.Chapter
|
||||
|| [SponsorSourceType.YouTube, SponsorSourceType.Autogenerated].includes(segment.source))))
|
||||
&& !(hasAutogeneratedChapters() && !Config.config.showAutogeneratedChapters)) {
|
||||
&& !(hasAutogeneratedChapters() && !getSkipProfileBool("showAutogeneratedChapters"))) {
|
||||
|
||||
if (this.customChaptersBar) this.customChaptersBar.style.display = "none";
|
||||
this.originalChapterBar.style.removeProperty("display");
|
||||
@@ -488,7 +489,7 @@ class PreviewBar {
|
||||
this.chapterGroups = this.unfilteredChapterGroups;
|
||||
}
|
||||
|
||||
if (this.chapterGroups.length === 0 && !Config.config.showAutogeneratedChapters && hasAutogeneratedChapters()) {
|
||||
if (this.chapterGroups.length === 0 && !getSkipProfileBool("showAutogeneratedChapters") && hasAutogeneratedChapters()) {
|
||||
// Add placeholder chapter group for whole video
|
||||
this.chapterGroups = [{
|
||||
segment: [0, this.videoDuration],
|
||||
@@ -890,7 +891,7 @@ class PreviewBar {
|
||||
if (!Config.config.showSegmentNameInChapterBar
|
||||
|| Config.config.disableSkipping
|
||||
|| ((!segments || segments.length <= 0) && submittingSegments?.length <= 0
|
||||
&& (Config.config.showAutogeneratedChapters || !hasAutogeneratedChapters()))) {
|
||||
&& (getSkipProfileBool("showAutogeneratedChapters") || !hasAutogeneratedChapters()))) {
|
||||
const chaptersContainer = this.getChaptersContainer();
|
||||
if (chaptersContainer) {
|
||||
chaptersContainer.querySelector(".sponsorChapterText")?.remove();
|
||||
@@ -992,7 +993,7 @@ class PreviewBar {
|
||||
} else {
|
||||
this.chapterVote.setVisibility(false);
|
||||
}
|
||||
} else if (!Config.config.showAutogeneratedChapters && hasAutogeneratedChapters()) {
|
||||
} else if (!getSkipProfileBool("showAutogeneratedChapters") && hasAutogeneratedChapters()) {
|
||||
// Keep original hidden
|
||||
chaptersContainer.querySelector(".sponsorChapterText")?.remove();
|
||||
const chapterTitle = chaptersContainer.querySelector(".ytp-chapter-title-content") as HTMLDivElement;
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
// Message and Response Types
|
||||
//
|
||||
|
||||
import { ConfigurationID } from "./config";
|
||||
import { SegmentUUID, SponsorHideType, SponsorTime, VideoID } from "./types";
|
||||
|
||||
interface BaseMessage {
|
||||
@@ -73,17 +74,24 @@ interface KeyDownMessage {
|
||||
metaKey: boolean;
|
||||
}
|
||||
|
||||
export type Message = BaseMessage & (DefaultMessage | BoolValueMessage | IsInfoFoundMessage | SkipMessage | SubmitVoteMessage | HideSegmentMessage | CopyToClipboardMessage | ImportSegmentsMessage | KeyDownMessage | LoopChapterMessage);
|
||||
interface SetCurrentTabSkipProfileResponse {
|
||||
message: "setCurrentTabSkipProfile";
|
||||
configID: ConfigurationID | null;
|
||||
}
|
||||
|
||||
export type Message = BaseMessage & (DefaultMessage | BoolValueMessage | IsInfoFoundMessage | SkipMessage | SubmitVoteMessage | HideSegmentMessage | CopyToClipboardMessage | ImportSegmentsMessage | KeyDownMessage | LoopChapterMessage | SetCurrentTabSkipProfileResponse);
|
||||
|
||||
export interface IsInfoFoundMessageResponse {
|
||||
found: boolean;
|
||||
status: number;
|
||||
status: number | string | Error;
|
||||
sponsorTimes: SponsorTime[];
|
||||
time: number;
|
||||
onMobileYouTube: boolean;
|
||||
videoID: VideoID;
|
||||
loopedChapter: SegmentUUID | null;
|
||||
channelWhitelisted: boolean;
|
||||
channelID: string;
|
||||
channelAuthor: string;
|
||||
currentTabSkipProfileID: ConfigurationID | null;
|
||||
}
|
||||
|
||||
interface GetVideoIdResponse {
|
||||
@@ -120,11 +128,13 @@ export type MessageResponse =
|
||||
| LogResponse
|
||||
| LoopedChapterResponse;
|
||||
|
||||
export interface VoteResponse {
|
||||
successType: number;
|
||||
statusCode: number;
|
||||
export type VoteResponse = {
|
||||
status: number;
|
||||
ok: boolean;
|
||||
responseText: string;
|
||||
}
|
||||
} | {
|
||||
error: Error | string;
|
||||
};
|
||||
|
||||
interface ImportSegmentsResponse {
|
||||
importedSegments: SponsorTime[];
|
||||
@@ -151,7 +161,8 @@ export type InfoUpdatedMessage = IsInfoFoundMessageResponse & {
|
||||
export interface VideoChangedPopupMessage {
|
||||
message: "videoChanged";
|
||||
videoID: string;
|
||||
whitelisted: boolean;
|
||||
channelID: string;
|
||||
channelAuthor: string;
|
||||
}
|
||||
|
||||
export type PopupMessage = TimeUpdateMessage | InfoUpdatedMessage | VideoChangedPopupMessage;
|
||||
|
||||
@@ -414,7 +414,7 @@ async function shouldHideOption(element: Element): Promise<boolean> {
|
||||
/**
|
||||
* Called when the config is updated
|
||||
*/
|
||||
function optionsConfigUpdateListener(changes: StorageChangesObject) {
|
||||
function optionsConfigUpdateListener() {
|
||||
const optionsContainer = document.getElementById("options");
|
||||
const optionsElements = optionsContainer.querySelectorAll("*");
|
||||
|
||||
@@ -425,12 +425,6 @@ function optionsConfigUpdateListener(changes: StorageChangesObject) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (changes.categorySelections || changes.payments) {
|
||||
for (const chooser of categoryChoosers) {
|
||||
chooser.update();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function optionsLocalConfigUpdateListener(changes: StorageChangesObject) {
|
||||
@@ -609,6 +603,8 @@ function activatePrivateTextChange(element: HTMLElement) {
|
||||
if (userInfo.warnings > 0 || userInfo.banned) {
|
||||
setButton.classList.add("hidden");
|
||||
}
|
||||
}).catch(e => {
|
||||
console.error("[SB] Caught error while fetching user info for the new user ID", e)
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -1,22 +1,24 @@
|
||||
import * as React from "react";
|
||||
import { YourWorkComponent } from "./YourWorkComponent";
|
||||
// import { ToggleOptionComponent } from "./ToggleOptionComponent";
|
||||
// import { FormattingOptionsComponent } from "./FormattingOptionsComponent";
|
||||
import { isSafari } from "../../maze-utils/src/config";
|
||||
import { showDonationLink } from "../utils/configUtils";
|
||||
import Config, { generateDebugDetails } from "../config";
|
||||
import { GetChannelIDResponse, IsInfoFoundMessageResponse, LogResponse, Message, MessageResponse, PopupMessage } from "../messageTypes";
|
||||
import Config, { ConfigurationID, generateDebugDetails } from "../config";
|
||||
import { IsInfoFoundMessageResponse, LogResponse, Message, MessageResponse, PopupMessage } from "../messageTypes";
|
||||
import { AnimationUtils } from "../../maze-utils/src/animationUtils";
|
||||
import { SegmentListComponent } from "./SegmentListComponent";
|
||||
import { ActionType, SegmentUUID, SponsorSourceType, SponsorTime } from "../types";
|
||||
import { SegmentSubmissionComponent } from "./SegmentSubmissionComponent";
|
||||
import { copyToClipboardPopup } from "./popupUtils";
|
||||
import { getSkipProfileID, getSkipProfileIDForChannel, getSkipProfileIDForTab, getSkipProfileIDForTime, getSkipProfileIDForVideo, setCurrentTabSkipProfile } from "../utils/skipProfiles";
|
||||
import { SelectOptionComponent } from "../components/options/SelectOptionComponent";
|
||||
import * as Video from "../../maze-utils/src/video";
|
||||
|
||||
export enum LoadingStatus {
|
||||
Loading,
|
||||
SegmentsFound,
|
||||
NoSegmentsFound,
|
||||
ConnectionError,
|
||||
JSError,
|
||||
StillLoading,
|
||||
NoVideo
|
||||
}
|
||||
@@ -24,6 +26,42 @@ export enum LoadingStatus {
|
||||
export interface LoadingData {
|
||||
status: LoadingStatus;
|
||||
code?: number;
|
||||
error?: Error | string;
|
||||
}
|
||||
|
||||
type SkipProfileAction = "forJustThisVideo" | "forThisChannel" | "forThisTab" | "forAnHour" | null;
|
||||
interface SkipProfileOption {
|
||||
name: SkipProfileAction;
|
||||
active: () => boolean;
|
||||
}
|
||||
|
||||
interface SegmentsLoadedProps {
|
||||
setStatus: (status: LoadingData) => void;
|
||||
setVideoID: (videoID: string | null) => void;
|
||||
setCurrentTime: (time: number) => void;
|
||||
setSegments: (segments: SponsorTime[]) => void;
|
||||
setLoopedChapter: (loopedChapter: SegmentUUID | null) => void;
|
||||
}
|
||||
|
||||
interface LoadSegmentsProps extends SegmentsLoadedProps {
|
||||
updating: boolean;
|
||||
}
|
||||
|
||||
interface SkipProfileRadioButtonsProps {
|
||||
selected: SkipProfileAction;
|
||||
setSelected: (s: SkipProfileAction, updateConfig: boolean) => void;
|
||||
disabled: boolean;
|
||||
configID: ConfigurationID | null;
|
||||
videoID: string;
|
||||
}
|
||||
|
||||
interface SkipOptionActionComponentProps {
|
||||
selected: boolean;
|
||||
setSelected: (s: boolean) => void;
|
||||
highlighted: boolean;
|
||||
disabled: boolean;
|
||||
overridden: boolean;
|
||||
label: string;
|
||||
}
|
||||
|
||||
let loadRetryCount = 0;
|
||||
@@ -33,7 +71,6 @@ export const PopupComponent = () => {
|
||||
status: LoadingStatus.Loading
|
||||
});
|
||||
const [extensionEnabled, setExtensionEnabled] = React.useState(!Config.config!.disableSkipping);
|
||||
const [channelWhitelisted, setChannelWhitelisted] = React.useState<boolean | null>(null);
|
||||
const [showForceChannelCheckWarning, setShowForceChannelCheckWarning] = React.useState(false);
|
||||
const [showNoticeButton, setShowNoticeButton] = React.useState(Config.config!.dontShowNotice);
|
||||
|
||||
@@ -47,7 +84,6 @@ export const PopupComponent = () => {
|
||||
loadSegments({
|
||||
updating: false,
|
||||
setStatus,
|
||||
setChannelWhitelisted,
|
||||
setVideoID,
|
||||
setCurrentTime,
|
||||
setSegments,
|
||||
@@ -56,7 +92,6 @@ export const PopupComponent = () => {
|
||||
|
||||
setupComPort({
|
||||
setStatus,
|
||||
setChannelWhitelisted,
|
||||
setVideoID,
|
||||
setCurrentTime,
|
||||
setSegments,
|
||||
@@ -107,7 +142,6 @@ export const PopupComponent = () => {
|
||||
loadSegments({
|
||||
updating: true,
|
||||
setStatus,
|
||||
setChannelWhitelisted,
|
||||
setVideoID,
|
||||
setCurrentTime,
|
||||
setSegments,
|
||||
@@ -129,54 +163,10 @@ export const PopupComponent = () => {
|
||||
|
||||
{/* Toggle Box */}
|
||||
<div className="sbControlsMenu">
|
||||
{/* github: mbledkowski/toggle-switch */}
|
||||
{channelWhitelisted !== null && (
|
||||
<label id="whitelistButton" htmlFor="whitelistToggle" className="toggleSwitchContainer sbControlsMenu-item" role="button" tabIndex={0}>
|
||||
<input type="checkbox"
|
||||
style={{ "display": "none" }}
|
||||
id="whitelistToggle"
|
||||
checked={channelWhitelisted}
|
||||
onChange={async (e) => {
|
||||
const response = await sendMessage({ message: 'getChannelID' }) as GetChannelIDResponse;
|
||||
if (!response.channelID) {
|
||||
if (response.isYTTV) {
|
||||
alert(chrome.i18n.getMessage("yttvNoChannelWhitelist"));
|
||||
} else {
|
||||
alert(chrome.i18n.getMessage("channelDataNotFound") + " https://github.com/ajayyy/SponsorBlock/issues/753");
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
const whitelistedChannels = Config.config.whitelistedChannels ?? [];
|
||||
if (e.target.checked) {
|
||||
whitelistedChannels.splice(whitelistedChannels.indexOf(response.channelID), 1);
|
||||
} else {
|
||||
whitelistedChannels.push(response.channelID);
|
||||
}
|
||||
Config.config.whitelistedChannels = whitelistedChannels;
|
||||
|
||||
setChannelWhitelisted(!e.target.checked);
|
||||
if (!Config.config.forceChannelCheck) setShowForceChannelCheckWarning(true);
|
||||
|
||||
// Send a message to the client
|
||||
sendMessage({
|
||||
message: 'whitelistChange',
|
||||
value: !e.target.checked
|
||||
});
|
||||
|
||||
}}/>
|
||||
<svg viewBox="0 0 24 24" width="23" height="23" className={"SBWhitelistIcon sbControlsMenu-itemIcon " + (channelWhitelisted ? " rotated" : "")}>
|
||||
<path d="M24 10H14V0h-4v10H0v4h10v10h4V14h10z" />
|
||||
</svg>
|
||||
<span id="whitelistChannel" className={channelWhitelisted ? " hidden" : ""}>
|
||||
{chrome.i18n.getMessage("whitelistChannel")}
|
||||
</span>
|
||||
<span id="unwhitelistChannel" className={!channelWhitelisted ? " hidden" : ""}>
|
||||
{chrome.i18n.getMessage("removeFromWhitelist")}
|
||||
</span>
|
||||
</label>
|
||||
)}
|
||||
<SkipProfileButton
|
||||
videoID={videoID}
|
||||
setShowForceChannelCheckWarning={setShowForceChannelCheckWarning}
|
||||
/>
|
||||
<label id="disableExtension" htmlFor="toggleSwitch" className="toggleSwitchContainer sbControlsMenu-item" role="button" tabIndex={0}>
|
||||
<span className="toggleSwitchContainer-switch">
|
||||
<input type="checkbox"
|
||||
@@ -302,7 +292,9 @@ function getVideoStatusText(status: LoadingData): string {
|
||||
case LoadingStatus.NoSegmentsFound:
|
||||
return chrome.i18n.getMessage("sponsor404");
|
||||
case LoadingStatus.ConnectionError:
|
||||
return chrome.i18n.getMessage("connectionError") + status.code;
|
||||
return `${chrome.i18n.getMessage("connectionError")} ${chrome.i18n.getMessage("errorCode").replace("{code}", `${status.code}`)}`;
|
||||
case LoadingStatus.JSError:
|
||||
return `${chrome.i18n.getMessage("connectionError")} ${status.error}`;
|
||||
case LoadingStatus.StillLoading:
|
||||
return chrome.i18n.getMessage("segmentsStillLoading");
|
||||
case LoadingStatus.NoVideo:
|
||||
@@ -310,19 +302,6 @@ function getVideoStatusText(status: LoadingData): string {
|
||||
}
|
||||
}
|
||||
|
||||
interface SegmentsLoadedProps {
|
||||
setStatus: (status: LoadingData) => void;
|
||||
setChannelWhitelisted: (whitelisted: boolean | null) => void;
|
||||
setVideoID: (videoID: string | null) => void;
|
||||
setCurrentTime: (time: number) => void;
|
||||
setSegments: (segments: SponsorTime[]) => void;
|
||||
setLoopedChapter: (loopedChapter: SegmentUUID | null) => void;
|
||||
}
|
||||
|
||||
interface LoadSegmentsProps extends SegmentsLoadedProps {
|
||||
updating: boolean;
|
||||
}
|
||||
|
||||
async function loadSegments(props: LoadSegmentsProps): Promise<void> {
|
||||
const response = await sendMessage({ message: "isInfoFound", updating: props.updating }) as IsInfoFoundMessageResponse;
|
||||
|
||||
@@ -350,6 +329,11 @@ function segmentsLoaded(response: IsInfoFoundMessageResponse, props: SegmentsLoa
|
||||
props.setStatus({
|
||||
status: LoadingStatus.SegmentsFound
|
||||
});
|
||||
} else if (typeof response.status !== "number") {
|
||||
props.setStatus({
|
||||
status: LoadingStatus.JSError,
|
||||
error: response.status,
|
||||
})
|
||||
} else if (response.status === 404 || response.status === 200) {
|
||||
props.setStatus({
|
||||
status: LoadingStatus.NoSegmentsFound
|
||||
@@ -367,8 +351,10 @@ function segmentsLoaded(response: IsInfoFoundMessageResponse, props: SegmentsLoa
|
||||
|
||||
|
||||
props.setVideoID(response.videoID);
|
||||
Video.setVideoID(response.videoID as Video.VideoID);
|
||||
props.setCurrentTime(response.time);
|
||||
props.setChannelWhitelisted(response.channelWhitelisted);
|
||||
Video.setChanelIDInfo(response.channelID, response.channelAuthor);
|
||||
setCurrentTabSkipProfile(response.currentTabSkipProfileID);
|
||||
props.setSegments((response.sponsorTimes || [])
|
||||
.filter((segment) => segment.source === SponsorSourceType.Server)
|
||||
.sort((a, b) => b.segment[1] - a.segment[1])
|
||||
@@ -390,16 +376,13 @@ function sendMessage(request: Message): Promise<MessageResponse> {
|
||||
});
|
||||
}
|
||||
|
||||
interface ComPortProps extends SegmentsLoadedProps {
|
||||
}
|
||||
|
||||
function setupComPort(props: ComPortProps): void {
|
||||
function setupComPort(props: SegmentsLoadedProps): void {
|
||||
const port = chrome.runtime.connect({ name: "popup" });
|
||||
port.onDisconnect.addListener(() => setupComPort(props));
|
||||
port.onMessage.addListener((msg) => onMessage(props, msg));
|
||||
}
|
||||
|
||||
function onMessage(props: ComPortProps, msg: PopupMessage) {
|
||||
function onMessage(props: SegmentsLoadedProps, msg: PopupMessage) {
|
||||
switch (msg.message) {
|
||||
case "time":
|
||||
props.setCurrentTime(msg.time);
|
||||
@@ -412,7 +395,8 @@ function onMessage(props: ComPortProps, msg: PopupMessage) {
|
||||
status: LoadingStatus.StillLoading
|
||||
});
|
||||
props.setVideoID(msg.videoID);
|
||||
props.setChannelWhitelisted(msg.whitelisted);
|
||||
Video.setVideoID(msg.videoID as Video.VideoID);
|
||||
Video.setChanelIDInfo(msg.channelID, msg.channelAuthor);
|
||||
props.setSegments([]);
|
||||
break;
|
||||
}
|
||||
@@ -458,3 +442,269 @@ window.addEventListener("message", async (e): Promise<void> => {
|
||||
document.head.appendChild(style);
|
||||
}
|
||||
});
|
||||
|
||||
function SkipProfileButton(props: {videoID: string; setShowForceChannelCheckWarning: (v: boolean) => void}): JSX.Element {
|
||||
const [menuOpen, setMenuOpen] = React.useState(false);
|
||||
const skipProfileSet = getSkipProfileIDForChannel() !== null;
|
||||
|
||||
React.useEffect(() => {
|
||||
setMenuOpen(false);
|
||||
}, [props.videoID]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<label id="skipProfileButton"
|
||||
htmlFor="skipProfileToggle"
|
||||
className="toggleSwitchContainer sbControlsMenu-item"
|
||||
role="button"
|
||||
tabIndex={0}
|
||||
onClick={() => {
|
||||
if (menuOpen && !Config.config.forceChannelCheck && getSkipProfileID() !== null) {
|
||||
props.setShowForceChannelCheckWarning(true);
|
||||
}
|
||||
|
||||
setMenuOpen(!menuOpen);
|
||||
}}>
|
||||
<svg viewBox="0 0 24 24" width="23" height="23" className={"SBWhitelistIcon sbControlsMenu-itemIcon " + (menuOpen ? " rotated" : "")}>
|
||||
<path d="M24 10H14V0h-4v10H0v4h10v10h4V14h10z" />
|
||||
</svg>
|
||||
<span id="whitelistChannel" className={(menuOpen || skipProfileSet) ? " hidden" : ""}>
|
||||
{chrome.i18n.getMessage("addChannelToSkipProfile")}
|
||||
</span>
|
||||
<span id="whitelistChannel" className={(menuOpen || !skipProfileSet) ? " hidden" : ""}>
|
||||
{chrome.i18n.getMessage("editChannelsSkipProfile")}
|
||||
</span>
|
||||
<span id="unwhitelistChannel" className={!menuOpen ? " hidden" : ""}>
|
||||
{chrome.i18n.getMessage("closeSkipProfileMenu")}
|
||||
</span>
|
||||
</label>
|
||||
|
||||
{
|
||||
props.videoID &&
|
||||
<SkipProfileMenu open={menuOpen} videoID={props.videoID} />
|
||||
}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
const skipProfileOptions: SkipProfileOption[] = [{
|
||||
name: "forAnHour",
|
||||
active: () => getSkipProfileIDForTime() !== null
|
||||
}, {
|
||||
name: "forThisTab",
|
||||
active: () => getSkipProfileIDForTab() !== null
|
||||
}, {
|
||||
name: "forJustThisVideo",
|
||||
active: () => getSkipProfileIDForVideo() !== null
|
||||
}, {
|
||||
name: "forThisChannel",
|
||||
active: () => getSkipProfileIDForChannel() !== null
|
||||
}];
|
||||
|
||||
function SkipProfileMenu(props: {open: boolean; videoID: string}): JSX.Element {
|
||||
const [configID, setConfigID] = React.useState<ConfigurationID | null>(null);
|
||||
const [selectedSkipProfileAction, setSelectedSkipProfileAction] = React.useState<SkipProfileAction>(null);
|
||||
const [allSkipProfiles, setAllSkipProfiles] = React.useState(Object.entries(Config.local!.skipProfiles));
|
||||
|
||||
React.useEffect(() => {
|
||||
if (props.open) {
|
||||
const channelInfo = Video.getChannelIDInfo();
|
||||
if (!channelInfo) {
|
||||
if (Video.isOnYTTV()) {
|
||||
alert(chrome.i18n.getMessage("yttvNoChannelWhitelist"));
|
||||
} else {
|
||||
alert(chrome.i18n.getMessage("channelDataNotFound") + " https://github.com/ajayyy/SponsorBlock/issues/753");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
setConfigID(getSkipProfileID());
|
||||
}, [props.open, props.videoID]);
|
||||
|
||||
React.useEffect(() => {
|
||||
Config.configLocalListeners.push(() => {
|
||||
setAllSkipProfiles(Object.entries(Config.local!.skipProfiles));
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div id="skipProfileMenu" className={`${!props.open ? " hidden" : ""}`}
|
||||
aria-label={chrome.i18n.getMessage("SkipProfileMenu")}>
|
||||
<div style={{position: "relative"}}>
|
||||
<SelectOptionComponent
|
||||
id="sbSkipProfileSelection"
|
||||
title={chrome.i18n.getMessage("SelectASkipProfile")}
|
||||
onChange={(value) => {
|
||||
if (value === "new") {
|
||||
chrome.runtime.sendMessage({ message: "openConfig", hash: "newProfile" });
|
||||
return;
|
||||
}
|
||||
|
||||
const configID = value === "null" ? null : value as ConfigurationID;
|
||||
setConfigID(configID);
|
||||
if (configID === null) {
|
||||
setSelectedSkipProfileAction(null);
|
||||
}
|
||||
|
||||
if (selectedSkipProfileAction) {
|
||||
updateSkipProfileSetting(selectedSkipProfileAction, configID);
|
||||
|
||||
if (configID === null) {
|
||||
for (const option of skipProfileOptions) {
|
||||
if (option.name !== selectedSkipProfileAction && option.active()) {
|
||||
updateSkipProfileSetting(option.name, null);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}}
|
||||
value={configID ?? "null"}
|
||||
options={[{
|
||||
value: "null",
|
||||
label: chrome.i18n.getMessage("DefaultConfiguration")
|
||||
}].concat(allSkipProfiles.map(([key, value]) => ({
|
||||
value: key,
|
||||
label: value.name
|
||||
}))).concat([{
|
||||
value: "new",
|
||||
label: chrome.i18n.getMessage("CreateNewConfiguration")
|
||||
}])}
|
||||
/>
|
||||
|
||||
<SkipProfileRadioButtons
|
||||
selected={selectedSkipProfileAction}
|
||||
setSelected={(s, updateConfig) => {
|
||||
if (updateConfig) {
|
||||
if (s === null) {
|
||||
updateSkipProfileSetting(selectedSkipProfileAction, null);
|
||||
} else {
|
||||
updateSkipProfileSetting(s, configID);
|
||||
}
|
||||
} else if (s !== null) {
|
||||
setConfigID(getSkipProfileID());
|
||||
}
|
||||
|
||||
setSelectedSkipProfileAction(s);
|
||||
}}
|
||||
disabled={configID === null}
|
||||
configID={configID}
|
||||
videoID={props.videoID}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function SkipProfileRadioButtons(props: SkipProfileRadioButtonsProps): JSX.Element {
|
||||
const result: JSX.Element[] = [];
|
||||
|
||||
React.useEffect(() => {
|
||||
if (props.configID === null) {
|
||||
props.setSelected(null, false);
|
||||
} else {
|
||||
for (const option of skipProfileOptions) {
|
||||
if (option.active()) {
|
||||
if (props.selected !== option.name) {
|
||||
props.setSelected(option.name, false);
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
}, [props.configID, props.videoID]);
|
||||
|
||||
let alreadySelected = false;
|
||||
for (const option of skipProfileOptions) {
|
||||
const highlighted = option.active() && props.selected !== option.name;
|
||||
const overridden = !highlighted && alreadySelected;
|
||||
result.push(
|
||||
<SkipOptionActionComponent
|
||||
highlighted={highlighted}
|
||||
label={chrome.i18n.getMessage(`skipProfile_${option.name}`)}
|
||||
selected={props.selected === option.name}
|
||||
overridden={overridden}
|
||||
disabled={props.disabled || overridden}
|
||||
key={option.name}
|
||||
setSelected={(s) => {
|
||||
props.setSelected(s ? option.name : null, true);
|
||||
}}/>
|
||||
);
|
||||
|
||||
if (props.selected === option.name) {
|
||||
alreadySelected = true;
|
||||
}
|
||||
}
|
||||
|
||||
return <div id="skipProfileActions">
|
||||
{result}
|
||||
</div>
|
||||
}
|
||||
|
||||
function SkipOptionActionComponent(props: SkipOptionActionComponentProps): JSX.Element {
|
||||
let title = "";
|
||||
if (props.selected) {
|
||||
title = chrome.i18n.getMessage("clickToNotApplyThisProfile");
|
||||
} else if ((props.highlighted && !props.disabled) || props.overridden) {
|
||||
title = chrome.i18n.getMessage("skipProfileBeingOverriddenByHigherPriority");
|
||||
} else if (!props.highlighted && !props.disabled) {
|
||||
title = chrome.i18n.getMessage("clickToApplyThisProfile");
|
||||
} else if (props.disabled) {
|
||||
title = chrome.i18n.getMessage("selectASkipProfileFirst");
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={`skipOptionAction ${props.selected ? "selected" : ""} ${props.highlighted ? "highlighted" : ""} ${props.disabled ? "disabled" : ""}`}
|
||||
title={title}
|
||||
role="button"
|
||||
tabIndex={0}
|
||||
aria-pressed={props.selected}
|
||||
onClick={() => {
|
||||
// Need to uncheck or disable a higher priority option first
|
||||
if (!props.disabled && !props.highlighted) {
|
||||
props.setSelected(!props.selected);
|
||||
}
|
||||
}}>
|
||||
{props.label}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function updateSkipProfileSetting(action: SkipProfileAction, configID: ConfigurationID | null) {
|
||||
switch (action) {
|
||||
case "forAnHour":
|
||||
Config.local!.skipProfileTemp = configID ? { time: Date.now(), configID } : null;
|
||||
break;
|
||||
case "forThisTab":
|
||||
setCurrentTabSkipProfile(configID);
|
||||
|
||||
sendMessage({
|
||||
message: "setCurrentTabSkipProfile",
|
||||
configID
|
||||
});
|
||||
break;
|
||||
case "forJustThisVideo":
|
||||
if (configID) {
|
||||
Config.local!.channelSkipProfileIDs[Video.getVideoID()!] = configID;
|
||||
} else {
|
||||
delete Config.local!.channelSkipProfileIDs[Video.getVideoID()!];
|
||||
}
|
||||
|
||||
Config.forceLocalUpdate("channelSkipProfileIDs");
|
||||
break;
|
||||
case "forThisChannel": {
|
||||
const channelInfo = Video.getChannelIDInfo();
|
||||
|
||||
if (configID) {
|
||||
Config.local!.channelSkipProfileIDs[channelInfo.id] = configID;
|
||||
delete Config.local!.channelSkipProfileIDs[channelInfo.author];
|
||||
} else {
|
||||
delete Config.local!.channelSkipProfileIDs[channelInfo.id];
|
||||
delete Config.local!.channelSkipProfileIDs[channelInfo.author];
|
||||
}
|
||||
|
||||
Config.forceLocalUpdate("channelSkipProfileIDs");
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -3,7 +3,7 @@ import { ActionType, SegmentUUID, SponsorHideType, SponsorTime, VideoID } from "
|
||||
import Config from "../config";
|
||||
import { waitFor } from "../../maze-utils/src";
|
||||
import { shortCategoryName } from "../utils/categoryUtils";
|
||||
import { getErrorMessage, getFormattedTime } from "../../maze-utils/src/formating";
|
||||
import { formatJSErrorMessage, getFormattedTime, getShortErrorMessage } from "../../maze-utils/src/formating";
|
||||
import { AnimationUtils } from "../../maze-utils/src/animationUtils";
|
||||
import { asyncRequestToServer } from "../utils/requests";
|
||||
import { Message, MessageResponse, VoteResponse } from "../messageTypes";
|
||||
@@ -11,6 +11,7 @@ import { LoadingStatus } from "./PopupComponent";
|
||||
import GenericNotice from "../render/GenericNotice";
|
||||
import { exportTimes } from "../utils/exporter";
|
||||
import { copyToClipboardPopup } from "./popupUtils";
|
||||
import { logRequest } from "../../maze-utils/src/background-request-proxy";
|
||||
|
||||
interface SegmentListComponentProps {
|
||||
videoID: VideoID;
|
||||
@@ -229,17 +230,24 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, loopedChapter,
|
||||
onClick={async (e) => {
|
||||
const stopAnimation = AnimationUtils.applyLoadingAnimation(e.currentTarget, 0.3);
|
||||
|
||||
if (segment.UUID.length > 60) {
|
||||
copyToClipboardPopup(segment.UUID, sendMessage);
|
||||
} else {
|
||||
const segmentIDData = await asyncRequestToServer("GET", "/api/segmentID", {
|
||||
UUID: segment.UUID,
|
||||
videoID: videoID
|
||||
});
|
||||
|
||||
if (segmentIDData.ok && segmentIDData.responseText) {
|
||||
copyToClipboardPopup(segmentIDData.responseText, sendMessage);
|
||||
try {
|
||||
if (segment.UUID.length > 60) {
|
||||
copyToClipboardPopup(segment.UUID, sendMessage);
|
||||
} else {
|
||||
const segmentIDData = await asyncRequestToServer("GET", "/api/segmentID", {
|
||||
UUID: segment.UUID,
|
||||
videoID: videoID
|
||||
});
|
||||
if (segmentIDData.ok && segmentIDData.responseText) {
|
||||
copyToClipboardPopup(segmentIDData.responseText, sendMessage);
|
||||
} else {
|
||||
logRequest(segmentIDData, "SB", "segment UUID resolution");
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.error("[SB] Caught error while attempting to resolve and copy segment UUID", e);
|
||||
} finally {
|
||||
stopAnimation();
|
||||
}
|
||||
|
||||
stopAnimation();
|
||||
@@ -386,14 +394,24 @@ async function vote(props: {
|
||||
}) as VoteResponse;
|
||||
|
||||
if (response != undefined) {
|
||||
let messageDuration = 1_500;
|
||||
// See if it was a success or failure
|
||||
if (response.successType == 1 || (response.successType == -1 && response.statusCode == 429)) {
|
||||
if ("error" in response) {
|
||||
// JS error
|
||||
console.error("[SB] Caught error while attempting to submit a vote", response.error);
|
||||
props.setVoteMessage(formatJSErrorMessage(response.error));
|
||||
messageDuration = 10_000;
|
||||
}
|
||||
else if (response.ok || response.status === 429) {
|
||||
// Success (treat rate limits as a success)
|
||||
props.setVoteMessage(chrome.i18n.getMessage("voted"));
|
||||
} else if (response.successType == -1) {
|
||||
props.setVoteMessage(getErrorMessage(response.statusCode, response.responseText));
|
||||
} else {
|
||||
// Error
|
||||
logRequest({headers: null, ...response}, "SB", "vote on segment");
|
||||
props.setVoteMessage(getShortErrorMessage(response.status, response.responseText));
|
||||
messageDuration = 10_000;
|
||||
}
|
||||
setTimeout(() => props.setVoteMessage(null), 1500);
|
||||
setTimeout(() => props.setVoteMessage(null), messageDuration);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
import * as React from "react";
|
||||
import { getHash } from "../../maze-utils/src/hash";
|
||||
import { getErrorMessage } from "../../maze-utils/src/formating";
|
||||
import { formatJSErrorMessage, getShortErrorMessage } from "../../maze-utils/src/formating";
|
||||
import Config from "../config";
|
||||
import { asyncRequestToServer } from "../utils/requests";
|
||||
import PencilIcon from "../svg-icons/pencilIcon";
|
||||
import ClipboardIcon from "../svg-icons/clipboardIcon";
|
||||
import CheckIcon from "../svg-icons/checkIcon";
|
||||
import { showDonationLink } from "../utils/configUtils";
|
||||
import { FetchResponse, logRequest } from "../../maze-utils/src/background-request-proxy";
|
||||
|
||||
export const YourWorkComponent = () => {
|
||||
const [isSettingUsername, setIsSettingUsername] = React.useState(false);
|
||||
@@ -21,10 +22,16 @@ export const YourWorkComponent = () => {
|
||||
React.useEffect(() => {
|
||||
(async () => {
|
||||
const values = ["userName", "viewCount", "minutesSaved", "vip", "permissions", "segmentCount"];
|
||||
const result = await asyncRequestToServer("GET", "/api/userInfo", {
|
||||
publicUserID: await getHash(Config.config!.userID!),
|
||||
values
|
||||
});
|
||||
let result: FetchResponse;
|
||||
try {
|
||||
result = await asyncRequestToServer("GET", "/api/userInfo", {
|
||||
publicUserID: await getHash(Config.config!.userID!),
|
||||
values
|
||||
});
|
||||
} catch (e) {
|
||||
console.error("[SB] Caught error while fetching user info", e);
|
||||
return
|
||||
}
|
||||
|
||||
if (result.ok) {
|
||||
const userInfo = JSON.parse(result.responseText);
|
||||
@@ -38,6 +45,8 @@ export const YourWorkComponent = () => {
|
||||
|
||||
setShowDonateMessage(Config.config.showDonationLink && Config.config.donateClicked <= 0 && Config.config.showPopupDonationCount < 5
|
||||
&& viewCount < 50000 && !Config.config.isVip && Config.config.skipCount > 10 && showDonationLink());
|
||||
} else {
|
||||
logRequest(result, "SB", "user info");
|
||||
}
|
||||
})();
|
||||
}, []);
|
||||
@@ -94,10 +103,12 @@ export const YourWorkComponent = () => {
|
||||
setUsername(newUsername);
|
||||
setIsSettingUsername(!isSettingUsername);
|
||||
} else {
|
||||
setUsernameSubmissionStatus(getErrorMessage(result.status, result.responseText));
|
||||
logRequest(result, "SB", "username change");
|
||||
setUsernameSubmissionStatus(getShortErrorMessage(result.status, result.responseText));
|
||||
}
|
||||
}).catch((e) => {
|
||||
setUsernameSubmissionStatus(`${chrome.i18n.getMessage("Error")}: ${e}`);
|
||||
console.error("[SB] Caught error while requesting a username change", e)
|
||||
setUsernameSubmissionStatus(formatJSErrorMessage(e));
|
||||
});
|
||||
}
|
||||
}}>
|
||||
|
||||
@@ -1,24 +1,16 @@
|
||||
import * as React from "react";
|
||||
import { createRoot } from 'react-dom/client';
|
||||
|
||||
import CategoryChooserComponent from "../components/options/CategoryChooserComponent";
|
||||
import { CategoryChooserComponent } from "../components/options/CategoryChooserComponent";
|
||||
|
||||
class CategoryChooser {
|
||||
|
||||
ref: React.RefObject<CategoryChooserComponent>;
|
||||
|
||||
constructor(element: Element) {
|
||||
this.ref = React.createRef();
|
||||
|
||||
const root = createRoot(element);
|
||||
root.render(
|
||||
<CategoryChooserComponent ref={this.ref} />
|
||||
<CategoryChooserComponent />
|
||||
);
|
||||
}
|
||||
|
||||
update(): void {
|
||||
this.ref.current?.forceUpdate();
|
||||
}
|
||||
}
|
||||
|
||||
export default CategoryChooser;
|
||||
@@ -121,7 +121,7 @@ export class CategoryPill {
|
||||
async setSegment(segment: SponsorTime): Promise<void> {
|
||||
await waitFor(() => this.ref.current);
|
||||
|
||||
if (this.ref.current?.state?.segment !== segment) {
|
||||
if (this.ref.current?.state?.segment !== segment || !this.ref.current?.state?.show) {
|
||||
const newState = {
|
||||
segment,
|
||||
show: true,
|
||||
|
||||
32
src/svg-icons/resetIcon.tsx
Normal file
32
src/svg-icons/resetIcon.tsx
Normal file
@@ -0,0 +1,32 @@
|
||||
import * as React from "react";
|
||||
|
||||
export interface AddIconProps {
|
||||
style?: React.CSSProperties;
|
||||
className?: string;
|
||||
onClick?: () => void;
|
||||
}
|
||||
|
||||
const ResetIcon = ({
|
||||
className = "",
|
||||
style = {},
|
||||
onClick
|
||||
}: AddIconProps): JSX.Element => (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
className={className}
|
||||
style={style}
|
||||
onClick={onClick} >
|
||||
<path
|
||||
d="M 23.993883,23.993883 H 0.006117 V 0.006117 h 23.987766 z"
|
||||
fill="none"
|
||||
id="path2"
|
||||
style={{strokeWidth: 0.99949}} />
|
||||
<path
|
||||
d="m 3.508834,3.5213414 c -2.1778668,2.1778667 -3.52964574,5.1668007 -3.52964574,8.4861686 0,6.638738 5.37707764,12.000795 12.01581474,12.000795 6.638737,0 12.015814,-5.362057 12.015814,-12.000795 0,-5.6023732 -3.830041,-10.273521 -9.011861,-11.61028034 V 3.5213414 c 3.499607,1.2316209 6.007907,4.5660093 6.007907,8.4861686 0,4.971544 -4.040317,9.011861 -9.01186,9.011861 -4.9715438,0 -9.0118611,-4.040317 -9.0118611,-9.011861 0,-2.4932821 1.0363647,-4.7162068 2.6735186,-6.3383421 L 10.493026,10.505534 V -0.00830443 H -0.02081174 Z"
|
||||
id="path4"
|
||||
style={{strokeWidth: 1.50198}} />
|
||||
</svg>
|
||||
);
|
||||
|
||||
export default ResetIcon;
|
||||
@@ -30,6 +30,7 @@ export interface VideoDurationResponse {
|
||||
}
|
||||
|
||||
export enum CategorySkipOption {
|
||||
FallbackToDefault = -2,
|
||||
Disabled = -1,
|
||||
ShowOverlay,
|
||||
ManualSkip,
|
||||
|
||||
21
src/utils.ts
21
src/utils.ts
@@ -6,6 +6,8 @@ import { waitFor } from "../maze-utils/src";
|
||||
import { findValidElementFromSelector } from "../maze-utils/src/dom";
|
||||
import { isSafari } from "../maze-utils/src/config";
|
||||
import { asyncRequestToServer } from "./utils/requests";
|
||||
import { FetchResponse, logRequest } from "../maze-utils/src/background-request-proxy";
|
||||
import { formatJSErrorMessage, getLongErrorMessage } from "../maze-utils/src/formating";
|
||||
|
||||
export default class Utils {
|
||||
|
||||
@@ -276,13 +278,24 @@ export default class Utils {
|
||||
|| !Config.config.trackDownvotes) return;
|
||||
|
||||
if (segmentUUID.length < 60) {
|
||||
const segmentIDData = await asyncRequestToServer("GET", "/api/segmentID", {
|
||||
UUID: segmentUUID,
|
||||
videoID
|
||||
});
|
||||
let segmentIDData: FetchResponse;
|
||||
try {
|
||||
segmentIDData = await asyncRequestToServer("GET", "/api/segmentID", {
|
||||
UUID: segmentUUID,
|
||||
videoID
|
||||
});
|
||||
} catch (e) {
|
||||
console.error("[SB] Caught error while trying to resolve the segment UUID to be hidden", e);
|
||||
alert(`${chrome.i18n.getMessage("segmentHideFailed")}\n${formatJSErrorMessage(e)}`);
|
||||
return;
|
||||
}
|
||||
|
||||
if (segmentIDData.ok && segmentIDData.responseText) {
|
||||
segmentUUID = segmentIDData.responseText;
|
||||
} else {
|
||||
logRequest(segmentIDData, "SB", "segment UUID resolution");
|
||||
alert(`${chrome.i18n.getMessage("segmentHideFailed")}\n${getLongErrorMessage(segmentIDData.status, segmentIDData.responseText)}`);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { ActionType, Category, SponsorSourceType, SponsorTime, VideoID } from "../types";
|
||||
import { getFormattedTimeToSeconds } from "../../maze-utils/src/formating";
|
||||
import Config from "../config";
|
||||
import { getSkipProfileBool } from "./skipProfiles";
|
||||
|
||||
export function getControls(): HTMLElement {
|
||||
const controlsSelectors = [
|
||||
@@ -70,7 +70,7 @@ export function getExistingChapters(currentVideoID: VideoID, duration: number):
|
||||
if (title?.textContent?.includes("Key moment")) return [];
|
||||
|
||||
const autogenerated = hasAutogeneratedChapters();
|
||||
if (!Config.config.showAutogeneratedChapters && autogenerated) return [];
|
||||
if (!getSkipProfileBool("showAutogeneratedChapters") && autogenerated) return [];
|
||||
|
||||
const chapters: SponsorTime[] = [];
|
||||
// .ytp-timed-markers-container indicates that key-moments are present, which should not be divided
|
||||
|
||||
@@ -2,17 +2,6 @@ import Config from "../config";
|
||||
import * as CompileConfig from "../../config.json";
|
||||
import { FetchResponse, sendRequestToCustomServer } from "../../maze-utils/src/background-request-proxy";
|
||||
|
||||
/**
|
||||
* Sends a request to a custom server
|
||||
*
|
||||
* @param type The request type. "GET", "POST", etc.
|
||||
* @param address The address to add to the SponsorBlock server address
|
||||
* @param callback
|
||||
*/
|
||||
export function asyncRequestToCustomServer(type: string, url: string, data = {}, headers = {}): Promise<FetchResponse> {
|
||||
return sendRequestToCustomServer(type, url, data, headers);
|
||||
}
|
||||
|
||||
/**
|
||||
* Sends a request to the SponsorBlock server with address added as a query
|
||||
*
|
||||
@@ -23,25 +12,5 @@ export function asyncRequestToCustomServer(type: string, url: string, data = {},
|
||||
export async function asyncRequestToServer(type: string, address: string, data = {}, headers = {}): Promise<FetchResponse> {
|
||||
const serverAddress = Config.config.testingServer ? CompileConfig.testingServerAddress : Config.config.serverAddress;
|
||||
|
||||
return await (asyncRequestToCustomServer(type, serverAddress + address, data, headers));
|
||||
}
|
||||
|
||||
/**
|
||||
* Sends a request to the SponsorBlock server with address added as a query
|
||||
*
|
||||
* @param type The request type. "GET", "POST", etc.
|
||||
* @param address The address to add to the SponsorBlock server address
|
||||
* @param callback
|
||||
*/
|
||||
export function sendRequestToServer(type: string, address: string, callback?: (response: FetchResponse) => void): void {
|
||||
const serverAddress = Config.config.testingServer ? CompileConfig.testingServerAddress : Config.config.serverAddress;
|
||||
|
||||
// Ask the background script to do the work
|
||||
chrome.runtime.sendMessage({
|
||||
message: "sendRequest",
|
||||
type,
|
||||
url: serverAddress + address
|
||||
}, (response) => {
|
||||
callback(response);
|
||||
});
|
||||
return await (sendRequestToCustomServer(type, serverAddress + address, data, headers));
|
||||
}
|
||||
@@ -2,10 +2,11 @@ import { DataCache } from "../../maze-utils/src/cache";
|
||||
import { getHash, HashedValue } from "../../maze-utils/src/hash";
|
||||
import Config, { } from "../config";
|
||||
import * as CompileConfig from "../../config.json";
|
||||
import { ActionType, ActionTypes, SponsorSourceType, SponsorTime, VideoID } from "../types";
|
||||
import { ActionTypes, SponsorSourceType, SponsorTime, VideoID } from "../types";
|
||||
import { getHashParams } from "./pageUtils";
|
||||
import { asyncRequestToServer } from "./requests";
|
||||
import { extensionUserAgent } from "../../maze-utils/src";
|
||||
import { logRequest, serializeOrStringify } from "../../maze-utils/src/background-request-proxy";
|
||||
|
||||
const segmentDataCache = new DataCache<VideoID, SegmentResponse>(() => {
|
||||
return {
|
||||
@@ -18,7 +19,7 @@ const pendingList: Record<VideoID, Promise<SegmentResponse>> = {};
|
||||
|
||||
export interface SegmentResponse {
|
||||
segments: SponsorTime[] | null;
|
||||
status: number;
|
||||
status: number | Error | string;
|
||||
}
|
||||
|
||||
export async function getSegmentsForVideo(videoID: VideoID, ignoreCache: boolean): Promise<SegmentResponse> {
|
||||
@@ -37,8 +38,18 @@ export async function getSegmentsForVideo(videoID: VideoID, ignoreCache: boolean
|
||||
const pendingData = fetchSegmentsForVideo(videoID);
|
||||
pendingList[videoID] = pendingData;
|
||||
|
||||
const result = await pendingData;
|
||||
delete pendingList[videoID];
|
||||
let result: Awaited<typeof pendingData>;
|
||||
try {
|
||||
result = await pendingData;
|
||||
} catch (e) {
|
||||
console.error("[SB] Caught error while fetching segments", e);
|
||||
return {
|
||||
segments: null,
|
||||
status: serializeOrStringify(e),
|
||||
}
|
||||
} finally {
|
||||
delete pendingList[videoID];
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
@@ -60,12 +71,9 @@ async function fetchSegmentsForVideo(videoID: VideoID): Promise<SegmentResponse>
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
const enabledActionTypes = getEnabledActionTypes();
|
||||
|
||||
const receivedSegments: SponsorTime[] = JSON.parse(response.responseText)
|
||||
?.filter((video) => video.videoID === videoID)
|
||||
?.map((video) => video.segments)?.[0]
|
||||
?.filter((segment) => enabledActionTypes.includes(segment.actionType))
|
||||
?.map((segment) => ({
|
||||
...segment,
|
||||
source: SponsorSourceType.Server
|
||||
@@ -85,21 +93,10 @@ async function fetchSegmentsForVideo(videoID: VideoID): Promise<SegmentResponse>
|
||||
segmentDataCache.setupCache(videoID);
|
||||
}
|
||||
}
|
||||
if (response.status !== 404) logRequest(response, "SB", "skip segments");
|
||||
|
||||
return {
|
||||
segments: null,
|
||||
status: response.status
|
||||
};
|
||||
}
|
||||
|
||||
function getEnabledActionTypes(forceFullVideo = false): ActionType[] {
|
||||
const actionTypes = [ActionType.Skip, ActionType.Poi, ActionType.Chapter];
|
||||
if (Config.config.muteSegments) {
|
||||
actionTypes.push(ActionType.Mute);
|
||||
}
|
||||
if (Config.config.fullVideoSegments || forceFullVideo) {
|
||||
actionTypes.push(ActionType.Full);
|
||||
}
|
||||
|
||||
return actionTypes;
|
||||
}
|
||||
97
src/utils/skipProfiles.ts
Normal file
97
src/utils/skipProfiles.ts
Normal file
@@ -0,0 +1,97 @@
|
||||
import { getChannelIDInfo, getVideoID } from "../../maze-utils/src/video";
|
||||
import Config, { ConfigurationID, CustomConfiguration } from "../config";
|
||||
import { SponsorHideType, SponsorTime } from "../types";
|
||||
|
||||
let currentTabSkipProfile: ConfigurationID = null;
|
||||
|
||||
export function getSkipProfileIDForTime(): ConfigurationID | null {
|
||||
if (Config.local.skipProfileTemp !== null && Config.local.skipProfileTemp.time > Date.now() - 60 * 60 * 1000) {
|
||||
return Config.local.skipProfileTemp.configID;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
export function getSkipProfileIDForTab(): ConfigurationID | null {
|
||||
return currentTabSkipProfile;
|
||||
}
|
||||
|
||||
export function setCurrentTabSkipProfile(configID: ConfigurationID | null) {
|
||||
currentTabSkipProfile = configID ?? null;
|
||||
}
|
||||
|
||||
export function getSkipProfileIDForVideo(): ConfigurationID | null {
|
||||
return Config.local.channelSkipProfileIDs[getVideoID()] ?? null;
|
||||
}
|
||||
|
||||
export function getSkipProfileIDForChannel(): ConfigurationID | null {
|
||||
const channelInfo = getChannelIDInfo();
|
||||
|
||||
if (!channelInfo) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return Config.local.channelSkipProfileIDs[channelInfo.id]
|
||||
?? Config.local.channelSkipProfileIDs[channelInfo.author]
|
||||
?? null;
|
||||
}
|
||||
|
||||
export function getSkipProfileID(): ConfigurationID | null {
|
||||
const configID =
|
||||
getSkipProfileIDForTime()
|
||||
?? getSkipProfileIDForTab()
|
||||
?? getSkipProfileIDForVideo()
|
||||
?? getSkipProfileIDForChannel();
|
||||
|
||||
return configID ?? null;
|
||||
}
|
||||
|
||||
export function getSkipProfile(): CustomConfiguration | null {
|
||||
const configID = getSkipProfileID();
|
||||
|
||||
if (configID) {
|
||||
return Config.local.skipProfiles[configID];
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
type SkipProfileBoolKey =
|
||||
"showAutogeneratedChapters"
|
||||
| "autoSkipOnMusicVideos"
|
||||
| "skipNonMusicOnlyOnYoutubeMusic"
|
||||
| "muteSegments"
|
||||
| "fullVideoSegments"
|
||||
| "manualSkipOnFullVideo";
|
||||
|
||||
export function getSkipProfileBool(key: SkipProfileBoolKey): boolean {
|
||||
return getSkipProfileValue<boolean>(key);
|
||||
}
|
||||
|
||||
export function getSkipProfileNum(key: "minDuration"): number {
|
||||
return getSkipProfileValue<number>(key);
|
||||
}
|
||||
|
||||
function getSkipProfileValue<T>(key: keyof CustomConfiguration): T {
|
||||
const profile = getSkipProfile();
|
||||
if (profile && profile[key] !== null) {
|
||||
return profile[key] as T;
|
||||
}
|
||||
|
||||
return Config.config[key];
|
||||
}
|
||||
|
||||
export function hideTooShortSegments(sponsorTimes: SponsorTime[]) {
|
||||
const minDuration = getSkipProfileNum("minDuration");
|
||||
|
||||
if (minDuration !== 0) {
|
||||
for (const segment of sponsorTimes) {
|
||||
const duration = segment.segment[1] - segment.segment[0];
|
||||
if (duration > 0 && duration < minDuration && (segment.hidden === SponsorHideType.Visible || SponsorHideType.MinimumDuration)) {
|
||||
segment.hidden = SponsorHideType.MinimumDuration;
|
||||
} else if (segment.hidden === SponsorHideType.MinimumDuration) {
|
||||
segment.hidden = SponsorHideType.Visible;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -2,6 +2,7 @@ import { getCurrentPageTitle } from "../../maze-utils/src/elements";
|
||||
import { getChannelIDInfo, getVideoDuration } from "../../maze-utils/src/video";
|
||||
import Config from "../config";
|
||||
import { CategorySelection, CategorySkipOption, SponsorSourceType, SponsorTime } from "../types";
|
||||
import { getSkipProfile, getSkipProfileBool } from "./skipProfiles";
|
||||
import { VideoLabelsCacheData } from "./videoLabels";
|
||||
|
||||
export interface Permission {
|
||||
@@ -53,12 +54,28 @@ export interface AdvancedSkipRuleSet {
|
||||
}
|
||||
|
||||
export function getCategorySelection(segment: SponsorTime | VideoLabelsCacheData): CategorySelection {
|
||||
// First check skip rules
|
||||
for (const ruleSet of Config.local.skipRules) {
|
||||
if (ruleSet.rules.every((rule) => isSkipRulePassing(segment, rule))) {
|
||||
return { name: segment.category, option: ruleSet.skipOption } as CategorySelection;
|
||||
}
|
||||
}
|
||||
|
||||
// Action type filters
|
||||
if ("actionType" in segment && (segment as SponsorTime).actionType === "mute" && !getSkipProfileBool("muteSegments")) {
|
||||
return { name: segment.category, option: CategorySkipOption.Disabled } as CategorySelection;
|
||||
}
|
||||
|
||||
// Then check skip profile
|
||||
const profile = getSkipProfile();
|
||||
if (profile) {
|
||||
const profileSelection = profile.categorySelections.find(selection => selection.name === segment.category);
|
||||
if (profileSelection) {
|
||||
return profileSelection;
|
||||
}
|
||||
}
|
||||
|
||||
// Then fallback to default
|
||||
for (const selection of Config.config.categorySelections) {
|
||||
if (selection.name === segment.category) {
|
||||
return selection;
|
||||
|
||||
@@ -3,6 +3,7 @@ import { getHash } from "../../maze-utils/src/hash";
|
||||
import { logWarn } from "./logger";
|
||||
import { asyncRequestToServer } from "./requests";
|
||||
import { getCategorySelection } from "./skipRule";
|
||||
import { FetchResponse, logRequest } from "../../maze-utils/src/background-request-proxy";
|
||||
|
||||
export interface VideoLabelsCacheData {
|
||||
category: Category;
|
||||
@@ -24,8 +25,15 @@ async function getLabelHashBlock(hashPrefix: string): Promise<LabelCacheEntry |
|
||||
return cachedEntry;
|
||||
}
|
||||
|
||||
const response = await asyncRequestToServer("GET", `/api/videoLabels/${hashPrefix}?hasStartSegment=true`);
|
||||
let response: FetchResponse;
|
||||
try {
|
||||
response = await asyncRequestToServer("GET", `/api/videoLabels/${hashPrefix}?hasStartSegment=true`);
|
||||
} catch (e) {
|
||||
console.error("[SB] Caught error while fetching video labels", e)
|
||||
return null;
|
||||
}
|
||||
if (response.status !== 200) {
|
||||
logRequest(response, "SB", "video labels");
|
||||
// No video labels or server down
|
||||
labelCache[hashPrefix] = {
|
||||
timestamp: Date.now(),
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
import { objectToURI } from "../../maze-utils/src";
|
||||
import { FetchResponse, logRequest } from "../../maze-utils/src/background-request-proxy";
|
||||
import { formatJSErrorMessage, getLongErrorMessage } from "../../maze-utils/src/formating";
|
||||
import { getHash } from "../../maze-utils/src/hash";
|
||||
import Config from "../config";
|
||||
import GenericNotice, { NoticeOptions } from "../render/GenericNotice";
|
||||
@@ -12,15 +14,26 @@ export interface ChatConfig {
|
||||
}
|
||||
|
||||
export async function openWarningDialog(contentContainer: ContentContainer): Promise<void> {
|
||||
const userInfo = await asyncRequestToServer("GET", "/api/userInfo", {
|
||||
publicUserID: await getHash(Config.config.userID),
|
||||
values: ["warningReason"]
|
||||
});
|
||||
let userInfo: FetchResponse;
|
||||
try {
|
||||
userInfo = await asyncRequestToServer("GET", "/api/userInfo", {
|
||||
publicUserID: await getHash(Config.config.userID),
|
||||
values: ["warningReason"]
|
||||
});
|
||||
} catch (e) {
|
||||
console.error("[SB] Caught error while trying to fetch user's active warnings", e)
|
||||
return;
|
||||
}
|
||||
|
||||
if (userInfo.ok) {
|
||||
const warningReason = JSON.parse(userInfo.responseText)?.warningReason;
|
||||
const userNameData = await asyncRequestToServer("GET", "/api/getUsername?userID=" + Config.config.userID);
|
||||
const userName = userNameData.ok ? JSON.parse(userNameData.responseText).userName : "";
|
||||
let userName = "";
|
||||
try {
|
||||
const userNameData = await asyncRequestToServer("GET", "/api/getUsername?userID=" + Config.config.userID);
|
||||
userName = userNameData.ok ? JSON.parse(userNameData.responseText).userName : "";
|
||||
} catch (e) {
|
||||
console.warn("[SB] Caught non-fatal error while trying to resolve user's username", e);
|
||||
}
|
||||
const publicUserID = await getHash(Config.config.userID);
|
||||
|
||||
let notice: GenericNotice = null;
|
||||
@@ -42,15 +55,22 @@ export async function openWarningDialog(contentContainer: ContentContainer): Pro
|
||||
{
|
||||
name: chrome.i18n.getMessage("warningConfirmButton"),
|
||||
listener: async () => {
|
||||
const result = await asyncRequestToServer("POST", "/api/warnUser", {
|
||||
userID: Config.config.userID,
|
||||
enabled: false
|
||||
});
|
||||
let result: FetchResponse;
|
||||
try {
|
||||
result = await asyncRequestToServer("POST", "/api/warnUser", {
|
||||
userID: Config.config.userID,
|
||||
enabled: false
|
||||
});
|
||||
} catch (e) {
|
||||
console.error("[SB] Caught error while trying to acknowledge user's active warning", e);
|
||||
alert(formatJSErrorMessage(e));
|
||||
}
|
||||
|
||||
if (result.ok) {
|
||||
notice?.close();
|
||||
} else {
|
||||
alert(`${chrome.i18n.getMessage("warningError")} ${result.status}`);
|
||||
logRequest(result, "SB", "warning acknowledgement");
|
||||
alert(getLongErrorMessage(result.status, result.responseText));
|
||||
}
|
||||
}
|
||||
}],
|
||||
@@ -58,6 +78,8 @@ export async function openWarningDialog(contentContainer: ContentContainer): Pro
|
||||
};
|
||||
|
||||
notice = new GenericNotice(contentContainer, "warningNotice", options);
|
||||
} else {
|
||||
logRequest(userInfo, "SB", "user's active warnings");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user