Project-Name-Here/hydrationhub
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: Project-Name-Here:5cfd8b23193249696da0f2636d1197e28ec30e00
Branches Tags
Project-Name-Here:master
...
compare: Project-Name-Here:c6e441dc26598255f47ccc756de6f2db39caeabe
Branches Tags
Project-Name-Here:master

2 Commits
5cfd8b2319 ... c6e441dc26

Author SHA1 Message Date
Spacelord
c6e441dc26 Refactor navbar to dynamically inject buttons 2025-04-21 21:02:11 +02:00
Spacelord
c89eb37361 Implement kiosk mode functionality and update external link handling in footer and credits 2025-04-21 21:01:43 +02:00
6 changed files with 71 additions and 62 deletions
Expand all files Collapse all files

13
static/js/kiosk_mode.js Normal file
View File

@ -0,0 +1,13 @@
document.addEventListener('DOMContentLoaded', () => {
setTimeout(() => {
// TODO: How to start kiosk mode?
if (true) {
console.info('Kiosk mode -> Disabled all external links');
document.querySelectorAll('a').forEach((link) => {
if (link.classList.contains('external-link')) {
link.style.pointerEvents = 'none';
}
});
}
}, 1000);
});

2
static/js/lockscreenBgHandler.js
View File

@ -79,7 +79,7 @@ function handleImage() {
}, 1000);
// Set the credits
credits.innerHTML = `Photo by <a href="${data.user.links.html}" target="_blank">${data.user.name}</a>`;
credits.innerHTML = `Photo by <a href="${data.user.links.html}" class="external-link" target="_blank">${data.user.name}</a>`;
credits.style.zIndex = 300000;
}
})

1
static/main.css
View File

@ -23,4 +23,5 @@ hidden {
footer {
margin-top: auto;
padding: 1rem !important;
}

5
views/partials/footer.eta
View File

@ -2,10 +2,11 @@
<div class="content has-text-centered">
<p>
<i class="bi bi-cup-straw"></i>
<strong>HydrationHUB</strong> by <a target="_blank" rel="noopener noreferrer" href="https://pnh.fyi">[Project-name-here]</a>.<br>
<strong>HydrationHUB</strong> by <a target="_blank" rel="noopener noreferrer" href="https://pnh.fyi" class="external-link">[Project-name-here]</a>.<br>
Running Version <span data-dataSource="version" data-dataAction="SPECIAL" class="is-skeleton">Load.</span>
</p>
</div>
</footer>
<script src="/static/apiWrapper.js"></script>
<script src="/static/pageDriver.js"></script>
<script src="/static/pageDriver.js"></script>
<script src="/static/js/kiosk_mode.js"></script>

111
views/partials/nav.eta
View File

@ -2,74 +2,67 @@
<div class="navbar-brand">
<a class="navbar-item primary" href="/">
<i class="bi bi-cup-straw"></i>
</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 class="navbar-item primary is-hidden" id="nav_username" href="/">
<strong>Hey, <span id="nav_usernameContent"></span></strong>
</a>
</div>
<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-item" href="/">Screensaver</a>
<a class="navbar-item" href="/user_select">user_select</a>
<a class="navbar-item" href="/product_select">product_select</a>
<a class="navbar-item" href="/test">Test <span class="tag is-info">Dev</span></a>
<!--<div class="navbar-item has-dropdown is-hoverable">
<a class="navbar-link">More</a>
<div class="navbar-dropdown">
<a class="navbar-item">About</a>
<a class="navbar-item is-selected">Jobs</a>
<a class="navbar-item">Contact</a>
<hr class="navbar-divider">
<a class="navbar-item">Report an issue</a>
</div>
</div>-->
<div id="navbarBasicExample" class="navbar-menu is-active">
<div class="navbar-end">
<div class="navbar-item" id="dynamic-navbar-buttons">
<!-- Buttons will be dynamically injected here -->
</div>
</div>
<div class="navbar-end">
<div class="navbar-item is-hidden" id="showOnLogin">
<strong>Hey, <span id="nav_username"></span></strong>
<button class="button" onclick="window.location='/pay_up'" >Zur Abrechnung</button>
</div>
<div class="navbar-item is-hidden" id="onlyShowRoot">
<button class="button" onclick="window.location='/admin/'" >Zur Administration</button>
</div>
<div class="navbar-item is-hidden" id="onlyShowAdmin">
<button class="button" onclick="window.location='/admin/'" >Zur Administration</button>
<button class="button" onclick="window.location='/'" >Abmelden</button>
</div>
</div>
<script>
// Check if ?user is set
if (window.location.search.includes('user')) {
// Show the sign up button
document.querySelector('#showOnLogin').classList.remove('is-hidden');
// Get the username from the cookie
username = document.cookie.split('; ').find(row => row.startsWith('name')).split('=')[1];
// Set the username in the nav
document.getElementById('nav_username').innerText = username;
}
document.addEventListener('DOMContentLoaded', () => {
const navbarButtons = document.getElementById('dynamic-navbar-buttons');
const currentPath = window.location.pathname;
const queryParams = new URLSearchParams(window.location.search);
// Check if /user_select is the current page
if (window.location.pathname == '/user_select') {
// Show the sign up button
document.querySelector('#onlyShowRoot').classList.remove('is-hidden');
}
const buttonsConfig = {
'/user_select': [
{ text: '', icon: 'bi bi-gear', link: '/admin' }
],
'/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 admin is contained in url
if (window.location.pathname.includes('admin')) {
// Show the sign up button
document.querySelector('#onlyShowAdmin').classList.remove('is-hidden');
}
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);
});
});
</script>
</div>
</nav>

1
views/screensaver.eta
View File

@ -13,5 +13,6 @@
<script src="/static/apiWrapper.js"></script>
<script src="/static/pageDriver.js"></script>
<script src="/static/js/lockscreenBgHandler.js"></script>
<script src="/static/js/kiosk_mode.js"></script>
<%~ include("partials/base_foot.eta") %>