MiauRizius/CoasterDB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

save sidebar opening states in session and load these values

Browse Source
This commit is contained in:
Maurice L.
2025-05-07 14:09:39 +02:00
parent 433cb61b07
commit cfeb4de56a
1 changed files with 45 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
src/components/app/AppSidebar.vue
View File

@@ -1,7 +1,5 @@
<script lang="ts"> <script lang="ts">
export default { export default {
components: { components: {
@@ -11,25 +9,59 @@ export default {
window.history.pushState({"html":null,"pageTitle":document.title},"", urlPath); window.history.pushState({"html":null,"pageTitle":document.title},"", urlPath);
} }
document.getElementById("help")?.addEventListener("click", () => { function toggleDropdown(buttonId: string, dropdownId: string, storageKey: string) {
processAjaxData("/app/help") const button = document.getElementById(buttonId);
}); const dropdown = document.getElementById(dropdownId);
const current = dropdown?.classList.contains('hidden');
document.getElementById("docs")?.addEventListener("click", () => { if (current) {
processAjaxData("/app/docs") dropdown?.classList.remove('hidden');
}); button?.setAttribute('aria-expanded', 'true');
sessionStorage.setItem(storageKey, 'true');
} else {
dropdown?.classList.add('hidden');
button?.setAttribute('aria-expanded', 'false');
sessionStorage.setItem(storageKey, 'false');
}
}
//Cats function restoreDropdownState(buttonId: string, dropdownId: string, storageKey: string) {
document.getElementById('dropdown-pages-button')?.addEventListener('click', () => { const button = document.getElementById(buttonId);
const button = document.getElementById('dropdown-pages-button'); const dropdown = document.getElementById(dropdownId);
const dropdown = document.getElementById("dropdown-pages"); const savedState = sessionStorage.getItem(storageKey);
if (dropdown?.classList.contains('hidden')) { if (savedState === 'true') {
dropdown?.classList.remove('hidden'); dropdown?.classList.remove('hidden');
button?.setAttribute('aria-expanded', 'true'); button?.setAttribute('aria-expanded', 'true');
} else { } else {
dropdown?.classList.add('hidden'); dropdown?.classList.add('hidden');
button?.setAttribute('aria-expanded', 'false'); button?.setAttribute('aria-expanded', 'false');
} }
}
// Reiterzustand wiederherstellen
restoreDropdownState('dropdown-pages-button', 'dropdown-pages', 'dropdown-pages-open');
restoreDropdownState('dropdown-sales-button', 'dropdown-sales', 'dropdown-sales-open');
restoreDropdownState('dropdown-authentication-button', 'dropdown-authentication', 'dropdown-authentication-open');
// Reiter-Click-Handler
document.getElementById('dropdown-pages-button')?.addEventListener('click', () => {
toggleDropdown('dropdown-pages-button', 'dropdown-pages', 'dropdown-pages-open');
});
document.getElementById('dropdown-sales-button')?.addEventListener('click', () => {
toggleDropdown('dropdown-sales-button', 'dropdown-sales', 'dropdown-sales-open');
});
document.getElementById('dropdown-authentication-button')?.addEventListener('click', () => {
toggleDropdown('dropdown-authentication-button', 'dropdown-authentication', 'dropdown-authentication-open');
});
// Navigation
document.getElementById("help")?.addEventListener("click", () => {
processAjaxData("/app/help")
});
document.getElementById("docs")?.addEventListener("click", () => {
processAjaxData("/app/docs")
}); });
document.getElementById("parks-side")?.addEventListener("click", () => { document.getElementById("parks-side")?.addEventListener("click", () => {
processAjaxData("/app/parks") processAjaxData("/app/parks")
@@ -37,38 +69,6 @@ export default {
document.getElementById("attractions-side")?.addEventListener("click", () => { document.getElementById("attractions-side")?.addEventListener("click", () => {
processAjaxData("/app/attractions") processAjaxData("/app/attractions")
}); });
//database
document.getElementById('dropdown-sales-button')?.addEventListener('click', () => {
const button = document.getElementById('dropdown-sales-button');
const dropdown = document.getElementById("dropdown-sales");
if (dropdown?.classList.contains('hidden')) {
dropdown?.classList.remove('hidden');
button?.setAttribute('aria-expanded', 'true');
} else {
dropdown?.classList.add('hidden');
button?.setAttribute('aria-expanded', 'false');
}
});
document.getElementById("stats-page")?.addEventListener("click", () => {
processAjaxData("/database/statistics")
});
document.getElementById("techstats-page")?.addEventListener("click", () => {
processAjaxData("/database/technical-information")
});
//last thing (outcommented)
document.getElementById('dropdown-authentication-button')?.addEventListener('click', () => {
const button = document.getElementById('dropdown-authentication-button');
const dropdown = document.getElementById("dropdown-authentication");
if (dropdown?.classList.contains('hidden')) {
dropdown?.classList.remove('hidden');
button?.setAttribute('aria-expanded', 'true');
} else {
dropdown?.classList.add('hidden');
button?.setAttribute('aria-expanded', 'false');
}
});
} }
} }