diff --git a/manifest/manifest.json b/manifest/manifest.json index b0d094be..4f391a48 100644 --- a/manifest/manifest.json +++ b/manifest/manifest.json @@ -36,7 +36,8 @@ "icons/close.png", "icons/PlayerInfoIconSponsorBlocker256px.png", "icons/PlayerDeleteIconSponsorBlocker256px.png", - "popup.html" + "popup.html", + "content.css" ], "permissions": [ "storage", diff --git a/src/content.ts b/src/content.ts index 9bbf4477..5851f89b 100644 --- a/src/content.ts +++ b/src/content.ts @@ -8,6 +8,9 @@ import runThePopup from "./popup"; import PreviewBar from "./js-components/previewBar"; import SkipNotice from "./js-components/skipNotice"; +// Hack to get the CSS loaded on permission-based sites (Invidious) +utils.wait(() => Config.config !== null, 5000, 10).then(addCSS); + //was sponsor data found when doing SponsorsLookup var sponsorDataFound = false; var previousVideoID = null; @@ -636,7 +639,7 @@ function skipToTime(v, index, sponsorTimes, openNotice) { // Count this as a skip Config.config.minutesSaved = Config.config.minutesSaved + (sponsorTimes[index][1] - sponsorTimes[index][0]) / 60; Config.config.skipCount = Config.config.skipCount + 1; - + sponsorSkipped[index] = true; } } @@ -1091,6 +1094,27 @@ function getSponsorTimesMessage(sponsorTimes) { return sponsorTimesMessage; } +/** + * Adds the CSS to the page if needed. Required on optional sites with Chrome. + */ +function addCSS() { + if (!utils.isFirefox() && Config.config.invidiousInstances.includes(new URL(document.URL).host)) { + window.addEventListener("DOMContentLoaded", () => { + let head = document.getElementsByTagName("head")[0]; + + for (const file of utils.css) { + let fileref = document.createElement("link"); + + fileref.rel = "stylesheet"; + fileref.type = "text/css"; + fileref.href = chrome.extension.getURL(file); + + head.appendChild(fileref); + } + }); + } +} + //converts time in seconds to minutes:seconds function getFormattedTime(seconds) { let minutes = Math.floor(seconds / 60); diff --git a/src/utils.ts b/src/utils.ts index e19e4ca9..7e156469 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -6,6 +6,17 @@ class Utils { // Contains functions needed from the background script backgroundScriptContainer: any = null; + // Used to add content scripts and CSS required + js = [ + "./js/vendor.js", + "./js/content.js" + ]; + css = [ + "content.css", + "./libs/Source+Sans+Pro.css", + "popup.css" + ]; + constructor(backgroundScriptContainer?: any) { this.backgroundScriptContainer = backgroundScriptContainer; } @@ -67,25 +78,15 @@ class Utils { * For now, it is just SB.config.invidiousInstances. */ setupExtraSiteContentScripts() { - let js = [ - "./js/vendor.js", - "./js/content.js" - ]; - let css = [ - "content.css", - "./libs/Source+Sans+Pro.css", - "popup.css" - ]; - let self = this; if (this.isFirefox()) { let firefoxJS = []; - for (const file of js) { + for (const file of this.js) { firefoxJS.push({file}); } let firefoxCSS = []; - for (const file of css) { + for (const file of this.css) { firefoxCSS.push({file}); } @@ -119,8 +120,8 @@ class Utils { // This API is experimental and not visible by the TypeScript compiler actions: [new ( chrome.declarativeContent).RequestContentScript({ allFrames: true, - js, - css + js: self.js, + css: self.css })] };