You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
1.3 KiB
48 lines
1.3 KiB
// showModal will create the modal structure the first time it is called.
|
|
var modal, modalContent;
|
|
const showModal = function() {
|
|
if (!modal) {
|
|
// make the modal
|
|
const modalClose = document.createElement('span');
|
|
modalClose.id = 'modal-close';
|
|
modalClose.innerHTML = '×';
|
|
|
|
modalContent = document.createElement('div');
|
|
modalContent.id = 'modal-content';
|
|
|
|
const modalBody = document.createElement('div');
|
|
modalBody.id = 'modal-body';
|
|
modalBody.appendChild(modalContent);
|
|
modalBody.appendChild(modalClose);
|
|
|
|
modal = document.createElement('div');
|
|
modal.id = 'modal';
|
|
modal.appendChild(modalBody);
|
|
|
|
// add the modal to the document
|
|
document.getElementsByTagName('body')[0].appendChild(modal);
|
|
|
|
// setup modal functionality
|
|
modalClose.onclick = function() {
|
|
modal.style.display = "none";
|
|
}
|
|
}
|
|
|
|
modalContent.innerHTML = '';
|
|
for (var i = 0; i < arguments.length; i++) {
|
|
modalContent.appendChild(arguments[i]);
|
|
}
|
|
modal.style.display = "block";
|
|
|
|
// When the user clicks anywhere outside of the modal, close it
|
|
window.onclick = function(event) {
|
|
if (event.target == modal) {
|
|
modal.style.display = "none";
|
|
window.onclick = undefined;
|
|
}
|
|
}
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
console.log("DOM loaded");
|
|
})
|
|
|