prepare intranet for first Dokploy deployment
This commit is contained in:
@@ -0,0 +1,199 @@
|
||||
////==========================================//
|
||||
//// GLOBALER BEREICH //
|
||||
////////////////////////////////////////////////
|
||||
//// Globale Konstanten
|
||||
const url = new URL(window.location.href);
|
||||
const basisUrl = url.origin + url.pathname;
|
||||
////
|
||||
////////////////////////////////////////////////
|
||||
////==========================================//
|
||||
|
||||
|
||||
|
||||
////==========================================//
|
||||
//// FUNKTIONEN und LISTENER //
|
||||
////////////////////////////////////////////////
|
||||
////
|
||||
|
||||
// Position der Elemente – min-height wird jetzt vollständig per CSS gelöst (nak-design.css)
|
||||
// Die alte JS-Berechnung wurde entfernt, da sie nach dem Laden die Höhe reduzierte.
|
||||
|
||||
|
||||
// JavaScript zum Erkennen der Scroll-Richtung und zum Umschalten der Klasse
|
||||
// Funktioniert sowohl bei Body-Scroll als auch bei internem Container-Scroll (z.B. eventbox_table)
|
||||
var lastScrollTop = 0;
|
||||
var lastContainerScrollTop = 0;
|
||||
|
||||
function handleHeaderScroll(scrollTop, lastScroll) {
|
||||
const elemHeaderMenue = document.getElementById('header_menue');
|
||||
const elemHeaderTitle = document.getElementById('header_title');
|
||||
|
||||
// Dynamische Höhe aus CSS-Variable lesen
|
||||
const headerHeight = parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--header-height')) || 64;
|
||||
|
||||
// Kein Einfahren, wenn der Content auf die Seite passt (kein Scrollen nötig)
|
||||
if (document.documentElement.scrollHeight <= window.innerHeight) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Am unteren Ende der Seite: Header wieder einblenden
|
||||
const atBottom = (window.innerHeight + window.scrollY) >= (document.documentElement.scrollHeight - 5);
|
||||
|
||||
if (scrollTop > lastScroll && !atBottom) {
|
||||
// Menü raus bei Scroll nach unten
|
||||
if (elemHeaderMenue) {
|
||||
elemHeaderMenue.style.top = `-${headerHeight}px`;
|
||||
elemHeaderMenue.style.transition = "top 0.3s ease-in-out";
|
||||
}
|
||||
if (elemHeaderTitle) {
|
||||
elemHeaderTitle.style.top = "0";
|
||||
elemHeaderTitle.style.transition = "top 0.3s ease-in-out";
|
||||
}
|
||||
} else {
|
||||
// Menü wieder rein bei Scroll nach oben
|
||||
if (elemHeaderMenue) {
|
||||
elemHeaderMenue.style.top = "0";
|
||||
elemHeaderMenue.style.transition = "top 0.3s ease-in-out";
|
||||
}
|
||||
if (elemHeaderTitle) {
|
||||
elemHeaderTitle.style.top = `${headerHeight}px`;
|
||||
elemHeaderTitle.style.transition = "top 0.3s ease-in-out";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Body/Document Scroll
|
||||
document.addEventListener("scroll", function() {
|
||||
var st = window.scrollY || document.documentElement.scrollTop;
|
||||
handleHeaderScroll(st, lastScrollTop);
|
||||
lastScrollTop = st <= 0 ? 0 : st;
|
||||
}, false);
|
||||
|
||||
// Auch bei internem Container-Scroll (eventbox_table, display_within_dev)
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
const scrollContainers = document.querySelectorAll('.eventbox_table, form.display_within_dev');
|
||||
scrollContainers.forEach(function(container) {
|
||||
var lastCST = 0;
|
||||
container.addEventListener("scroll", function() {
|
||||
var st = container.scrollTop;
|
||||
handleHeaderScroll(st, lastCST);
|
||||
lastCST = st <= 0 ? 0 : st;
|
||||
}, false);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function openCloseHeaderProfile() {
|
||||
if (window.innerWidth >= 769) {
|
||||
// Desktop: click on profile image goes to profile page
|
||||
window.location.href = '/intranet_repo/projects/intranet/profile.php';
|
||||
} else {
|
||||
// Mobile: toggle expand/collapse
|
||||
const hpElem = document.getElementById('header_profile');
|
||||
hpElem.classList.toggle('header_profile_slideLeft');
|
||||
}
|
||||
}
|
||||
|
||||
function openCloseOverlay(id) {
|
||||
//Overlay ein-/ausblenden - beim Ausblenden zurück auf eigene Seite
|
||||
const elem = document.getElementById(id);
|
||||
|
||||
if (elem.style.display === "flex") {
|
||||
elem.style.display = "none";
|
||||
} else {
|
||||
elem.style.display = "flex";
|
||||
}
|
||||
}
|
||||
|
||||
function openCloseProfile(id, name, overlay) {
|
||||
// Profil per Klick öffnen/schließen, alle anderen immer schließen
|
||||
|
||||
const profiles = document.getElementsByName(name); //Ausgewählter Profilbereich (visit, calendar, ...)
|
||||
const oProfile = document.getElementById(overlay); //Ausgewähltes Overlay
|
||||
const aProfile = document.getElementById(id); //Ausgewähltes Profil
|
||||
const aId = (id > 0) ? aProfile.id : 0; //Ausweichen, wenn kein Profil gewählt
|
||||
|
||||
console.log('id:' + id);
|
||||
console.log('overlay:' + overlay);
|
||||
console.log('name:' + name);
|
||||
|
||||
if (oProfile.style.display === "flex") { //Overlay ein-/ausblenden
|
||||
oProfile.style.display = "none";
|
||||
} else {
|
||||
oProfile.style.display = "flex";
|
||||
//TODO: folgender ScrollTop greift nicht, WARUM?
|
||||
//oProfile.scrollTop = 0; //Hinscrollen zum Beginn des Overlays, vor allem bei @Media
|
||||
}
|
||||
|
||||
for (let i = 0; i < profiles.length; i++) {
|
||||
|
||||
const cProfile = profiles[i]; //Aktuelles Profil (Style: profile_container)
|
||||
|
||||
if (cProfile.id === aId && cProfile.style.display !== "block") {
|
||||
profiles[i].style.display = "block";
|
||||
} else {
|
||||
profiles[i].style.display = "none";
|
||||
}
|
||||
}
|
||||
document.activeElement.blur(); //Fokus entfernen
|
||||
|
||||
// TEST console.log(id);
|
||||
}
|
||||
|
||||
|
||||
|
||||
function mix(content) { //wird aktuell nicht eingesetzt, Daten werden per SQL randomized
|
||||
const list = document.getElementById(content);
|
||||
const items = Array.from(list.children);
|
||||
console.log('Vor dem Mischen:', items.map(item => item.textContent || item.innerText));
|
||||
|
||||
for (let i = items.length - 1; i > 0; i--) {
|
||||
const j = Math.floor(Math.random() * (i + 1));
|
||||
[items[i], items[j]] = [items[j], items[i]];
|
||||
}
|
||||
|
||||
console.log('Nach dem Mischen:', items.map(item => item.textContent || item.innerText));
|
||||
items.forEach(item => list.appendChild(item));
|
||||
}
|
||||
|
||||
|
||||
function showHideText(element) {
|
||||
element.classList.toggle("open");
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Per Taste Overlay verlassen
|
||||
document.addEventListener('keydown', function(event) {
|
||||
const profileVisitOverlay = document.getElementById('profile_visit_overlay');
|
||||
const profileCalendarOverlay = document.getElementById('profile_calendar_overlay');
|
||||
const addNewUser = document.getElementById('addNewUser');
|
||||
const showMessage = document.getElementById('showMessage');
|
||||
|
||||
if (event.key === 'Escape') {
|
||||
if (profileVisitOverlay && profileVisitOverlay.style.display === 'flex') {
|
||||
openCloseProfile(0, 'profile_visit', 'profile_visit_overlay');
|
||||
}
|
||||
if (profileCalendarOverlay && profileCalendarOverlay.style.display === 'flex') {
|
||||
openCloseProfile(0, 'profile_calendar', 'profile_calendar_overlay');
|
||||
}
|
||||
if (addNewUser && addNewUser.style.display === 'flex') {
|
||||
openCloseOverlay('addNewUser');
|
||||
}
|
||||
} else if (event.key === 'Enter' || event.key === 'Return' || event.key === " ") {
|
||||
if (showMessage && showMessage.style.display === 'flex') {
|
||||
openCloseOverlay('showMessage'); // ausblenden
|
||||
window.location.href=basisUrl; // zur aktuellen Seite zurückkehren
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Fokus auf passendes Element beim Laden der Intranet-Seiten
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
document.querySelector("#admintable tr[tabindex='0']")?.focus(); // Adminpanel
|
||||
document.querySelector("#visittable tr[tabindex='0']")?.focus(); // Besuchsstellen
|
||||
});
|
||||
Reference in New Issue
Block a user