|‾‾‾‾‾‾‾‾‾|
diff --git a/static/script-bon.js b/static/script-bon.js
index 5d09dd1..ebad4d8 100644
--- a/static/script-bon.js
+++ b/static/script-bon.js
@@ -1,14 +1,15 @@
async function setupPage() {
-// Checks if the user enabled prefers-reduced-motion
+ // Checks if the user enabled prefers-reduced-motion
const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
-// Dictionary to keep track of animation intervals
+ let animationEnabled = prefersReducedMotion;
+ // Dictionary to keep track of animation intervals
let animationIntervals = {};
-// Dictionary to keep track of delay count for each animation
+ // Dictionary to keep track of delay count for each animation
let delays = {};
-// Dictionary to keep track of frame for each animation
+ // Dictionary to keep track of frame for each animation
let frames = {};
-// dictionary to keep track of frame count for each animation
+ // dictionary to keep track of frame count for each animation
let frameCounts = {};
const illustrationAccueil = document.getElementById('illustration-accueil');
@@ -16,9 +17,9 @@ async function setupPage() {
const orsay = document.getElementById('orsay');
const parterre = document.getElementById('parterre');
-// Update ARIA live attributes based on prefers-reduced-motion
- function updateARIALiveAttributes() {
- if (prefersReducedMotion) {
+ // Update ARIA live attributes based on prefers-reduced-motion
+ function setARIALiveAttributes(isAnimated) {
+ if (isAnimated) {
illustrationAccueil.setAttribute('aria-live', 'off');
rennes.setAttribute('aria-live', 'off');
orsay.setAttribute('aria-live', 'off');
@@ -52,12 +53,10 @@ async function setupPage() {
delays[id] = delay;
// Update ARIA live attributes
- updateARIALiveAttributes();
+ setARIALiveAttributes(true);
// Start the animation if prefers-reduced-motion is not enabled
- if (!prefersReducedMotion) {
- animationIntervals[id] = setInterval(updateAnimation, delay, id, framesList, framesList.length);
- }
+ animationIntervals[id] = setInterval(updateAnimation, delay, id, framesList, framesList.length);
}
function updateAnimation(id, framesList, totalFrames) {
@@ -76,17 +75,19 @@ async function setupPage() {
}
}
- animate("illustration-accueil", 500);
- animate("rennes", 1000);
- animate("orsay", 2000);
- animate("parterre", 1500);
+ if (animationEnabled) {
+ animate("illustration-accueil", 500);
+ animate("rennes", 1000);
+ animate("orsay", 2000);
+ animate("parterre", 1500);
+ }
- const toggleableElements = document.querySelectorAll('.toggleable, .img_top_toggleable');
- toggleableElements.forEach(function (element) {
- element.addEventListener('click', function () {
- toggleAnimation();
- });
+ const toggleableElements = document.querySelectorAll('.toggleable, .img_top_toggleable');
+ toggleableElements.forEach(function (element) {
+ element.addEventListener('click', function () {
+ toggleAnimation();
});
+ });
function toggleAnimation() {
const toggleable = document.querySelector('.toggleable');