887 lines
29 KiB
JavaScript
887 lines
29 KiB
JavaScript
/*=============== SHOW MENU ===============*/
|
|
const navMenu = document.getElementById('nav-menu'),
|
|
navToggle = document.getElementById('nav-toggle'),
|
|
navClose = document.getElementById('nav-close')
|
|
|
|
/* Menu show */
|
|
if(navToggle) {
|
|
navToggle.addEventListener('click', () =>{
|
|
navMenu.classList.add('show-menu')
|
|
})
|
|
}
|
|
|
|
/* Menu hidden */
|
|
if(navClose) {
|
|
navClose.addEventListener('click', () =>{
|
|
navMenu.classList.remove('show-menu')
|
|
})
|
|
}
|
|
|
|
/*=============== SHOW AGENCY DROPDOWN MENU ===============*/
|
|
const agencyDropdownItems = document.querySelectorAll('.dropdownagency__item')
|
|
|
|
// 1. Select each dropdown item.
|
|
agencyDropdownItems.forEach((item) =>{
|
|
const dropdownButton = item.querySelector('.dropdown__button')
|
|
|
|
// 2. Select each button click.
|
|
dropdownButton.addEventListener('click', () =>{
|
|
|
|
// 7. Select the current show-dropdown class.
|
|
const showDropdown = document.querySelector('.show-dropdown')
|
|
|
|
// 5. Call the toggleItem function.
|
|
agencyToggleItem(item)
|
|
|
|
// 8. Remove the show-dropdown class from other items.
|
|
if(showDropdown && showDropdown != item) {
|
|
toggleItem(showDropdown)
|
|
}
|
|
})
|
|
})
|
|
|
|
// 3. Create a function to display the dropdown.
|
|
const agencyToggleItem = (item) =>{
|
|
|
|
// 3.1. Select each dropdown content.
|
|
const agencyDropdownContainer = item.querySelector('.dropdownagency__container')
|
|
|
|
// 6. If the same item contains the show-dropdown class, remove.
|
|
if(item.classList.contains('show-dropdown')) {
|
|
agencyDropdownContainer.removeAttribute('style')
|
|
item.classList.remove('show-dropdown')
|
|
} else {
|
|
// 4. Add the maximum height to dropdown content and add the show-dropdown class.
|
|
agencyDropdownContainer.style.height = agencyDropdownContainer.scrollHeight + 'px'
|
|
item.classList.add('show-dropdown')
|
|
}
|
|
}
|
|
|
|
/*=============== SHOW PRODUCTS DROPDOWN MENU ===============*/
|
|
const dropdownItems = document.querySelectorAll('.dropdown__item')
|
|
|
|
// 1. Select each dropdown item.
|
|
dropdownItems.forEach((item) =>{
|
|
const dropdownButton = item.querySelector('.dropdown__button')
|
|
|
|
// 2. Select each button click.
|
|
dropdownButton.addEventListener('click', () =>{
|
|
|
|
// 7. Select the current show-dropdown class.
|
|
const showDropdown = document.querySelector('.show-dropdown')
|
|
|
|
// 5. Call the toggleItem function.
|
|
toggleItem(item)
|
|
|
|
// 8. Remove the show-dropdown class from other items.
|
|
if(showDropdown && showDropdown != item) {
|
|
agencyToggleItem(showDropdown)
|
|
}
|
|
})
|
|
})
|
|
|
|
// 3. Create a function to display the dropdown.
|
|
const toggleItem = (item) =>{
|
|
|
|
// 3.1. Select each dropdown content.
|
|
const dropdownContainer = item.querySelector('.dropdown__container')
|
|
|
|
// 6. If the same item contains the show-dropdown class, remove.
|
|
if(item.classList.contains('show-dropdown')) {
|
|
dropdownContainer.removeAttribute('style')
|
|
item.classList.remove('show-dropdown')
|
|
} else {
|
|
// 4. Add the maximum height to dropdown content and add the show-dropdown class.
|
|
dropdownContainer.style.height = dropdownContainer.scrollHeight + 'px'
|
|
item.classList.add('show-dropdown')
|
|
}
|
|
}
|
|
|
|
/*=============== DELETE DROPDOWN STYLES ===============*/
|
|
const mediaQuery = matchMedia('(min-width: 1150px)'),
|
|
dropdownContainer = document.querySelectorAll('.dropdown__container')
|
|
|
|
// Function to remove dropdown styles in mobile mode when browser resizes
|
|
const removeStyle = () =>{
|
|
// Validate if the media query reaches 1118px
|
|
if(mediaQuery.matches){
|
|
// Remove the dropdown container height style
|
|
dropdownContainer.forEach((e) =>{
|
|
e.removeAttribute('style')
|
|
})
|
|
|
|
// Remove the show-dropdown class from dropdown item
|
|
dropdownItems.forEach((e) =>{
|
|
e.classList.remove('show-dropdown')
|
|
})
|
|
}
|
|
}
|
|
|
|
addEventListener('resize', removeStyle)
|
|
|
|
/*=============== LOGIN ===============*/
|
|
const loginButton = document.getElementById('login-button'),
|
|
loginClose = document.getElementById('login-close'),
|
|
loginContent = document.getElementById('login-content')
|
|
|
|
/* Login show */
|
|
if(loginButton) {
|
|
loginButton.addEventListener('click', () =>{
|
|
loginContent.classList.add('show-login')
|
|
})
|
|
}
|
|
|
|
/* Login hidden */
|
|
if(loginClose) {
|
|
loginClose.addEventListener('click', () =>{
|
|
loginContent.classList.remove('show-login')
|
|
})
|
|
}
|
|
|
|
/*=============== PELLETEUSE BOOKING LOGIN ===============*/
|
|
const pelleteuseBooking = document.getElementById('pelleteuse-booking'),
|
|
pelleteuseBookingClose = document.getElementById('login-close'),
|
|
pelleteuseBookingContent = document.getElementById('login-content')
|
|
|
|
/* Modal show */
|
|
if(pelleteuseBooking) {
|
|
pelleteuseBooking.addEventListener('click', () =>{
|
|
pelleteuseBookingContent.classList.add('show-login')
|
|
})
|
|
}
|
|
|
|
/* Modal hidden */
|
|
if(pelleteuseBookingClose) {
|
|
pelleteuseBookingClose.addEventListener('click', () =>{
|
|
pelleteuseBookingContent.classList.remove('show-login')
|
|
})
|
|
}
|
|
|
|
/*=============== PELLETEUSE BOOKING BY PHONE ===============*/
|
|
const pelleteuseBookingPhone = document.getElementById('pelleteuse-booking-phone'),
|
|
pelleteuseBookingPhoneClose = document.getElementById('modal-close'),
|
|
pelleteuseBookingPhoneContent = document.getElementById('modal-content')
|
|
|
|
/* Modal show */
|
|
if(pelleteuseBookingPhone) {
|
|
pelleteuseBookingPhone.addEventListener('click', () =>{
|
|
pelleteuseBookingPhoneContent.classList.add('show-modal')
|
|
})
|
|
}
|
|
|
|
/* Modal hidden */
|
|
if(pelleteuseBookingPhoneClose) {
|
|
pelleteuseBookingPhoneClose.addEventListener('click', () =>{
|
|
pelleteuseBookingPhoneContent.classList.remove('show-modal')
|
|
})
|
|
}
|
|
|
|
/*=============== MARTEAU PIQUEUR BOOKING LOGIN ===============*/
|
|
const marteauPiqueurBooking = document.getElementById('marteau-piqueur-booking'),
|
|
marteauPiqueurBookingClose = document.getElementById('login-close'),
|
|
marteauPiqueurBookingContent = document.getElementById('login-content')
|
|
|
|
/* Login show */
|
|
if(marteauPiqueurBooking) {
|
|
marteauPiqueurBooking.addEventListener('click', () =>{
|
|
marteauPiqueurBookingContent.classList.add('show-login')
|
|
})
|
|
}
|
|
|
|
/* Login hidden */
|
|
if(marteauPiqueurBookingClose) {
|
|
marteauPiqueurBookingClose.addEventListener('click', () =>{
|
|
marteauPiqueurBookingContent.classList.remove('show-login')
|
|
})
|
|
}
|
|
|
|
/*=============== MARTEAU PIQUEUR BOOKING BY PHONE ===============*/
|
|
const marteauPiqueurBookingPhone = document.getElementById('marteau-piqueur-booking-phone'),
|
|
marteauPiqueurBookingPhoneClose = document.getElementById('modal-close'),
|
|
marteauPiqueurBookingPhoneContent = document.getElementById('modal-content')
|
|
|
|
/* Modal show */
|
|
if(marteauPiqueurBookingPhone) {
|
|
marteauPiqueurBookingPhone.addEventListener('click', () =>{
|
|
pelleteuseBookingPhoneContent.classList.add('show-modal')
|
|
})
|
|
}
|
|
|
|
/* Modal hidden */
|
|
if(marteauPiqueurBookingPhoneClose) {
|
|
pelleteuseBookingPhoneClose.addEventListener('click', () =>{
|
|
pelleteuseBookingPhoneContent.classList.remove('show-modal')
|
|
})
|
|
}
|
|
|
|
/*=============== BENNE A BETON BOOKING LOGIN ===============*/
|
|
const benneBetonBooking = document.getElementById('benne-beton'),
|
|
benneBetonBookingClose = document.getElementById('login-close'),
|
|
benneBetonBookingContent = document.getElementById('login-content')
|
|
|
|
/* Login show */
|
|
if(benneBetonBooking) {
|
|
benneBetonBooking.addEventListener('click', () =>{
|
|
benneBetonBookingContent.classList.add('show-login')
|
|
})
|
|
}
|
|
|
|
/* Login hidden */
|
|
if(benneBetonBookingClose) {
|
|
benneBetonBookingClose.addEventListener('click', () =>{
|
|
benneBetonBookingContent.classList.remove('show-login')
|
|
})
|
|
}
|
|
|
|
/*=============== BENNE A BETON BOOKING BY PHONE ===============*/
|
|
const benneBetonBookingPhone = document.getElementById('benne-beton-phone'),
|
|
benneBetonBookingPhoneClose = document.getElementById('modal-close'),
|
|
benneBetonBookingPhoneContent = document.getElementById('modal-content')
|
|
|
|
/* Modal show */
|
|
if(benneBetonBookingPhone) {
|
|
benneBetonBookingPhone.addEventListener('click', () =>{
|
|
benneBetonBookingPhoneContent.classList.add('show-modal')
|
|
})
|
|
}
|
|
|
|
/* Modal hidden */
|
|
if(benneBetonBookingPhoneClose) {
|
|
benneBetonBookingPhoneClose.addEventListener('click', () =>{
|
|
benneBetonBookingPhoneContent.classList.remove('show-modal')
|
|
})
|
|
}
|
|
|
|
/*=============== GOULOTTE BOOKING LOGIN ===============*/
|
|
const goulotteBooking = document.getElementById('goulotte'),
|
|
goulotteBookingClose = document.getElementById('login-close'),
|
|
goulotteBookingContent = document.getElementById('login-content')
|
|
|
|
/* Login show */
|
|
if(goulotteBooking) {
|
|
goulotteBooking.addEventListener('click', () =>{
|
|
goulotteBookingContent.classList.add('show-login')
|
|
})
|
|
}
|
|
|
|
/* Login hidden */
|
|
if(goulotteBookingClose) {
|
|
goulotteBookingClose.addEventListener('click', () =>{
|
|
goulotteBookingContent.classList.remove('show-login')
|
|
})
|
|
}
|
|
|
|
/*=============== GOULOTTE BOOKING BY PHONE ===============*/
|
|
const goulotteBookingPhone = document.getElementById('goulotte-phone'),
|
|
goulotteBookingPhoneClose = document.getElementById('modal-close'),
|
|
goulotteBookingPhoneContent = document.getElementById('modal-content')
|
|
|
|
/* Modal show */
|
|
if(goulotteBookingPhone) {
|
|
goulotteBookingPhone.addEventListener('click', () =>{
|
|
goulotteBookingPhoneContent.classList.add('show-modal')
|
|
})
|
|
}
|
|
|
|
/* Modal hidden */
|
|
if(goulotteBookingPhoneClose) {
|
|
goulotteBookingPhoneClose.addEventListener('click', () =>{
|
|
goulotteBookingPhoneContent.classList.remove('show-modal')
|
|
})
|
|
}
|
|
|
|
/*=============== DISCOUNT LOGIN ===============*/
|
|
const discountLogin = document.getElementById('discount-login'),
|
|
discountLoginClose = document.getElementById('login-close'),
|
|
discountLoginContent = document.getElementById('login-content')
|
|
|
|
/* Login show */
|
|
if(discountLogin) {
|
|
discountLogin.addEventListener('click', () =>{
|
|
discountLoginContent.classList.add('show-login')
|
|
})
|
|
}
|
|
|
|
/* Login hidden */
|
|
if(discountLoginClose) {
|
|
discountLoginClose.addEventListener('click', () =>{
|
|
discountLoginContent.classList.remove('show-login')
|
|
})
|
|
}
|
|
|
|
|
|
|
|
/*=============== REMOVE MENU MOBILE ===============*/
|
|
const navLink = document.querySelectorAll('.nav__link')
|
|
|
|
const linkAction = () =>{
|
|
const navMenu = document.getElementById('nav-menu')
|
|
navMenu.classList.remove('show-menu')
|
|
}
|
|
navLink.forEach(n => n.addEventListener('click', linkAction))
|
|
|
|
/*=============== ADD SHADOW HEADER ===============*/
|
|
/*const shadowHeader = ()=>{
|
|
const header = document.getElementById('header')
|
|
this.scrollY >= 50 ? header.classList.add('shadow-header')
|
|
: header.classList.remove('shadow-header')
|
|
}
|
|
window.addEventListener('scroll', shadowHeader)*/
|
|
|
|
/*=============== SWIPER HOME ===============*/
|
|
let swiperHome = new Swiper('.home__swiper', {
|
|
loop: true,
|
|
spaceBetween: -24,
|
|
grabCursor: true,
|
|
slidesPerView: 'auto',
|
|
centeredSlides: 'auto',
|
|
|
|
autoplay: {
|
|
delay: 3000,
|
|
disableOnInteraction: false,
|
|
},
|
|
|
|
breakpoints: {
|
|
1220: {
|
|
spaceBetween: -32,
|
|
slidesPerView: 3,
|
|
}
|
|
}
|
|
})
|
|
|
|
/*=============== FARMLAND SWIPER ===============*/
|
|
let swiperFarmland = new Swiper('.farmland__swiper', {
|
|
loop: true,
|
|
spaceBetween: 16,
|
|
grabCursor: true,
|
|
slidesPerView: 'auto',
|
|
centeredSlides: 'auto',
|
|
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
},
|
|
|
|
breakpoints: {
|
|
1150: {
|
|
slidesPerView: 4,
|
|
centeredSlides: false,
|
|
}
|
|
}
|
|
})
|
|
|
|
/*=============== FARMLAND ATTECOUBÉ BOOKING BY PHONE ===============*/
|
|
const farmlandAttecoubePhoneClose = document.getElementById('modal-close'),
|
|
farmlandAttecoubePhoneContent = document.getElementById('modal-content')
|
|
function farmlandAttecoubeByPhone() {
|
|
farmlandAttecoubePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== FARMLAND ATTECOUBÉ BOOKING LOGIN ===============*/
|
|
const farmlandAttecoubeClose = document.getElementById('login-close'),
|
|
farmlandAttecoubeContent = document.getElementById('login-content')
|
|
function farmlandAttecoube() {
|
|
farmlandAttecoubeContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== FARMLAND TREICHVILLE BOOKING BY PHONE ===============*/
|
|
const farmlandTreichvillePhoneClose = document.getElementById('modal-close'),
|
|
farmlandTreichvillePhoneContent = document.getElementById('modal-content')
|
|
function farmlandTreichvilleByPhone() {
|
|
farmlandTreichvillePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== FARMLAND TREICHVILLE BOOKING LOGIN ===============*/
|
|
const farmlandTreichvilleClose = document.getElementById('login-close'),
|
|
farmlandTreichvilleContent = document.getElementById('login-content')
|
|
function farmlandTreichville() {
|
|
farmlandTreichvilleContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== FARMLAND MARCORY BOOKING BY PHONE ===============*/
|
|
const farmlandMarcoryPhoneClose = document.getElementById('modal-close'),
|
|
farmlandMarcoryPhoneContent = document.getElementById('modal-content')
|
|
function farmlandMarcoryByPhone() {
|
|
farmlandMarcoryPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== FARMLAND MARCORY BOOKING LOGIN ===============*/
|
|
const farmlandMarcoryClose = document.getElementById('login-close'),
|
|
farmlandMarcoryContent = document.getElementById('login-content')
|
|
function farmlandMarcory() {
|
|
farmlandMarcoryContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== FARMLAND BRACODI BOOKING BY PHONE ===============*/
|
|
const farmlandBracodiPhoneClose = document.getElementById('modal-close'),
|
|
farmlandBracodiPhoneContent = document.getElementById('modal-content')
|
|
function farmlandBracodiByPhone() {
|
|
farmlandBracodiPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== FARMLAND BRACODI BOOKING LOGIN ===============*/
|
|
const farmlandBracodiClose = document.getElementById('login-close'),
|
|
farmlandBracodiContent = document.getElementById('login-content')
|
|
function farmlandBracodi() {
|
|
farmlandBracodiContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== FARMLAND SIKASSO BOOKING BY PHONE ===============*/
|
|
const farmlandSikassoPhoneClose = document.getElementById('modal-close'),
|
|
farmlandSikassoPhoneContent = document.getElementById('modal-content')
|
|
function farmlandSikassoByPhone() {
|
|
farmlandSikassoPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== FARMLAND SIKASSO BOOKING LOGIN ===============*/
|
|
const farmlandSikassoClose = document.getElementById('login-close'),
|
|
farmlandSikassoContent = document.getElementById('login-content')
|
|
function farmlandSikasso() {
|
|
farmlandSikassoContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== BUILDING PELLETEUSE BOOKING BY PHONE ===============*/
|
|
const buildingPelleteusePhoneClose = document.getElementById('modal-close'),
|
|
buildingPelleteusePhoneContent = document.getElementById('modal-content')
|
|
function buildingPelleteuseByPhone() {
|
|
buildingPelleteusePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== BUILDING PELLETEUSE BOOKING LOGIN ===============*/
|
|
const buildingPelleteuseClose = document.getElementById('login-close'),
|
|
buildingPelleteuseContent = document.getElementById('login-content')
|
|
function buildingPelleteuse() {
|
|
buildingPelleteuseContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== BUILDING MARTEAU BOOKING BY PHONE ===============*/
|
|
const buildingMarteauPhoneClose = document.getElementById('modal-close'),
|
|
buildingMarteauPhoneContent = document.getElementById('modal-content')
|
|
function buildingMarteauByPhone() {
|
|
buildingMarteauPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== BUILDING MARTEAU BOOKING LOGIN ===============*/
|
|
const buildingMarteauClose = document.getElementById('login-close'),
|
|
buildingMarteauContent = document.getElementById('login-content')
|
|
function buildingMarteau() {
|
|
buildingMarteauContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== BUILDING BENNE BOOKING BY PHONE ===============*/
|
|
const buildingBennePhoneClose = document.getElementById('modal-close'),
|
|
buildingBennePhoneContent = document.getElementById('modal-content')
|
|
function buildingBenneByPhone() {
|
|
buildingBennePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== BUILDING BENNE BOOKING LOGIN ===============*/
|
|
const buildingBenneClose = document.getElementById('login-close'),
|
|
buildingBenneContent = document.getElementById('login-content')
|
|
function buildingBenne() {
|
|
buildingBenneContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== BUILDING GOULOTTE BOOKING BY PHONE ===============*/
|
|
const buildingGoulottePhoneClose = document.getElementById('modal-close'),
|
|
buildingGoulottePhoneContent = document.getElementById('modal-content')
|
|
function buildingGoulotteByPhone() {
|
|
buildingGoulottePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== BUILDING GOULOTTE BOOKING LOGIN ===============*/
|
|
const buildingGoulotteClose = document.getElementById('login-close'),
|
|
buildingGoulotteContent = document.getElementById('login-content')
|
|
function buildingGoulotte() {
|
|
buildingGoulotteContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== SONGON BY PHONE ===============*/
|
|
const songonPhoneClose = document.getElementById('modal-close'),
|
|
songonPhoneContent = document.getElementById('modal-content')
|
|
function songonPhone() {
|
|
songonPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
function explore() {
|
|
setTimeout(function () {
|
|
location.reload();
|
|
}, 3000);
|
|
}
|
|
|
|
function zoneSongon() {
|
|
setTimeout(function () {
|
|
location.reload();
|
|
}, 3000);
|
|
}
|
|
|
|
function deposerAnnonce() {
|
|
setTimeout(function () {
|
|
location.reload();
|
|
}, 10);
|
|
}
|
|
|
|
/*=============== DEPOSER ANNONCE LOGIN ===============*/
|
|
const deposerAnnonceClose = document.getElementById('login-close'),
|
|
deposerAnnonceContent = document.getElementById('login-content')
|
|
function deposerAnnonceToLogin() {
|
|
deposerAnnonceContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== INSCRIPTION ANNONCE ===============*/
|
|
function inscriptionAnnonce() {
|
|
setTimeout(function () {
|
|
location.reload();
|
|
}, 10);
|
|
}
|
|
|
|
/*=============== EVENTROOM SALLE A BY PHONE ===============*/
|
|
const eventroomSalleAPhoneClose = document.getElementById('modal-close'),
|
|
eventroomSalleAPhoneContent = document.getElementById('modal-content')
|
|
function eventroomSalleAPhone() {
|
|
eventroomSalleAPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== EVENTROOM SALLE A LOGIN ===============*/
|
|
const eventroomSalleAClose = document.getElementById('login-close'),
|
|
eventroomSalleAContent = document.getElementById('login-content')
|
|
function eventroomSalleA() {
|
|
eventroomSalleAContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== EVENTROOM SALLE B BY PHONE ===============*/
|
|
const eventroomSalleBPhoneClose = document.getElementById('modal-close'),
|
|
eventroomSalleBPhoneContent = document.getElementById('modal-content')
|
|
function eventroomSalleBPhone() {
|
|
eventroomSalleBPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== EVENTROOM SALLE B LOGIN ===============*/
|
|
const eventroomSalleBClose = document.getElementById('login-close'),
|
|
eventroomSalleBContent = document.getElementById('login-content')
|
|
function eventroomSalleB() {
|
|
eventroomSalleBContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== EVENTROOM SALLE C BY PHONE ===============*/
|
|
const eventroomSalleCPhoneClose = document.getElementById('modal-close'),
|
|
eventroomSalleCPhoneContent = document.getElementById('modal-content')
|
|
function eventroomSalleCPhone() {
|
|
eventroomSalleCPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== EVENTROOM SALLE C LOGIN ===============*/
|
|
const eventroomSalleCClose = document.getElementById('login-close'),
|
|
eventroomSalleCContent = document.getElementById('login-content')
|
|
function eventroomSalleC() {
|
|
eventroomSalleCContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== EVENTROOM SALLE D BY PHONE ===============*/
|
|
const eventroomSalleDPhoneClose = document.getElementById('modal-close'),
|
|
eventroomSalleDPhoneContent = document.getElementById('modal-content')
|
|
function eventroomSalleDPhone() {
|
|
eventroomSalleDPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== EVENTROOM SALLE D LOGIN ===============*/
|
|
const eventroomSalleDClose = document.getElementById('login-close'),
|
|
eventroomSalleDContent = document.getElementById('login-content')
|
|
function eventroomSalleD() {
|
|
eventroomSalleDContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== TARPAULIN BACHE STRUCTURE A BY PHONE ===============*/
|
|
const tarpaulinBacheAPhoneClose = document.getElementById('modal-close'),
|
|
tarpaulinBacheAPhoneContent = document.getElementById('modal-content')
|
|
function tarpaulinBacheAPhone() {
|
|
tarpaulinBacheAPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== TARPAULIN BACHE STRUCTURE A LOGIN ===============*/
|
|
const tarpaulinBacheAClose = document.getElementById('login-close'),
|
|
tarpaulinBacheAContent = document.getElementById('login-content')
|
|
function tarpaulinBacheA() {
|
|
tarpaulinBacheAContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== TARPAULIN BACHE STRUCTURE B BY PHONE ===============*/
|
|
const tarpaulinBacheBPhoneClose = document.getElementById('modal-close'),
|
|
tarpaulinBacheBPhoneContent = document.getElementById('modal-content')
|
|
function tarpaulinBacheBPhone() {
|
|
tarpaulinBacheBPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== TARPAULIN BACHE STRUCTURE B LOGIN ===============*/
|
|
const tarpaulinBacheBClose = document.getElementById('login-close'),
|
|
tarpaulinBacheBContent = document.getElementById('login-content')
|
|
function tarpaulinBacheB() {
|
|
tarpaulinBacheBContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== TARPAULIN BACHE STRUCTURE C BY PHONE ===============*/
|
|
const tarpaulinBacheCPhoneClose = document.getElementById('modal-close'),
|
|
tarpaulinBacheCPhoneContent = document.getElementById('modal-content')
|
|
function tarpaulinBacheCPhone() {
|
|
tarpaulinBacheCPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== TARPAULIN BACHE STRUCTURE C LOGIN ===============*/
|
|
const tarpaulinBacheCClose = document.getElementById('login-close'),
|
|
tarpaulinBacheCContent = document.getElementById('login-content')
|
|
function tarpaulinBacheC() {
|
|
tarpaulinBacheCContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== TARPAULIN BACHE STRUCTURE D BY PHONE ===============*/
|
|
const tarpaulinBacheDPhoneClose = document.getElementById('modal-close'),
|
|
tarpaulinBacheDPhoneContent = document.getElementById('modal-content')
|
|
function tarpaulinBacheDPhone() {
|
|
tarpaulinBacheDPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== TARPAULIN BACHE STRUCTURE D LOGIN ===============*/
|
|
const tarpaulinBacheDClose = document.getElementById('login-close'),
|
|
tarpaulinBacheDContent = document.getElementById('login-content')
|
|
function tarpaulinBacheD() {
|
|
tarpaulinBacheDContent.classList.add('show-login');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT CHAISE BY PHONE ===============*/
|
|
const spotlightChaisePhoneClose = document.getElementById('modal-close'),
|
|
spotlightChaisePhoneContent = document.getElementById('modal-content')
|
|
function spotlightChaisePhone() {
|
|
spotlightChaisePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT BATEAU BY PHONE ===============*/
|
|
const spotlightBateauPhoneClose = document.getElementById('modal-close'),
|
|
spotlightBateauPhoneContent = document.getElementById('modal-content')
|
|
function spotlightBateauPhone() {
|
|
spotlightBateauPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT VAISSELLE BY PHONE ===============*/
|
|
const spotlightVaissellePhoneClose = document.getElementById('modal-close'),
|
|
spotlightVaissellePhoneContent = document.getElementById('modal-content')
|
|
function spotlightVaissellePhone() {
|
|
spotlightVaissellePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT BACHE BY PHONE ===============*/
|
|
const spotlightBachePhoneClose = document.getElementById('modal-close'),
|
|
spotlightBachePhoneContent = document.getElementById('modal-content')
|
|
function spotlightBachePhone() {
|
|
spotlightBachePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT TERRAIN ATTECOUBE BY PHONE ===============*/
|
|
const spotlightTerrainAttecoubePhoneClose = document.getElementById('modal-close'),
|
|
spotlightTerrainAttecoubePhoneContent = document.getElementById('modal-content')
|
|
function spotlightTerrainAttecoubePhone() {
|
|
spotlightTerrainAttecoubePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT TERRAIN TREICHVILLE BY PHONE ===============*/
|
|
const spotlightTerrainTreichvillePhoneClose = document.getElementById('modal-close'),
|
|
spotlightTerrainTreichvillePhoneContent = document.getElementById('modal-content')
|
|
function spotlightTerrainTreichvillePhone() {
|
|
spotlightTerrainTreichvillePhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT TERRAIN MARCORY BY PHONE ===============*/
|
|
const spotlightTerrainMarcoryPhoneClose = document.getElementById('modal-close'),
|
|
spotlightTerrainMarcoryPhoneContent = document.getElementById('modal-content')
|
|
function spotlightTerrainMarcoryPhone() {
|
|
spotlightTerrainMarcoryPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT TERRAIN BRACODI BY PHONE ===============*/
|
|
const spotlightTerrainBracodyPhoneClose = document.getElementById('modal-close'),
|
|
spotlightTerrainBracodiPhoneContent = document.getElementById('modal-content')
|
|
function spotlightTerrainBracodiPhone() {
|
|
spotlightTerrainBracodiPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT RENAULT BY PHONE ===============*/
|
|
const spotlightRenaultPhoneClose = document.getElementById('modal-close'),
|
|
spotlightRenaultPhoneContent = document.getElementById('modal-content')
|
|
function spotlightRenaultPhone() {
|
|
spotlightRenaultPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT MAZDA BY PHONE ===============*/
|
|
const spotlightMazdaPhoneClose = document.getElementById('modal-close'),
|
|
spotlightMazdaPhoneContent = document.getElementById('modal-content')
|
|
function spotlightMazdaPhone() {
|
|
spotlightMazdaPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
/*=============== SPOTLIGHT AUDI BY PHONE ===============*/
|
|
const spotlightAudiPhoneClose = document.getElementById('modal-close'),
|
|
spotlightAudiPhoneContent = document.getElementById('modal-content')
|
|
function spotlightAudiPhone() {
|
|
spotlightAudiPhoneContent.classList.add('show-modal');
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/*=============== BUILDING SWIPER ===============*/
|
|
let swiperBuilding = new Swiper('.building__swiper', {
|
|
loop: true,
|
|
spaceBetween: 16,
|
|
grabCursor: true,
|
|
slidesPerView: 'auto',
|
|
centeredSlides: 'auto',
|
|
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
},
|
|
|
|
breakpoints: {
|
|
1150: {
|
|
slidesPerView: 4,
|
|
centeredSlides: false,
|
|
}
|
|
}
|
|
})
|
|
|
|
/*=============== VEHICLE SWIPER ===============*/
|
|
let swiperVehicle = new Swiper('.vehicle__swiper', {
|
|
loop: true,
|
|
spaceBetween: 16,
|
|
slidesPerView: 'auto',
|
|
|
|
breakpoints: {
|
|
1150: {
|
|
slidesPerView: 3,
|
|
}
|
|
}
|
|
})
|
|
|
|
/*=============== TESTIMONIAL SWIPER ===============*/
|
|
let swiperTestimonial = new Swiper('.testimonial__swiper', {
|
|
loop: true,
|
|
spaceBetween: 16,
|
|
grabCursor: true,
|
|
slidesPerView: 'auto',
|
|
centeredSlides: 'auto',
|
|
|
|
breakpoints: {
|
|
1150: {
|
|
slidesPerView: 3,
|
|
centeredSlides: false,
|
|
}
|
|
}
|
|
})
|
|
|
|
/*=============== EVENTROOMS SWIPER ===============*/
|
|
let swiperEventrooms = new Swiper('.eventrooms__swiper', {
|
|
loop: true,
|
|
spaceBetween: 16,
|
|
grabCursor: true,
|
|
slidesPerView: 'auto',
|
|
centeredSlides: 'auto',
|
|
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
},
|
|
|
|
breakpoints: {
|
|
1150: {
|
|
slidesPerView: 4,
|
|
centeredSlides: false,
|
|
}
|
|
}
|
|
})
|
|
|
|
/*=============== TARPAULIN SWIPER ===============*/
|
|
let swiperTarpaulin = new Swiper('.tarpaulin__swiper', {
|
|
loop: true,
|
|
spaceBetween: 16,
|
|
grabCursor: true,
|
|
slidesPerView: 'auto',
|
|
centeredSlides: 'auto',
|
|
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
},
|
|
|
|
breakpoints: {
|
|
1150: {
|
|
slidesPerView: 4,
|
|
centeredSlides: false,
|
|
}
|
|
}
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/*=============== SHOW SCROLL UP ===============*/
|
|
const scrollUp = () => {
|
|
const scrollUp = document.getElementById('scroll-up')
|
|
this.scrollY >= 350 ? scrollUp.classList.add('show-scroll')
|
|
:scrollUp.classList.remove('show-scroll')
|
|
}
|
|
window.addEventListener('scroll', scrollUp)
|
|
|
|
/*=============== SCROLL REVEAL ANIMATION ===============*/
|
|
const sr = ScrollReveal({
|
|
origin: 'top',
|
|
distance: '60px',
|
|
duration: 2500,
|
|
delay: 400,
|
|
reset: true, // Repeat
|
|
})
|
|
|
|
sr.reveal(`.home__data, .building__container, .vehicle__container,
|
|
.join__data, .testimonial__container, .footer`)
|
|
sr.reveal(`.home__images`, {delay: 600})
|
|
sr.reveal(`.services__card`, {interval: 100})
|
|
sr.reveal(`.discount__data`, {origin: 'left'})
|
|
sr.reveal(`.discount__images`, {origin: 'right'})
|
|
|