Vendors HTMX 2.0.4 (the prior file was a 1-line stub) and uses it to poll two new partials on a 2s tick while a job is in flight: - /servers/<id>/actions → state badge, filtered action buttons, last-job sentence, live job log (SSE) while a Start/Stop/Reset job is running. When the job is terminal the partial re-renders without hx-trigger and polling stops. - /overlays/<id>/build-status → build state badge, last-build sentence, live job log while a build_overlay job is running. Same terminal-state stop behavior. Server detail restructure: - Editable name moves out of the page body into a Rename modal triggered from a link next to Delete in the page footer. - Compact dl with Port (linked as steam://run/550//+connect <host>:<port>) and Blueprint. - Actions row: state badge + state-filtered buttons (start/stop, reset) + last-job sentence. Drift warning when desired ≠ actual. - Recent Jobs table removed. Overlay detail restructure: - Single panel, dl Type/Scope, no separate Last build row, no Builds section. - Script form gets two compound submits: "Save and build" and "Save, reset and rebuild". Standalone Rebuild/Wipe gone. - Build status state badge + last-build sentence under the editor; action buttons hide while a build is in flight. - Rename modal in the page footer next to Delete. sse.js binds on htmx:load (covers initial document and post-swap inserts) and closes EventSources on htmx:beforeCleanupElement to avoid leaking streams across swaps. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
64 lines
1.8 KiB
JavaScript
64 lines
1.8 KiB
JavaScript
function streamTextToElement(element) {
|
|
if (element.dataset.sseBound === "true") {
|
|
return;
|
|
}
|
|
const url = element.dataset.sseUrl;
|
|
if (!url) {
|
|
return;
|
|
}
|
|
const source = new EventSource(url);
|
|
element._sseSource = source;
|
|
element.dataset.sseBound = "true";
|
|
|
|
const appendLine = (line) => {
|
|
element.textContent += `${line}\n`;
|
|
element.scrollTop = element.scrollHeight;
|
|
};
|
|
|
|
source.onmessage = (event) => {
|
|
appendLine(event.data);
|
|
};
|
|
|
|
source.addEventListener("stdout", (event) => {
|
|
appendLine(event.data);
|
|
});
|
|
|
|
source.addEventListener("stderr", (event) => {
|
|
appendLine(`[stderr] ${event.data}`);
|
|
});
|
|
}
|
|
|
|
function bindSseIn(root) {
|
|
if (!root) return;
|
|
const scope = root.matches?.("[data-sse-url]") ? [root] : [];
|
|
if (root.querySelectorAll) {
|
|
root.querySelectorAll("[data-sse-url]").forEach((el) => scope.push(el));
|
|
}
|
|
scope.forEach(streamTextToElement);
|
|
}
|
|
|
|
function closeSseIn(root) {
|
|
if (!root) return;
|
|
const scope = root.matches?.("[data-sse-url]") ? [root] : [];
|
|
if (root.querySelectorAll) {
|
|
root.querySelectorAll("[data-sse-url]").forEach((el) => scope.push(el));
|
|
}
|
|
scope.forEach((el) => {
|
|
if (el._sseSource) {
|
|
el._sseSource.close();
|
|
el._sseSource = null;
|
|
delete el.dataset.sseBound;
|
|
}
|
|
});
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", () => bindSseIn(document));
|
|
|
|
// HTMX fires `htmx:load` for the initial document and after every swap, so
|
|
// dynamically inserted log-stream elements get bound. `htmx:beforeCleanupElement`
|
|
// fires for elements about to be removed; close their EventSources first to
|
|
// stop the previous stream and avoid leaking sockets.
|
|
document.addEventListener("htmx:load", (event) => bindSseIn(event.detail.elt));
|
|
document.addEventListener("htmx:beforeCleanupElement", (event) =>
|
|
closeSseIn(event.detail.elt),
|
|
);
|