Merge pull request #122 from jtormalm/master

Add animation on skipButton entry and exit
This commit is contained in:
TwistedUmbrellaX 2024-04-18 11:05:47 -04:00 committed by GitHub
commit edd4652d8a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -76,6 +76,7 @@ introSkipper.injectCss = function () {
border-radius: 0px; border-radius: 0px;
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
opacity: 0;
box-shadow: inset 0 0 0 0 #f9f9f9; box-shadow: inset 0 0 0 0 #f9f9f9;
-webkit-transition: ease-out 0.4s; -webkit-transition: ease-out 0.4s;
-moz-transition: ease-out 0.4s; -moz-transition: ease-out 0.4s;
@ -177,7 +178,12 @@ introSkipper.videoPositionChanged = function () {
const segment = introSkipper.getCurrentSegment(introSkipper.videoPlayer.currentTime); const segment = introSkipper.getCurrentSegment(introSkipper.videoPlayer.currentTime);
switch (segment["SegmentType"]) { switch (segment["SegmentType"]) {
case "None": case "None":
skipButton.classList.add("hide"); if (skipButton.style.opacity === '0') return;
skipButton.style.opacity = '0';
skipButton.addEventListener("transitionend", () => {
skipButton.classList.add("hide");
}, { once: true });
return; return;
case "Introduction": case "Introduction":
skipButton.querySelector("#btnSkipSegmentText").textContent = skipButton.querySelector("#btnSkipSegmentText").textContent =
@ -188,7 +194,14 @@ introSkipper.videoPositionChanged = function () {
skipButton.dataset["credits_text"]; skipButton.dataset["credits_text"];
break; break;
} }
if (!skipButton.classList.contains("hide")) return;
skipButton.classList.remove("hide"); skipButton.classList.remove("hide");
requestAnimationFrame(() => {
requestAnimationFrame(() => {
skipButton.style.opacity = '1';
});
});
} }
/** Seeks to the end of the intro. */ /** Seeks to the end of the intro. */
introSkipper.doSkip = function (e) { introSkipper.doSkip = function (e) {