deroulement js pour new content

web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js

@@ -356,17 +356,42 @@
       }
     });
 
-    // for each .date element add or remove ::before 
+// Fonction pour ajouter ou retirer la classe .only
-    document.querySelectorAll('.date').forEach(function(dateElement) {
+function updateDateClasses() {
-      const date2Element = dateElement.querySelector('.date2');
+  document.querySelectorAll('.paragraph--type--phase-deroulement .date').forEach(function(dateElement) {
-      const yearElement = dateElement.querySelector('.field_field_date_de_annee');
+    const date2Element = dateElement.querySelector('.date2');
+    const yearElement = dateElement.querySelector('.field_field_date_de_annee');
 
-      // Check if the .date2 element is empty
+    if (date2Element && !date2Element.textContent.trim()) {
-      if (date2Element && !date2Element.textContent.trim()) {
+      if (yearElement) {
-        // Add the .only class to the year element
         yearElement.classList.add('only');
       }
-    });
+    } else {
+      if (yearElement) {
+        yearElement.classList.remove('only');
+      }
+    }
+  });
+}
+
+// Exécuter la fonction une première fois pour le contenu déjà présent
+updateDateClasses();
+
+// MutationObserver pour surveiller les changements dans le DOM
+const observer = new MutationObserver(function(mutationsList, observer) {
+  for(let mutation of mutationsList) {
+    if (mutation.type === 'childList') {
+      updateDateClasses();
+    }
+  }
+});
+
+// Configuration de l'observateur
+const config = { childList: true, subtree: true };
+
+// Démarrer l'observateur sur le document entier ou sur un conteneur spécifique
+observer.observe(document.body, config);
+
 
             // Handle window resize
     window.addEventListener('resize', function() {