356 lines
10 KiB
JavaScript
356 lines
10 KiB
JavaScript
const btnOpenMenu = document.querySelector('.burger-btn');
|
|
const headerMenu = document.querySelector('.bottom-header-row');
|
|
|
|
btnOpenMenu.addEventListener('click', ()=> {
|
|
document.querySelector('html').style = "overflow: hidden;"
|
|
headerMenu.classList.add('open');
|
|
btnOpenMenu.style="opacity: 0;";
|
|
});
|
|
|
|
const boxes = Array.from(document.querySelectorAll(".box__accordion"));
|
|
boxes.forEach((box) => {
|
|
box.addEventListener("click", boxHandler);
|
|
});
|
|
|
|
function boxHandler(e) {
|
|
e.preventDefault();
|
|
let currentBox = e.target.closest(".box__accordion");
|
|
let currentContent = currentBox.querySelector(".box__accordion_content");;
|
|
|
|
currentBox.classList.toggle("active");
|
|
if (currentBox.classList.contains("active")) {
|
|
currentContent.style.maxHeight = currentContent.scrollHeight + 20 + "px";
|
|
} else {
|
|
currentContent.style.maxHeight = 0;
|
|
}
|
|
}
|
|
|
|
const modalRequestForm = document.querySelector('.modal-request-form');
|
|
|
|
document.addEventListener("click", function (event) {
|
|
|
|
const target = event.target;
|
|
|
|
if (target.classList.contains("certificates__item_img")) {
|
|
const screen = document.querySelector('.screen-certificates');
|
|
//screen.querySelector('.screen-certificates__img').innerHTML = event.target.outerHTML;
|
|
document.querySelector('html').style = "overflow: hidden;"
|
|
screen.classList.add('open');
|
|
return;
|
|
}
|
|
if (target.classList.contains("clickRemove") || event.target.classList.contains("btn-close-certificates-img")) {
|
|
document.querySelector('.screen-certificates').classList.remove('open');
|
|
document.querySelector('html').style = "";
|
|
return;
|
|
}
|
|
|
|
if (target.classList.contains("btn-close-header-menu")) {
|
|
headerMenu.classList.remove('open');
|
|
btnOpenMenu.style="";
|
|
document.querySelector('html').style = "";
|
|
return;
|
|
}
|
|
if (target.classList.contains("btn-write")) {
|
|
modalRequestForm.style="";
|
|
document.querySelector('html').style = "overflow: hidden;";
|
|
// Динамическая загрузка Bitrix24 (иначе не инициализируется в скрытом контейнере)
|
|
var container = modalRequestForm.querySelector('.b24-form-container');
|
|
if (container && !container.querySelector('.b24-form')) {
|
|
var fForm = modalRequestForm.dataset.b24Form;
|
|
var fLoader = modalRequestForm.dataset.b24Loader;
|
|
if (fForm && fLoader) {
|
|
var s = document.createElement('script');
|
|
s.setAttribute('data-b24-form', fForm);
|
|
s.setAttribute('data-skip-moving', 'true');
|
|
s.text = "(function(w,d,u){var s=d.createElement('script');s.async=true;s.src=u+'?'+(Date.now()/180000|0);var h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})(window,document,'" + fLoader + "');";
|
|
container.appendChild(s);
|
|
}
|
|
}
|
|
return;
|
|
}
|
|
if (target.classList.contains("btn-close-request-form") || target.classList.contains("btn-close-request-form-img")) {
|
|
modalRequestForm.style="display: none;";
|
|
document.querySelector('html').style = "";
|
|
return;
|
|
}
|
|
// Клик по фону (затемнению) — закрыть модалку
|
|
if (target === modalRequestForm) {
|
|
modalRequestForm.style="display: none;";
|
|
document.querySelector('html').style = "";
|
|
return;
|
|
}
|
|
|
|
if(target.classList.contains("hover-effect")) {
|
|
target.classList.remove("hover-effect");
|
|
return;
|
|
}
|
|
|
|
if (target.classList.contains("menu-item-has-children")) {
|
|
target.parentNode.classList.add("hover-effect");
|
|
return;
|
|
}
|
|
});
|
|
|
|
/*(function ($) {
|
|
$(document).ready(function () {
|
|
$(".teachers-owl").owlCarousel({
|
|
//autoplay: true,
|
|
loop: false,
|
|
center: true,
|
|
margin: 30,
|
|
autoplayHoverPause: true,
|
|
autoplayTimeout: 4000,
|
|
items: 2,
|
|
dots: false,
|
|
nav: true,
|
|
navText: ['<i></i>', '<i></i>'],
|
|
//navText: ['<i class="fa fa-angle-left"></i>', '<i class="fa fa-angle-right"></i>'],
|
|
responsive: {
|
|
0: { items: 1,
|
|
center: true,
|
|
},
|
|
768: {
|
|
items: 2,
|
|
center: false,
|
|
},
|
|
992: {
|
|
items: 4,
|
|
center: false,
|
|
margin: 36,
|
|
},
|
|
}
|
|
});
|
|
|
|
});
|
|
})(jQuery);*/
|
|
|
|
let swiperPopularSubjects = new Swiper(".swiper-popular-subjects", {
|
|
spaceBetween: 10,
|
|
slidesPerView: 1,
|
|
speed: 400,
|
|
preventInteractionOnTransition: true, // запрет смены слайдов
|
|
keyboard: true,
|
|
breakpoints: {
|
|
680: {
|
|
slidesPerView: 2,
|
|
speed: 400,
|
|
},
|
|
860: {
|
|
slidesPerView: 3,
|
|
speed: 400,
|
|
}
|
|
},
|
|
navigation: {
|
|
nextEl: ".subject-next",
|
|
prevEl: ".subject-prev",
|
|
}
|
|
});
|
|
|
|
let swiperFoto = new Swiper(".swiper-foto", {
|
|
spaceBetween: 10,
|
|
slidesPerView: 1,
|
|
speed: 400,
|
|
preventInteractionOnTransition: true, // запрет смены слайдов
|
|
keyboard: true,
|
|
navigation: {
|
|
nextEl: ".foto-next",
|
|
prevEl: ".foto-prev",
|
|
},
|
|
pagination: {
|
|
el: ".swiper-pagination",
|
|
clickable: true,
|
|
},
|
|
});
|
|
|
|
let swiperNews = new Swiper(".swiper-news", {
|
|
spaceBetween: 10,
|
|
slidesPerView: 1,
|
|
speed: 400,
|
|
preventInteractionOnTransition: true, // запрет смены слайдов
|
|
keyboard: true,
|
|
breakpoints: {
|
|
680: {
|
|
slidesPerView: 2,
|
|
speed: 400,
|
|
},
|
|
860: {
|
|
slidesPerView: 3,
|
|
speed: 400,
|
|
}
|
|
},
|
|
navigation: {
|
|
nextEl: ".news-next",
|
|
prevEl: ".news-prev",
|
|
}
|
|
});
|
|
|
|
let swiperCertificates = new Swiper(".certificates-owl", {
|
|
spaceBetween: 10,
|
|
slidesPerView: 1,
|
|
speed: 400,
|
|
loop: true,
|
|
preventInteractionOnTransition: true, // запрет смены слайдов
|
|
keyboard: true,
|
|
navigation: {
|
|
nextEl: ".certificates-owl-next",
|
|
prevEl: ".certificates-owl-prev",
|
|
}
|
|
});
|
|
|
|
let swiperReviews = new Swiper(".reviews-owl", {
|
|
spaceBetween: 40,
|
|
speed: 400,
|
|
slidesPerView: 1,
|
|
/*slidesPerGroup: 2,
|
|
centeredSlidesBounds: true,
|
|
freeMode: true,
|
|
followFinger: true,
|
|
loop: false,*/
|
|
//preventInteractionOnTransition: true, // запрет смены слайдов
|
|
keyboard: true,
|
|
breakpoints: {
|
|
860: {
|
|
slidesPerView: 2,
|
|
speed: 400,
|
|
}
|
|
},
|
|
navigation: {
|
|
nextEl: ".reviews-owl-next",
|
|
prevEl: ".reviews-owl-prev",
|
|
}
|
|
});
|
|
|
|
let swiperTeachers = new Swiper(".teachers-owl", {
|
|
spaceBetween: 30,
|
|
speed: 400,
|
|
slidesPerView: 1,
|
|
keyboard: true,
|
|
breakpoints: {
|
|
540: {
|
|
slidesPerView: 2,
|
|
},
|
|
860: {
|
|
slidesPerView: 4,
|
|
},
|
|
992: {
|
|
slidesPerView: 4,
|
|
spaceBetween: 36,
|
|
},
|
|
},
|
|
navigation: {
|
|
nextEl: ".teachers-owl-next",
|
|
prevEl: ".teachers-owl-prev",
|
|
}
|
|
});
|
|
|
|
setTimeout(() => {
|
|
document.querySelectorAll('.b24-form-content .b24-form-btn').forEach(btn => {
|
|
btn.textContent = 'записаться';
|
|
});
|
|
}, 1000);
|
|
|
|
document.querySelectorAll('.header-menu').forEach(item => {
|
|
item.classList.add('hover-effect');
|
|
})
|
|
|
|
/* ── Scroll Progress Bar ── */
|
|
(function() {
|
|
var progressBar = document.createElement('div');
|
|
progressBar.className = 'pksh-scroll-progress';
|
|
document.body.prepend(progressBar);
|
|
|
|
function updateProgress() {
|
|
var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
|
var docHeight = document.documentElement.scrollHeight - document.documentElement.clientHeight;
|
|
var progress = (scrollTop / docHeight) * 100;
|
|
progressBar.style.width = progress + '%';
|
|
}
|
|
|
|
window.addEventListener('scroll', updateProgress, { passive: true });
|
|
window.addEventListener('resize', updateProgress, { passive: true });
|
|
updateProgress();
|
|
})();
|
|
|
|
/* ── Desktop Sticky CTA — show after hero ── */
|
|
(function() {
|
|
var sticky = document.querySelector('.sticky-cta-desktop');
|
|
var hero = document.querySelector('.banner');
|
|
if (!sticky || !hero) return;
|
|
|
|
var observer = new IntersectionObserver(function(entries) {
|
|
entries.forEach(function(entry) {
|
|
// Show sticky CTA when hero is NOT visible (scrolled past)
|
|
sticky.classList.toggle('visible', !entry.isIntersecting);
|
|
});
|
|
}, { threshold: 0 });
|
|
|
|
observer.observe(hero);
|
|
})();
|
|
|
|
/* ── Mobile banner padding: compensate for fixed header ── */
|
|
(function() {
|
|
var banner = document.querySelector('.page-pksh .banner');
|
|
var header = document.querySelector('.header');
|
|
if (banner && header && window.innerWidth <= 860) {
|
|
var headerH = header.offsetHeight || 76;
|
|
banner.style.paddingTop = headerH + 'px';
|
|
banner.style.marginTop = '-' + headerH + 'px';
|
|
}
|
|
})();
|
|
|
|
/* ── .open-bitrix-form → opens modal form ── */
|
|
document.querySelectorAll('.open-bitrix-form').forEach(btn => {
|
|
btn.addEventListener('click', function(e) {
|
|
const modal = document.querySelector('.modal-request-form');
|
|
if (modal) {
|
|
modal.style = "";
|
|
// Динамическая загрузка Bitrix24
|
|
var container = modal.querySelector('.b24-form-container');
|
|
if (container && !container.querySelector('.b24-form')) {
|
|
var fForm = modal.dataset.b24Form;
|
|
var fLoader = modal.dataset.b24Loader;
|
|
if (fForm && fLoader) {
|
|
var s = document.createElement('script');
|
|
s.setAttribute('data-b24-form', fForm);
|
|
s.setAttribute('data-skip-moving', 'true');
|
|
s.text = "(function(w,d,u){var s=d.createElement('script');s.async=true;s.src=u+'?'+(Date.now()/180000|0);var h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})(window,document,'" + fLoader + "');";
|
|
container.appendChild(s);
|
|
}
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
// Закрытие модалки по Escape
|
|
document.addEventListener("keydown", function(e) {
|
|
if (e.key === "Escape") {
|
|
const modal = document.querySelector('.modal-request-form');
|
|
if (modal && modal.style.display !== "none") {
|
|
modal.style.display = "none";
|
|
document.querySelector('html').style = "";
|
|
}
|
|
}
|
|
});
|
|
|
|
/* ── FAQ Accordion (mystyle-accordion) ── */
|
|
document.querySelectorAll('.mystyle-accordion-trigger').forEach(trigger => {
|
|
trigger.addEventListener('click', function(e) {
|
|
const item = this.closest('.mystyle-accordion-item');
|
|
if (!item) return;
|
|
const isOpen = item.classList.contains('active');
|
|
// Закрываем все другие аккордеоны в том же контейнере
|
|
const parent = item.parentElement;
|
|
if (parent) {
|
|
parent.querySelectorAll('.mystyle-accordion-item.active').forEach(other => {
|
|
if (other !== item) {
|
|
other.classList.remove('active');
|
|
}
|
|
});
|
|
}
|
|
if (isOpen) {
|
|
item.classList.remove('active');
|
|
} else {
|
|
item.classList.add('active');
|
|
}
|
|
});
|
|
}); |