Clean up Pop-Up JS

Fix missing Width and Height data stopping images from loading
This commit is contained in:
Michał Gdula 2023-03-10 15:55:34 +00:00
parent b0a9271265
commit feadaba8a1
5 changed files with 146 additions and 180 deletions

View file

@ -2,34 +2,23 @@ function popUpShow(title, body, actions, content) {
// Stop scrolling
document.querySelector("html").style.overflow = "hidden";
// Get popup elements
var popup = document.querySelector('.pop-up');
var popupContent = document.querySelector('.pop-up-content');
var popupActions = document.querySelector('.pop-up-controlls');
// Set tile and description
h3 = document.createElement('h3');
h3.innerHTML = title;
p = document.createElement('p');
p.innerHTML = body;
popupContent.innerHTML = '';
popupContent.appendChild(h3);
popupContent.appendChild(p);
// Set content
if (content != '') {
popupContent.innerHTML += content;
}
// Set popup content
popupContent.innerHTML = `<h3>${title}</h3><p>${body}</p>${content}`;
// Set buttons that will be displayed
popupActions.innerHTML = '';
if (actions != '') {
popupActions.innerHTML += actions;
}
popupActions.innerHTML = actions;
popupActions.innerHTML += '<button class="pop-up__btn pop-up__btn-fill" onclick="popupDissmiss()">Nooooooo</button>';
// Show popup
popup.classList.add('pop-up__active');
popup.style.display = 'block';
setTimeout(function() {
popup.classList.add('active')
}, 10);
}
function popupDissmiss() {
@ -38,16 +27,16 @@ function popupDissmiss() {
var popup = document.querySelector('.pop-up');
popup.classList.add('pop-up__hide');
popup.classList.remove('active');
setTimeout(function() {
popup.classList = 'pop-up';
popup.style.display = 'none';
}, 200);
}
document.addEventListener('keydown', function(event) {
if (event.key === 'Escape') {
if (document.querySelector('.pop-up').classList.contains('pop-up__active')) {
if (document.querySelector('.pop-up').classList.contains('active')) {
popupDissmiss();
}
}