Good-Production/Fakel-Gym
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

full

Browse Source
This commit is contained in:
GP_DEV
2025-07-08 14:21:19 +03:00
parent a6bb81cbe1
commit 21562852ca
65 changed files with 7464 additions and 1073 deletions
Download Patch File Download Diff File Expand all files Collapse all files

200
template-parts/la-components/blocks/reviews-block/reviews-block.js
View File

@@ -13,102 +13,139 @@ function initReviewsBlock(blockId) {
let lightbox;
function initAllSwipers() {
const tabs = container.querySelectorAll('.tab-button');
container.querySelectorAll('.reviews-swiper').forEach(swiperEl => {
const tabId = swiperEl.id.replace('swiper-', '');
tabs.forEach(button => {
const tabId = button.getAttribute('data-tab');
const tabContent = container.querySelector(`#tab-${tabId}`);
if (tabContent && tabContent.querySelector('.swiper')) {
const wasHidden = tabContent.classList.contains('hidden');
if (wasHidden) {
tabContent.style.visibility = 'hidden';
tabContent.style.position = 'absolute';
tabContent.classList.remove('hidden');
tabContent.classList.add('block');
}
if (swipers[tabId]) {
swipers[tabId].destroy(true, true);
}
swipers[tabId] = new Swiper(`#${blockId} #swiper-${tabId}`, {
slidesPerView: 'auto',
spaceBetween: 20,
loop: true,
centeredSlides: true,
observer: true,
observeParents: true,
watchSlidesProgress: true,
});
if (wasHidden) {
tabContent.style.visibility = '';
tabContent.style.position = '';
tabContent.classList.add('hidden');
tabContent.classList.remove('block');
}
}
swipers[tabId] = new Swiper(`#${blockId} #swiper-${tabId}`, {
slidesPerView: 'auto',
spaceBetween: 24,
grabCursor: true,
watchSlidesProgress: true,
scrollbar: {
el: `#${blockId} #swiper-${tabId} .swiper-scrollbar`,
draggable: true,
},
});
});
}
function initLightbox(tabId) {
if (lightbox) {
lightbox.destroy();
}
const currentSelector = `#${blockId} #tab-${tabId} .glightbox`;
lightbox = GLightbox({
selector: `#${blockId} #tab-${tabId} .glightbox`,
touchNavigation: true,
loop: true,
autoplayVideos: false,
videosWidth: '90vw',
videosHeight: '80vh',
plyr: {
css: 'https://cdn.plyr.io/3.7.8/plyr.css',
js: 'https://cdn.plyr.io/3.7.8/plyr.js',
config: {
ratio: '16:9',
fullscreen: { enabled: true, fallback: true, iosNative: true },
controls: [
'play-large',
'play',
'progress',
'current-time',
'duration',
'mute',
'volume',
'fullscreen'
]
}
},
onOpen: () => {
console.log('видео открыли');
},
onClose: () => {
console.log('видео закрыли');
if (lightbox?.settings?.selector !== currentSelector) {
if (lightbox) {
lightbox.destroy();
}
});
const isVideo = tabId === 'video';
lightbox = GLightbox({
selector: currentSelector,
touchNavigation: true,
loop: true,
autoplayVideos: false,
videosWidth: isVideo ? '90vw' : 'auto',
videosHeight: isVideo ? '80vh' : 'auto',
plyr: isVideo ? {
css: 'https://cdn.plyr.io/3.7.8/plyr.css',
js: 'https://cdn.plyr.io/3.7.8/plyr.js',
config: {
ratio: '16:9',
fullscreen: { enabled: true, fallback: true, iosNative: true },
controls: [
'play-large',
'play',
'progress',
'current-time',
'duration',
'mute',
'volume',
'fullscreen'
]
}
} : undefined,
});
}
}
function toggleRatingSection(show) {
const ratingSection = container.querySelector('.rating-section');
if (ratingSection) {
if (show) {
ratingSection.classList.remove('hidden');
ratingSection.classList.add('flex');
} else {
ratingSection.classList.remove('flex');
ratingSection.classList.add('hidden');
}
}
}
function updateRatingAndStars(rating, stars) {
if (stars) {
const starsElement = container.querySelector('[data-reviews="stars"]');
if (starsElement) {
const starCount = parseInt(stars);
const lastDigit = starCount % 10;
const lastTwoDigits = starCount % 100;
let ending;
if (lastTwoDigits >= 11 && lastTwoDigits <= 19) {
ending = ' оценок';
} else if (lastDigit == 1) {
ending = ' оценка';
} else if (lastDigit >= 2 && lastDigit <= 4) {
ending = ' оценки';
} else {
ending = ' оценок';
}
starsElement.textContent = starCount + ending;
}
}
}
function debounce(func, wait) {
let timeout;
return (...args) => {
clearTimeout(timeout);
timeout = setTimeout(() => func.apply(this, args), wait);
};
}
initAllSwipers();
const activeTab = container.querySelector('.tab-button.active');
if (activeTab) {
const tabId = activeTab.getAttribute('data-tab');
initLightbox(tabId);
}
container.querySelectorAll('.tab-button').forEach(button => {
button.addEventListener('click', () => {
button.addEventListener('click', debounce(() => {
const tabId = button.getAttribute('data-tab');
const rating = button.getAttribute('data-rating');
const stars = button.getAttribute('data-stars');
const isVideoTab = tabId === 'video';
container.querySelectorAll('.tab-button').forEach(btn => {
btn.classList.remove('active', 'underline');
btn.classList.add('bg-gray-100');
btn.classList.remove('active');
});
button.classList.add('active', 'underline');
button.classList.remove('bg-gray-100');
button.classList.add('active');
toggleRatingSection(!isVideoTab);
if (!isVideoTab) {
updateRatingAndStars(rating, stars);
}
container.querySelectorAll('.tab-content').forEach(content => {
content.classList.remove('block');
@@ -119,13 +156,22 @@ function initReviewsBlock(blockId) {
targetTab.classList.remove('hidden');
targetTab.classList.add('block');
if (swipers[tabId]) {
initLightbox(tabId);
if (!isVideoTab && swipers[tabId]) {
requestAnimationFrame(() => {
swipers[tabId].update();
});
}
initLightbox(tabId);
});
}, 100));
});
window.addEventListener('beforeunload', () => {
Object.values(swipers).forEach(swiper => swiper?.destroy());
if (lightbox) lightbox.destroy();
});
}