Countdown timer now pauses after hovering.

Also lowered countdown time.
This commit is contained in:
Ajay Ramachandran
2019-08-19 17:24:17 -04:00
parent db2af83a34
commit 6fe94a70a7
2 changed files with 37 additions and 3 deletions

View File

@@ -72,6 +72,9 @@
"goBack": { "goBack": {
"message": "Unskip" "message": "Unskip"
}, },
"paused": {
"message": "Paused"
},
"confirmMSG": { "confirmMSG": {
"message": "\n\nTo edit or delete individual values, click the info button or open the extension popup by clicking the extension icon in the top right corner." "message": "\n\nTo edit or delete individual values, click the info button or open the extension popup by clicking the extension icon in the top right corner."
}, },

View File

@@ -7,7 +7,9 @@ class SkipNotice {
this.UUID = UUID; this.UUID = UUID;
//the countdown until this notice closes //the countdown until this notice closes
this.countdownTime = 7; this.countdownTime = 4;
//the id for the setInterval running the countdown
this.countdownInterval = -1;
//add notice //add notice
let amountOfPreviousNotices = document.getElementsByClassName("sponsorSkipNotice").length; let amountOfPreviousNotices = document.getElementsByClassName("sponsorSkipNotice").length;
@@ -26,6 +28,10 @@ class SkipNotice {
noticeElement.classList.add("sponsorSkipNotice"); noticeElement.classList.add("sponsorSkipNotice");
noticeElement.style.zIndex = 50 + amountOfPreviousNotices; noticeElement.style.zIndex = 50 + amountOfPreviousNotices;
//add mouse enter and leave listeners
noticeElement.addEventListener("mouseenter", this.pauseCountdown.bind(this));
noticeElement.addEventListener("mouseleave", this.startCountdown.bind(this));
//the row that will contain the info //the row that will contain the info
let firstRow = document.createElement("tr"); let firstRow = document.createElement("tr");
firstRow.id = "sponsorSkipNoticeFirstRow" + this.UUID; firstRow.id = "sponsorSkipNoticeFirstRow" + this.UUID;
@@ -151,8 +157,7 @@ class SkipNotice {
referenceNode.prepend(noticeElement); referenceNode.prepend(noticeElement);
//add closing listener this.startCountdown();
this.countdownInterval = setInterval(this.countdown.bind(this), 1000);
} }
//called every second to lower the countdown before hiding the notice //called every second to lower the countdown before hiding the notice
@@ -169,6 +174,32 @@ class SkipNotice {
return; return;
} }
this.updateTimerDisplay();
}
pauseCountdown() {
//remove setInterval
clearInterval(this.countdownInterval);
this.countdownInterval = -1;
//reset countdown
this.countdownTime = 4;
//inform the user
let timeLeft = document.getElementById("sponsorSkipNoticeTimeLeft" + this.UUID);
timeLeft.innerText = chrome.i18n.getMessage("paused");
}
startCountdown() {
//if it has already started, don't start it again
if (this.countdownInterval != -1) return;
this.countdownInterval = setInterval(this.countdown.bind(this), 1000);
this.updateTimerDisplay();
}
updateTimerDisplay() {
//update the timer display //update the timer display
let timeLeft = document.getElementById("sponsorSkipNoticeTimeLeft" + this.UUID); let timeLeft = document.getElementById("sponsorSkipNoticeTimeLeft" + this.UUID);
timeLeft.innerText = this.countdownTime + "s"; timeLeft.innerText = this.countdownTime + "s";