From b5482b652787a7a39e72f4c7c499e33a9b3eabce Mon Sep 17 00:00:00 2001 From: NDevTK <31563761+NDevTK@users.noreply.github.com> Date: Thu, 19 May 2022 13:33:33 +0100 Subject: [PATCH 1/9] Move popup to iframe --- src/content.ts | 101 +++++++++++++++++++------------------------------ src/popup.ts | 9 +++++ 2 files changed, 47 insertions(+), 63 deletions(-) diff --git a/src/content.ts b/src/content.ts index e89bbb2a..32be9609 100644 --- a/src/content.ts +++ b/src/content.ts @@ -1686,73 +1686,48 @@ function openInfoMenu() { //hide info button if (playerButtons.info) playerButtons.info.button.style.display = "none"; - sendRequestToCustomServer('GET', chrome.extension.getURL("popup.html"), function(xmlhttp) { - if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { - const popup = document.createElement("div"); - popup.id = "sponsorBlockPopupContainer"; + + const popup = document.createElement("div"); + popup.id = "sponsorBlockPopupContainer"; + + const frame = document.createElement("iframe"); + frame.width = "410"; + frame.height = "400"; + frame.onload = () => frame.contentWindow.postMessage("", "*"); + frame.src = chrome.extension.getURL("popup.html"); + popup.appendChild(frame); + - let htmlData = xmlhttp.responseText; - // Hack to replace head data (title, favicon) - htmlData = htmlData.replace(/[\S\s]*<\/head>/gi, ""); - // Hack to replace body and html tag with div - htmlData = htmlData.replace(/ popup.querySelector("#sponsorBlockPopupLogo"); - const settings = popup.querySelector("#sbPopupIconSettings"); - const edit = popup.querySelector("#sbPopupIconEdit"); - const copy = popup.querySelector("#sbPopupIconCopyUserID"); - const check = popup.querySelector("#sbPopupIconCheck"); - const refreshSegments = popup.querySelector("#refreshSegments"); - const heart = popup.querySelector(".sbHeart"); - const close = popup.querySelector("#sbCloseDonate"); - logo.src = chrome.extension.getURL("icons/IconSponsorBlocker256px.png"); - settings.src = chrome.extension.getURL("icons/settings.svg"); - edit.src = chrome.extension.getURL("icons/pencil.svg"); - copy.src = chrome.extension.getURL("icons/clipboard.svg"); - check.src = chrome.extension.getURL("icons/check.svg"); - heart.src = chrome.extension.getURL("icons/heart.svg"); - close.src = chrome.extension.getURL("icons/close.png"); - refreshSegments.src = chrome.extension.getURL("icons/refresh.svg"); - - parentNode.insertBefore(popup, parentNode.firstChild); - - //run the popup init script - runThePopup(messageListener); + const parentNodes = document.querySelectorAll("#secondary"); + let parentNode = null; + for (let i = 0; i < parentNodes.length; i++) { + if (parentNodes[i].firstElementChild !== null) { + parentNode = parentNodes[i]; } - }); + } + if (parentNode == null) { + //old youtube theme + parentNode = document.getElementById("watch7-sidebar-contents"); + } + + parentNode.insertBefore(popup, parentNode.firstChild); + + //run the popup init script + runThePopup(messageListener); } function closeInfoMenu() { diff --git a/src/popup.ts b/src/popup.ts index 504229fc..ae4a40c8 100644 --- a/src/popup.ts +++ b/src/popup.ts @@ -41,10 +41,19 @@ class MessageHandler { } } +let allowPopup = (window === window.top); +window.onmessage = async e => { + if (e.source !== window.parent) return + if (e.origin.endsWith('.youtube.com')) return allowPopup = true; + await utils.wait(() => Config.config !== null); + if (Config.config.supportInvidious && e.origin.includes(Config.config.invidiousInstances)) return allowPopup = true; +} //make this a function to allow this to run on the content page async function runThePopup(messageListener?: MessageListener): Promise { + if (window !== window.top) await utils.wait(() => allowPopup === true); + const messageHandler = new MessageHandler(messageListener); utils.localizeHtmlPage(); From afee6815751f0cd2e4c9a554daced584eca2f116 Mon Sep 17 00:00:00 2001 From: NDevTK <31563761+NDevTK@users.noreply.github.com> Date: Thu, 19 May 2022 18:49:45 +0100 Subject: [PATCH 2/9] Removed runThePopup --- src/content.ts | 5 ----- src/popup.ts | 7 +------ 2 files changed, 1 insertion(+), 11 deletions(-) diff --git a/src/content.ts b/src/content.ts index 32be9609..d7caa944 100644 --- a/src/content.ts +++ b/src/content.ts @@ -5,8 +5,6 @@ import { ContentContainer, Keybind } from "./types"; import Utils from "./utils"; const utils = new Utils(); -import runThePopup from "./popup"; - import PreviewBar, {PreviewBarSegment} from "./js-components/previewBar"; import SkipNotice from "./render/SkipNotice"; import SkipNoticeComponent from "./components/SkipNoticeComponent"; @@ -1725,9 +1723,6 @@ function openInfoMenu() { } parentNode.insertBefore(popup, parentNode.firstChild); - - //run the popup init script - runThePopup(messageListener); } function closeInfoMenu() { diff --git a/src/popup.ts b/src/popup.ts index ae4a40c8..e97559cc 100644 --- a/src/popup.ts +++ b/src/popup.ts @@ -831,9 +831,4 @@ async function runThePopup(messageListener?: MessageListener): Promise { //end of function } -if (chrome.tabs != undefined) { - //this means it is actually opened in the popup - runThePopup(); -} - -export default runThePopup; +runThePopup(); From a7956aacf92dadbebb92eb68fbd7ce4603934044 Mon Sep 17 00:00:00 2001 From: NDevTK <31563761+NDevTK@users.noreply.github.com> Date: Thu, 19 May 2022 22:54:08 +0100 Subject: [PATCH 3/9] Remove unused sendRequestToCustomServer --- src/content.ts | 19 ------------------- 1 file changed, 19 deletions(-) diff --git a/src/content.ts b/src/content.ts index d7caa944..e16f71be 100644 --- a/src/content.ts +++ b/src/content.ts @@ -2083,25 +2083,6 @@ function addCSS() { } } -function sendRequestToCustomServer(type, fullAddress, callback) { - const xmlhttp = new XMLHttpRequest(); - - xmlhttp.open(type, fullAddress, true); - - if (callback != undefined) { - xmlhttp.onreadystatechange = function () { - callback(xmlhttp, false); - }; - - xmlhttp.onerror = function() { - callback(xmlhttp, true); - }; - } - - //submit this request - xmlhttp.send(); -} - /** * Update the isAdPlaying flag and hide preview bar/controls if ad is playing */ From bfadb1373a55125fc8d7876e7f1cae12fdd8604a Mon Sep 17 00:00:00 2001 From: NDevTK <31563761+NDevTK@users.noreply.github.com> Date: Thu, 19 May 2022 23:17:18 +0100 Subject: [PATCH 4/9] Add comment --- src/popup.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/popup.ts b/src/popup.ts index e97559cc..32c4424a 100644 --- a/src/popup.ts +++ b/src/popup.ts @@ -43,6 +43,7 @@ class MessageHandler { let allowPopup = (window === window.top); +// To prevent clickjacking window.onmessage = async e => { if (e.source !== window.parent) return if (e.origin.endsWith('.youtube.com')) return allowPopup = true; From 58207585631a32e067741b7ec64fc40f38525e8b Mon Sep 17 00:00:00 2001 From: Ajay Date: Thu, 2 Jun 2022 16:56:19 -0400 Subject: [PATCH 5/9] Fix close button layout issues --- public/popup.html | 4 ++++ src/content.ts | 22 +++++----------------- src/messageTypes.ts | 3 ++- src/popup.ts | 25 ++++++++++++++++++++++++- 4 files changed, 35 insertions(+), 19 deletions(-) diff --git a/public/popup.html b/public/popup.html index b1a241c4..fae41356 100644 --- a/public/popup.html +++ b/public/popup.html @@ -11,6 +11,10 @@
+ + diff --git a/src/content.ts b/src/content.ts index e16f71be..e9f800bc 100644 --- a/src/content.ts +++ b/src/content.ts @@ -217,6 +217,9 @@ function messageListener(request: Message, sender: unknown, sendResponse: (respo utils.addHiddenSegment(sponsorVideoID, request.UUID, request.type); updatePreviewBar(); break; + case "closePopup": + closeInfoMenu(); + break; } } @@ -1689,26 +1692,11 @@ function openInfoMenu() { popup.id = "sponsorBlockPopupContainer"; const frame = document.createElement("iframe"); - frame.width = "410"; - frame.height = "400"; + frame.width = "374"; + frame.height = "500"; frame.onload = () => frame.contentWindow.postMessage("", "*"); frame.src = chrome.extension.getURL("popup.html"); popup.appendChild(frame); - - - //close button - const closeButton = document.createElement("button"); - const closeButtonIcon = document.createElement("img"); - closeButtonIcon.src = chrome.extension.getURL("icons/close.png"); - closeButtonIcon.width = 15; - closeButtonIcon.height = 15; - closeButton.appendChild(closeButtonIcon); - closeButton.setAttribute("title", chrome.i18n.getMessage("closePopup")); - closeButton.classList.add("sbCloseButton"); - closeButton.addEventListener("click", closeInfoMenu); - - //add the close button - popup.prepend(closeButton); const parentNodes = document.querySelectorAll("#secondary"); let parentNode = null; diff --git a/src/messageTypes.ts b/src/messageTypes.ts index adabbee5..45941ee4 100644 --- a/src/messageTypes.ts +++ b/src/messageTypes.ts @@ -16,7 +16,8 @@ interface DefaultMessage { | "getChannelID" | "isChannelWhitelisted" | "submitTimes" - | "refreshSegments"; + | "refreshSegments" + | "closePopup"; } interface BoolValueMessage { diff --git a/src/popup.ts b/src/popup.ts index 32c4424a..b1bd8071 100644 --- a/src/popup.ts +++ b/src/popup.ts @@ -122,9 +122,16 @@ async function runThePopup(messageListener?: MessageListener): Promise { "sponsorTimesDonateContainer", "sbConsiderDonateLink", "sbCloseDonate", - "sbBetaServerWarning" + "sbBetaServerWarning", + "sbCloseButton" ].forEach(id => PageElements[id] = document.getElementById(id)); + PageElements.sbCloseButton.addEventListener("click", () => { + sendTabMessage({ + message: "closePopup" + }); + }); + // Hide donate button if wanted (Safari, or user choice) if (!showDonationLink()) { PageElements.sbDonate.style.display = "none"; @@ -588,6 +595,22 @@ async function runThePopup(messageListener?: MessageListener): Promise { chrome.runtime.sendMessage({ "message": "openHelp" }); } + function sendTabMessage(data: Message): Promise { + return new Promise((resolve) => { + messageHandler.query({ + active: true, + currentWindow: true + }, tabs => { + messageHandler.sendMessage( + tabs[0].id, + data, + (response) => resolve(response) + ); + } + ); + }); + } + //make the options username setting option visible function setUsernameButton() { PageElements.usernameInput.value = PageElements.usernameValue.innerText; From 96173dd901bf95bfdf5e55d76c8f1e23cab8c6f3 Mon Sep 17 00:00:00 2001 From: Ajay Date: Thu, 2 Jun 2022 18:47:03 -0400 Subject: [PATCH 6/9] Fix popup communication on Firefox --- src/background.ts | 15 ++++++++++++++- src/popup.ts | 6 ++++-- 2 files changed, 18 insertions(+), 3 deletions(-) diff --git a/src/background.ts b/src/background.ts index d576fba1..aa94df5e 100644 --- a/src/background.ts +++ b/src/background.ts @@ -84,7 +84,20 @@ chrome.runtime.onMessage.addListener(function (request, _, callback) { case "unregisterContentScript": unregisterFirefoxContentScript(request.id) return false; - } + case "tabs": + chrome.tabs.query({ + active: true, + currentWindow: true + }, tabs => { + chrome.tabs.sendMessage( + tabs[0].id, + request.data, + (response) => callback(response) + ); + } + ); + return true; + } }); //add help page on install diff --git a/src/popup.ts b/src/popup.ts index b1bd8071..34a9d69f 100644 --- a/src/popup.ts +++ b/src/popup.ts @@ -22,13 +22,15 @@ class MessageHandler { sendMessage(id: number, request: Message, callback?) { if (this.messageListener) { this.messageListener(request, null, callback); - } else { + } else if (chrome.tabs) { chrome.tabs.sendMessage(id, request, callback); + } else { + chrome.runtime.sendMessage({ message: "tabs", data: request }, callback); } } query(config, callback) { - if (this.messageListener) { + if (this.messageListener || !chrome.tabs) { // Send back dummy info callback([{ url: document.URL, From 3d9221eb8dcccd3dbe2c84e6b8e5157bc01e6d7e Mon Sep 17 00:00:00 2001 From: Ajay Date: Thu, 2 Jun 2022 21:08:34 -0400 Subject: [PATCH 7/9] improve display while popup loads --- public/popup.html | 2 +- src/content.ts | 2 +- src/help.ts | 8 ++++---- src/options.ts | 3 ++- src/permissions.ts | 3 ++- src/popup.ts | 20 ++++++++------------ src/utils.ts | 25 ------------------------- src/utils/pageUtils.ts | 25 +++++++++++++++++++++++++ 8 files changed, 43 insertions(+), 45 deletions(-) diff --git a/public/popup.html b/public/popup.html index fae41356..0ebd5e2b 100644 --- a/public/popup.html +++ b/public/popup.html @@ -8,7 +8,7 @@ - +
diff --git a/src/popup.ts b/src/popup.ts index 568b2436..92b5fe01 100644 --- a/src/popup.ts +++ b/src/popup.ts @@ -140,6 +140,10 @@ async function runThePopup(messageListener?: MessageListener): Promise { }); }); + if (window !== window.top) { + PageElements.sbCloseButton.classList.remove("hidden"); + } + // Hide donate button if wanted (Safari, or user choice) if (!showDonationLink()) { PageElements.sbDonate.style.display = "none";