2023-03-05 18:16:28 +00:00
|
|
|
function popUpShow(title, body, actions, content) {
|
2023-03-09 12:22:25 +00:00
|
|
|
// Stop scrolling
|
|
|
|
document.querySelector("html").style.overflow = "hidden";
|
|
|
|
|
2023-03-10 15:55:34 +00:00
|
|
|
// Get popup elements
|
2023-03-05 18:16:28 +00:00
|
|
|
var popup = document.querySelector('.pop-up');
|
|
|
|
var popupContent = document.querySelector('.pop-up-content');
|
|
|
|
var popupActions = document.querySelector('.pop-up-controlls');
|
2023-03-10 15:55:34 +00:00
|
|
|
|
|
|
|
// Set popup content
|
|
|
|
popupContent.innerHTML = `<h3>${title}</h3><p>${body}</p>${content}`;
|
2023-03-05 18:16:28 +00:00
|
|
|
|
|
|
|
// Set buttons that will be displayed
|
2023-03-10 15:55:34 +00:00
|
|
|
popupActions.innerHTML = actions;
|
2023-03-05 18:16:28 +00:00
|
|
|
|
|
|
|
// Show popup
|
2023-03-10 15:55:34 +00:00
|
|
|
popup.style.display = 'block';
|
|
|
|
setTimeout(function() {
|
|
|
|
popup.classList.add('active')
|
|
|
|
}, 10);
|
2023-03-05 18:16:28 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
function popupDissmiss() {
|
2023-03-09 12:22:25 +00:00
|
|
|
// un-Stop scrolling
|
|
|
|
document.querySelector("html").style.overflow = "auto";
|
|
|
|
|
2023-03-05 18:16:28 +00:00
|
|
|
var popup = document.querySelector('.pop-up');
|
|
|
|
|
2023-03-10 15:55:34 +00:00
|
|
|
popup.classList.remove('active');
|
2023-03-05 18:16:28 +00:00
|
|
|
|
|
|
|
setTimeout(function() {
|
2023-03-10 15:55:34 +00:00
|
|
|
popup.style.display = 'none';
|
2023-03-05 18:16:28 +00:00
|
|
|
}, 200);
|
|
|
|
}
|
|
|
|
|
|
|
|
document.addEventListener('keydown', function(event) {
|
|
|
|
if (event.key === 'Escape') {
|
2023-03-10 15:55:34 +00:00
|
|
|
if (document.querySelector('.pop-up').classList.contains('active')) {
|
2023-03-05 18:16:28 +00:00
|
|
|
popupDissmiss();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|