Compare commits

..

3 Commits

3 changed files with 14 additions and 9 deletions

View File

@ -5,8 +5,6 @@
<title>Compteur Electrique</title>
<link rel="stylesheet" href="styles/general.css">
<link rel="stylesheet" href="fonts/FuturaBold/FuturaBold.css">
<link rel="stylesheet" href="fonts/FuturaBoldItalic/FuturaBoldItalic.css">
<script type="text/javascript" src="scripts/session_startup_animation.js"></script>
<link rel="stylesheet" href="styles/session_startup_animation.css">

View File

@ -9,10 +9,13 @@ function waitForAnimationEnd(elem, animationName)
resolve();
}
}
elem.onanimationend = handleAnimationEnd;
});
}
let sound = new Audio("../assets/game-boy-advance-startup-sound.mp3");
async function sessionStartupAnimation()
{
// Page setup
@ -48,11 +51,10 @@ async function sessionStartupAnimation()
text_elem.className = "startup-animation-text";
text_elem.innerHTML = quote.text;
let sound = new Audio("../assets/game-boy-advance-startup-sound.mp3");
sound.play();
document.body.appendChild(text_elem);
sound.play();
await waitForAnimationEnd(text_elem, "text-animation");
// Fade out for both
@ -73,8 +75,13 @@ async function sessionStartupAnimation()
function interruptStartingAnimation()
{
// Bad but works in this context
window.location.reload();
let author_elem = document.body.querySelector(".startup-animation-author");
author_elem.getAnimations().forEach((animation) => animation.finish());
let text_elem = document.body.querySelector(".startup-animation-text");
text_elem.getAnimations().forEach((animation) => animation.finish());
sound.currentTime = 2.75;
}
window.onkeydown = () => {
@ -83,7 +90,7 @@ window.onkeydown = () => {
}
window.onload = () => {
//if(!sessionStorage.getItem("hasExecutedSessionStartupAnimation"))
if(!sessionStorage.getItem("hasExecutedSessionStartupAnimation"))
{
sessionStorage.setItem("hasExecutedSessionStartupAnimation", "true");
sessionStartupAnimation();

View File

@ -66,7 +66,7 @@
width: 100%;
top: 25%;
text-align: center;
animation: text-animation 2.5s ease-in-out, opacity-fade-in 1s;
animation: text-animation 3s ease-in-out, opacity-fade-in 1s;
}
.startup-animation-author {