Merge branch 'master' into loop-chapters

This commit is contained in:
Gosha
2025-09-15 07:34:25 +02:00
committed by GitHub
38 changed files with 2659 additions and 3988 deletions

View File

@@ -13,5 +13,8 @@
},
"browser_action": {
"default_area": "navbar"
}
},
"permissions": [
"unlimitedStorage"
]
}

4291
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -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"

View File

@@ -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%;
}

View File

@@ -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">

View File

@@ -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;
}

View File

@@ -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),
};
}
}

View File

@@ -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));
}
}
}

View File

@@ -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));
}
}
}

View File

@@ -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 {

View File

@@ -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}
</>);
}

View File

@@ -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 [];
}
}

View 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>
);
}

View 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>
);
});
}

View File

@@ -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;

View File

@@ -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);
}

View File

@@ -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));
}
}

View File

@@ -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;

View File

@@ -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;

View File

@@ -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)
});
}

View File

@@ -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;
}
}
}

View File

@@ -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);
}
}

View File

@@ -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));
});
}
}}>

View File

@@ -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;

View File

@@ -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,

View 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;

View File

@@ -30,6 +30,7 @@ export interface VideoDurationResponse {
}
export enum CategorySkipOption {
FallbackToDefault = -2,
Disabled = -1,
ShowOverlay,
ManualSkip,

View File

@@ -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;
}
}

View File

@@ -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

View File

@@ -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));
}

View File

@@ -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
View 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;
}
}
}
}

View File

@@ -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;

View File

@@ -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(),

View File

@@ -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");
}
}