https://aci2025worldcongress.com/assets/js/template.js

1jQuery(document).ready(function ($) {
2
3  // Back to top button
4  $(window).scroll(function () {
5    if ($(this).scrollTop() > 100) {
6      $('.back-to-top').fadeIn('slow');
7    } else {
8      $('.back-to-top').fadeOut('slow');
9    }
10  });
11  $('.back-to-top').click(function () {
12    $('html, body').animate({ scrollTop: 0 }, 1500, 'easeInOutExpo');
13    return false;
14  });
15
16  // Header fixed on scroll
17  $(window).scroll(function () {
18    if ($(this).scrollTop() > 100) {
19      $('#header').addClass('header-scrolled');
20    } else {
21      $('#header').removeClass('header-scrolled');
22    }
23  });
24
25  if ($(window).scrollTop() > 100) {
26    $('#header').addClass('header-scrolled');
27  }
28
29  // Real view height for mobile devices
30  if (window.matchMedia("(max-width: 767px)").matches) {
31    $('#intro').css({ height: $(window).height() });
32  }
33
34  // Initiate the wowjs animation library
35  new WOW().init();
36
37  // Initialize Venobox
38  $('.venobox').venobox({
39    bgcolor: '',
40    overlayColor: 'rgba(6, 12, 34, 0.85)',
41    closeBackground: '',
42    closeColor: '#fff'
43  });
44
45  // Initiate superfish on nav menu
46  $('.nav-menu').superfish({
47    animation: {
48      opacity: 'show'
49    },
50    speed: 400
51  });
52
53  // Mobile Navigation
54  if ($('#nav-menu-container').length) {
55    var $mobile_nav = $('#nav-menu-container').clone().prop({
56      id: 'mobile-nav'
57    });
58
59    $mobile_nav.find('> ul').attr({
60      'class': '',
61      'id': ''
62    });
63
64    $('body').append($mobile_nav);
65    $('body').prepend('<button type="button" id="mobile-nav-toggle"><i class="fa fa-bars"></i></button>');
66    $('body').append('<div id="mobile-body-overly"></div>');
67
68    $('#mobile-nav').find('.menu-has-children').prepend('<i class="fa fa-chevron-down"></i>');
69
70    $(document).on('click', '.menu-has-children > i', function (e) {
71      e.stopPropagation(); // Évite la propagation des événements
72
73      let $this = $(this);
74      let $submenu = $this.nextAll('ul').eq(0);
75      let $parentLi = $this.closest('li');
76
77      // Vérifier si l'élément cliqué est un menu principal
78      let isMainMenu = $parentLi.parent().is('#mobile-nav > ul');
79
80      if (isMainMenu) {
81        // Fermer les autres menus principaux et leurs sous-menus
82        $('#mobile-nav > ul > li.menu-has-children > ul').not($submenu).slideUp().find('ul').slideUp();
83        $('#mobile-nav > ul > li.menu-has-children > i').not($this).removeClass("fa-chevron-up").addClass("fa-chevron-down");
84
85        // Remettre les chevrons des sous-menus vers le bas
86        $('#mobile-nav .menu-has-children ul li .fa-chevron-up').removeClass("fa-chevron-up").addClass("fa-chevron-down");
87      }
88
89      // Basculer l'affichage du sous-menu sélectionné
90      if ($submenu.is(':visible')) {
91        $submenu.slideUp();
92        $this.removeClass("fa-chevron-up").addClass("fa-chevron-down");
93      } else {
94        $submenu.slideDown();
95        $this.removeClass("fa-chevron-down").addClass("fa-chevron-up");
96      }
97    });
98
99    $(document).on('click', '#mobile-nav-toggle', function (e) {
100      $('body').toggleClass('mobile-nav-active');
101      $('#mobile-nav-toggle i').toggleClass('fa-times fa-bars');
102      $('#mobile-body-overly').toggle();
103    });
104
105    $(document).click(function (e) {
106      var container = $("#mobile-nav, #mobile-nav-toggle");
107      if (!container.is(e.target) && container.has(e.target).length === 0) {
108        if ($('body').hasClass('mobile-nav-active')) {
109          $('body').removeClass('mobile-nav-active');
110          $('#mobile-nav-toggle i').toggleClass('fa-times fa-bars');
111          $('#mobile-body-overly').fadeOut();
112        }
113      }
114    });
115  } else if ($("#mobile-nav, #mobile-nav-toggle").length) {
116    $("#mobile-nav, #mobile-nav-toggle").hide();
117  }
118
119// Smooth scroll for the menu and links with .scrollto classes
120$('.nav-menu a, #mobile-nav a, .scrollto').on('click', function (event) {
121  // Vérifiez si l'ancre commence par "schedule" pour ne pas appliquer le défilement fluide
122  if (this.hash && this.hash.startsWith('#schedule') && this.hash.length > '#schedule'.length) {
123    return; // Ne pas appliquer le défilement fluide pour les ancres d'onglets Bootstrap
124  }
125

126  if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
127    var target = $(this.hash);
128    if (target.length) {
129      var top_space = 0;
130
131      if ($('#header').length) {
132        top_space = $('#header').outerHeight();
133
134        if (!$('#header').hasClass('header-fixed')) {
135          top_space = top_space - 20;
136        }
137      }
138
139      $('html, body').animate({
140        scrollTop: target.offset().top - top_space
141      }, 1000, 'easeInOutExpo');
142
143      if ($(this).parents('.nav-menu').length) {
144        $('.nav-menu .menu-active').removeClass('menu-active');
145        $(this).closest('li').addClass('menu-active');
146      }
147
148      if ($('body').hasClass('mobile-nav-active')) {
149        $('body').removeClass('mobile-nav-active');
150        $('#mobile-nav-toggle i').toggleClass('fa-times fa-bars');
151        $('#mobile-body-overly').fadeOut();
152      }
153      return false;
154    }
155  }
156});
157
158  // Gallery carousel (uses the Owl Carousel library)
159  $(".gallery-carousel").owlCarousel({
160    autoplay: true,
161    dots: true,
162    loop: true,
163    center: true,
164    responsive: {
165      0: { items: 1 }, 768: { items: 3 }, 992: { items: 4 }, 1200: { items: 5 }
166    }
167  });
168
169  // Buy tickets select the ticket type on click
170  $('#buy-ticket-modal').on('show.bs.modal', function (event) {
171    var button = $(event.relatedTarget);
172    var ticketType = button.data('ticket-type');
173    var modal = $(this);
174    modal.find('#ticket-type').val(ticketType);
175  })
176
177  // custom code
178
179});
180
181let lastScrollTop = 0;
182const header = document.getElementById('header');
183
184function handleScroll() {
185  let scrollTop = window.scrollY || document.documentElement.scrollTop;
186
187  if (scrollTop > lastScrollTop) {
188    // Scrolling down
189    header.style.marginTop = '-60px'; // Ajustez cette valeur selon vos besoins
190  } else {
191    // Scrolling up
192    header.style.marginTop = '0';
193  }
194  lastScrollTop = scrollTop;
195}
196
197function checkWindowWidth() {
198  if (window.innerWidth >= 992) {
199    window.addEventListener('scroll', handleScroll);
200  } else {
201    window.removeEventListener('scroll', handleScroll);
202    header.style.marginTop = '0'; // Réinitialiser la marge si nécessaire
203  }
204}
205
206// Vérifier la largeur de la fenêtre au chargement et au redimensionnement
207window.addEventListener('resize', checkWindowWidth);
208window.addEventListener('load', checkWindowWidth);
209
210
211/*------------------
212    Swiper
213--------------------*/
214
215function initSwiper() {
216  document.querySelectorAll(".init-swiper").forEach(function (swiperElement) {
217    let config = JSON.parse(
218      swiperElement.querySelector(".swiper-config").innerHTML.trim()
219    );
220
221    if (swiperElement.classList.contains("swiper-tab")) {
222      initSwiperWithCustomPagination(swiperElement, config);
223    } else {
224      new Swiper(swiperElement, config);
225    }
226  });
227}
228
229window.addEventListener("load", initSwiper);
230
231/*------------------
232    CountDown
233--------------------*/
234// Définission de la Date pour le Countdown
235var timerdate = "2025/06/19 08:00:00"; // Espace au lieu de "-"
236
237$("#countdown").countdown(timerdate, function (event) {
238  $(this).html(event.strftime(
239    "<div class='cd-item'><span>%D</span><p>Days</p> </div>" +
240    "<div class='cd-item'><span>%H</span><p>Hrs</p> </div>" +
241    "<div class='cd-item'><span>%M</span><p>Min</p> </div>" +
242    "<div class='cd-item'><span>%S</span><p>Sec</p> </div>"
243  ));
244});