88 lines
2.9 KiB
Plaintext
88 lines
2.9 KiB
Plaintext
<nav class="navbar" role="navigation" aria-label="main navigation">
|
|
<div class="navbar-brand">
|
|
<a class="navbar-item primary" href="/">
|
|
<i class="bi bi-cup-straw"></i>
|
|
</a>
|
|
<a class="navbar-item primary is-hidden" id="nav_username" href="/">
|
|
<strong>Hey, <span id="nav_usernameContent"></span></strong>
|
|
</a>
|
|
|
|
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
|
|
<span aria-hidden="true"></span>
|
|
<span aria-hidden="true"></span>
|
|
<span aria-hidden="true"></span>
|
|
<span aria-hidden="true"></span>
|
|
</a>
|
|
</div>
|
|
|
|
<div id="navbarBasicExample" class="navbar-menu">
|
|
<div class="navbar-end">
|
|
<div class="navbar-item" id="dynamic-navbar-buttons">
|
|
<!-- Buttons will be dynamically injected here -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const navbarButtons = document.getElementById('dynamic-navbar-buttons');
|
|
const currentPath = window.location.pathname;
|
|
const queryParams = new URLSearchParams(window.location.search);
|
|
|
|
const buttonsConfig = {
|
|
'/user_select': [
|
|
{ text: '', icon: 'bi bi-gear', link: '/admin' },
|
|
{ text: '', icon: 'bi bi-house', link: '/user_select' }
|
|
],
|
|
'/product_select': [
|
|
{ text: 'Zur Abrechnung', link: '/pay_up' },
|
|
{ text: '', icon: 'bi bi-gear', link: '/admin' },
|
|
{ text: '', icon: 'bi bi-box-arrow-right', link: '/user_select' }
|
|
],
|
|
'/pay_up': [
|
|
{ text: '', icon: 'bi bi-gear', link: '/admin' },
|
|
{ text: '', icon: 'bi bi-box-arrow-right', link: '/user_select' }
|
|
],
|
|
'/admin': [
|
|
{ text: '', icon: 'bi bi-gear', link: '/admin' },
|
|
{ text: '', icon: 'bi bi-house', link: '/user_select' }
|
|
]
|
|
};
|
|
|
|
if (currentPath === '/product_select' && queryParams.has('user')) {
|
|
const username = document.cookie.split('; ').find(row => row.startsWith('name'))?.split('=')[1];
|
|
if (username) {
|
|
document.getElementById('nav_usernameContent').innerText = username; // Set greeting
|
|
document.getElementById('nav_username').classList.remove('is-hidden'); // Show greeting
|
|
}
|
|
}
|
|
|
|
const buttons = buttonsConfig[currentPath] || [];
|
|
buttons.forEach(button => {
|
|
const btn = document.createElement('button');
|
|
btn.className = 'button';
|
|
btn.onclick = () => window.location = button.link;
|
|
if (button.icon) {
|
|
const icon = document.createElement('i');
|
|
icon.className = button.icon;
|
|
btn.appendChild(icon);
|
|
}
|
|
if (button.text) {
|
|
btn.appendChild(document.createTextNode(button.text));
|
|
}
|
|
navbarButtons.appendChild(btn);
|
|
});
|
|
|
|
// Burger menu toggle
|
|
const burger = document.querySelector('.navbar-burger');
|
|
const menu = document.querySelector('.navbar-menu');
|
|
|
|
if (burger && menu) {
|
|
burger.addEventListener('click', () => {
|
|
burger.classList.toggle('is-active');
|
|
menu.classList.toggle('is-active');
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
</nav>
|