ateliers55/user/themes/ateliers-55/js/script.js

103 lines
3.0 KiB
JavaScript
Raw Normal View History

2024-03-26 14:22:54 +01:00
function toggleMenu(el) {
let nav = document.querySelector('nav');
el.classList.toggle('open');
nav.classList.toggle('open');
}
function toggleAbout() {
let arrow = document.querySelector('#about-arrow');
let aboutContent = document.querySelector('#about-hidden');
aboutContent.classList.toggle('open');
arrow.classList.toggle('open');
}
$(document).ready(function() {
let body = document.querySelector('body');
if (document.querySelector('.swiper')) {
body.style.overflowY = "hidden";
} else {
body.style.overflowY = "auto";
}
let swiperEl = document.querySelector('.swiper');
2024-04-21 18:29:43 +02:00
if (swiperEl) {
swiperEl.style.opacity = 1;
2024-04-21 18:48:08 +02:00
resizeVerticalImages();
2024-04-21 18:29:43 +02:00
}
2024-03-26 14:22:54 +01:00
initSwiper();
barba.init({
transitions: [{
name: 'opacity-transition',
leave(data) {
return gsap.to(data.current.container, {
opacity: 0
})
},
enter(data) {
return gsap.from(data.next.container, {
opacity: 0
})
}
}]
});
barba.hooks.before((data) => {
2024-04-21 18:29:43 +02:00
if (swiperEl) {
swiperEl.style.opacity = 0;
}
2024-03-26 14:22:54 +01:00
});
barba.hooks.after((data) => {
swiperEl = document.querySelector('.swiper');
2024-04-21 18:29:43 +02:00
if (swiperEl) {
if (document.querySelector('.swiper') && !document.querySelector('.swiper-initialized')) {
initSwiper();
body.style.overflowY = "hidden";
}
swiperEl.style.opacity = 1;
2024-03-26 14:22:54 +01:00
} else {
body.style.overflowY = "auto";
}
2024-04-21 18:48:08 +02:00
resizeVerticalImages();
2024-03-26 14:22:54 +01:00
});
})
function initSwiper() {
let swiper = new Swiper('.swiper', {
loop: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
}
function resizeVerticalImages() {
2024-04-21 18:54:00 +02:00
let verticalImages = document.querySelectorAll('.swiper-slide > img');
2024-04-21 19:01:31 +02:00
let imagesIndex = 0;
2024-04-21 18:54:00 +02:00
for (let img of verticalImages) {
2024-04-21 19:15:58 +02:00
if(img.complete){
imagesIndex++;
2024-04-21 18:51:08 +02:00
if (img.clientHeight > img.clientWidth) {
img.style.width = "50%";
}
2024-04-21 19:15:58 +02:00
if (imagesIndex === verticalImages.length) {
swiperSlideEls = document.querySelectorAll('.swiper-slide');
for (let swiperSlideEl of swiperSlideEls) {
swiperSlideEl.style.maxHeight = "unset";
}
2024-04-21 19:01:31 +02:00
}
2024-04-21 19:15:58 +02:00
} else {
img.onload = () => {
imagesIndex++;
if (img.clientHeight > img.clientWidth) {
img.style.width = "50%";
}
if (imagesIndex === verticalImages.length) {
swiperSlideEls = document.querySelectorAll('.swiper-slide');
for (let swiperSlideEl of swiperSlideEls) {
swiperSlideEl.style.maxHeight = "unset";
}
}
}
}
2024-04-21 18:54:00 +02:00
}
2024-03-26 14:22:54 +01:00
}