Web: clear CLI input after Enter and remove misleading placeholder
The Enter key handler in the CLI panel now awaits runCommand() directly instead of simulating a button click, and clears the input field once the command has been dispatched. This makes keyboard-driven use more comfortable: the field is ready for the next command without manual clearing. The placeholder text "get mqtt.status" is removed from the command input. Its color was nearly identical to regular input text, making the field appear non-empty even when cleared, which was confusing. The Quick "get" Commands panel already provides one-click buttons for all common read-only queries, so the hint was redundant in any case. The Run button onclick path is intentionally unchanged: the command stays in the field after execution, allowing fast repeat by clicking Run again without retyping.
This commit is contained in:
@@ -628,7 +628,7 @@ const char kWebPanelAppHtml[] PROGMEM = R"HTML(
|
||||
<section class="card" id="cliPanel" style="display:none">
|
||||
<h2>Run CLI Command</h2>
|
||||
<div class="row-command">
|
||||
<input id="command" placeholder="get mqtt.status">
|
||||
<input id="command">
|
||||
<button id="runBtn">Run</button>
|
||||
</div>
|
||||
<p class="panel-copy">Authenticated sessions can run repeater CLI commands here.</p>
|
||||
@@ -2368,10 +2368,12 @@ const char kWebPanelAppHtml[] PROGMEM = R"HTML(
|
||||
const openStats = () => window.location.assign("/stats");
|
||||
const openApp = () => window.location.assign("/app");
|
||||
document.getElementById("openStatsPanelBtn").onclick = () => openStats();
|
||||
document.getElementById("command").addEventListener("keydown", (event) => {
|
||||
document.getElementById("command").addEventListener("keydown", async (event) => {
|
||||
if (event.key === "Enter") {
|
||||
event.preventDefault();
|
||||
document.getElementById("runBtn").click();
|
||||
const cmd = document.getElementById("command");
|
||||
await runCommand(cmd.value);
|
||||
cmd.value = "";
|
||||
}
|
||||
});
|
||||
document.querySelectorAll("[data-cmd]").forEach((btn) => btn.onclick = () => runCommand(btn.dataset.cmd));
|
||||
|
||||
Reference in New Issue
Block a user