♻️ - Suppression de la classe JustifiedGallery et ajout de nouveaux effets de survol pour les images

JS/JustifedGallery/assets/js/lib/gallery/effects/lens.js

@@ -0,0 +1,37 @@
+export default function enableLensEffect(container) {
+    container
+        .querySelectorAll('.hover-lens')
+        .forEach(link => {
+            const img = link.querySelector('img');
+            if (!img) return;
+
+            link.addEventListener('mousemove', e => {
+                const rect = link.getBoundingClientRect();
+                const x = e.clientX - rect.left;
+                const y = e.clientY - rect.top;
+
+                link.style.setProperty('--lens-x', `${x}px`);
+                link.style.setProperty('--lens-y', `${y}px`);
+                link.style.setProperty('--lens-bg', `url(${img.src})`);
+                link.style.setProperty(
+                    '--lens-pos',
+                    `${(x / rect.width) * 100}% ${(y / rect.height) * 100}%`
+                );
+                link.style.backgroundImage = `url(${img.src})`;
+            });
+
+            link.addEventListener('mouseenter', () => {
+                const rect = link.getBoundingClientRect();
+                link.style.setProperty('--lens-bg', `url(${img.src})`);
+                link.style.setProperty('--lens-pos', `center center`);
+                link.style.setProperty('--lens-x', `${rect.width / 2}px`);
+                link.style.setProperty('--lens-y', `${rect.height / 2}px`);
+                link.classList.add('active');
+            });
+
+            link.addEventListener('mouseleave', () => {
+                link.classList.remove('active');
+                link.style.removeProperty('background-image');
+            });
+        });
+}

JS/JustifedGallery/assets/js/lib/gallery/effects/ripple-animate.js

@@ -0,0 +1,19 @@
+export default function enableRippleEffect(container) {
+    container
+        .querySelectorAll('.hover-ripple-animate')
+        .forEach(link => {
+            link.addEventListener('mouseenter', e => {
+                const rect = link.getBoundingClientRect();
+                const ripple = document.createElement('span');
+                ripple.classList.add('ripple-effect');
+
+                const size = Math.max(rect.width, rect.height);
+                ripple.style.width = ripple.style.height = `${size}px`;
+                ripple.style.left = `${e.clientX - rect.left}px`;
+                ripple.style.top = `${e.clientY - rect.top}px`;
+
+                link.appendChild(ripple);
+                ripple.addEventListener('animationend', () => ripple.remove());
+            });
+        });
+}

JS/JustifedGallery/assets/js/lib/gallery/effects/spotlight.js

@@ -0,0 +1,33 @@
+export function enableSpotlightEffect(container) {
+    const images = container.querySelectorAll('.hover-spotlight');
+
+    images.forEach(image => {
+        // Crée un overlay lumineux via pseudo ou dataset
+        const overlay = document.createElement('div');
+        overlay.classList.add('spotlight-overlay');
+        image.appendChild(overlay);
+
+        // Mise à jour dynamique du gradient
+        image.addEventListener('mousemove', (e) => {
+            const rect = image.getBoundingClientRect();
+            const x = e.clientX - rect.left;
+            const y = e.clientY - rect.top;
+
+            const intensity = Math.min(rect.width, rect.height) / 400;
+            overlay.style.background = `radial-gradient(
+                circle at ${x}px ${y}px,
+                rgba(255,255,255,${0.1 * intensity}),
+                rgba(0,0,0,0.5) 60%
+            )`;
+        });
+
+        // Reset progressif quand la souris sort
+        image.addEventListener('mouseleave', () => {
+            overlay.style.background = `radial-gradient(
+                circle at center,
+                rgba(255,255,255,0),
+                rgba(0,0,0,0.4) 70%
+            )`;
+        });
+    });
+}