Refractored skipNotice to use a class now

This commit is contained in:
Ajay Ramachandran
2019-08-19 16:09:54 -04:00
parent 761ae63845
commit 175cf62201
5 changed files with 276 additions and 324 deletions

View File

@@ -499,13 +499,13 @@ function skipToTime(v, index, sponsorTimes, openNotice) {
if (openNotice) { if (openNotice) {
//send out the message saying that a sponsor message was skipped //send out the message saying that a sponsor message was skipped
openSkipNotice(currentUUID); if (!dontShowNotice) {
new SkipNotice(this, currentUUID);
setTimeout(() => closeSkipNotice(currentUUID), 7000);
//auto-upvote this sponsor //auto-upvote this sponsor
if (trackViewCount) { if (trackViewCount) {
vote(1, currentUUID, true); vote(1, currentUUID, null);
}
} }
} }
@@ -515,12 +515,12 @@ function skipToTime(v, index, sponsorTimes, openNotice) {
} }
} }
function goBackToPreviousTime(UUID) { function goBackToPreviousTime(sponsorTime) {
if (sponsorTimes != null) { if (sponsorTimes != null) {
//add a tiny bit of time to make sure it is not skipped again //add a tiny bit of time to make sure it is not skipped again
v.currentTime = sponsorTimes[UUIDs.indexOf(UUID)][0] + 0.001; v.currentTime = sponsorTimes[UUIDs.indexOf(sponsorTime.UUID)][0] + 0.001;
closeSkipNotice(UUID); sponsorTime.closeSkipNotice();
} }
} }
@@ -842,238 +842,12 @@ function clearSponsorTimes() {
}); });
} }
//Opens the notice that tells the user that a sponsor was just skipped //if skipNotice is null, it will not affect the UI
function openSkipNotice(UUID){ function vote(type, UUID, skipNotice) {
if (dontShowNotice) { if (skipNotice != null) {
//don't show, return
return;
}
let amountOfPreviousNotices = document.getElementsByClassName("sponsorSkipNotice").length;
if (amountOfPreviousNotices > 0) {
//already exists
let previousNotice = document.getElementsByClassName("sponsorSkipNotice")[0];
previousNotice.classList.add("secondSkipNotice")
}
let noticeElement = document.createElement("div");
//what sponsor time this is about
noticeElement.id = "sponsorSkipNotice" + UUID;
noticeElement.classList.add("sponsorSkipObject");
noticeElement.classList.add("sponsorSkipNotice");
noticeElement.style.zIndex = 50 + amountOfPreviousNotices;
//the row that will contain the info
let firstRow = document.createElement("tr");
firstRow.id = "sponsorSkipNoticeFirstRow" + UUID;
let logoColumn = document.createElement("td");
let logoElement = document.createElement("img");
logoElement.id = "sponsorSkipLogo" + UUID;
logoElement.className = "sponsorSkipLogo sponsorSkipObject";
logoElement.src = chrome.extension.getURL("icons/IconSponsorBlocker256px.png");
let noticeMessage = document.createElement("span");
noticeMessage.id = "sponsorSkipMessage" + UUID;
noticeMessage.classList.add("sponsorSkipMessage");
noticeMessage.classList.add("sponsorSkipObject");
noticeMessage.innerText = chrome.i18n.getMessage("noticeTitle");
//create the first column
logoColumn.appendChild(logoElement);
logoColumn.appendChild(noticeMessage);
//add the x button
let closeButtonContainer = document.createElement("td");
closeButtonContainer.className = "sponsorSkipNoticeRightSection";
closeButtonContainer.style.top = "11px";
let timeLeft = document.createElement("span");
timeLeft.innerText = chrome.i18n.getMessage("noticeClosingMessage");
timeLeft.className = "sponsorSkipObject sponsorSkipNoticeTimeLeft";
let hideButton = document.createElement("img");
hideButton.src = chrome.extension.getURL("icons/close.png");
hideButton.className = "sponsorSkipObject sponsorSkipNoticeButton sponsorSkipNoticeCloseButton sponsorSkipNoticeRightButton";
hideButton.addEventListener("click", () => closeSkipNotice(UUID));
closeButtonContainer.appendChild(timeLeft);
closeButtonContainer.appendChild(hideButton);
//add all objects to first row
firstRow.appendChild(logoColumn);
firstRow.appendChild(closeButtonContainer);
let spacer = document.createElement("hr");
spacer.id = "sponsorSkipNoticeSpacer" + UUID;
spacer.className = "sponsorBlockSpacer";
//the row that will contain the buttons
let secondRow = document.createElement("tr");
secondRow.id = "sponsorSkipNoticeSecondRow" + UUID;
//thumbs up and down buttons
let voteButtonsContainer = document.createElement("td");
voteButtonsContainer.id = "sponsorTimesVoteButtonsContainer" + UUID;
let reportText = document.createElement("span");
reportText.id = "sponsorTimesReportText" + UUID;
reportText.className = "sponsorTimesInfoMessage sponsorTimesVoteButtonMessage";
reportText.innerText = chrome.i18n.getMessage("reportButtonTitle");
reportText.style.marginRight = "5px";
reportText.setAttribute("title", chrome.i18n.getMessage("reportButtonInfo"));
let downvoteButton = document.createElement("img");
downvoteButton.id = "sponsorTimesDownvoteButtonsContainer" + UUID;
downvoteButton.className = "sponsorSkipObject voteButton";
downvoteButton.src = chrome.extension.getURL("icons/report.png");
downvoteButton.addEventListener("click", () => vote(0, UUID));
downvoteButton.setAttribute("title", chrome.i18n.getMessage("reportButtonInfo"));
//add downvote and report text to container
voteButtonsContainer.appendChild(reportText);
voteButtonsContainer.appendChild(downvoteButton);
//add unskip button
let unskipContainer = document.createElement("td");
unskipContainer.className = "sponsorSkipNoticeUnskipSection";
let unskipButton = document.createElement("button");
unskipButton.innerText = chrome.i18n.getMessage("goBack");
unskipButton.className = "sponsorSkipObject sponsorSkipNoticeButton";
unskipButton.addEventListener("click", () => goBackToPreviousTime(UUID));
unskipContainer.appendChild(unskipButton);
//add don't show again button
let dontshowContainer = document.createElement("td");
dontshowContainer.className = "sponsorSkipNoticeRightSection";
let dontShowAgainButton = document.createElement("button");
dontShowAgainButton.innerText = chrome.i18n.getMessage("Hide");
dontShowAgainButton.className = "sponsorSkipObject sponsorSkipNoticeButton sponsorSkipNoticeRightButton";
dontShowAgainButton.addEventListener("click", dontShowNoticeAgain);
dontshowContainer.appendChild(dontShowAgainButton);
//add to row
secondRow.appendChild(voteButtonsContainer);
secondRow.appendChild(unskipContainer);
secondRow.appendChild(dontshowContainer);
noticeElement.appendChild(firstRow);
noticeElement.appendChild(spacer);
noticeElement.appendChild(secondRow);
let referenceNode = document.getElementById("movie_player");
if (referenceNode == null) {
//for embeds
let player = document.getElementById("player");
referenceNode = player.firstChild;
let index = 1;
//find the child that is the video player (sometimes it is not the first)
while (!referenceNode.classList.contains("html5-video-player") || !referenceNode.classList.contains("ytp-embed")) {
referenceNode = player.children[index];
index++;
}
}
referenceNode.prepend(noticeElement);
}
function afterDownvote(UUID) {
addVoteButtonInfo(chrome.i18n.getMessage("Voted"), UUID);
addNoticeInfoMessage(chrome.i18n.getMessage("hitGoBack"), UUID);
//remove this sponsor from the sponsors looked up
//find which one it is
for (let i = 0; i < sponsorTimes.length; i++) {
if (UUIDs[i] == UUID) {
//this one is the one to hide
//add this as a hidden sponsorTime
hiddenSponsorTimes.push(i);
let sponsorTimesLeft = sponsorTimes.slice();
for (let j = 0; j < hiddenSponsorTimes.length; j++) {
//remove this sponsor time
sponsorTimesLeft.splice(hiddenSponsorTimes[j], 1);
}
//update the preview
previewBar.set(sponsorTimesLeft, [], v.duration);
break;
}
}
}
function addNoticeInfoMessage(message, UUID) {
let previousInfoMessage = document.getElementById("sponsorTimesInfoMessage" + UUID);
if (previousInfoMessage != null) {
//remove it
document.getElementById("sponsorSkipNotice" + UUID).removeChild(previousInfoMessage);
}
//add info
let thanksForVotingText = document.createElement("p");
thanksForVotingText.id = "sponsorTimesInfoMessage" + UUID;
thanksForVotingText.className = "sponsorTimesInfoMessage";
thanksForVotingText.innerText = message;
//add element to div
document.getElementById("sponsorSkipNotice" + UUID).insertBefore(thanksForVotingText, document.getElementById("sponsorSkipNoticeSpacer" + UUID));
}
function resetNoticeInfoMessage(UUID) {
let previousInfoMessage = document.getElementById("sponsorTimesInfoMessage" + UUID);
if (previousInfoMessage != null) {
//remove it
document.getElementById("sponsorSkipNotice" + UUID).removeChild(previousInfoMessage);
}
}
function addVoteButtonInfo(message, UUID) {
resetVoteButtonInfo(UUID);
//hide vote button
let downvoteButton = document.getElementById("sponsorTimesDownvoteButtonsContainer" + UUID);
if (downvoteButton != null) {
document.getElementById("sponsorTimesDownvoteButtonsContainer" + UUID).style.display = "none";
}
//add info
let thanksForVotingText = document.createElement("td");
thanksForVotingText.id = "sponsorTimesVoteButtonInfoMessage" + UUID;
thanksForVotingText.className = "sponsorTimesInfoMessage sponsorTimesVoteButtonMessage";
thanksForVotingText.innerText = message;
//add element to div
document.getElementById("sponsorSkipNoticeSecondRow" + UUID).prepend(thanksForVotingText);
}
function resetVoteButtonInfo(UUID) {
let previousInfoMessage = document.getElementById("sponsorTimesVoteButtonInfoMessage" + UUID);
if (previousInfoMessage != null) {
//remove it
document.getElementById("sponsorSkipNoticeSecondRow" + UUID).removeChild(previousInfoMessage);
}
//show button again
document.getElementById("sponsorTimesDownvoteButtonsContainer" + UUID).style.removeProperty("display");
}
//if inTheBackground is true, then no UI methods will be called
function vote(type, UUID, inTheBackground = false) {
if (!inTheBackground) {
//add loading info //add loading info
addVoteButtonInfo("Loading...", UUID) skipNotice.addVoteButtonInfo.bind(skipNotice)("Loading...")
resetNoticeInfoMessage(UUID); skipNotice.resetNoticeInfoMessage.bind(skipNotice)();
} }
chrome.runtime.sendMessage({ chrome.runtime.sendMessage({
@@ -1083,24 +857,24 @@ function vote(type, UUID, inTheBackground = false) {
}, function(response) { }, function(response) {
if (response != undefined) { if (response != undefined) {
//see if it was a success or failure //see if it was a success or failure
if (!inTheBackground) { if (skipNotice != null) {
if (response.successType == 1) { if (response.successType == 1) {
//success //success
if (type == 0) { if (type == 0) {
afterDownvote(UUID); skipNotice.afterDownvote.bind(skipNotice)();
} }
} else if (response.successType == 0) { } else if (response.successType == 0) {
//failure: duplicate vote //failure: duplicate vote
addNoticeInfoMessage(chrome.i18n.getMessage("voteFAIL"), UUID) skipNotice.addNoticeInfoMessage.bind(skipNotice)(chrome.i18n.getMessage("voteFail"))
resetVoteButtonInfo(UUID); skipNotice.resetVoteButtonInfo.bind(skipNotice)();
} else if (response.successType == -1) { } else if (response.successType == -1) {
if (response.statusCode == 502) { if (response.statusCode == 502) {
addNoticeInfoMessage(chrome.i18n.getMessage("serverDown"), UUID) skipNotice.addNoticeInfoMessage.bind(skipNotice)(chrome.i18n.getMessage("serverDown"))
resetVoteButtonInfo(UUID); skipNotice.resetVoteButtonInfo.bind(skipNotice)();
} else { } else {
//failure: unknown error //failure: unknown error
addNoticeInfoMessage(chrome.i18n.getMessage("connectionError") + response.statusCode, UUID); skipNotice.addNoticeInfoMessage.bind(skipNotice)(chrome.i18n.getMessage("connectionError") + response.statusCode);
resetVoteButtonInfo(UUID); skipNotice.resetVoteButtonInfo.bind(skipNotice)();
} }
} }
} }
@@ -1108,14 +882,6 @@ function vote(type, UUID, inTheBackground = false) {
}); });
} }
//Closes the notice that tells the user that a sponsor was just skipped for this UUID
function closeSkipNotice(UUID){
let notice = document.getElementById("sponsorSkipNotice" + UUID);
if (notice != null) {
notice.remove();
}
}
//Closes all notices that tell the user that a sponsor was just skipped //Closes all notices that tell the user that a sponsor was just skipped
function closeAllSkipNotices(){ function closeAllSkipNotices(){
let notices = document.getElementsByClassName("sponsorSkipNotice"); let notices = document.getElementsByClassName("sponsorSkipNotice");

View File

@@ -0,0 +1,8 @@
{
"browser_specific_settings": {
"gecko": {
"id": "sponsorBlocker@ajay.app",
"strict_min_version": "57.0"
}
}
}

View File

@@ -1,68 +0,0 @@
{
"name": "SponsorBlock - YouTube Sponsorship Blocker",
"short_name": "SponsorBlock",
"version": "1.0.12",
"description": "Skip over sponsorship on YouTube videos. Report sponsors on videos you watch to save the time of others.",
"content_scripts": [
{
"matches": [
"https://*.youtube.com/*"
],
"js": [
"config.js",
"content.js",
"popup.js"
],
"css": [
"content.css",
"./libs/Source+Sans+Pro.css",
"popup.css"
]
}
],
"web_accessible_resources": [
"icons/LogoSponsorBlocker256px.png",
"icons/IconSponsorBlocker256px.png",
"icons/PlayerStartIconSponsorBlocker256px.png",
"icons/PlayerStopIconSponsorBlocker256px.png",
"icons/PlayerUploadIconSponsorBlocker256px.png",
"icons/PlayerUploadFailedIconSponsorBlocker256px.png",
"icons/upvote.png",
"icons/downvote.png",
"icons/PlayerInfoIconSponsorBlocker256px.png",
"icons/PlayerDeleteIconSponsorBlocker256px.png",
"popup.html",
"help/index.html",
"help/style.css"
],
"permissions": [
"tabs",
"storage",
"notifications",
"https://sponsor.ajay.app/*"
],
"browser_action": {
"default_title": "SponsorBlock",
"default_popup": "popup.html"
},
"background": {
"scripts":[
"config.js",
"background.js"
]
},
"icons": {
"16": "icons/IconSponsorBlocker16px.png",
"32": "icons/IconSponsorBlocker32px.png",
"64": "icons/LogoSponsorBlocker64px.png",
"128": "icons/LogoSponsorBlocker128px.png",
"256": "icons/LogoSponsorBlocker256px.png"
},
"browser_specific_settings": {
"gecko": {
"id": "sponsorBlocker@ajay.app",
"strict_min_version": "57.0"
}
},
"manifest_version": 2
}

View File

@@ -13,6 +13,7 @@
"js": [ "js": [
"config.js", "config.js",
"utils/previewBar.js", "utils/previewBar.js",
"utils/skipNotice.js",
"utils.js", "utils.js",
"content.js", "content.js",
"popup.js" "popup.js"

245
utils/skipNotice.js Normal file
View File

@@ -0,0 +1,245 @@
'use strict';
//The notice that tells the user that a sponsor was just skipped
class SkipNotice {
constructor(parent, UUID) {
this.parent = parent;
this.UUID = UUID;
//add notice
let amountOfPreviousNotices = document.getElementsByClassName("sponsorSkipNotice").length;
if (amountOfPreviousNotices > 0) {
//already exists
let previousNotice = document.getElementsByClassName("sponsorSkipNotice")[0];
previousNotice.classList.add("secondSkipNotice")
}
let noticeElement = document.createElement("div");
//what sponsor time this is about
noticeElement.id = "sponsorSkipNotice" + this.UUID;
noticeElement.classList.add("sponsorSkipObject");
noticeElement.classList.add("sponsorSkipNotice");
noticeElement.style.zIndex = 50 + amountOfPreviousNotices;
//the row that will contain the info
let firstRow = document.createElement("tr");
firstRow.id = "sponsorSkipNoticeFirstRow" + this.UUID;
let logoColumn = document.createElement("td");
let logoElement = document.createElement("img");
logoElement.id = "sponsorSkipLogo" + this.UUID;
logoElement.className = "sponsorSkipLogo sponsorSkipObject";
logoElement.src = chrome.extension.getURL("icons/IconSponsorBlocker256px.png");
let noticeMessage = document.createElement("span");
noticeMessage.id = "sponsorSkipMessage" + this.UUID;
noticeMessage.classList.add("sponsorSkipMessage");
noticeMessage.classList.add("sponsorSkipObject");
noticeMessage.innerText = chrome.i18n.getMessage("noticeTitle");
//create the first column
logoColumn.appendChild(logoElement);
logoColumn.appendChild(noticeMessage);
//add the x button
let closeButtonContainer = document.createElement("td");
closeButtonContainer.className = "sponsorSkipNoticeRightSection";
closeButtonContainer.style.top = "11px";
let timeLeft = document.createElement("span");
timeLeft.innerText = chrome.i18n.getMessage("noticeClosingMessage");
timeLeft.className = "sponsorSkipObject sponsorSkipNoticeTimeLeft";
let hideButton = document.createElement("img");
hideButton.src = chrome.extension.getURL("icons/close.png");
hideButton.className = "sponsorSkipObject sponsorSkipNoticeButton sponsorSkipNoticeCloseButton sponsorSkipNoticeRightButton";
hideButton.addEventListener("click", this.close.bind(this));
closeButtonContainer.appendChild(timeLeft);
closeButtonContainer.appendChild(hideButton);
//add all objects to first row
firstRow.appendChild(logoColumn);
firstRow.appendChild(closeButtonContainer);
let spacer = document.createElement("hr");
spacer.id = "sponsorSkipNoticeSpacer" + this.UUID;
spacer.className = "sponsorBlockSpacer";
//the row that will contain the buttons
let secondRow = document.createElement("tr");
secondRow.id = "sponsorSkipNoticeSecondRow" + this.UUID;
//thumbs up and down buttons
let voteButtonsContainer = document.createElement("td");
voteButtonsContainer.id = "sponsorTimesVoteButtonsContainer" + this.UUID;
let reportText = document.createElement("span");
reportText.id = "sponsorTimesReportText" + this.UUID;
reportText.className = "sponsorTimesInfoMessage sponsorTimesVoteButtonMessage";
reportText.innerText = chrome.i18n.getMessage("reportButtonTitle");
reportText.style.marginRight = "5px";
reportText.setAttribute("title", chrome.i18n.getMessage("reportButtonInfo"));
let downvoteButton = document.createElement("img");
downvoteButton.id = "sponsorTimesDownvoteButtonsContainer" + this.UUID;
downvoteButton.className = "sponsorSkipObject voteButton";
downvoteButton.src = chrome.extension.getURL("icons/report.png");
downvoteButton.addEventListener("click", () => vote(0, this.UUID, this));
downvoteButton.setAttribute("title", chrome.i18n.getMessage("reportButtonInfo"));
//add downvote and report text to container
voteButtonsContainer.appendChild(reportText);
voteButtonsContainer.appendChild(downvoteButton);
//add unskip button
let unskipContainer = document.createElement("td");
unskipContainer.className = "sponsorSkipNoticeUnskipSection";
let unskipButton = document.createElement("button");
unskipButton.innerText = chrome.i18n.getMessage("goBack");
unskipButton.className = "sponsorSkipObject sponsorSkipNoticeButton";
unskipButton.addEventListener("click", () => goBackToPreviousTime(this));
unskipContainer.appendChild(unskipButton);
//add don't show again button
let dontshowContainer = document.createElement("td");
dontshowContainer.className = "sponsorSkipNoticeRightSection";
let dontShowAgainButton = document.createElement("button");
dontShowAgainButton.innerText = chrome.i18n.getMessage("Hide");
dontShowAgainButton.className = "sponsorSkipObject sponsorSkipNoticeButton sponsorSkipNoticeRightButton";
dontShowAgainButton.addEventListener("click", dontShowNoticeAgain);
dontshowContainer.appendChild(dontShowAgainButton);
//add to row
secondRow.appendChild(voteButtonsContainer);
secondRow.appendChild(unskipContainer);
secondRow.appendChild(dontshowContainer);
noticeElement.appendChild(firstRow);
noticeElement.appendChild(spacer);
noticeElement.appendChild(secondRow);
//get reference node
let referenceNode = document.getElementById("movie_player");
if (referenceNode == null) {
//for embeds
let player = document.getElementById("player");
referenceNode = player.firstChild;
let index = 1;
//find the child that is the video player (sometimes it is not the first)
while (!referenceNode.classList.contains("html5-video-player") || !referenceNode.classList.contains("ytp-embed")) {
referenceNode = player.children[index];
index++;
}
}
referenceNode.prepend(noticeElement);
//add closing listener
setTimeout(this.close.bind(this), 7000);
}
afterDownvote() {
this.addVoteButtonInfo(chrome.i18n.getMessage("Voted"));
this.addNoticeInfoMessage(chrome.i18n.getMessage("hitGoBack"));
//remove this sponsor from the sponsors looked up
//find which one it is
for (let i = 0; i < sponsorTimes.length; i++) {
if (UUIDs[i] == this.UUID) {
//this one is the one to hide
//add this as a hidden sponsorTime
hiddenSponsorTimes.push(i);
let sponsorTimesLeft = sponsorTimes.slice();
for (let j = 0; j < hiddenSponsorTimes.length; j++) {
//remove this sponsor time
sponsorTimesLeft.splice(hiddenSponsorTimes[j], 1);
}
//update the preview
previewBar.set(sponsorTimesLeft, [], v.duration);
break;
}
}
}
addNoticeInfoMessage(message) {
let previousInfoMessage = document.getElementById("sponsorTimesInfoMessage" + this.UUID);
if (previousInfoMessage != null) {
//remove it
document.getElementById("sponsorSkipNotice" + this.UUID).removeChild(previousInfoMessage);
}
//add info
let thanksForVotingText = document.createElement("p");
thanksForVotingText.id = "sponsorTimesInfoMessage" + this.UUID;
thanksForVotingText.className = "sponsorTimesInfoMessage";
thanksForVotingText.innerText = message;
//add element to div
document.getElementById("sponsorSkipNotice" + this.UUID).insertBefore(thanksForVotingText, document.getElementById("sponsorSkipNoticeSpacer" + this.UUID));
}
resetNoticeInfoMessage() {
let previousInfoMessage = document.getElementById("sponsorTimesInfoMessage" + this.UUID);
if (previousInfoMessage != null) {
//remove it
document.getElementById("sponsorSkipNotice" + this.UUID).removeChild(previousInfoMessage);
}
}
addVoteButtonInfo(message) {
this.resetVoteButtonInfo();
//hide report button and text for it
let downvoteButton = document.getElementById("sponsorTimesDownvoteButtonsContainer" + this.UUID);
if (downvoteButton != null) {
document.getElementById("sponsorTimesDownvoteButtonsContainer" + this.UUID).style.display = "none";
}
let downvoteButtonText = document.getElementById("sponsorTimesReportText" + this.UUID);
if (downvoteButtonText != null) {
document.getElementById("sponsorTimesDownvoteButtonsContainer" + this.UUID).style.display = "none";
}
//add info
let thanksForVotingText = document.createElement("td");
thanksForVotingText.id = "sponsorTimesVoteButtonInfoMessage" + this.UUID;
thanksForVotingText.className = "sponsorTimesInfoMessage sponsorTimesVoteButtonMessage";
thanksForVotingText.innerText = message;
//add element to div
document.getElementById("sponsorSkipNoticeSecondRow" + this.UUID).prepend(thanksForVotingText);
}
resetVoteButtonInfo() {
let previousInfoMessage = document.getElementById("sponsorTimesVoteButtonInfoMessage" + this.UUID);
if (previousInfoMessage != null) {
//remove it
document.getElementById("sponsorSkipNoticeSecondRow" + this.UUID).removeChild(previousInfoMessage);
}
//show button again
document.getElementById("sponsorTimesDownvoteButtonsContainer" + this.UUID).style.removeProperty("display");
}
//close this notice
close() {
let notice = document.getElementById("sponsorSkipNotice" + this.UUID);
if (notice != null) {
notice.remove();
}
}
}