Don't show animations before loading

This commit is contained in:
Ajay Ramachandran
2020-12-14 00:35:49 -05:00
parent 1afabb934f
commit 125a83ac3f
3 changed files with 56 additions and 79 deletions

View File

@@ -166,8 +166,12 @@ background-color:#ec1c1c;
background: white; background: white;
position: absolute; position: absolute;
border-radius: 12.5px; border-radius: 12.5px;
transition: transform .2s ease-out;
box-shadow: .75px .75px 3.8px 0px rgba(50, 50, 50, 0.45); box-shadow: .75px .75px 3.8px 0px rgba(50, 50, 50, 0.45);
transition: transform .2s ease-out;
}
.preload * {
transition: none !important;
} }
#toggleSwitch:checked~.switchDot { #toggleSwitch:checked~.switchDot {

View File

@@ -5,7 +5,7 @@
</head> </head>
<body style="margin: 0; min-width: 320px; background: var(--sb-main-bg-color);"> <body style="margin: 0; min-width: 320px; background: var(--sb-main-bg-color);">
<div id="sponsorblockPopup" class="sponsorBlockPageBody"> <div id="sponsorblockPopup" class="sponsorBlockPageBody preload">
<div class="logoText bottomSpace"> <div class="logoText bottomSpace">
<img src="icons/IconSponsorBlocker256px.png" height="40px" id="sponsorBlockPopupLogo"> <img src="icons/IconSponsorBlocker256px.png" height="40px" id="sponsorBlockPopupLogo">
<p>SponsorBlock</p> <p>SponsorBlock</p>

View File

