!

(function (e) {
'function' != typeof e.matches &&
(e.matches =
e.msMatchesSelector ||
e.mozMatchesSelector ||
e.webkitMatchesSelector ||
function (e) {
for (
var t = this,
o = (t.document || t.ownerDocument).querySelectorAll(e),
n = 0;
o[n] && o[n] !== t;

)
++n;
return Boolean(o[n]);
}),
'function' != typeof e.closest &&
(e.closest = function (e) {
for (var t = this; t && 1 === t.nodeType; ) {
if (t.matches(e)) return t;
t = t.parentNode;
}
return null;
});
})(window.Element.prototype);

document.addEventListener('DOMContentLoaded', function () {
/* Записываем в переменные массив элементов-кнопок и подложку.
Подложке зададим id, чтобы не влиять на другие элементы с классом overlay*/
var modalButtons = document.querySelectorAll('.js-open-modal'),
overlay = document.querySelector('.js-overlay-modal'),
closeButtons = document.querySelectorAll('.js-modal-close');

/* Перебираем массив кнопок */

modalButtons.forEach(function (item) {
/* Назначаем каждой кнопке обработчик клика */
item.addEventListener('click', function (e) {
/* Предотвращаем стандартное действие элемента. Так как кнопку разные
люди могут сделать по-разному. Кто-то сделает ссылку, кто-то кнопку.
Нужно подстраховаться. */
e.preventDefault();

/* При каждом клике на кнопку мы будем забирать содержимое атрибута data-

modal
и будем искать модальное окно с таким же атрибутом. */
var modalId = this.getAttribute('data-modal'),
modalElem = document.querySelector(
'.modal[data-modal="' + modalId + '"]'
);

/* После того как нашли нужное модальное окно, добавим классы

подложке и окну чтобы показать их. */
document.body.classList.add('noScroll');
modalElem.classList.add('active');
overlay.classList.add('active');
}); // end click
}); // end foreach
const Youtube = document.getElementById('Youtube');
 closeButtons.forEach(function (item) {
item.addEventListener('click', function (e) {
const iframeSrc = Youtube.src;
Youtube.src = iframeSrc;
var parentModal = this.closest('.modal');
document.body.classList.remove('noScroll');
parentModal.classList.remove('active');
overlay.classList.remove('active');
});
}); // end foreach

document.body.addEventListener(
'keyup',
function (e) {
var key = e.keyCode;

if (key == 27) {
document.querySelector('.modal.active').classList.remove('active');
document.querySelector('.overlay').classList.remove('active');
document.body.classList.remove('noScroll');
}
},
false
);

overlay.addEventListener('click', function () {
const iframeSrc = Youtube.src;
Youtube.src = iframeSrc;
document.querySelector('.modal.active').classList.remove('active');
this.classList.remove('active');
document.body.classList.remove('noScroll');
});
}); // end ready