<script>
document.addEventListener("DOMContentLoaded", function(){
//Полуаем нужные элементы
let popupBtn = document.querySelectorAll('[href^="#uc-zw"]');
let popupZero = document.querySelectorAll('div[class*="uc-zw-"]');
let mainPopup = document.querySelector('.uc-main-popup');
if(popupBtn.length&&popupZero.length&&mainPopup){
let popupCont = mainPopup.querySelector('.t-popup__container');
let popupCloseIcon = mainPopup.querySelector('.t-popup__close');
//Очищаем popup и получаем ссылку его вызова
popupCont.innerHTML = '';
let popupHook = mainPopup.querySelector('.t-popup').getAttribute('data-tooltip-hook');
//Создаём элемент со ссылкой вызова popup
let popupLink = document.createElement('a');
popupLink.href = popupHook; popupLink.className = "bf503-zero";
mainPopup.appendChild(popupLink);
//Размечаем наши Zero для привязки к нужной ссылке
for (let i = 0; i < popupZero.length; i++) {
popupZero[i].classList.add("popup-zero" , "hide-popup-zero");
//Закрываем окно при клике на вне элементов
popupZero[i].querySelector('.t396__filter').addEventListener('click', function() { popupCloseIcon.click() });
//Закрываем окно при клике на кнопку #popup-close
setTimeout(function(){
let closeIcon = popupZero[i].querySelector('a[href="#popup-close"]');
if(closeIcon != null){
popupCloseIcon.classList.add("hide-popup-zero");
closeIcon.addEventListener('click', function(e) {
popupCloseIcon.click();e.preventDefault();
});
};
}, 1000);
//Закрываем окно при отправке формы
popupZero[i].addEventListener('click', function(e){
let type = e.target.getAttribute('type');
if(type=="submit"){
setTimeout(function(){
let form = e.target.closest('.t-form');
if (form.classList.contains('js-send-form-success')) popupCloseIcon.click();
}, 1000);
};
});
//Добавляем атрибут в виде ссылки
let classZeroPopup = popupZero[i].getAttribute('class');
let classArrZeroPopup = classZeroPopup.split(' ');
classArrZeroPopup.forEach(function(item, j) {
if(item.includes('uc-zw-')) {
popupZero[i].setAttribute('data-zero-popup', item);
popupZero[i].classList.remove(item);
};
});
};
//Отслеживаем закрытие окна
let popupShow = mainPopup.querySelector('.t-popup');
let observer = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
setTimeout(function(){
popupShow = mainPopup.querySelector('.t-popup');
if (!popupShow.classList.contains('t-popup_show')) {
let activeZero = mainPopup.querySelector('.active-popup-zero');
let frame = activeZero.querySelectorAll('iframe');
if(frame.length){frame.forEach(i => i.src = i.src)};
let video = activeZero.querySelectorAll('video');
if(video.length){video.forEach(i => i.pause())};
};
}, 500);
});
});
observer.observe( popupShow, { attributes: true, attributeFilter: ['class'] });
//Отслеживаем нажатие кнопок для вызова окна
for (let i = 0; i < popupBtn.length; i++) {
popupBtn[i].addEventListener('click', function(e) {e.preventDefault();
let link = (this.getAttribute('href')).replace('#' , '');
let popupZeroActive = document.querySelector('div[data-zero-popup="'+link+'"]');
if(popupZeroActive){
if (!popupZeroActive.hasAttribute("zero-popup-mode")) {
popupCont.append(popupZeroActive);
popupZeroActive.setAttribute('zero-popup-mode','');
};
let zeroInside = popupCont.querySelectorAll('.popup-zero');
if(zeroInside){
zeroInside.forEach(i => i.classList.add("hide-popup-zero"));
zeroInside.forEach(i => i.classList.remove("active-popup-zero"))
};
popupZeroActive.classList.remove('hide-popup-zero');
popupZeroActive.classList.add('active-popup-zero');
let popup = mainPopup.querySelector('.t-popup');
popup.classList.add("popup-transition");
popupLink.click();
};
});
};
};
});
</script>
<style>
div[class*="uc-zw-"], .hide-popup-zero {
position: absolute;
width: 100%;
top: 0;
opacity: 0;
z-index: -10;
pointer-events: none;
}
.uc-main-popup .t-popup {
padding: 0;
display: block !important;
pointer-events: none;
}
.uc-main-popup .t-popup__container {left:0; right:0;background: none}
.tn-atom .t-form__errorbox-wrapper,
.tn-form__errorbox-popup,
.t-form-success-popup { z-index: 9999999 !important}
div#tilda-popup-for-error {display: none !important}
.popup-zero .t396__filter {cursor: pointer}
.uc-main-popup .t-popup.t-popup_show {pointer-events: auto}
.uc-main-popup .t-popup { transition: none}
.uc-main-popup .popup-transition {transition: opacity ease-in-out .3s;}
.uc-main-popup {
position: fixed;
z-index: 999;
}
</style>