Changed popup to only use report button instead of upvote and downvote + improved popup.

This commit is contained in:
Ajay Ramachandran
2019-08-14 21:30:02 -04:00
parent 739548d169
commit edb577cf5b
6 changed files with 79 additions and 119 deletions

View File

@@ -58,7 +58,7 @@
"message": "Never Show"
},
"hitGoBack": {
"message": "Hit go back to get to where you came from."
"message": "Hit unskip to get to where you came from."
},
"goBack": {
"message": "Unskip"
@@ -89,7 +89,7 @@
"message": "This probably isn't a YouTube tab, or you clicked too early. \n If you know this is a YouTube tab,\n close this popup and open it again."
},
"Voted": {
"message": "Thanks for voting!"
"message": "Voted!"
},
"voteFail": {
"message": "You have already voted this way before."

View File

@@ -61,13 +61,15 @@
.sponsorBlockSpacer {
background-color: rgb(100, 100, 100);
border-color: rgb(100, 100, 100);
margin-left: 5px;
}
.sponsorSkipNotice {
min-width: 270px;
min-width: 280px;
background-color: rgba(28, 28, 28, 0.9);
position: absolute;
right: 0;
right: 5px;
bottom: 100px;
right: 10px;
@@ -75,7 +77,9 @@
animation: fadeIn 0.5s;
border-spacing: 10px 10px;
border-spacing: 5px 10px;
padding-left: 5px;
padding-right: 5px;
}
.sponsorSkipNoticeTimeLeft {
@@ -90,7 +94,7 @@
/* if two are very close to eachother */
.secondSkipNotice {
bottom: 280px;
bottom: 250px;
transition: bottom 0.2s;
}
@@ -106,6 +110,8 @@
position: absolute;
float: right;
margin-right: 5px;
}
.sponsorSkipNoticeRightButton {
@@ -126,7 +132,6 @@
cursor: pointer;
margin-left: 10px;
margin-right: 10px;
}
@@ -162,18 +167,19 @@
margin-top: 0px;
}
.sponsorTimesVoteButtonMessage {
float: left;
}
.sponsorTimesInfoMessage {
font-size: 15px;
font-weight: bold;
color: #000000;
font-size: 13.3333px;
color: rgb(235, 235, 235);
text-align: center;
}
.voteButton {
height: 18px;
cursor: pointer;
margin-right: 10px;
}
.voteButton:hover {
filter: brightness(80%);

View File

@@ -870,25 +870,9 @@ function openSkipNotice(UUID){
noticeElement.classList.add("sponsorSkipNotice");
noticeElement.style.zIndex = 50 + amountOfPreviousNotices;
// let logoElement = document.createElement("img");
// logoElement.id = "sponsorSkipLogo" + UUID;
// logoElement.className = "sponsorSkipLogo";
// logoElement.src = chrome.extension.getURL("icons/LogoSponsorBlocker256px.png");
// let noticeMessage = document.createElement("div");
// noticeMessage.id = "sponsorSkipMessage" + UUID;
// noticeMessage.classList.add("sponsorSkipMessage");
// noticeMessage.classList.add("sponsorSkipObject");
// noticeMessage.innerText = "Hey, you just skipped a sponsor!";
// let noticeInfo = document.createElement("p");
// noticeInfo.id = "sponsorSkipInfo" + UUID;
// noticeInfo.classList.add("sponsorSkipInfo");
// noticeInfo.classList.add("sponsorSkipObject");
// noticeInfo.innerText = "This message will disapear in 7 seconds";
//the row that will contain the info
let firstRow = document.createElement("tr");
firstRow.id = "sponsorSkipNoticeFirstRow" + UUID;
let logoColumn = document.createElement("td");
@@ -913,7 +897,7 @@ function openSkipNotice(UUID){
closeButtonContainer.style.top = "11px";
let timeLeft = document.createElement("span");
timeLeft.innerText = "closing in 7s";
timeLeft.innerText = "closes in 7s";
timeLeft.className = "sponsorSkipObject sponsorSkipNoticeTimeLeft";
let hideButton = document.createElement("img");
@@ -929,29 +913,24 @@ function openSkipNotice(UUID){
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 upvoteButton = document.createElement("img");
upvoteButton.id = "sponsorTimesUpvoteButtonsContainer" + UUID;
upvoteButton.className = "sponsorSkipObject voteButton";
upvoteButton.src = chrome.extension.getURL("icons/upvote.png");
upvoteButton.addEventListener("click", () => vote(1, UUID));
let downvoteButton = document.createElement("img");
downvoteButton.id = "sponsorTimesDownvoteButtonsContainer" + UUID;
downvoteButton.className = "sponsorSkipObject voteButton";
downvoteButton.src = chrome.extension.getURL("icons/downvote.png");
downvoteButton.src = chrome.extension.getURL("icons/report.png");
downvoteButton.addEventListener("click", () => vote(0, UUID));
//add thumbs up and down buttons to the container
voteButtonsContainer.appendChild(upvoteButton);
voteButtonsContainer.appendChild(downvoteButton);
//add unskip button
@@ -968,7 +947,6 @@ function openSkipNotice(UUID){
//add don't show again button
let dontshowContainer = document.createElement("td");
dontshowContainer.className = "sponsorSkipNoticeRightSection";
dontshowContainer.style.bottom = "14px";
let dontShowAgainButton = document.createElement("button");
dontShowAgainButton.innerText = chrome.i18n.getMessage("Hide");
@@ -982,34 +960,6 @@ function openSkipNotice(UUID){
secondRow.appendChild(unskipContainer);
secondRow.appendChild(dontshowContainer);
// let buttonContainer = document.createElement("div");
// buttonContainer.setAttribute("align", "center");
// let goBackButton = document.createElement("button");
// goBackButton.innerText = chrome.i18n.getMessage("goBack");
// goBackButton.className = "sponsorSkipButton";
// goBackButton.addEventListener("click", () => goBackToPreviousTime(UUID));
// let hideButton = document.createElement("button");
// hideButton.innerText = chrome.i18n.getMessage("Dismiss");
// hideButton.className = "sponsorSkipButton";
// hideButton.addEventListener("click", () => closeSkipNotice(UUID));
// let dontShowAgainButton = document.createElement("button");
// dontShowAgainButton.innerText = chrome.i18n.getMessage("Hide");
// dontShowAgainButton.className = "sponsorSkipDontShowButton";
// dontShowAgainButton.addEventListener("click", dontShowNoticeAgain);
// buttonContainer.appendChild(goBackButton);
// buttonContainer.appendChild(hideButton);
// buttonContainer.appendChild(document.createElement("br"));
// buttonContainer.appendChild(document.createElement("br"));
// buttonContainer.appendChild(dontShowAgainButton);
// noticeElement.appendChild(logoElement);
// noticeElement.appendChild(noticeMessage);
// noticeElement.appendChild(noticeInfo);
noticeElement.appendChild(firstRow);
noticeElement.appendChild(spacer);
noticeElement.appendChild(secondRow);
@@ -1033,36 +983,8 @@ function openSkipNotice(UUID){
}
function afterDownvote(UUID) {
//change text to say thanks for voting
//remove buttons
let upvoteButton = document.getElementById("sponsorTimesUpvoteButtonsContainer" + UUID);
let downvoteButton = document.getElementById("sponsorTimesDownvoteButtonsContainer" + UUID);
if (upvoteButton != null) {
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).removeChild(upvoteButton);
}
if (downvoteButton != null) {
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).removeChild(downvoteButton);
}
let previousInfoMessage = document.getElementById("sponsorTimesInfoMessage" + UUID);
if (previousInfoMessage != null) {
//remove it
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).removeChild(previousInfoMessage);
}
//add thanks for voting text
let thanksForVotingText = document.createElement("p");
thanksForVotingText.id = "sponsorTimesThanksForVotingText";
thanksForVotingText.innerText = chrome.i18n.getMessage("Voted");
//add extra info for voting
let thanksForVotingInfoText = document.createElement("p");
thanksForVotingInfoText.id = "sponsorTimesThanksForVotingInfoText";
thanksForVotingInfoText.innerText = chrome.i18n.getMessage("hitGoBack");
//add element to div
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).appendChild(thanksForVotingText);
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).appendChild(thanksForVotingInfoText);
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
@@ -1081,41 +1003,71 @@ function afterDownvote(UUID) {
//update the preview
previewBar.set(sponsorTimesLeft, [], v.duration);
break;
}
}
}
function addLoadingInfo(message, UUID) {
//change text to say thanks for message
//remove buttons
let upvoteButton = document.getElementById("sponsorTimesUpvoteButtonsContainer" + UUID);
let downvoteButton = document.getElementById("sponsorTimesDownvoteButtonsContainer" + UUID);
if (upvoteButton != null) {
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).removeChild(upvoteButton);
}
if (downvoteButton != null) {
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).removeChild(downvoteButton);
}
function addNoticeInfoMessage(message, UUID) {
let previousInfoMessage = document.getElementById("sponsorTimesInfoMessage" + UUID);
if (previousInfoMessage != null) {
//remove it
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).removeChild(previousInfoMessage);
document.getElementById("sponsorSkipNotice" + UUID).removeChild(previousInfoMessage);
}
//add thanks for voting text
//add info
let thanksForVotingText = document.createElement("p");
thanksForVotingText.id = "sponsorTimesInfoMessage" + UUID;
thanksForVotingText.className = "sponsorTimesInfoMessage";
thanksForVotingText.innerText = message;
//add element to div
document.getElementById("sponsorTimesVoteButtonsContainer" + UUID).appendChild(thanksForVotingText);
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");
}
function vote(type, UUID) {
//add loading info
addLoadingInfo("Loading...", UUID)
addVoteButtonInfo("Loading...", UUID)
resetNoticeInfoMessage(UUID);
chrome.runtime.sendMessage({
message: "submitVote",
@@ -1128,18 +1080,19 @@ function vote(type, UUID) {
//success
if (type == 0) {
afterDownvote(UUID);
} else if (type == 1) {
closeSkipNotice(UUID);
}
} else if (response.successType == 0) {
//failure: duplicate vote
addLoadingInfo(chrome.i18n.getMessage("voteFAIL"), UUID)
addNoticeInfoMessage(chrome.i18n.getMessage("voteFAIL"), UUID)
resetVoteButtonInfo(UUID);
} else if (response.successType == -1) {
if (response.statusCode == 502) {
addLoadingInfo(chrome.i18n.getMessage("serverDown"), UUID)
addNoticeInfoMessage(chrome.i18n.getMessage("serverDown"), UUID)
resetVoteButtonInfo(UUID);
} else {
//failure: unknown error
addLoadingInfo(chrome.i18n.getMessage("connectionError") + response.statusCode, UUID);
addNoticeInfoMessage(chrome.i18n.getMessage("connectionError") + response.statusCode, UUID);
resetVoteButtonInfo(UUID);
}
}
}

BIN
icons/report.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

@@ -33,6 +33,7 @@
"icons/PlayerUploadFailedIconSponsorBlocker256px.png",
"icons/upvote.png",
"icons/downvote.png",
"icons/report.png",
"icons/close.png",
"icons/PlayerInfoIconSponsorBlocker256px.png",
"icons/PlayerDeleteIconSponsorBlocker256px.png",

View File

@@ -1051,7 +1051,7 @@ function runThePopup() {
//this is not a YouTube video page
function displayNoVideo() {
document.getElementById("loadingIndicator").innerHTML = chrome.i18n.getMessage("noVideoID");
document.getElementById("loadingIndicator").innerText = chrome.i18n.getMessage("noVideoID");
}
function reportAnIssue() {