121 lines
3.7 KiB
JavaScript
121 lines
3.7 KiB
JavaScript
(function (ns) {
|
|
'use strict';
|
|
|
|
const dialog = document.getElementById('info-dialog');
|
|
const title = document.getElementById('info-dialog-title');
|
|
const menu = document.getElementById('info-menu');
|
|
const backButton = document.getElementById('info-back');
|
|
const closeButton = document.getElementById('info-close');
|
|
const infoButton = document.getElementById('info-button');
|
|
const pageTitles = Object.freeze({
|
|
privacy: 'Datenschutzerklärung',
|
|
imprint: 'Impressum',
|
|
technology: 'Cookies und Technik'
|
|
});
|
|
|
|
function isActivation(event) {
|
|
if (event.type === 'keydown') return event.key === 'Enter' || event.key === ' ';
|
|
if (event.type !== 'pointerup') return false;
|
|
if (event.isPrimary === false) return false;
|
|
return event.pointerType !== 'mouse' || event.button === 0;
|
|
}
|
|
|
|
function activate(element, handler) {
|
|
element.addEventListener('pointerup', event => {
|
|
if (!isActivation(event)) return;
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
handler(event);
|
|
});
|
|
element.addEventListener('keydown', event => {
|
|
if (!isActivation(event)) return;
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
handler(event);
|
|
});
|
|
}
|
|
|
|
function syncStorageToggles() {
|
|
const enabled = ns.PrivacyStorage.isProgressStorageEnabled();
|
|
document.querySelectorAll('.progress-storage-toggle').forEach(toggle => {
|
|
toggle.checked = enabled;
|
|
});
|
|
document.querySelectorAll('.cookie-toggle').forEach(toggle => {
|
|
toggle.checked = false;
|
|
});
|
|
}
|
|
|
|
function showMenu() {
|
|
title.textContent = 'Informationen';
|
|
menu.hidden = false;
|
|
backButton.hidden = true;
|
|
document.querySelectorAll('[data-info-page]').forEach(page => {
|
|
page.hidden = true;
|
|
});
|
|
}
|
|
|
|
function showPage(name) {
|
|
const page = document.querySelector(`[data-info-page="${name}"]`);
|
|
if (!page) return;
|
|
|
|
title.textContent = pageTitles[name] ?? 'Informationen';
|
|
menu.hidden = true;
|
|
backButton.hidden = false;
|
|
document.querySelectorAll('[data-info-page]').forEach(item => {
|
|
item.hidden = item !== page;
|
|
});
|
|
const content = document.querySelector('.info-dialog-content');
|
|
if (content) content.scrollTop = 0;
|
|
}
|
|
|
|
function openDialog() {
|
|
if (dialog.open) return;
|
|
showMenu();
|
|
syncStorageToggles();
|
|
if (typeof dialog.showModal === 'function') dialog.showModal();
|
|
else dialog.setAttribute('open', '');
|
|
closeButton.focus();
|
|
}
|
|
|
|
function closeDialog() {
|
|
if (typeof dialog.close === 'function') dialog.close();
|
|
else dialog.removeAttribute('open');
|
|
infoButton.focus();
|
|
}
|
|
|
|
function bindStorageToggles() {
|
|
document.querySelectorAll('.progress-storage-toggle').forEach(toggle => {
|
|
toggle.addEventListener('change', event => {
|
|
const enabled = ns.PrivacyStorage.setProgressStorageEnabled(event.currentTarget.checked);
|
|
syncStorageToggles();
|
|
document.dispatchEvent(new CustomEvent('wegwichtel:progress-storage-changed', {
|
|
detail: { enabled }
|
|
}));
|
|
});
|
|
});
|
|
}
|
|
|
|
activate(infoButton, openDialog);
|
|
activate(closeButton, closeDialog);
|
|
activate(backButton, showMenu);
|
|
document.querySelectorAll('[data-info-target]').forEach(button => {
|
|
activate(button, () => showPage(button.dataset.infoTarget));
|
|
});
|
|
|
|
dialog.addEventListener('pointerup', event => {
|
|
if (event.target !== dialog || !isActivation(event)) return;
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
closeDialog();
|
|
});
|
|
dialog.addEventListener('cancel', event => {
|
|
event.preventDefault();
|
|
closeDialog();
|
|
});
|
|
|
|
bindStorageToggles();
|
|
syncStorageToggles();
|
|
|
|
ns.LegalUi = Object.freeze({ open: openDialog, close: closeDialog, syncStorageToggles });
|
|
}(globalThis.Wegwichtel ??= {}));
|