Use events for channel id and fallback to current system

Also fix formatting
This commit is contained in:
Ajay
2022-09-02 00:46:55 -04:00
parent c479a601cd
commit 1377be9915
2 changed files with 71 additions and 61 deletions

View File

@@ -346,6 +346,7 @@ function resetValues() {
id: null id: null
}; };
lockedCategories = []; lockedCategories = [];
isLivePremiere = false;
//empty the preview bar //empty the preview bar
if (previewBar !== null) { if (previewBar !== null) {
@@ -1304,25 +1305,29 @@ function updatePreviewBar(): void {
async function whitelistCheck() { async function whitelistCheck() {
const whitelistedChannels = Config.config.whitelistedChannels; const whitelistedChannels = Config.config.whitelistedChannels;
const getChannelID = () =>
(document.querySelector("a.ytd-video-owner-renderer") // YouTube
?? document.querySelector("a.ytp-title-channel-logo") // YouTube Embed
?? document.querySelector(".channel-profile #channel-name")?.parentElement.parentElement // Invidious
?? document.querySelector("a.slim-owner-icon-and-title")) // Mobile YouTube
?.getAttribute("href")?.match(/\/(?:channel|c|user)\/(UC[a-zA-Z0-9_-]{22}|[a-zA-Z0-9_-]+)/)?.[1];
try { try {
await utils.wait(() => !!getChannelID(), 6000, 20); await utils.wait(() => channelIDInfo.status === ChannelIDStatus.Found, 6000, 20);
channelIDInfo = { // If found, continue on, it was set by the listener
status: ChannelIDStatus.Found,
id: getChannelID().match(/^\/?([^\s/]+)/)[0]
};
} catch (e) { } catch (e) {
channelIDInfo = { // Try fallback
status: ChannelIDStatus.Failed, const channelIDFallback = (document.querySelector("a.ytd-video-owner-renderer") // YouTube
id: null ?? document.querySelector("a.ytp-title-channel-logo") // YouTube Embed
}; ?? document.querySelector(".channel-profile #channel-name")?.parentElement.parentElement // Invidious
?? document.querySelector("a.slim-owner-icon-and-title")) // Mobile YouTube
?.getAttribute("href")?.match(/\/(?:channel|c|user)\/(UC[a-zA-Z0-9_-]{22}|[a-zA-Z0-9_-]+)/)?.[1];
if (channelIDFallback) {
channelIDInfo = {
status: ChannelIDStatus.Found,
id: channelIDFallback
};
} else {
channelIDInfo = {
status: ChannelIDStatus.Failed,
id: null
};
}
} }
//see if this is a whitelisted channel //see if this is a whitelisted channel
@@ -2196,25 +2201,25 @@ function windowListenerHandler(event: MessageEvent): void {
const data = event.data; const data = event.data;
const dataType = data.type const dataType = data.type
if (data.source !== "sponsorblock") return; if (data.source !== "sponsorblock") return;
if (dataType === "navigation") { if (dataType === "navigation") {
sponsorVideoID = data.videoID; sponsorVideoID = data.videoID;
pageType = data.pageType pageType = data.pageType
/* for use with category-specific
channelIDInfo = { channelIDInfo = {
id: data.channelID, id: data.channelID,
name: data.channelTitle, status: ChannelIDStatus.Found
status: 1
} }
*/
} else if (dataType === "ad") { } else if (dataType === "ad") {
// update isAdPlaying if (isAdPlaying != data.playing) {
if(isAdPlaying != data.playing) {
isAdPlaying = data.playing isAdPlaying = data.playing
updatePreviewBar(); updatePreviewBar();
updateVisibilityOfPlayerControlsButton(); updateVisibilityOfPlayerControlsButton();
} }
} else if (dataType === "data") { } else if (dataType === "data") {
sponsorVideoID = data.videoID; if (data.video !== sponsorVideoID) {
sponsorVideoID = data.videoID;
videoIDChange(sponsorVideoID);
}
isLivePremiere = data.isLive || data.isPremiere isLivePremiere = data.isLive || data.isPremiere
} }
} }
@@ -2263,13 +2268,15 @@ function addPageListeners(): void {
refreshVideoAttachments(); refreshVideoAttachments();
} }
}; };
// inject into document // inject into document
const docScript = document.createElement("script"); const docScript = document.createElement("script");
docScript.src = chrome.runtime.getURL("js/document.js"); docScript.src = chrome.runtime.getURL("js/document.js");
(document.head || document.documentElement).appendChild(docScript); (document.head || document.documentElement).appendChild(docScript);
document.addEventListener("yt-navigate-start", resetValues); document.addEventListener("yt-navigate-start", resetValues);
document.addEventListener("yt-navigate-finish", refreshListners); document.addEventListener("yt-navigate-finish", refreshListners);
window.addEventListener("message", windowListenerHandler) window.addEventListener("message", windowListenerHandler);
} }
function addHotkeyListener(): void { function addHotkeyListener(): void {

View File

@@ -3,75 +3,78 @@
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 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 { PageType } from "./types" import { PageType } from "./types";
interface StartMessage { interface StartMessage {
type: "navigation", type: "navigation",
pageType: PageType pageType: PageType
videoID: string | null, videoID: string | null,
} }
interface FinishMessage extends StartMessage { interface FinishMessage extends StartMessage {
channelID: string, channelID: string,
channelTitle: string channelTitle: string
} }
interface AdMessage { interface AdMessage {
type: "ad", type: "ad",
playing: boolean playing: boolean
} }
interface VideoData { interface VideoData {
type: "data", type: "data",
videoID: string, videoID: string,
isLive: boolean, isLive: boolean,
isPremiere: boolean isPremiere: boolean
} }
type WindowMessage = StartMessage | FinishMessage | AdMessage | VideoData type WindowMessage = StartMessage | FinishMessage | AdMessage | VideoData;
// global playerClient - too difficult to type // global playerClient - too difficult to type
// eslint-disable-next-line @typescript-eslint/no-explicit-any // eslint-disable-next-line @typescript-eslint/no-explicit-any
let playerClient: any; let playerClient: any;
const sendMessage = (message: WindowMessage): void => { const sendMessage = (message: WindowMessage): void => {
window.postMessage({ source: "sponsorblock", ...message}, "/") window.postMessage({ source: "sponsorblock", ...message }, "/");
} }
function setupPlayerClient(e: CustomEvent): void { function setupPlayerClient(e: CustomEvent): void {
if (playerClient) return // early exit if already defined if (playerClient) return; // early exit if already defined
playerClient = e.detail
sendVideoData(); // send playerData after setup playerClient = e.detail;
e.detail.addEventListener('onAdStart', () => sendMessage({ type: "ad", playing: true } as AdMessage)) sendVideoData(); // send playerData after setup
e.detail.addEventListener('onAdFinish', () => sendMessage({ type: "ad", playing: false } as AdMessage))
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-player-updated", setupPlayerClient);
document.addEventListener("yt-navigate-start", navigationStartSend) document.addEventListener("yt-navigate-start", navigationStartSend);
document.addEventListener("yt-navigate-finish", navigateFinishSend) document.addEventListener("yt-navigate-finish", navigateFinishSend);
function navigationParser (event: CustomEvent): StartMessage { function navigationParser(event: CustomEvent): StartMessage {
const pageType: PageType = event.detail.pageType const pageType: PageType = event.detail.pageType;
const result: StartMessage = { type: "navigation", pageType, videoID: null } const result: StartMessage = { type: "navigation", pageType, videoID: null };
if (pageType === "shorts" || pageType === "watch") { if (pageType === "shorts" || pageType === "watch") {
const endpoint = event.detail.endpoint const endpoint = event.detail.endpoint
result.videoID = (pageType === "shorts" ? endpoint.reelWatchEndpoint : endpoint.watchEndpoint).videoId result.videoID = (pageType === "shorts" ? endpoint.reelWatchEndpoint : endpoint.watchEndpoint).videoId;
} }
return result
return result;
} }
function navigationStartSend(event: CustomEvent): void { function navigationStartSend(event: CustomEvent): void {
sendMessage(navigationParser(event) as StartMessage) sendMessage(navigationParser(event) as StartMessage);
} }
function navigateFinishSend(event: CustomEvent): void { function navigateFinishSend(event: CustomEvent): void {
sendVideoData() // arrived at new video, send video data sendVideoData(); // arrived at new video, send video data
const videoDetails = event.detail?.response?.playerResponse?.videoDetails const videoDetails = event.detail?.response?.playerResponse?.videoDetails;
sendMessage({ channelID: videoDetails.channelId, channelTitle: videoDetails.author, ...navigationParser(event) } as FinishMessage) sendMessage({ channelID: videoDetails.channelId, channelTitle: videoDetails.author, ...navigationParser(event) } as FinishMessage);
} }
function sendVideoData(): void { function sendVideoData(): void {
if (!playerClient) return if (!playerClient) return;
const { video_id, isLive, isPremiere } = playerClient.getVideoData(); const { video_id, isLive, isPremiere } = playerClient.getVideoData();
sendMessage({ type: "data", videoID: video_id, isLive, isPremiere } as VideoData) sendMessage({ type: "data", videoID: video_id, isLive, isPremiere } as VideoData);
} }