From 62beb5006764125fd1f6c1416d370a557ed8e2bb Mon Sep 17 00:00:00 2001 From: bach Date: Wed, 25 Sep 2024 16:46:35 +0200 Subject: [PATCH] js bug fix --- .../src/assets/js/animated_formes.js | 46 ++++---- .../src/assets/js/quartiers_de_demain.js | 101 ++++++++++-------- 2 files changed, 82 insertions(+), 65 deletions(-) diff --git a/web/themes/custom/quartiers_de_demain/src/assets/js/animated_formes.js b/web/themes/custom/quartiers_de_demain/src/assets/js/animated_formes.js index 5de3e3d..25c51d4 100644 --- a/web/themes/custom/quartiers_de_demain/src/assets/js/animated_formes.js +++ b/web/themes/custom/quartiers_de_demain/src/assets/js/animated_formes.js @@ -1,10 +1,11 @@ document.addEventListener('scroll', function() { const scrolled = window.pageYOffset; const background = document.getElementById('background-animated'); - - // Adjust this value to control the speed of the parallax effect - const parallaxSpeed = 0.2; - background.style.transform = 'translateY(' + (scrolled * parallaxSpeed) + 'px)'; + if (background) { + // Adjust this value to control the speed of the parallax effect + const parallaxSpeed = 0.2; + background.style.transform = 'translateY(' + (scrolled * parallaxSpeed) + 'px)'; + } }); @@ -34,21 +35,24 @@ document.addEventListener('scroll', function() { //ANimation Pilliers const svg = document.querySelector('#paragraph-id--7 .colone-picto'); -// Configuration de l'observateur d'intersection -const observer = new IntersectionObserver(entries => { - entries.forEach(entry => { - if (entry.isIntersecting) { - // Ajoute une classe lorsque l'élément est visible - // svg.classList.remove('invisible'); - svg.classList.add('visible'); - } - // else { - // // Optionnel : Retirez la classe si nécessaire - // svg.classList.remove('visible'); - - // } +if (svg) { + // Configuration de l'observateur d'intersection + const observer = new IntersectionObserver(entries => { + entries.forEach(entry => { + if (entry.isIntersecting) { + // Ajoute une classe lorsque l'élément est visible + // svg.classList.remove('invisible'); + svg.classList.add('visible'); + } + // else { + // // Optionnel : Retirez la classe si nécessaire + // svg.classList.remove('visible'); + + // } + }); }); -}); - -// Observer l'élément SVG -observer.observe(svg); + + // Observer l'élément SVG + observer.observe(svg); + +} diff --git a/web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js b/web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js index 18618b1..ed6008d 100644 --- a/web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js +++ b/web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js @@ -340,9 +340,16 @@ } // Attach event listeners - document.getElementById('arrowPrev').addEventListener('click', prevSlide); - document.getElementById('arrowNext').addEventListener('click', nextSlide); - + let arrowprev = document.getElementById('arrowPrev'); + if (arrowprev) { + arrowprev.addEventListener('click', prevSlide); + } + let arrownext = document.getElementById('arrowNext') + if (arrownext) { + arrownext.addEventListener('click', nextSlide); + } + + // Update month field to only show the first 3 letters document.querySelectorAll('.paragraph--type--phase-deroulement').forEach(function(paragraph) { const monthField = paragraph.querySelector('.field_field_date_de_moi div:nth-of-type(2)'); @@ -427,52 +434,58 @@ //////////// slideshow home ////////////////////////// $(document).ready(function(){ - $('.content-actus .view').slick({ - slidesToShow: 3, - // slidesToScroll: 1, - dots: false, - arrows: true, - centerMode: true, - adaptiveHeight: true, - autoplay: false, - // autoplaySpeed: 1500, - // infinite: true, - // centerPadding: '100px', - responsive: [ - { - breakpoint: 810, - settings: { - slidesToShow: 1, - adaptiveHeight: false, - arrows: true, - draggable: true, - centerMode: true, - autoplay: false, - // autoplaySpeed: 2000, - } - }] - }); - console.log('salut slick home'); + let actuview = $('.content-actus .view') + if (actuview) { + actuview.slick({ + slidesToShow: 3, + // slidesToScroll: 1, + dots: false, + arrows: true, + centerMode: true, + adaptiveHeight: true, + autoplay: false, + // autoplaySpeed: 1500, + // infinite: true, + // centerPadding: '100px', + responsive: [ + { + breakpoint: 810, + settings: { + slidesToShow: 1, + adaptiveHeight: false, + arrows: true, + draggable: true, + centerMode: true, + autoplay: false, + // autoplaySpeed: 2000, + } + }] + }); + console.log('salut slick home'); + + } }); ////////////////////// start diaporama home swiper ///////////////////////////////// - - $(document).ready(function () { - //initialize swiper when document ready - var mySwiper = new Swiper ('.swiper-container', { + + // PAS DE SWIPER CHARGÉ DANS L'ENV JS ... + + // $(document).ready(function () { + // //initialize swiper when document ready + // let mySwiper = new Swiper ('.swiper-container', { - speed: 400, - spaceBetween: 100, - // Optional parameters - autoplay: { - delay: 3000, - disableOnInteraction: false, - }, - direction: 'horizontal', - loop: true, - }) - }); + // speed: 400, + // spaceBetween: 100, + // // Optional parameters + // autoplay: { + // delay: 3000, + // disableOnInteraction: false, + // }, + // direction: 'horizontal', + // loop: true, + // }) + // }); ////////////////////// end diaporama home swiper /////////////////////////////////