This commit is contained in:
2025-11-23 02:32:42 +01:00
parent daad90cea3
commit 9168380c80
2 changed files with 24 additions and 21 deletions

View File

@@ -20,7 +20,6 @@ if (!isset($pageDescription) || !is_string($pageDescription)) {
$pageDescription = ''; $pageDescription = '';
} }
if (function_exists('tpl_add_script')) { if (function_exists('tpl_add_script')) {
tpl_add_script('/assets/js/header-user-menu.js', 'footer', true, false, '', null);
tpl_add_script('/assets/js/header.js', 'footer', true, false, '', null); tpl_add_script('/assets/js/header.js', 'footer', true, false, '', null);
} }

View File

@@ -1,9 +1,8 @@
// public/assets/js/header.js // public/assets/js/header.js
document.addEventListener('DOMContentLoaded', function () { document.addEventListener('DOMContentLoaded', function () {
// ------------------------- // --------------------------------------------------
// Login-Button // LOGIN-BUTTON → /login mit redirect + lang
// ------------------------- // --------------------------------------------------
const loginBtn = document.getElementById('loginButton'); const loginBtn = document.getElementById('loginButton');
if (loginBtn) { if (loginBtn) {
@@ -39,9 +38,9 @@ document.addEventListener('DOMContentLoaded', function () {
}); });
} }
// ------------------------- // --------------------------------------------------
// Avatar-Menü ein-/ausblenden // AVATAR-MENÜ (userAvatar / userMenu)
// ------------------------- // --------------------------------------------------
const avatarBtn = document.getElementById('userAvatar'); const avatarBtn = document.getElementById('userAvatar');
const userMenu = document.getElementById('userMenu'); const userMenu = document.getElementById('userMenu');
@@ -56,7 +55,10 @@ document.addEventListener('DOMContentLoaded', function () {
// Klick außerhalb schließt Menü // Klick außerhalb schließt Menü
document.addEventListener('click', function (event) { document.addEventListener('click', function (event) {
if (!userMenu.classList.contains('hidden')) { if (userMenu.classList.contains('hidden')) {
return;
}
const clickedInsideMenu = userMenu.contains(event.target); const clickedInsideMenu = userMenu.contains(event.target);
const clickedAvatarButton = avatarBtn.contains(event.target); const clickedAvatarButton = avatarBtn.contains(event.target);
@@ -64,13 +66,12 @@ document.addEventListener('DOMContentLoaded', function () {
userMenu.classList.add('hidden'); userMenu.classList.add('hidden');
avatarBtn.setAttribute('aria-expanded', 'false'); avatarBtn.setAttribute('aria-expanded', 'false');
} }
}
}); });
} }
// ------------------------- // --------------------------------------------------
// Logout-Modal // LOGOUT-MODAL
// ------------------------- // --------------------------------------------------
const logoutButtons = document.querySelectorAll('[data-logout-link="true"]'); const logoutButtons = document.querySelectorAll('[data-logout-link="true"]');
const backdrop = document.getElementById('logoutModalBackdrop'); const backdrop = document.getElementById('logoutModalBackdrop');
const btnConfirm = document.getElementById('logoutConfirm'); const btnConfirm = document.getElementById('logoutConfirm');
@@ -99,7 +100,10 @@ document.addEventListener('DOMContentLoaded', function () {
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
const href = btn.getAttribute('data-logout-href') || btn.getAttribute('href') || '/auth/logout'; const href = btn.getAttribute('data-logout-href')
|| btn.getAttribute('href')
|| '/auth/logout';
showLogoutModal(href); showLogoutModal(href);
// Avatar-Menü beim Öffnen des Modals schließen // Avatar-Menü beim Öffnen des Modals schließen
@@ -126,9 +130,9 @@ document.addEventListener('DOMContentLoaded', function () {
hideLogoutModal(); hideLogoutModal();
}); });
// Klick auf Hintergrund schließt Modal // Klick auf Hintergrund schließt Modal (außer man klickt auf die Card)
backdrop.addEventListener('click', function (event) { backdrop.addEventListener('click', function (event) {
const card = backdrop.querySelector('div.w-full.max-w-sm'); const card = backdrop.querySelector('.max-w-sm');
if (card && !card.contains(event.target)) { if (card && !card.contains(event.target)) {
hideLogoutModal(); hideLogoutModal();
} }