mirror of
https://github.com/ajayyy/SponsorBlock.git
synced 2025-12-10 13:37:04 +03:00
Made it possible for multiple notices to appear, added an animation for it.
This commit is contained in:
22
content.css
22
content.css
@@ -2,7 +2,7 @@
|
|||||||
font-family: 'Source Sans Pro', sans-serif;
|
font-family: 'Source Sans Pro', sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sponsorSkipLogo {
|
.sponsorSkipLogo {
|
||||||
height: 64px;
|
height: 64px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
@@ -11,7 +11,12 @@
|
|||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sponsorSkipNotice {
|
@keyframes fadeIn {
|
||||||
|
from { opacity: 0; }
|
||||||
|
to { opacity: 1; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsorSkipNotice {
|
||||||
min-height: 165px;
|
min-height: 165px;
|
||||||
min-width: 400px;
|
min-width: 400px;
|
||||||
background-color: rgba(255, 217, 217, 0.8);
|
background-color: rgba(255, 217, 217, 0.8);
|
||||||
@@ -19,9 +24,18 @@
|
|||||||
z-index: 1;
|
z-index: 1;
|
||||||
border: 3px solid rgba(0, 0, 0, 0.8);
|
border: 3px solid rgba(0, 0, 0, 0.8);
|
||||||
margin-top: -50px;
|
margin-top: -50px;
|
||||||
|
|
||||||
|
animation: fadeIn 0.5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sponsorSkipMessage {
|
/* if two are very close to eachother */
|
||||||
|
.secondSkipNotice {
|
||||||
|
margin-left: 500px;
|
||||||
|
|
||||||
|
transition: margin-left 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsorSkipMessage {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
color: #000000;
|
color: #000000;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@@ -30,7 +44,7 @@
|
|||||||
margin-top: 4px;
|
margin-top: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sponsorSkipInfo {
|
.sponsorSkipInfo {
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
color: #000000;
|
color: #000000;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|||||||
97
content.js
97
content.js
@@ -148,24 +148,26 @@ function sponsorCheck(sponsorTimes) { // Video skipping
|
|||||||
v.currentTime = sponsorTimes[i][1];
|
v.currentTime = sponsorTimes[i][1];
|
||||||
|
|
||||||
lastSponsorTimeSkipped = sponsorTimes[i][0];
|
lastSponsorTimeSkipped = sponsorTimes[i][0];
|
||||||
lastSponsorTimeSkippedUUID = UUIDs[i];
|
|
||||||
|
let currentUUID = UUIDs[i];
|
||||||
|
lastSponsorTimeSkippedUUID = currentUUID;
|
||||||
|
|
||||||
//send out the message saying that a sponsor message was skipped
|
//send out the message saying that a sponsor message was skipped
|
||||||
openSkipNotice();
|
openSkipNotice();
|
||||||
|
|
||||||
setTimeout(closeSkipNotice, 7000);
|
setTimeout(() => closeSkipNotice(currentUUID), 7000);
|
||||||
}
|
}
|
||||||
|
|
||||||
lastTime = v.currentTime;
|
lastTime = v.currentTime;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function goBackToPreviousTime() {
|
function goBackToPreviousTime(UUID) {
|
||||||
if (lastSponsorTimeSkipped != null) {
|
if (sponsorTimes != undefined) {
|
||||||
//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 = lastSponsorTimeSkipped + 0.001;
|
v.currentTime = sponsorTimes[UUIDs.indexOf(UUID)][0] + 0.001;
|
||||||
|
|
||||||
closeSkipNotice();
|
closeSkipNotice(UUID);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -239,40 +241,57 @@ function openSkipNotice(){
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let amountOfPreviousNotices = document.getElementsByClassName("sponsorSkipNotice").length;
|
||||||
|
|
||||||
|
if (amountOfPreviousNotices > 0) {
|
||||||
|
//already exists
|
||||||
|
|
||||||
|
let previousNotice = document.getElementsByClassName("sponsorSkipNotice")[0];
|
||||||
|
previousNotice.classList.add("secondSkipNotice")
|
||||||
|
}
|
||||||
|
|
||||||
|
let UUID = lastSponsorTimeSkippedUUID;
|
||||||
|
|
||||||
let noticeElement = document.createElement("div");
|
let noticeElement = document.createElement("div");
|
||||||
noticeElement.id = "sponsorSkipNotice";
|
//what sponsor time this is about
|
||||||
noticeElement.className = "sponsorSkipObject";
|
noticeElement.id = "sponsorSkipNotice" + lastSponsorTimeSkippedUUID;
|
||||||
|
noticeElement.classList.add("sponsorSkipObject");
|
||||||
|
noticeElement.classList.add("sponsorSkipNotice");
|
||||||
|
noticeElement.style.zIndex = 1 + amountOfPreviousNotices;
|
||||||
|
|
||||||
let logoElement = document.createElement("img");
|
let logoElement = document.createElement("img");
|
||||||
logoElement.id = "sponsorSkipLogo";
|
logoElement.id = "sponsorSkipLogo" + lastSponsorTimeSkippedUUID;
|
||||||
|
logoElement.className = "sponsorSkipLogo";
|
||||||
logoElement.src = chrome.extension.getURL("icons/LogoSponsorBlocker256px.png");
|
logoElement.src = chrome.extension.getURL("icons/LogoSponsorBlocker256px.png");
|
||||||
|
|
||||||
let noticeMessage = document.createElement("div");
|
let noticeMessage = document.createElement("div");
|
||||||
noticeMessage.id = "sponsorSkipMessage";
|
noticeMessage.id = "sponsorSkipMessage" + lastSponsorTimeSkippedUUID;
|
||||||
noticeMessage.className = "sponsorSkipObject";
|
noticeMessage.classList.add("sponsorSkipMessage");
|
||||||
|
noticeMessage.classList.add("sponsorSkipObject");
|
||||||
noticeMessage.innerText = "Hey, you just skipped a sponsor!";
|
noticeMessage.innerText = "Hey, you just skipped a sponsor!";
|
||||||
|
|
||||||
let noticeInfo = document.createElement("p");
|
let noticeInfo = document.createElement("p");
|
||||||
noticeInfo.id = "sponsorSkipInfo";
|
noticeInfo.id = "sponsorSkipInfo" + lastSponsorTimeSkippedUUID;
|
||||||
noticeInfo.className = "sponsorSkipObject";
|
noticeInfo.classList.add("sponsorSkipInfo");
|
||||||
|
noticeInfo.classList.add("sponsorSkipObject");
|
||||||
noticeInfo.innerText = "This message will disapear in 7 seconds";
|
noticeInfo.innerText = "This message will disapear in 7 seconds";
|
||||||
|
|
||||||
//thumbs up and down buttons
|
//thumbs up and down buttons
|
||||||
let voteButtonsContainer = document.createElement("div");
|
let voteButtonsContainer = document.createElement("div");
|
||||||
voteButtonsContainer.id = "sponsorTimesVoteButtonsContainer";
|
voteButtonsContainer.id = "sponsorTimesVoteButtonsContainer" + lastSponsorTimeSkippedUUID;
|
||||||
voteButtonsContainer.setAttribute("align", "center");
|
voteButtonsContainer.setAttribute("align", "center");
|
||||||
|
|
||||||
let upvoteButton = document.createElement("img");
|
let upvoteButton = document.createElement("img");
|
||||||
upvoteButton.id = "sponsorTimesUpvoteButtonsContainer"
|
upvoteButton.id = "sponsorTimesUpvoteButtonsContainer" + lastSponsorTimeSkippedUUID;
|
||||||
upvoteButton.className = "sponsorSkipObject voteButton";
|
upvoteButton.className = "sponsorSkipObject voteButton";
|
||||||
upvoteButton.src = chrome.extension.getURL("icons/upvote.png");
|
upvoteButton.src = chrome.extension.getURL("icons/upvote.png");
|
||||||
upvoteButton.addEventListener("click", upvote);
|
upvoteButton.addEventListener("click", () => upvote(UUID));
|
||||||
|
|
||||||
let downvoteButton = document.createElement("img");
|
let downvoteButton = document.createElement("img");
|
||||||
downvoteButton.id = "sponsorTimesDownvoteButtonsContainer"
|
downvoteButton.id = "sponsorTimesDownvoteButtonsContainer" + lastSponsorTimeSkippedUUID;
|
||||||
downvoteButton.className = "sponsorSkipObject voteButton";
|
downvoteButton.className = "sponsorSkipObject voteButton";
|
||||||
downvoteButton.src = chrome.extension.getURL("icons/downvote.png");
|
downvoteButton.src = chrome.extension.getURL("icons/downvote.png");
|
||||||
downvoteButton.addEventListener("click", downvote);
|
downvoteButton.addEventListener("click", () => downvote(UUID));
|
||||||
|
|
||||||
//add thumbs up and down buttons to the container
|
//add thumbs up and down buttons to the container
|
||||||
voteButtonsContainer.appendChild(upvoteButton);
|
voteButtonsContainer.appendChild(upvoteButton);
|
||||||
@@ -284,12 +303,12 @@ function openSkipNotice(){
|
|||||||
let goBackButton = document.createElement("button");
|
let goBackButton = document.createElement("button");
|
||||||
goBackButton.innerText = "Go back";
|
goBackButton.innerText = "Go back";
|
||||||
goBackButton.className = "sponsorSkipButton";
|
goBackButton.className = "sponsorSkipButton";
|
||||||
goBackButton.addEventListener("click", goBackToPreviousTime);
|
goBackButton.addEventListener("click", () => goBackToPreviousTime(UUID));
|
||||||
|
|
||||||
let hideButton = document.createElement("button");
|
let hideButton = document.createElement("button");
|
||||||
hideButton.innerText = "Dismiss";
|
hideButton.innerText = "Dismiss";
|
||||||
hideButton.className = "sponsorSkipButton";
|
hideButton.className = "sponsorSkipButton";
|
||||||
hideButton.addEventListener("click", closeSkipNotice);
|
hideButton.addEventListener("click", () => closeSkipNotice(UUID));
|
||||||
|
|
||||||
let dontShowAgainButton = document.createElement("button");
|
let dontShowAgainButton = document.createElement("button");
|
||||||
dontShowAgainButton.innerText = "Don't Show This Again";
|
dontShowAgainButton.innerText = "Don't Show This Again";
|
||||||
@@ -316,19 +335,19 @@ function openSkipNotice(){
|
|||||||
referenceNode.prepend(noticeElement);
|
referenceNode.prepend(noticeElement);
|
||||||
}
|
}
|
||||||
|
|
||||||
function upvote() {
|
function upvote(UUID) {
|
||||||
vote(1);
|
vote(1, UUID);
|
||||||
|
|
||||||
closeSkipNotice();
|
closeSkipNotice(UUID);
|
||||||
}
|
}
|
||||||
|
|
||||||
function downvote() {
|
function downvote(UUID) {
|
||||||
vote(0);
|
vote(0, UUID);
|
||||||
|
|
||||||
//change text to say thanks for voting
|
//change text to say thanks for voting
|
||||||
//remove buttons
|
//remove buttons
|
||||||
document.getElementById("sponsorTimesVoteButtonsContainer").removeChild(document.getElementById("sponsorTimesUpvoteButtonsContainer"));
|
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).removeChild(document.getElementById("sponsorTimesUpvoteButtonsContainer" + UUID));
|
||||||
document.getElementById("sponsorTimesVoteButtonsContainer").removeChild(document.getElementById("sponsorTimesDownvoteButtonsContainer"));
|
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).removeChild(document.getElementById("sponsorTimesDownvoteButtonsContainer" + UUID));
|
||||||
|
|
||||||
//add thanks for voting text
|
//add thanks for voting text
|
||||||
let thanksForVotingText = document.createElement("p");
|
let thanksForVotingText = document.createElement("p");
|
||||||
@@ -341,32 +360,40 @@ function downvote() {
|
|||||||
thanksForVotingInfoText.innerText = "Hit go back to get to where you came from."
|
thanksForVotingInfoText.innerText = "Hit go back to get to where you came from."
|
||||||
|
|
||||||
//add element to div
|
//add element to div
|
||||||
document.getElementById("sponsorTimesVoteButtonsContainer").appendChild(thanksForVotingText);
|
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).appendChild(thanksForVotingText);
|
||||||
document.getElementById("sponsorTimesVoteButtonsContainer").appendChild(thanksForVotingInfoText);
|
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).appendChild(thanksForVotingInfoText);
|
||||||
}
|
}
|
||||||
|
|
||||||
function vote(type) {
|
function vote(type, UUID) {
|
||||||
chrome.runtime.sendMessage({
|
chrome.runtime.sendMessage({
|
||||||
message: "submitVote",
|
message: "submitVote",
|
||||||
type: type,
|
type: type,
|
||||||
UUID: lastSponsorTimeSkippedUUID
|
UUID: UUID
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
//Closes the notice that tells the user that a sponsor was just skipped
|
//Closes the notice that tells the user that a sponsor was just skipped for this UUID
|
||||||
function closeSkipNotice(){
|
function closeSkipNotice(UUID){
|
||||||
let notice = document.getElementById("sponsorSkipNotice");
|
let notice = document.getElementById("sponsorSkipNotice" + UUID);
|
||||||
if (notice != null) {
|
if (notice != null) {
|
||||||
notice.remove();
|
notice.remove();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//Closes all notices that tell the user that a sponsor was just skipped
|
||||||
|
function closeAllSkipNotices(){
|
||||||
|
let notices = document.getElementsByClassName("sponsorSkipNotice");
|
||||||
|
for (let i = 0; i < notices.length; i++) {
|
||||||
|
notices[i].remove();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function dontShowNoticeAgain() {
|
function dontShowNoticeAgain() {
|
||||||
chrome.storage.local.set({"dontShowNoticeAgain": true});
|
chrome.storage.local.set({"dontShowNoticeAgain": true});
|
||||||
|
|
||||||
dontShowNotice = true;
|
dontShowNotice = true;
|
||||||
|
|
||||||
closeSkipNotice();
|
closeAllSkipNotices();
|
||||||
}
|
}
|
||||||
|
|
||||||
function sponsorMessageStarted() {
|
function sponsorMessageStarted() {
|
||||||
|
|||||||
Reference in New Issue
Block a user