[deploy]

public/ts-build/ui/navigation.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderSidebar = renderSidebar;
+exports.initNavigation = initNavigation;
+const store_js_1 = require("../state/store.js");
+const defaultNav = [
+    { id: 'overview', label: 'Uebersicht', icon: '[*]' },
+    { id: 'tickets', label: 'Ticketsystem', icon: '[*]' },
+    { id: 'modules', label: 'Module', icon: '[*]' },
+    { id: 'settings', label: 'Einstellungen', icon: '[*]' },
+    { id: 'events', label: 'Events', icon: '[*]' },
+    { id: 'admin', label: 'Admin', icon: '[*]', requiresAdmin: true }
+];
+function renderSidebar(container, isAdmin) {
+    container.innerHTML = '';
+    const brand = document.createElement('div');
+    brand.className = 'brand';
+    brand.textContent = 'Papo Control';
+    const nav = document.createElement('div');
+    nav.className = 'nav';
+    defaultNav.forEach((item) => {
+        if (item.requiresAdmin && !isAdmin)
+            return;
+        const a = document.createElement('a');
+        a.href = `#${item.id}`;
+        a.dataset.target = item.id;
+        a.innerHTML = `<span class="icon">${item.icon || ''}</span>${item.label}`;
+        nav.appendChild(a);
+    });
+    container.appendChild(brand);
+    container.appendChild(nav);
+}
+function initNavigation(onChange) {
+    const navLinks = Array.from(document.querySelectorAll('.nav a'));
+    const activate = (section) => {
+        navLinks.forEach((link) => link.classList.toggle('active', link.dataset.target === section));
+        document.querySelectorAll('.section').forEach((sec) => {
+            sec.classList.toggle('active', sec.id === `section-${section}`);
+        });
+        (0, store_js_1.setState)({}); // trigger listeners for potential observers
+        onChange(section);
+    };
+    navLinks.forEach((link) => {
+        link.addEventListener('click', (e) => {
+            e.preventDefault();
+            const target = link.dataset.target || 'overview';
+            history.replaceState(null, '', `#${target}`);
+            activate(target);
+        });
+    });
+    const initial = (location.hash || '#overview').replace('#', '');
+    activate(initial);
+    window.addEventListener('hashchange', () => {
+        const section = (location.hash || '#overview').replace('#', '');
+        activate(section);
+    });
+}