diff --git a/static/script-bon.js b/static/script-bon.js index 8f416b0..c369bb1 100644 --- a/static/script-bon.js +++ b/static/script-bon.js @@ -2,27 +2,6 @@ let animationPaused = false; // Dictionary to keep track of animation intervals let animationIntervals = {}; - -document.getElementById('toggleAnimation').addEventListener('click', function() { - const button = document.getElementById('toggleAnimation'); - - if (animationPaused) { - button.textContent = 'Pause'; - animationPaused = false; - // Play the animation - Object.keys(animationIntervals).forEach(id => { - animationIntervals[id] = setInterval(updateAnimation, delays[id], id, frames[id], frames[id].length); - }); - } else { - button.textContent = 'Play'; - animationPaused = true; - // Pause the animation - Object.keys(animationIntervals).forEach(id => { - clearInterval(animationIntervals[id]); - }); - } -}); - // Dictionary to keep track of delay count for each animation let delays = {}; // Dictionary to keep track of frame for each animation @@ -87,13 +66,19 @@ document.addEventListener('DOMContentLoaded', function() { function toggleAnimation() { const toggleable = document.querySelector('.toggleable'); const imgTopToggleable = document.querySelector('.img_top_toggleable'); - + // Play the animations if (toggleable.style.display === 'none') { toggleable.style.display = 'block'; imgTopToggleable.style.display = 'none'; - } else { + Object.keys(animationIntervals).forEach(id => { + animationIntervals[id] = setInterval(updateAnimation, delays[id], id, frames[id], frames[id].length); + }); + } else { // Pause the animations toggleable.style.display = 'none'; imgTopToggleable.style.display = 'block'; + Object.keys(animationIntervals).forEach(id => { + clearInterval(animationIntervals[id]); + }); } }