external/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2024-09-19 20:51:28 +02:00
Code Issues Projects Releases Packages Wiki Activity

Move video handing and config to shared library

Browse source
This commit is contained in:
Ajay 2023-02-13 02:31:25 -05:00
parent f4d80d8843
commit 5859c33ce8
11 changed files with 386 additions and 999 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
package-lock.json generated
View file

@ -27,7 +27,7 @@
],
"license": "LGPL-3.0-or-later",
"dependencies": {
"@ajayyy/maze-utils": "^1.0.3",
"@ajayyy/maze-utils": "^1.1.0",
"content-scripts-register-polyfill": "^4.0.2",
"react": "^18.2.0",
"react-dom": "^18.2.0"
@ -68,9 +68,9 @@
}
},
"node_modules/@ajayyy/maze-utils": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/@ajayyy/maze-utils/-/maze-utils-1.0.3.tgz",
"integrity": "sha512-sdQyU/2VAmJ9FiyUIdjE8FbO5b5IofN9vK/7lkZiUw91V+NZi7aSG/LSYMqmQ3OuTYRE5PLN9Jyknuo2ZnljjA==",
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@ajayyy/maze-utils/-/maze-utils-1.1.0.tgz",
"integrity": "sha512-Dc63B4Qbad14R590837b1ST0WFT8wWy4YFUmwheMiVABiG+G2m7o6wdq7Ln12pT/QUQO6h4/oKijEF3/ojXDVg==",
"funding": [
{
"type": "individual",
@ -13420,9 +13420,9 @@
},
"dependencies": {
"@ajayyy/maze-utils": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/@ajayyy/maze-utils/-/maze-utils-1.0.3.tgz",
"integrity": "sha512-sdQyU/2VAmJ9FiyUIdjE8FbO5b5IofN9vK/7lkZiUw91V+NZi7aSG/LSYMqmQ3OuTYRE5PLN9Jyknuo2ZnljjA=="
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@ajayyy/maze-utils/-/maze-utils-1.1.0.tgz",
"integrity": "sha512-Dc63B4Qbad14R590837b1ST0WFT8wWy4YFUmwheMiVABiG+G2m7o6wdq7Ln12pT/QUQO6h4/oKijEF3/ojXDVg=="
},
"@ampproject/remapping": {
"version": "2.2.0",

2
package.json
View file

@ -4,7 +4,7 @@
"description": "",
"main": "background.js",
"dependencies": {
"@ajayyy/maze-utils": "^1.0.3",
"@ajayyy/maze-utils": "^1.1.0",
"content-scripts-register-polyfill": "^4.0.2",
"react": "^18.2.0",
"react-dom": "^18.2.0"

398
src/config.ts
View file

@ -1,7 +1,8 @@
import * as CompileConfig from "../config.json";
import * as invidiousList from "../ci/invidiouslist.json";
import { Category, CategorySelection, CategorySkipOption, NoticeVisbilityMode, PreviewBarOption, SponsorTime, StorageChangesObject, Keybind, HashedValue, VideoID, SponsorHideType } from "./types";
import { Category, CategorySelection, CategorySkipOption, NoticeVisbilityMode, PreviewBarOption, SponsorTime, Keybind, HashedValue, VideoID, SponsorHideType } from "./types";
import { isSafari, keybindEquals } from "./utils/configUtils";
import { ProtoConfig, StorageChangesObject } from "@ajayyy/maze-utils/lib/config";
export interface Permission {
canSubmit: boolean;
@ -143,13 +144,118 @@ export interface SBObject {
resetToDefault(): void;
}
const Config: SBObject = {
/**
* Callback function when an option is updated
*/
configLocalListeners: [],
configSyncListeners: [],
syncDefaults: {
class ConfigClass extends ProtoConfig<SBConfig, SBStorage> {
resetToDefault() {
chrome.storage.sync.set({
...this.syncDefaults,
userID: this.config.userID,
minutesSaved: this.config.minutesSaved,
skipCount: this.config.skipCount,
sponsorTimesContributed: this.config.sponsorTimesContributed
});
}
}
function migrateOldSyncFormats(config: SBConfig) {
if (config["segmentTimes"]) {
const unsubmittedSegments = {};
for (const item of config["segmentTimes"]) {
unsubmittedSegments[item[0]] = item[1];
}
chrome.storage.sync.remove("segmentTimes", () => config.unsubmittedSegments = unsubmittedSegments);
}
if (!config["exclusive_accessCategoryAdded"] && !config.categorySelections.some((s) => s.name === "exclusive_access")) {
config["exclusive_accessCategoryAdded"] = true;
config.categorySelections.push({
name: "exclusive_access" as Category,
option: CategorySkipOption.ShowOverlay
});
config.categorySelections = config.categorySelections;
}
if (config["fillerUpdate"] !== undefined) {
chrome.storage.sync.remove("fillerUpdate");
}
if (config["highlightCategoryAdded"] !== undefined) {
chrome.storage.sync.remove("highlightCategoryAdded");
}
if (config["highlightCategoryUpdate"] !== undefined) {
chrome.storage.sync.remove("highlightCategoryUpdate");
}
if (config["askAboutUnlistedVideos"]) {
chrome.storage.sync.remove("askAboutUnlistedVideos");
}
if (!config["autoSkipOnMusicVideosUpdate"]) {
config["autoSkipOnMusicVideosUpdate"] = true;
for (const selection of config.categorySelections) {
if (selection.name === "music_offtopic"
&& selection.option === CategorySkipOption.AutoSkip) {
config.autoSkipOnMusicVideos = true;
break;
}
}
}
if (config["disableAutoSkip"]) {
for (const selection of config.categorySelections) {
if (selection.name === "sponsor") {
selection.option = CategorySkipOption.ManualSkip;
chrome.storage.sync.remove("disableAutoSkip");
}
}
}
if (typeof config["skipKeybind"] == "string") {
config["skipKeybind"] = { key: config["skipKeybind"] };
}
if (typeof config["startSponsorKeybind"] == "string") {
config["startSponsorKeybind"] = { key: config["startSponsorKeybind"] };
}
if (typeof config["submitKeybind"] == "string") {
config["submitKeybind"] = { key: config["submitKeybind"] };
}
// Unbind key if it matches a previous one set by the user (should be ordered oldest to newest)
const keybinds = ["skipKeybind", "startSponsorKeybind", "submitKeybind"];
for (let i = keybinds.length - 1; i >= 0; i--) {
for (let j = 0; j < keybinds.length; j++) {
if (i == j)
continue;
if (keybindEquals(config[keybinds[i]], config[keybinds[j]]))
config[keybinds[i]] = null;
}
}
// Remove some old unused options
if (config["sponsorVideoID"] !== undefined) {
chrome.storage.sync.remove("sponsorVideoID");
}
if (config["previousVideoID"] !== undefined) {
chrome.storage.sync.remove("previousVideoID");
}
// populate invidiousInstances with new instances if 3p support is **DISABLED**
// for safari, update it immediately
if ((isSafari() || !config["supportInvidious"]) && config["invidiousInstances"].length !== invidiousList.length) {
config["invidiousInstances"] = invidiousList;
}
if (config["lastIsVipUpdate"]) {
chrome.storage.sync.remove("lastIsVipUpdate");
}
}
const syncDefaults = {
userID: null,
isVip: false,
permissions: {},
@ -330,280 +436,12 @@ const Config: SBObject = {
opacity: "0.7"
}
}
},
localDefaults: {
};
const localDefaults = {
downvotedSegments: {},
navigationApiAvailable: null
},
cachedSyncConfig: null,
cachedLocalStorage: null,
config: null,
local: null,
forceSyncUpdate,
forceLocalUpdate,
resetToDefault
};
// Function setup
function configProxy(): { sync: SBConfig; local: SBStorage } {
chrome.storage.onChanged.addListener((changes: {[key: string]: chrome.storage.StorageChange}, areaName) => {
if (areaName === "sync") {
for (const key in changes) {
Config.cachedSyncConfig[key] = changes[key].newValue;
}
for (const callback of Config.configSyncListeners) {
callback(changes);
}
} else if (areaName === "local") {
for (const key in changes) {
Config.cachedLocalStorage[key] = changes[key].newValue;
}
for (const callback of Config.configLocalListeners) {
callback(changes);
}
}
});
const syncHandler: ProxyHandler<SBConfig> = {
set<K extends keyof SBConfig>(obj: SBConfig, prop: K, value: SBConfig[K]) {
Config.cachedSyncConfig[prop] = value;
chrome.storage.sync.set({
[prop]: value
});
return true;
},
get<K extends keyof SBConfig>(obj: SBConfig, prop: K): SBConfig[K] {
const data = Config.cachedSyncConfig[prop];
return obj[prop] || data;
},
deleteProperty(obj: SBConfig, prop: keyof SBConfig) {
chrome.storage.sync.remove(<string> prop);
return true;
}
};
const localHandler: ProxyHandler<SBStorage> = {
set<K extends keyof SBStorage>(obj: SBStorage, prop: K, value: SBStorage[K]) {
Config.cachedLocalStorage[prop] = value;
chrome.storage.local.set({
[prop]: value
});
return true;
},
get<K extends keyof SBStorage>(obj: SBStorage, prop: K): SBStorage[K] {
const data = Config.cachedLocalStorage[prop];
return obj[prop] || data;
},
deleteProperty(obj: SBStorage, prop: keyof SBStorage) {
chrome.storage.local.remove(<string> prop);
return true;
}
};
return {
sync: new Proxy<SBConfig>({ handler: syncHandler } as unknown as SBConfig, syncHandler),
local: new Proxy<SBStorage>({ handler: localHandler } as unknown as SBStorage, localHandler)
};
}
function forceSyncUpdate(prop: string): void {
const value = Config.cachedSyncConfig[prop];
if (prop === "unsubmittedSegments") {
// Early to be safe
if (JSON.stringify(value).length + prop.length > 8000) {
for (const key in value) {
if (!value[key] || value[key].length <= 0) {
delete value[key];
}
}
}
}
chrome.storage.sync.set({
[prop]: value
});
}
function forceLocalUpdate(prop: string): void {
chrome.storage.local.set({
[prop]: Config.cachedLocalStorage[prop]
});
}
async function fetchConfig(): Promise<void> {
await Promise.all([new Promise<void>((resolve) => {
chrome.storage.sync.get(null, function(items) {
Config.cachedSyncConfig = <SBConfig> <unknown> items;
resolve();
});
}), new Promise<void>((resolve) => {
chrome.storage.local.get(null, function(items) {
Config.cachedLocalStorage = <SBStorage> <unknown> items;
resolve();
});
})]);
}
function migrateOldSyncFormats(config: SBConfig) {
if (config["segmentTimes"]) {
const unsubmittedSegments = {};
for (const item of config["segmentTimes"]) {
unsubmittedSegments[item[0]] = item[1];
}
chrome.storage.sync.remove("segmentTimes", () => config.unsubmittedSegments = unsubmittedSegments);
}
if (!config["exclusive_accessCategoryAdded"] && !config.categorySelections.some((s) => s.name === "exclusive_access")) {
config["exclusive_accessCategoryAdded"] = true;
config.categorySelections.push({
name: "exclusive_access" as Category,
option: CategorySkipOption.ShowOverlay
});
config.categorySelections = config.categorySelections;
}
if (config["fillerUpdate"] !== undefined) {
chrome.storage.sync.remove("fillerUpdate");
}
if (config["highlightCategoryAdded"] !== undefined) {
chrome.storage.sync.remove("highlightCategoryAdded");
}
if (config["highlightCategoryUpdate"] !== undefined) {
chrome.storage.sync.remove("highlightCategoryUpdate");
}
if (config["askAboutUnlistedVideos"]) {
chrome.storage.sync.remove("askAboutUnlistedVideos");
}
if (!config["autoSkipOnMusicVideosUpdate"]) {
config["autoSkipOnMusicVideosUpdate"] = true;
for (const selection of config.categorySelections) {
if (selection.name === "music_offtopic"
&& selection.option === CategorySkipOption.AutoSkip) {
config.autoSkipOnMusicVideos = true;
break;
}
}
}
if (config["disableAutoSkip"]) {
for (const selection of config.categorySelections) {
if (selection.name === "sponsor") {
selection.option = CategorySkipOption.ManualSkip;
chrome.storage.sync.remove("disableAutoSkip");
}
}
}
if (typeof config["skipKeybind"] == "string") {
config["skipKeybind"] = {key: config["skipKeybind"]};
}
if (typeof config["startSponsorKeybind"] == "string") {
config["startSponsorKeybind"] = {key: config["startSponsorKeybind"]};
}
if (typeof config["submitKeybind"] == "string") {
config["submitKeybind"] = {key: config["submitKeybind"]};
}
// Unbind key if it matches a previous one set by the user (should be ordered oldest to newest)
const keybinds = ["skipKeybind", "startSponsorKeybind", "submitKeybind"];
for (let i = keybinds.length-1; i >= 0; i--) {
for (let j = 0; j < keybinds.length; j++) {
if (i == j)
continue;
if (keybindEquals(config[keybinds[i]], config[keybinds[j]]))
config[keybinds[i]] = null;
}
}
// Remove some old unused options
if (config["sponsorVideoID"] !== undefined) {
chrome.storage.sync.remove("sponsorVideoID");
}
if (config["previousVideoID"] !== undefined) {
chrome.storage.sync.remove("previousVideoID");
}
// populate invidiousInstances with new instances if 3p support is **DISABLED**
// for safari, update it immediately
if ((isSafari() || !config["supportInvidious"]) && config["invidiousInstances"].length !== invidiousList.length) {
config["invidiousInstances"] = invidiousList;
}
if (config["lastIsVipUpdate"]) {
chrome.storage.sync.remove("lastIsVipUpdate");
}
}
async function setupConfig() {
if (typeof(chrome) === "undefined") return;
await fetchConfig();
addDefaults();
const config = configProxy();
migrateOldSyncFormats(config.sync);
Config.config = config.sync;
Config.local = config.local;
}
// Add defaults
function addDefaults() {
for (const key in Config.syncDefaults) {
if(!Object.prototype.hasOwnProperty.call(Config.cachedSyncConfig, key)) {
Config.cachedSyncConfig[key] = Config.syncDefaults[key];
} else if (key === "barTypes") {
for (const key2 in Config.syncDefaults[key]) {
if(!Object.prototype.hasOwnProperty.call(Config.cachedSyncConfig[key], key2)) {
Config.cachedSyncConfig[key][key2] = Config.syncDefaults[key][key2];
}
}
}
}
for (const key in Config.localDefaults) {
if(!Object.prototype.hasOwnProperty.call(Config.cachedLocalStorage, key)) {
Config.cachedLocalStorage[key] = Config.localDefaults[key];
}
}
}
function resetToDefault() {
chrome.storage.sync.set({
...Config.syncDefaults,
userID: Config.config.userID,
minutesSaved: Config.config.minutesSaved,
skipCount: Config.config.skipCount,
sponsorTimesContributed: Config.config.sponsorTimesContributed
});
}
// Sync config
setupConfig();
const Config = new ConfigClass(syncDefaults, localDefaults, migrateOldSyncFormats);
export default Config;

596
src/content.ts
View file

File diff suppressed because it is too large Load diff

96
src/document.ts
View file

@ -1,95 +1,3 @@
/*
Content script are run in an isolated DOM so it is not possible to access some key details that are sanitized when passed cross-dom
This script is used to get the details from the page and make them available for the content script by being injected directly into the page
*/
import { init } from "@ajayyy/maze-utils/lib/injected/document";
import { PageType } from "./types";
interface StartMessage {
type: "navigation";
pageType: PageType;
videoID: string | null;
}
interface FinishMessage extends StartMessage {
channelID: string;
channelTitle: string;
}
interface AdMessage {
type: "ad";
playing: boolean;
}
interface VideoData {
type: "data";
videoID: string;
isLive: boolean;
isPremiere: boolean;
}
type WindowMessage = StartMessage | FinishMessage | AdMessage | VideoData;
// global playerClient - too difficult to type
// eslint-disable-next-line @typescript-eslint/no-explicit-any
let playerClient: any;
let lastVideo = "";
const sendMessage = (message: WindowMessage): void => {
window.postMessage({ source: "sponsorblock", ...message }, "/");
}
function setupPlayerClient(e: CustomEvent): void {
if (playerClient) return; // early exit if already defined
playerClient = e.detail;
sendVideoData(); // send playerData after setup
e.detail.addEventListener('onAdStart', () => sendMessage({ type: "ad", playing: true } as AdMessage));
e.detail.addEventListener('onAdFinish', () => sendMessage({ type: "ad", playing: false } as AdMessage));
}
document.addEventListener("yt-player-updated", setupPlayerClient);
document.addEventListener("yt-navigate-start", navigationStartSend);
document.addEventListener("yt-navigate-finish", navigateFinishSend);
function navigationParser(event: CustomEvent): StartMessage {
const pageType: PageType = event.detail.pageType;
if (pageType) {
const result: StartMessage = { type: "navigation", pageType, videoID: null };
if (pageType === "shorts" || pageType === "watch") {
const endpoint = event.detail.endpoint
if (!endpoint) return null;
result.videoID = (pageType === "shorts" ? endpoint.reelWatchEndpoint : endpoint.watchEndpoint).videoId;
}
return result;
} else {
return null;
}
}
function navigationStartSend(event: CustomEvent): void {
const message = navigationParser(event) as StartMessage;
if (message) {
sendMessage(message);
}
}
function navigateFinishSend(event: CustomEvent): void {
sendVideoData(); // arrived at new video, send video data
const videoDetails = event.detail?.response?.playerResponse?.videoDetails;
if (videoDetails) {
sendMessage({ channelID: videoDetails.channelId, channelTitle: videoDetails.author, ...navigationParser(event) } as FinishMessage);
}
}
function sendVideoData(): void {
if (!playerClient) return;
const videoData = playerClient.getVideoData();
if (videoData && videoData.video_id !== lastVideo) {
lastVideo = videoData.video_id;
sendMessage({ type: "data", videoID: videoData.video_id, isLive: videoData.isLive, isPremiere: videoData.isPremiere } as VideoData);
}
}
init();

2
src/js-components/previewBar.ts
View file

@ -11,8 +11,8 @@ import { ActionType, Category, SegmentContainer, SponsorHideType, SponsorSourceT
import { partition } from "../utils/arrayUtils";
import { DEFAULT_CATEGORY, shortCategoryName } from "../utils/categoryUtils";
import { normalizeChapterName } from "../utils/exporter";
import { findValidElement } from "../utils/pageUtils";
import { getFormattedTimeToSeconds } from "@ajayyy/maze-utils/lib/formating";
import { findValidElement } from "@ajayyy/maze-utils/lib/dom";
const TOOLTIP_VISIBLE_CLASS = 'sponsorCategoryTooltipVisible';
const MIN_CHAPTER_SIZE = 0.003;

2
src/options.ts
View file

@ -14,7 +14,7 @@ import UnsubmittedVideos from "./render/UnsubmittedVideos";
import KeybindComponent from "./components/options/KeybindComponent";
import { showDonationLink } from "./utils/configUtils";
import { localizeHtmlPage } from "./utils/pageUtils";
import { StorageChangesObject } from "./types";
import { StorageChangesObject } from "@ajayyy/maze-utils/lib/config";
const utils = new Utils();
let embed = false;

2
src/popup.ts
View file

@ -7,7 +7,6 @@ import {
SponsorHideType,
SponsorSourceType,
SponsorTime,
StorageChangesObject,
} from "./types";
import {
GetChannelIDResponse,
@ -28,6 +27,7 @@ import { exportTimes } from "./utils/exporter";
import GenericNotice from "./render/GenericNotice";
import { noRefreshFetchingChaptersAllowed } from "./utils/licenseKey";
import { getFormattedTime } from "@ajayyy/maze-utils/lib/formating";
import { StorageChangesObject } from "@ajayyy/maze-utils/lib/config";
const utils = new Utils();

11
src/types.ts
View file

@ -194,8 +194,6 @@ export interface VideoInfo {
export type VideoID = string;
export type StorageChangesObject = { [key: string]: chrome.storage.StorageChange };
export type UnEncodedSegmentTimes = [string, SponsorTime[]][];
export enum ChannelIDStatus {
@ -239,15 +237,6 @@ export type Keybind = {
shift?: boolean;
}
export enum PageType {
Shorts = "shorts",
Watch = "watch",
Search = "search",
Browse = "browse",
Channel = "channel",
Embed = "embed"
}
export interface ButtonListener {
name: string;
listener: (e?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;

75
src/utils.ts
View file

@ -2,9 +2,9 @@ import Config, { VideoDownvotes } from "./config";
import { CategorySelection, SponsorTime, FetchResponse, BackgroundScriptContainer, Registration, HashedValue, VideoID, SponsorHideType } from "./types";
import * as CompileConfig from "../config.json";
import { findValidElement, findValidElementFromSelector } from "./utils/pageUtils";
import { waitFor } from "@ajayyy/maze-utils";
import { isSafari } from "./utils/configUtils";
import { findValidElementFromSelector } from "@ajayyy/maze-utils/lib/dom";
export default class Utils {
@ -23,11 +23,6 @@ export default class Utils {
"shared.css"
];
/* Used for waitForElement */
creatingWaitingMutationObserver = false;
waitingMutationObserver: MutationObserver = null;
waitingElements: { selector: string; visibleCheck: boolean; callback: (element: Element) => void }[] = [];
constructor(backgroundScriptContainer: BackgroundScriptContainer = null) {
this.backgroundScriptContainer = backgroundScriptContainer;
}
@ -36,74 +31,6 @@ export default class Utils {
return waitFor(condition, timeout, check);
}
/* Uses a mutation observer to wait asynchronously */
async waitForElement(selector: string, visibleCheck = false): Promise<Element> {
return await new Promise((resolve) => {
const initialElement = this.getElement(selector, visibleCheck);
if (initialElement) {
resolve(initialElement);
return;
}
this.waitingElements.push({
selector,
visibleCheck,
callback: resolve
});
if (!this.creatingWaitingMutationObserver) {
this.creatingWaitingMutationObserver = true;
if (document.body) {
this.setupWaitingMutationListener();
} else {
window.addEventListener("DOMContentLoaded", () => {
this.setupWaitingMutationListener();
});
}
}
});
}
private setupWaitingMutationListener(): void {
if (!this.waitingMutationObserver) {
const checkForObjects = () => {
const foundSelectors = [];
for (const { selector, visibleCheck, callback } of this.waitingElements) {
const element = this.getElement(selector, visibleCheck);
if (element) {
callback(element);
foundSelectors.push(selector);
}
}
this.waitingElements = this.waitingElements.filter((element) => !foundSelectors.includes(element.selector));
if (this.waitingElements.length === 0) {
this.waitingMutationObserver?.disconnect();
this.waitingMutationObserver = null;
this.creatingWaitingMutationObserver = false;
}
};
// Do an initial check over all objects
checkForObjects();
if (this.waitingElements.length > 0) {
this.waitingMutationObserver = new MutationObserver(checkForObjects);
this.waitingMutationObserver.observe(document.body, {
childList: true,
subtree: true
});
}
}
}
private getElement(selector: string, visibleCheck: boolean) {
return visibleCheck ? findValidElement(document.querySelectorAll(selector)) : document.querySelector(selector);
}
containsPermission(permissions: chrome.permissions.Permissions): Promise<boolean> {
return new Promise((resolve) => {
chrome.permissions.contains(permissions, resolve)

19
src/utils/pageUtils.ts
View file

@ -28,25 +28,6 @@ export function isVisible(element: HTMLElement): boolean {
return element && element.offsetWidth > 0 && element.offsetHeight > 0;
}
export function findValidElementFromSelector(selectors: string[]): HTMLElement {
return findValidElementFromGenerator(selectors, (selector) => document.querySelector(selector));
}
export function findValidElement(elements: HTMLElement[] | NodeListOf<HTMLElement>): HTMLElement {
return findValidElementFromGenerator(elements);
}
function findValidElementFromGenerator<T>(objects: T[] | NodeListOf<HTMLElement>, generator?: (obj: T) => HTMLElement): HTMLElement {
for (const obj of objects) {
const element = generator ? generator(obj as T) : obj as HTMLElement;
if (element && isVisible(element)) {
return element;
}
}
return null;
}
export function getHashParams(): Record<string, unknown> {
const windowHash = window.location.hash.slice(1);
if (windowHash) {