@@ -47,7 +47,9 @@ async function runThePopup(messageListener?: MessageListener) {
var PageElements: any = {}; var PageElements: any = {};
["sponsorStart", [
"sponsorblockPopup",
"sponsorStart",
// Top toggles // Top toggles
"whitelistChannel", "whitelistChannel",
"unwhitelistChannel", "unwhitelistChannel",
@@ -62,30 +64,18 @@ async function runThePopup(messageListener?: MessageListener) {
"helpButton", "helpButton",
// More controls // More controls
"submitTimes", "submitTimes",
//"reportAnIssue",
// sponsorTimesContributions
"sponsorTimesContributionsContainer", "sponsorTimesContributionsContainer",
"sponsorTimesContributionsDisplay", "sponsorTimesContributionsDisplay",
//"sponsorTimesContributionsDisplayEndWord",
// sponsorTimesViewsDisplay
"sponsorTimesViewsContainer", "sponsorTimesViewsContainer",
"sponsorTimesViewsDisplay", "sponsorTimesViewsDisplay",
"sponsorTimesViewsDisplayEndWord", "sponsorTimesViewsDisplayEndWord",
// sponsorTimesOthersTimeSaved
//"sponsorTimesOthersTimeSavedContainer",
"sponsorTimesOthersTimeSavedDisplay", "sponsorTimesOthersTimeSavedDisplay",
"sponsorTimesOthersTimeSavedEndWord", "sponsorTimesOthersTimeSavedEndWord",
// sponsorTimesSkipsDone
"sponsorTimesSkipsDoneContainer", "sponsorTimesSkipsDoneContainer",
"sponsorTimesSkipsDoneDisplay", "sponsorTimesSkipsDoneDisplay",
"sponsorTimesSkipsDoneEndWord", "sponsorTimesSkipsDoneEndWord",
// sponsorTimeSaved
//"sponsorTimeSavedContainer",
"sponsorTimeSavedDisplay", "sponsorTimeSavedDisplay",
"sponsorTimeSavedEndWord", "sponsorTimeSavedEndWord",
// discordButtons
//"discordButtonContainer",
//"hideDiscordButton",
// Username // Username
"setUsernameContainer", "setUsernameContainer",
"setUsernameButton", "setUsernameButton",
@@ -114,18 +104,10 @@ async function runThePopup(messageListener?: MessageListener) {
unwhitelistChannel(); unwhitelistChannel();
} }
}); });
//PageElements.whitelistChannel.addEventListener("click", whitelistChannel);
PageElements.whitelistForceCheck.addEventListener("click", openOptions); PageElements.whitelistForceCheck.addEventListener("click", openOptions);
//PageElements.unwhitelistChannel.addEventListener("click", unwhitelistChannel);
PageElements.toggleSwitch.addEventListener("change", function() { PageElements.toggleSwitch.addEventListener("change", function() {
if (this.checked) { toggleSkipping(!this.checked);
toggleSkipping(false);
} else {
toggleSkipping(true);
}
}); });
//PageElements.disableSkipping.addEventListener("click", () => toggleSkipping(true));
//PageElements.enableSkipping.addEventListener("click", () => toggleSkipping(false));
PageElements.submitTimes.addEventListener("click", submitTimes); PageElements.submitTimes.addEventListener("click", submitTimes);
//PageElements.showNoticeAgain.addEventListener("click", showNoticeAgain); //PageElements.showNoticeAgain.addEventListener("click", showNoticeAgain);
PageElements.setUsernameButton.addEventListener("click", setUsernameButton); PageElements.setUsernameButton.addEventListener("click", setUsernameButton);
@@ -133,8 +115,6 @@ async function runThePopup(messageListener?: MessageListener) {
PageElements.submitUsername.addEventListener("click", submitUsername); PageElements.submitUsername.addEventListener("click", submitUsername);
PageElements.optionsButton.addEventListener("click", openOptions); PageElements.optionsButton.addEventListener("click", openOptions);
PageElements.helpButton.addEventListener("click", openHelp); PageElements.helpButton.addEventListener("click", openHelp);
//PageElements.reportAnIssue.addEventListener("click", reportAnIssue);
//PageElements.hideDiscordButton.addEventListener("click", hideDiscordButton);
//if true, the button now selects the end time //if true, the button now selects the end time
let startTimeChosen = false; let startTimeChosen = false;
@@ -183,11 +163,6 @@ async function runThePopup(messageListener?: MessageListener) {
//get the amount of times this user has contributed and display it to thank them //get the amount of times this user has contributed and display it to thank them
if (Config.config.sponsorTimesContributed != undefined) { if (Config.config.sponsorTimesContributed != undefined) {
/*if (Config.config.sponsorTimesContributed !== 1) {
PageElements.sponsorTimesContributionsDisplayEndWord.innerText = chrome.i18n.getMessage("Segments");
} else {
PageElements.sponsorTimesContributionsDisplayEndWord.innerText = chrome.i18n.getMessage("Segment");
}*/
PageElements.sponsorTimesContributionsDisplay.innerText = Config.config.sponsorTimesContributed.toLocaleString(); PageElements.sponsorTimesContributionsDisplay.innerText = Config.config.sponsorTimesContributed.toLocaleString();
PageElements.sponsorTimesContributionsContainer.classList.remove("hidden"); PageElements.sponsorTimesContributionsContainer.classList.remove("hidden");
@@ -255,6 +230,9 @@ async function runThePopup(messageListener?: MessageListener) {
//PageElements.sponsorTimeSavedContainer.style.display = "unset"; //PageElements.sponsorTimeSavedContainer.style.display = "unset";
} }
// Must be delayed so it only happens once loaded
setTimeout(() => PageElements.sponsorblockPopup.classList.remove("preload"), 250);
messageHandler.query({ messageHandler.query({
active: true, active: true,
currentWindow: true currentWindow: true
@@ -897,11 +875,6 @@ async function runThePopup(messageListener?: MessageListener) {
document.getElementById("loadingIndicator").innerText = chrome.i18n.getMessage("noVideoID"); document.getElementById("loadingIndicator").innerText = chrome.i18n.getMessage("noVideoID");
} }
/*function reportAnIssue() {
document.getElementById("issueReporterContainer").style.display = "unset";
//PageElements.reportAnIssue.style.display = "none";
}*/
function addVoteMessage(message, UUID) { function addVoteMessage(message, UUID) {
let voteButtonsContainer = document.getElementById("sponsorTimesVoteButtonsContainer" + UUID); let voteButtonsContainer = document.getElementById("sponsorTimesVoteButtonsContainer" + UUID);
voteButtonsContainer.style.display = "none"; voteButtonsContainer.style.display = "none";