mirror of
https://github.com/Leaflet/Leaflet.git
synced 2025-07-21 23:26:12 +00:00
46 lines
1.4 KiB
JavaScript
46 lines
1.4 KiB
JavaScript
const SESSION_KEY = 'dialog-session';
|
|
const ONE_DAY_MILLI_SEC = 7 * 24 * 60 * 60 * 1000;
|
|
|
|
function openDialog() {
|
|
|
|
// keep the last session timestamp in local storage to re-show after 7 days since last time
|
|
if (localStorage) {
|
|
const sessionTimestamp = localStorage.getItem(SESSION_KEY);
|
|
if (sessionTimestamp && Date.now() - sessionTimestamp < ONE_DAY_MILLI_SEC) {
|
|
return;
|
|
}
|
|
}
|
|
|
|
const html = '<div class=\'container iframe-container\'><iframe src=\'/dialog/\'></iframe><button type="submit" class=\'close-dialog\' aria-label=\'close\'>×</button></div>';
|
|
|
|
const dialog = document.createElement('div');
|
|
dialog.id = 'dialog';
|
|
dialog.setAttribute('role', 'dialog');
|
|
dialog.innerHTML = html;
|
|
|
|
document.body.insertBefore(dialog, document.body.firstChild);
|
|
document.body.classList.add('overflowHidden');
|
|
|
|
setTimeout(() => {
|
|
dialog.focus();
|
|
}, 100);
|
|
|
|
const closeBtn = document.querySelector('.close-dialog');
|
|
closeBtn.addEventListener('click', () => {
|
|
const dialog = document.getElementById('dialog');
|
|
document.body.removeChild(dialog);
|
|
document.body.classList.remove('overflowHidden');
|
|
if (localStorage) {
|
|
localStorage.setItem(SESSION_KEY, Date.now());
|
|
}
|
|
});
|
|
|
|
// keep focus in dialog
|
|
// https://css-tricks.com/a-css-approach-to-trap-focus-inside-of-an-element/
|
|
dialog.addEventListener('transitionend', () => {
|
|
dialog.querySelector('iframe').focus();
|
|
});
|
|
}
|
|
|
|
openDialog();
|