some webUI fixes
This commit is contained in:
Ayzen
@@ -15,6 +15,12 @@ const btnStop = document.getElementById("btn-stop");
|
||||
const btnTmpRef = document.getElementById("btn-tmp-ref");
|
||||
const btnApply = document.getElementById("btn-apply");
|
||||
const btnResetHistory = document.getElementById("btn-reset-history");
|
||||
const btnLoadConfig = document.getElementById("btn-load-config");
|
||||
const configSelect = document.getElementById("config-select");
|
||||
const configActiveEl = document.getElementById("config-active");
|
||||
const savePathInput = document.getElementById("save-path");
|
||||
const saveNameInput = document.getElementById("save-name");
|
||||
const btnSaveDataset = document.getElementById("btn-save-dataset");
|
||||
|
||||
const settingsToggle = document.getElementById("settings-toggle");
|
||||
const sidePanel = document.querySelector(".side-panel");
|
||||
@@ -24,12 +30,15 @@ const settingsNote = document.getElementById("settings-note");
|
||||
const runningEl = document.getElementById("stat-running");
|
||||
const processorEl = document.getElementById("stat-processor");
|
||||
const ringEl = document.getElementById("stat-ring");
|
||||
const scansEl = document.getElementById("stat-scans");
|
||||
const staleEl = document.getElementById("stat-stale");
|
||||
const toastEl = document.getElementById("toast");
|
||||
|
||||
/* ---- state ------------------------------------------------------- */
|
||||
let pendingPng = null; // newest PNG (base64), shown on the next animation frame
|
||||
let lastFrameTs = 0; // performance.now() of the last received frame
|
||||
let pendingPng = null; // newest PNG (base64), shown on the next animation frame
|
||||
let lastFrameTs = 0; // performance.now() of the last received frame
|
||||
let pipelineRunning = false; // gates the config loader (loading requires a stopped pipeline)
|
||||
let saveFieldsPrefilled = false; // seed the save path/name fields once, then leave the operator's edits
|
||||
|
||||
/* ---- helpers ----------------------------------------------------- */
|
||||
function toast(message, isError) {
|
||||
@@ -245,6 +254,63 @@ async function loadSettings() {
|
||||
}
|
||||
}
|
||||
|
||||
/* ---- config profile --------------------------------------------- */
|
||||
// Loading a config does exactly what the desktop "Load Config" button does. The file
|
||||
// list comes from the server's run_configs/ directory (the browser has no file access),
|
||||
// and loading is gated to a stopped pipeline — mirroring the desktop precondition.
|
||||
function updateLoadButtonState() {
|
||||
btnLoadConfig.disabled = pipelineRunning || configSelect.options.length === 0;
|
||||
}
|
||||
|
||||
async function loadConfigList() {
|
||||
try {
|
||||
const { names = [] } = await api("/api/configs");
|
||||
const previous = configSelect.value;
|
||||
configSelect.innerHTML = "";
|
||||
for (const name of names) {
|
||||
const opt = document.createElement("option");
|
||||
opt.value = name;
|
||||
opt.textContent = name;
|
||||
configSelect.appendChild(opt);
|
||||
}
|
||||
if (names.includes(previous)) configSelect.value = previous; // keep the operator's choice
|
||||
updateLoadButtonState();
|
||||
} catch (err) {
|
||||
toast("Could not load config list: " + err.message, true);
|
||||
}
|
||||
}
|
||||
|
||||
btnLoadConfig.addEventListener("click", async () => {
|
||||
const name = configSelect.value;
|
||||
if (!name) return;
|
||||
btnLoadConfig.disabled = true;
|
||||
try {
|
||||
await api("/api/load_config", { name });
|
||||
toast(`Config loaded: ${name}`); // the new settings schema arrives via the live status push
|
||||
} catch (err) {
|
||||
toast(err.message, true);
|
||||
} finally {
|
||||
updateLoadButtonState();
|
||||
}
|
||||
});
|
||||
|
||||
/* ---- save dataset ----------------------------------------------- */
|
||||
// Saves to the path in the field, mirroring the desktop "Save Dataset" button exactly.
|
||||
btnSaveDataset.addEventListener("click", async () => {
|
||||
btnSaveDataset.disabled = true;
|
||||
try {
|
||||
await api("/api/save_dataset", {
|
||||
path: savePathInput.value.trim(),
|
||||
name: saveNameInput.value.trim(),
|
||||
});
|
||||
toast("Save requested"); // a radar-config prefix is prepended to the name server-side
|
||||
} catch (err) {
|
||||
toast(err.message, true);
|
||||
} finally {
|
||||
btnSaveDataset.disabled = false;
|
||||
}
|
||||
});
|
||||
|
||||
/* ---- status ------------------------------------------------------ */
|
||||
function setStat(el, label, value, cls) {
|
||||
el.className = "stat" + (cls ? " " + cls : "");
|
||||
@@ -253,13 +319,26 @@ function setStat(el, label, value, cls) {
|
||||
}
|
||||
|
||||
function applyStatus(s) {
|
||||
if ("running" in s)
|
||||
if ("running" in s) {
|
||||
setStat(runningEl, "running", s.running ? "yes" : "no", s.running ? "ok" : "off");
|
||||
pipelineRunning = !!s.running;
|
||||
updateLoadButtonState();
|
||||
}
|
||||
if ("active_config" in s)
|
||||
configActiveEl.textContent = s.active_config ? `current: ${s.active_config}` : "";
|
||||
if ("save_path" in s && !saveFieldsPrefilled) {
|
||||
savePathInput.value = s.save_path || ""; // seed once; don't clobber later edits
|
||||
saveNameInput.value = s.save_name || "";
|
||||
saveFieldsPrefilled = true;
|
||||
}
|
||||
if ("processor_running" in s)
|
||||
setStat(processorEl, "processor", s.processor_running ? "yes" : "no",
|
||||
s.processor_running ? "ok" : "off");
|
||||
if ("ring_name" in s) setStat(ringEl, "ring", s.ring_name || "—",
|
||||
s.ring_name ? "" : "off");
|
||||
if ("raw_count" in s)
|
||||
setStat(scansEl, "scans",
|
||||
`raw ${s.raw_count} / preprocessed ${s.preprocessed_count} / results ${s.result_count}`);
|
||||
}
|
||||
|
||||
/* ---- frame rendering (latest-wins; the frame IS the Qt plot image) - */
|
||||
@@ -305,6 +384,7 @@ async function init() {
|
||||
settingsNote.textContent = "Status unavailable: " + err.message;
|
||||
}
|
||||
await loadSettings();
|
||||
await loadConfigList();
|
||||
connectWs();
|
||||
}
|
||||
init();
|
||||
|
||||
@@ -28,6 +28,26 @@
|
||||
</section>
|
||||
|
||||
<aside class="side-panel">
|
||||
<div class="config-section">
|
||||
<div class="config-title">Config profile</div>
|
||||
<div class="config-row">
|
||||
<select id="config-select" class="config-control" aria-label="Run config"></select>
|
||||
<button id="btn-load-config" class="btn">Load</button>
|
||||
</div>
|
||||
<div class="config-active" id="config-active"></div>
|
||||
</div>
|
||||
|
||||
<div class="config-section">
|
||||
<div class="config-title">Save dataset</div>
|
||||
<div class="config-row">
|
||||
<input id="save-path" class="config-control" type="text" placeholder="Save path" aria-label="Save path" />
|
||||
</div>
|
||||
<div class="config-row">
|
||||
<input id="save-name" class="config-control" type="text" placeholder="Name (optional)" aria-label="Save name" />
|
||||
<button id="btn-save-dataset" class="btn">Save</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel-head" id="settings-toggle">
|
||||
<span class="panel-title">Processor settings</span>
|
||||
<span class="chevron" id="settings-chevron">▾</span>
|
||||
@@ -47,6 +67,7 @@
|
||||
<span class="stat" id="stat-running">running: —</span>
|
||||
<span class="stat" id="stat-processor">processor: —</span>
|
||||
<span class="stat" id="stat-ring">ring: —</span>
|
||||
<span class="stat" id="stat-scans">scans: —</span>
|
||||
<span class="stat" id="stat-stale">live</span>
|
||||
</footer>
|
||||
|
||||
|
||||
@@ -134,6 +134,35 @@ body {
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
/* Config profile picker (top of the side panel) */
|
||||
.config-section {
|
||||
padding: 10px 12px;
|
||||
border-bottom: 1px solid var(--border-soft);
|
||||
}
|
||||
.config-title { font-weight: 600; color: var(--status); margin-bottom: 8px; }
|
||||
.config-row { display: flex; gap: 8px; }
|
||||
.config-row + .config-row { margin-top: 8px; }
|
||||
.config-control {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
background: var(--panel);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 7px;
|
||||
padding: 5px 7px;
|
||||
color: var(--text);
|
||||
font-family: var(--mono);
|
||||
font-size: 12px;
|
||||
}
|
||||
.config-control:focus { outline: none; border-color: var(--accent); }
|
||||
.config-active {
|
||||
margin-top: 6px;
|
||||
min-height: 14px;
|
||||
color: var(--muted);
|
||||
font-family: var(--mono);
|
||||
font-size: 11px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.panel-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
Reference in New Issue
Block a user