You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
386 lines
12 KiB
386 lines
12 KiB
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
|
|
let home = new Swiper(".home__swiper ", {
|
|
slidesPerView: 1,
|
|
spaceBetween: 1000,
|
|
loop:true,
|
|
autoplay: {
|
|
delay: 5000,
|
|
},
|
|
pagination: {
|
|
el: ".home__pagination",
|
|
clickable: true
|
|
},
|
|
});
|
|
|
|
let market = new Swiper(".marketplace__swiper ", {
|
|
slidesPerView: 'auto',
|
|
spaceBetween: 13,
|
|
|
|
});
|
|
|
|
// sellerSlider
|
|
let sellerSlider = new Swiper(".sellerSlider", {
|
|
slidesPerView: 5,
|
|
spaceBetween: 24,
|
|
centeredSlides: true,
|
|
initialSlide: 1,
|
|
loop:true,
|
|
navigation: {
|
|
nextEl: '.sellerSlider-next',
|
|
prevEl: '.sellerSlider-prev'
|
|
},
|
|
breakpoints: {
|
|
250: {
|
|
slidesPerView: 1,
|
|
spaceBetween: 22,
|
|
},
|
|
576: {
|
|
slidesPerView: 2,
|
|
spaceBetween: 20,
|
|
},
|
|
768: {
|
|
slidesPerView: 2.5,
|
|
spaceBetween: 20,
|
|
},
|
|
1024: {
|
|
slidesPerView: 3,
|
|
spaceBetween: 20,
|
|
},
|
|
1400: {
|
|
slidesPerView: 5,
|
|
spaceBetween: 24,
|
|
},
|
|
}
|
|
});
|
|
|
|
// blogSlider
|
|
let blogSlider = new Swiper(".blogSlider", {
|
|
slidesPerView: 2.5,
|
|
spaceBetween: 43,
|
|
navigation: {
|
|
nextEl: '.blogSlider-next',
|
|
prevEl: '.blogSlider-prev'
|
|
},
|
|
breakpoints: {
|
|
300: {
|
|
slidesPerView: 1.3,
|
|
spaceBetween: 20,
|
|
},
|
|
776: {
|
|
slidesPerView: 1.3,
|
|
spaceBetween: 53,
|
|
},
|
|
991: {
|
|
slidesPerView: 2.4,
|
|
spaceBetween: '5%',
|
|
},
|
|
1400: {
|
|
slidesPerView: 2.4,
|
|
spaceBetween: '5%',
|
|
},
|
|
}
|
|
});
|
|
|
|
let cosmopetSwiper = new Swiper(".cosmopet-x__swiper", {
|
|
slidesPerView: 2.5,
|
|
spaceBetween: 43,
|
|
navigation: {
|
|
nextEl: '.cosmopet-next',
|
|
prevEl: '.cosmopet-prev'
|
|
},
|
|
breakpoints: {
|
|
300: {
|
|
slidesPerView: 1,
|
|
spaceBetween: 200,
|
|
},
|
|
776: {
|
|
slidesPerView: 2,
|
|
spaceBetween: 30,
|
|
},
|
|
991: {
|
|
slidesPerView: 2.4,
|
|
spaceBetween: '5%',
|
|
},
|
|
1400: {
|
|
slidesPerView: 3,
|
|
spaceBetween: 37,
|
|
},
|
|
}
|
|
});
|
|
|
|
let smigSlider = new Swiper(".smiSlider", {
|
|
slidesPerView: 3.3,
|
|
spaceBetween: 40,
|
|
navigation: {
|
|
nextEl: '.smiSlider-next',
|
|
prevEl: '.smiSlider-prev'
|
|
},
|
|
breakpoints: {
|
|
300: {
|
|
slidesPerView: 1.3,
|
|
spaceBetween: 20,
|
|
},
|
|
776: {
|
|
slidesPerView: 1.3,
|
|
spaceBetween: 40,
|
|
},
|
|
991: {
|
|
slidesPerView: 2.4,
|
|
spaceBetween: 40,
|
|
},
|
|
1400: {
|
|
slidesPerView: 2.8,
|
|
spaceBetween: 40,
|
|
},
|
|
}
|
|
});
|
|
|
|
let petsSlider = new Swiper(".discount_cosmodog__slider", {
|
|
slidesPerView: 1,
|
|
spaceBetween: 0,
|
|
effect: "fade",
|
|
autoplay: {
|
|
delay: 5000,
|
|
},
|
|
});
|
|
});
|
|
|
|
|
|
// Quiz
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const truthContents = document.querySelectorAll('.truth_content');
|
|
let currentIndex = 0;
|
|
let correctAnswers = 0;
|
|
|
|
truthContents.forEach(content => {
|
|
const successBtn = content.querySelector('.success_btn');
|
|
const errorBtn = content.querySelector('.error_btn');
|
|
const nextBtn = content.querySelectorAll(".next_btn");
|
|
const truthSuccess = content.querySelector('.truth_success');
|
|
const truthError = content.querySelector('.truth_error');
|
|
const truthDefault = content.querySelector('.truth_default');
|
|
|
|
if (successBtn) {
|
|
successBtn.addEventListener('click', function () {
|
|
truthDefault.style.display = 'none';
|
|
truthSuccess.classList.add('show');
|
|
correctAnswers++;
|
|
});
|
|
}
|
|
|
|
if (errorBtn) {
|
|
errorBtn.addEventListener('click', function () {
|
|
truthDefault.style.display = 'none';
|
|
truthError.classList.add('show');
|
|
});
|
|
}
|
|
|
|
if (nextBtn) {
|
|
nextBtn.forEach(btn => {
|
|
btn.addEventListener('click', function () {
|
|
truthSuccess.classList.contains('show') ? truthSuccess.classList.remove('show') : truthError.classList.remove('show');
|
|
content.classList.remove('active');
|
|
|
|
currentIndex++;
|
|
|
|
if (currentIndex < truthContents.length) {
|
|
truthContents[currentIndex].classList.add('active');
|
|
}
|
|
if (truthContents.length - currentIndex == 1) {
|
|
truthContents[currentIndex].querySelector(".truth_points-corrects").innerHTML = correctAnswers;
|
|
truthContents[currentIndex].querySelector(".truth_points-all").innerHTML = currentIndex ;
|
|
}
|
|
})
|
|
});
|
|
}
|
|
|
|
// Initial visibility
|
|
if (truthDefault) {
|
|
truthDefault.style.display = 'block';
|
|
}
|
|
});
|
|
|
|
});
|
|
|
|
// discount cosmodog img
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const cosmodogContainer = document.querySelector('.discount_cosmodog');
|
|
if (cosmodogContainer){
|
|
const images = cosmodogContainer.querySelectorAll('.discount_cosmodog-img');
|
|
let currentIndex = 0;
|
|
|
|
cosmodogContainer.addEventListener('click', function () {
|
|
images[currentIndex].classList.remove('active');
|
|
currentIndex = (currentIndex + 1) % images.length;
|
|
images[currentIndex].classList.add('active');
|
|
});
|
|
}
|
|
|
|
});
|
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
jQuery('.truth-form').on('submit', function(e){
|
|
e.preventDefault();
|
|
var form = new FormData(this);
|
|
var action = jQuery(this).attr('action')
|
|
jQuery.ajax({
|
|
url: action,
|
|
data: form,
|
|
processData: false,
|
|
contentType: false,
|
|
type: 'POST',
|
|
success: function (response) {
|
|
response = JSON.parse(response)
|
|
if (response.status == 'Success'){
|
|
jQuery('.truth_end-text--before').hide()
|
|
jQuery('.truth_end-text--sent').show()
|
|
}
|
|
}
|
|
});
|
|
})
|
|
|
|
|
|
|
|
jQuery('body').on('click', '[data-copy]', async function(){
|
|
|
|
|
|
try {
|
|
const textToCopy = jQuery(this).data('copy');
|
|
await navigator.clipboard.writeText(textToCopy);
|
|
|
|
jQuery(this).addClass('active')
|
|
setTimeout(function(){
|
|
jQuery(this).removeClass('active')
|
|
}, 2000)
|
|
} catch (err) {
|
|
|
|
}
|
|
})
|
|
});
|
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const sliders = document.querySelectorAll('.reviews_item-swiper');
|
|
sliders.forEach((slider, index) => {
|
|
new Swiper(slider, {
|
|
slidesPerView: 1,
|
|
spaceBetween: 0,
|
|
loop: true,
|
|
effect: 'fade',
|
|
fadeEffect: {
|
|
crossFade: true // enables slides to cross fade into each other
|
|
},
|
|
autoplay: {
|
|
delay: 3000, // Интервал переключения слайдов (3 секунды)
|
|
disableOnInteraction: false,
|
|
pauseOnMouseEnter: false,
|
|
// Задержка перед началом автопрокрутки для каждого слайдера
|
|
delayBeforeStart: index *
|
|
1000, // 0 сек для первого, 1 сек для второго, 2 сек для третьего
|
|
},
|
|
});
|
|
});
|
|
|
|
// Swiper не поддерживает delayBeforeStart нативно, поэтому добавим кастомную задержку
|
|
sliders.forEach((slider, index) => {
|
|
const swiperInstance = slider.swiper;
|
|
setTimeout(() => {
|
|
swiperInstance.autoplay.start();
|
|
}, index * 1000); // Задержка перед стартом: 0, 1000, 2000 мс
|
|
});
|
|
});
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Initialize Swiper
|
|
const reviewsSwiper = new Swiper('.reviews-slider', {
|
|
slidesPerView: 1,
|
|
spaceBetween: 50,
|
|
pagination: {
|
|
el: '.swiper-pagination',
|
|
clickable: true,
|
|
},
|
|
navigation: {
|
|
nextEl: '.swiper-button-prev',
|
|
prevEl: '.swiper-button-next',
|
|
},
|
|
breakpoints: {
|
|
320: {
|
|
slidesPerView: 1.3,
|
|
spaceBetween: 20,
|
|
|
|
},
|
|
1024: {
|
|
slidesPerView: 2,
|
|
},
|
|
1200: {
|
|
slidesPerView: 2,
|
|
}
|
|
}
|
|
});
|
|
|
|
// Show more functionality
|
|
const showMoreButtons = document.querySelectorAll('.show-more-btn');
|
|
const reviewPopup = document.querySelector('.review-popup');
|
|
const popupContent = document.querySelector('.popup-review-content');
|
|
const closePopup = document.querySelector('.close-popup');
|
|
|
|
showMoreButtons.forEach(button => {
|
|
button.addEventListener('click', function() {
|
|
const reviewCard = this.closest('.review-card');
|
|
const reviewHeader = reviewCard.querySelector('.review-header').cloneNode(true);
|
|
const reviewText = reviewCard.querySelector('.review-text').cloneNode(true);
|
|
|
|
// Show the hidden content in the review text
|
|
const moreContent = reviewText.querySelector('.review-more-content');
|
|
if (moreContent) {
|
|
moreContent.style.display = 'block';
|
|
}
|
|
|
|
// Populate popup
|
|
popupContent.innerHTML = '';
|
|
popupContent.appendChild(reviewHeader);
|
|
popupContent.appendChild(reviewText);
|
|
|
|
// Show popup
|
|
reviewPopup.style.display = 'flex';
|
|
});
|
|
});
|
|
|
|
// Close popup
|
|
if (closePopup) {
|
|
closePopup.addEventListener('click', function() {
|
|
reviewPopup.style.display = 'none';
|
|
});
|
|
}
|
|
if (reviewPopup){
|
|
reviewPopup.addEventListener('click', function(e) {
|
|
if (e.target === reviewPopup) {
|
|
reviewPopup.style.display = 'none';
|
|
}
|
|
});
|
|
}
|
|
// Close popup when clicking outside
|
|
});
|
|
|
|
|
|
var slider = carousel_init();
|
|
|
|
function carousel_init() {
|
|
var carousel = document.querySelectorAll('.carousel');
|
|
var options = {
|
|
numVisible: window.innerWidth > 421 ? 5 : 3,
|
|
indicators: false // Removed dots
|
|
};
|
|
var instances = M.Carousel.init(carousel, options);
|
|
document.querySelectorAll('.about_slider_nav').forEach(btn => {
|
|
btn.addEventListener('click', function (e) {
|
|
if (e.target.closest('button').classList.contains('next')) {
|
|
instances[0].next();
|
|
} else {
|
|
instances[0].prev();
|
|
}
|
|
});
|
|
});
|
|
return instances;
|
|
} |