327 lines
10 KiB
JavaScript
Executable File
327 lines
10 KiB
JavaScript
Executable File
(() => {
|
||
const layout = document.querySelector('.layout-body');
|
||
if (!layout) return;
|
||
|
||
const enabled = layout.dataset.sidebarEnabled === '1';
|
||
const collapsible = layout.dataset.sidebarCollapsible === '1';
|
||
const defaultState = layout.dataset.sidebarDefault || 'collapsed';
|
||
|
||
const toggles = document.querySelectorAll('[data-sidebar-toggle]');
|
||
if (!enabled || !collapsible) {
|
||
toggles.forEach((t) => t.remove());
|
||
return;
|
||
}
|
||
|
||
const saved = localStorage.getItem('sidebar-state');
|
||
const initial = saved || defaultState;
|
||
if (initial === 'open') {
|
||
layout.classList.add('sidebar-open');
|
||
} else {
|
||
layout.classList.remove('sidebar-open');
|
||
}
|
||
|
||
toggles.forEach((toggle) => {
|
||
toggle.addEventListener('click', () => {
|
||
layout.classList.toggle('sidebar-open');
|
||
localStorage.setItem('sidebar-state', layout.classList.contains('sidebar-open') ? 'open' : 'collapsed');
|
||
});
|
||
});
|
||
})();
|
||
|
||
(() => {
|
||
const openBtn = document.querySelector('[data-debug-open]');
|
||
const modal = document.getElementById('debug-modal');
|
||
if (!openBtn || !modal) return;
|
||
|
||
const listEl = document.getElementById('debug-log-list');
|
||
const contentEl = document.getElementById('debug-log-content');
|
||
const closeEls = modal.querySelectorAll('[data-debug-close]');
|
||
|
||
const open = () => {
|
||
modal.classList.add('is-open');
|
||
modal.setAttribute('aria-hidden', 'false');
|
||
loadList();
|
||
startRefresh();
|
||
};
|
||
const close = () => {
|
||
modal.classList.remove('is-open');
|
||
modal.setAttribute('aria-hidden', 'true');
|
||
if (refreshTimer) {
|
||
clearInterval(refreshTimer);
|
||
refreshTimer = null;
|
||
}
|
||
};
|
||
|
||
let activeFile = null;
|
||
let refreshTimer = null;
|
||
|
||
const loadList = async () => {
|
||
try {
|
||
const res = await fetch('/debug?list=1', { cache: 'no-store' });
|
||
if (!res.ok) {
|
||
listEl.innerHTML = `<li class=\"muted\">Fehler: ${res.status}</li>`;
|
||
return;
|
||
}
|
||
const files = await res.json();
|
||
listEl.innerHTML = '';
|
||
files.forEach((f) => {
|
||
const a = document.createElement('a');
|
||
a.href = '#';
|
||
a.textContent = f;
|
||
a.addEventListener('click', (e) => {
|
||
e.preventDefault();
|
||
loadFile(f);
|
||
});
|
||
const li = document.createElement('li');
|
||
li.appendChild(a);
|
||
listEl.appendChild(li);
|
||
});
|
||
if (files.includes('oidc_login.log')) {
|
||
loadFile('oidc_login.log');
|
||
}
|
||
} catch (e) {
|
||
listEl.innerHTML = '<li class=\"muted\">Fehler beim Laden der Logs.</li>';
|
||
}
|
||
};
|
||
|
||
const loadFile = async (name) => {
|
||
activeFile = name;
|
||
try {
|
||
const res = await fetch(`/debug?raw=1&file=${encodeURIComponent(name)}&tail=200`, { cache: 'no-store' });
|
||
if (!res.ok) {
|
||
contentEl.textContent = `Fehler: ${res.status}`;
|
||
return;
|
||
}
|
||
const text = await res.text();
|
||
contentEl.textContent = formatLog(text);
|
||
} catch (e) {
|
||
contentEl.textContent = 'Fehler beim Laden der Datei.';
|
||
}
|
||
};
|
||
|
||
const formatLog = (text) => {
|
||
const lines = text.split(/\\r?\\n/).filter(Boolean);
|
||
const pretty = lines.map((line) => {
|
||
try {
|
||
const obj = JSON.parse(line);
|
||
return JSON.stringify(obj, null, 2);
|
||
} catch (e) {
|
||
return line;
|
||
}
|
||
});
|
||
return pretty.join('\\n\\n');
|
||
};
|
||
|
||
const startRefresh = () => {
|
||
if (refreshTimer) clearInterval(refreshTimer);
|
||
refreshTimer = setInterval(() => {
|
||
if (activeFile) loadFile(activeFile);
|
||
}, 3000);
|
||
};
|
||
|
||
openBtn.addEventListener('click', open);
|
||
closeEls.forEach((el) => el.addEventListener('click', close));
|
||
if (modal.classList.contains('is-open')) {
|
||
startRefresh();
|
||
}
|
||
})();
|
||
|
||
(() => {
|
||
const tabBar = document.querySelector('[data-console-tab-bar]');
|
||
const tabPanels = document.querySelector('[data-console-tab-panels]');
|
||
if (!tabBar || !tabPanels) return;
|
||
|
||
let tabCount = 0;
|
||
const idleMs = 5 * 60 * 1000;
|
||
const idleTimers = new Map();
|
||
|
||
const activateTab = (id) => {
|
||
tabBar.querySelectorAll('.console-tab').forEach((btn) => {
|
||
btn.classList.toggle('is-active', btn.dataset.tabId === id);
|
||
});
|
||
tabPanels.querySelectorAll('.console-panel').forEach((panel) => {
|
||
panel.classList.toggle('is-active', panel.dataset.tabId === id);
|
||
});
|
||
};
|
||
|
||
const openTab = (label, url) => {
|
||
const id = `tab-${++tabCount}`;
|
||
const btn = document.createElement('button');
|
||
btn.type = 'button';
|
||
btn.className = 'console-tab';
|
||
btn.textContent = label || 'Konsole';
|
||
btn.dataset.tabId = id;
|
||
btn.addEventListener('click', () => activateTab(id));
|
||
|
||
const closeBtn = document.createElement('span');
|
||
closeBtn.className = 'console-tab-close';
|
||
closeBtn.textContent = '×';
|
||
closeBtn.addEventListener('click', (e) => {
|
||
e.stopPropagation();
|
||
const panel = tabPanels.querySelector(`.console-panel[data-tab-id="${id}"]`);
|
||
if (panel) panel.remove();
|
||
btn.remove();
|
||
idleTimers.delete(id);
|
||
const next = tabBar.querySelector('.console-tab');
|
||
if (next) activateTab(next.dataset.tabId);
|
||
});
|
||
btn.appendChild(closeBtn);
|
||
|
||
const panel = document.createElement('div');
|
||
panel.className = 'console-panel';
|
||
panel.dataset.tabId = id;
|
||
panel.innerHTML = `<iframe src="${url}" title="${label || 'Konsole'}"></iframe>`;
|
||
|
||
tabBar.appendChild(btn);
|
||
tabPanels.appendChild(panel);
|
||
activateTab(id);
|
||
|
||
const iframe = panel.querySelector('iframe');
|
||
const markActive = () => {
|
||
idleTimers.set(id, Date.now());
|
||
};
|
||
idleTimers.set(id, Date.now());
|
||
|
||
iframe.addEventListener('load', () => {
|
||
try {
|
||
const doc = iframe.contentWindow.document;
|
||
['keydown', 'mousedown', 'wheel', 'touchstart'].forEach((evt) => {
|
||
doc.addEventListener(evt, markActive, { passive: true });
|
||
});
|
||
const observer = new MutationObserver(markActive);
|
||
observer.observe(doc.body, { childList: true, subtree: true, characterData: true });
|
||
} catch (e) {
|
||
// cross-origin or blocked; rely on timer only
|
||
}
|
||
});
|
||
|
||
const idleCheck = setInterval(() => {
|
||
const last = idleTimers.get(id) || 0;
|
||
if (Date.now() - last > idleMs) {
|
||
const panelEl = tabPanels.querySelector(`.console-panel[data-tab-id="${id}"]`);
|
||
const btnEl = tabBar.querySelector(`.console-tab[data-tab-id="${id}"]`);
|
||
if (panelEl) panelEl.remove();
|
||
if (btnEl) btnEl.remove();
|
||
idleTimers.delete(id);
|
||
clearInterval(idleCheck);
|
||
const next = tabBar.querySelector('.console-tab');
|
||
if (next) activateTab(next.dataset.tabId);
|
||
}
|
||
}, 10000);
|
||
};
|
||
|
||
document.querySelectorAll('.console-launch').forEach((el) => {
|
||
const url = el.dataset.url;
|
||
const host = el.dataset.host || 'Konsole';
|
||
if (url) {
|
||
openTab(host, url);
|
||
}
|
||
el.remove();
|
||
});
|
||
|
||
const queueBody = document.querySelector('[data-queue-body]');
|
||
const countdownEl = document.querySelector('[data-queue-countdown]');
|
||
const refreshBtn = document.querySelector('[data-queue-refresh]');
|
||
if (!queueBody || !countdownEl) return;
|
||
|
||
let remaining = 10;
|
||
let timer = null;
|
||
|
||
const fetchQueue = async () => {
|
||
const url = new URL(window.location.href);
|
||
url.searchParams.set('queue_json', '1');
|
||
try {
|
||
const res = await fetch(url.toString(), { cache: 'no-store' });
|
||
if (!res.ok) return;
|
||
const data = await res.json();
|
||
if (data && data.html) {
|
||
queueBody.innerHTML = data.html;
|
||
}
|
||
remaining = data && data.next ? data.next : 10;
|
||
} catch (e) {
|
||
// ignore
|
||
}
|
||
};
|
||
|
||
const tick = () => {
|
||
remaining -= 1;
|
||
if (remaining <= 0) {
|
||
fetchQueue();
|
||
remaining = 10;
|
||
}
|
||
countdownEl.textContent = String(remaining);
|
||
};
|
||
|
||
timer = setInterval(tick, 1000);
|
||
if (refreshBtn) {
|
||
refreshBtn.addEventListener('click', () => {
|
||
fetchQueue();
|
||
remaining = 10;
|
||
countdownEl.textContent = String(remaining);
|
||
});
|
||
}
|
||
|
||
const consoleForm = document.querySelector('[data-console-form]');
|
||
const consoleError = document.querySelector('[data-console-error]');
|
||
const consoleNotice = document.querySelector('[data-console-notice]');
|
||
const tokenEl = document.querySelector('[data-console-token]');
|
||
if (consoleForm) {
|
||
const submitOpen = async () => {
|
||
const formData = new FormData(consoleForm);
|
||
const url = new URL(window.location.href);
|
||
url.searchParams.set('open_console_json', '1');
|
||
const res = await fetch(url.toString(), { method: 'POST', body: formData, cache: 'no-store' });
|
||
const data = await res.json();
|
||
if (!data.ok) {
|
||
if (consoleError) {
|
||
consoleError.textContent = data.error || 'Fehler beim Öffnen der Konsole.';
|
||
consoleError.style.display = 'block';
|
||
}
|
||
return;
|
||
}
|
||
if (consoleError) consoleError.style.display = 'none';
|
||
if (consoleNotice) consoleNotice.style.display = 'none';
|
||
if (tokenEl) tokenEl.textContent = data.token || '';
|
||
if (data.url) openTab(data.host || 'Konsole', data.url);
|
||
};
|
||
|
||
const submitRun = async () => {
|
||
const formData = new FormData(consoleForm);
|
||
const url = new URL(window.location.href);
|
||
url.searchParams.set('run_command_json', '1');
|
||
const res = await fetch(url.toString(), { method: 'POST', body: formData, cache: 'no-store' });
|
||
const data = await res.json();
|
||
if (!data.ok) {
|
||
if (consoleError) {
|
||
consoleError.textContent = data.error || 'Fehler beim Ausführen.';
|
||
consoleError.style.display = 'block';
|
||
}
|
||
return;
|
||
}
|
||
if (consoleError) consoleError.style.display = 'none';
|
||
if (consoleNotice) {
|
||
consoleNotice.textContent = data.notice || '';
|
||
consoleNotice.style.display = 'block';
|
||
}
|
||
fetchQueue();
|
||
remaining = 10;
|
||
countdownEl.textContent = String(remaining);
|
||
};
|
||
|
||
const openBtn = consoleForm.querySelector('[data-open-console]');
|
||
const runBtn = consoleForm.querySelector('[data-run-command]');
|
||
if (openBtn) {
|
||
openBtn.addEventListener('click', (e) => {
|
||
e.preventDefault();
|
||
submitOpen();
|
||
});
|
||
}
|
||
if (runBtn) {
|
||
runBtn.addEventListener('click', (e) => {
|
||
e.preventDefault();
|
||
submitRun();
|
||
});
|
||
}
|
||
}
|
||
})();
|