CodeDevMLH/Seasonals
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add stop bunny animation

Browse Source
This commit is contained in:
MLH
2025-01-24 01:38:20 +01:00
parent 14e55b628b
commit 42ec6eb458
1 changed files with 12 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
seperate single seasonals/Seasonals-Easter/easter.js
View File

@@ -6,13 +6,13 @@ const easterEggCount = 20; // count of random extra easter
const bunny = true; // enable/disable hopping bunny const bunny = true; // enable/disable hopping bunny
const bunnyDuration = 12000; // duration of the bunny animation in ms const bunnyDuration = 12000; // duration of the bunny animation in ms
const hopHeight = 20; // height of the bunny hops in px const hopHeight = 12; // height of the bunny hops in px
const minBunnyRestTime = 2000; // minimum time the bunny rests in ms const minBunnyRestTime = 2000; // minimum time the bunny rests in ms
const maxBunnyRestTime = 5000; // maximum time the bunny rests in ms const maxBunnyRestTime = 5000; // maximum time the bunny rests in ms
let msgPrinted = false; // flag to prevent multiple console messages let msgPrinted = false; // flag to prevent multiple console messages
let rabbitActive = true; // flag to control the bunny animation let animationFrameId;
// function to check and control the easter // function to check and control the easter
function toggleEaster() { function toggleEaster() {
@@ -27,16 +27,19 @@ function toggleEaster() {
// hide easter if video/trailer player is active or dashboard is visible // hide easter if video/trailer player is active or dashboard is visible
if (videoPlayer || trailerPlayer || isDashboard || hasUserMenu) { if (videoPlayer || trailerPlayer || isDashboard || hasUserMenu) {
easterContainer.style.display = 'none'; // hide easter easterContainer.style.display = 'none'; // hide easter
rabbitActive = false; // stop the bunny animation if (animationFrameId) {
cancelAnimationFrame(animationFrameId);
animationFrameId = null;
}
if (!msgPrinted) { if (!msgPrinted) {
console.log('Easter hidden'); console.log('Easter hidden');
msgPrinted = true; msgPrinted = true;
} }
} else { } else {
easterContainer.style.display = 'block'; // show easter easterContainer.style.display = 'block'; // show easter
rabbitActive = true; // start the bunny animation if (!animationFrameId) {
let rabbitDiv = document.getElementById("rabbit"); animateRabbit(); // start animation
animateRabbit(rabbitDiv); }
if (msgPrinted) { if (msgPrinted) {
console.log('Easter visible'); console.log('Easter visible');
msgPrinted = false; msgPrinted = false;
@@ -158,7 +161,6 @@ function animateRabbit(rabbit) {
let startTime = null; let startTime = null;
function animationStep(timestamp) { function animationStep(timestamp) {
if (!rabbitActive) return;
if (!startTime) { if (!startTime) {
startTime = timestamp; startTime = timestamp;
@@ -183,18 +185,18 @@ function animateRabbit(rabbit) {
rabbit.style.transform = `translate(${x}vw, ${y}px) scaleX(${rabbit.direction})`; rabbit.style.transform = `translate(${x}vw, ${y}px) scaleX(${rabbit.direction})`;
if (progress < bunnyDuration) { if (progress < bunnyDuration) {
requestAnimationFrame(animationStep); animationFrameId = requestAnimationFrame(animationStep);
} else { } else {
// let the bunny rest for a while before hiding easter eggs again // let the bunny rest for a while before hiding easter eggs again
const pauseDuration = Math.random() * (maxBunnyRestTime - minBunnyRestTime) + minBunnyRestTime; const pauseDuration = Math.random() * (maxBunnyRestTime - minBunnyRestTime) + minBunnyRestTime;
setTimeout(() => { setTimeout(() => {
startTime = null; startTime = null;
requestAnimationFrame(animationStep); animationFrameId = requestAnimationFrame(animationStep);
}, pauseDuration); }, pauseDuration);
} }
} }
requestAnimationFrame(animationStep); animationFrameId = requestAnimationFrame(animationStep);
} }