Fix web debug layout. Added command execution from web UI

This commit is contained in:
Xose Pérez
2018-03-11 22:09:20 +01:00
parent 9e99cab572
commit 5f2b22d063
10 changed files with 3348 additions and 3259 deletions

View File

@@ -121,6 +121,14 @@ div.state {
text-align: right;
}
.terminal {
font-family: 'Courier New', monospace !important;
font-size: 80% !important;
line-height: 100% !important;
background-color: #000 !important;
color: #0F0 !important;
}
/* -----------------------------------------------------------------------------
Buttons
-------------------------------------------------------------------------- */
@@ -163,6 +171,7 @@ div.state {
.button-ha-config,
.button-settings-backup,
.button-settings-restore,
.button-dbgcmd,
.button-apikey {
background: rgb(0, 192, 0); /* green */
}
@@ -175,6 +184,7 @@ div.state {
}
.button-upgrade-browse,
.button-dbgcmd,
.button-ha-add,
.button-apikey,
.button-upgrade {
@@ -281,19 +291,15 @@ span.slider {
#haConfig,
#scanResult {
color: #888;
font-family: 'Courier New', monospace;
font-size: 60%;
margin-top: 10px;
display: none;
padding: 10px;
}
/* -----------------------------------------------------------------------------
Logs
-------------------------------------------------------------------------- */
#weblog {
font-family: 'Courier New', monospace;
font-size: 60%;
resize: none;
height: 300px;
line-height: 100%;
height: 400px;
}

View File

@@ -74,6 +74,17 @@ function magnitudeError(error) {
// Utils
// -----------------------------------------------------------------------------
$.fn.enterKey = function (fnc) {
return this.each(function () {
$(this).keypress(function (ev) {
var keycode = (ev.keyCode ? ev.keyCode : ev.which);
if (keycode == '13') {
fnc.call(this, ev);
}
})
})
}
function keepTime() {
if (0 === now) { return; }
var date = new Date(now * 1000);
@@ -523,6 +534,14 @@ function doHAConfig() {
return false;
}
function doDebugCommand() {
var el = $("input[name='dbgcmd']");
var command = el.val();
el.val("");
sendAction("dbgcmd", {command: command});
return false;
}
// -----------------------------------------------------------------------------
// Visualization
// -----------------------------------------------------------------------------
@@ -1013,6 +1032,15 @@ function processData(data) {
if ("scanResult" === key) {
$("div.scan.loading").hide();
$("#scanResult").show();
}
// -----------------------------------------------------------------------------
// Home Assistant
// -----------------------------------------------------------------------------
if ("haConfig" === key) {
$("#haConfig").show();
}
// -----------------------------------------------------------------------------
@@ -1106,7 +1134,8 @@ function processData(data) {
}
if ("weblog" === key) {
document.getElementById("weblog").value += value;
$("#weblog").append(value);
$("#weblog").scrollTop($("#weblog")[0].scrollHeight - $("#weblog").height());
return;
}
@@ -1275,6 +1304,8 @@ $(function() {
$(".button-reconnect").on("click", doReconnect);
$(".button-wifi-scan").on("click", doScan);
$(".button-ha-config").on("click", doHAConfig);
$(".button-dbgcmd").on("click", doDebugCommand);
$("input[name='dbgcmd']").enterKey(doDebugCommand);
$(".button-settings-backup").on("click", doBackup);
$(".button-settings-restore").on("click", doRestore);
$(".button-settings-factory").on("click", doFactoryReset);

View File

@@ -138,6 +138,10 @@
<a href="#" class="pure-menu-link" data="panel-admin">ADMIN</a>
</li>
<li class="pure-menu-item module module-dbg">
<a href="#" class="pure-menu-link" data="panel-dbg">DEBUG</a>
</li>
</ul>
<div class="main-buttons">
@@ -180,6 +184,7 @@
<div id="magnitudes"></div>
<div class="pure-u-1 pure-u-lg-1-2 state">
<div class="pure-u-1-2">Manufacturer</div>
<div class="pure-u-11-24"><span class="right" name="manufacturer"></span></div>
@@ -207,16 +212,16 @@
<div class="pure-u-1-2">Load average</div>
<div class="pure-u-11-24"><span class="right" name="loadaverage"></span><span>%</span></div>
<div class="pure-u-1-2">Vcc</div>
<div class="pure-u-1-2">VCC</div>
<div class="pure-u-11-24"><span class="right" name="vcc"></span><span>mV</span></div>
<div class="pure-u-1-2">MQTT Status</div>
<div class="pure-u-11-24"><span class="right" name="mqttStatus">NOT AVAILABLE</span></div>
</div>
<div class="pure-u-1 pure-u-lg-11-24">
<div class="pure-u-1 pure-u-lg-11-24 state">
<div class="pure-u-1-2">Wifi MAC</div>
<div class="pure-u-11-24"><span class="right" name="mac"></span></div>
@@ -251,14 +256,6 @@
<div class="pure-u-11-24"><span class="right" name="ago">?</span><span> seconds ago</span></div>
</div>
<div class="header">
<h2>Debug log</h2>
</div>
<div class="pure-g">
<textarea class="pure-u-1" readonly id="weblog" name="weblog" wrap="off"></textarea>
</div>
</fieldset>
</form>
@@ -582,8 +579,7 @@
</div>
<div class="pure-g">
<div class="pure-u-0 pure-u-lg-1-4"></div>
<span class="pure-u-1 pure-u-lg-3-4" id="scanResult" name="scanResult"></span>
<span class="pure-u-1 terminal" id="scanResult" name="scanResult"></span>
</div>
<legend>Networks</legend>
@@ -857,8 +853,7 @@
</div>
</div>
<div class="pure-g">
<div class="pure-u-0 pure-u-lg-1-4"></div>
<div class="pure-u-1 pure-u-lg-3-4"><span id="haConfig" name="haConfig"></span></div>
<span class="pure-u-1 terminal" id="haConfig" name="haConfig"></span>
</div>
@@ -957,6 +952,37 @@
</div>
<div class="panel" id="panel-dbg">
<div class="header">
<h1>DEBUG LOG</h1>
<h2>
Shows debug messages from the device
</h2>
</div>
<div class="page">
<fieldset>
<div class="pure-g module module-telnet">
<div class="pure-u-1 hint">
Write a command and click send to execute it on the device. The output will be shown in the debug text area below.
</div>
<input name="dbgcmd" class="pure-u-3-4" type="text" tabindex="2" />
<div class=" pure-u-1-4 pure-u-lg-1-4"><button class="pure-button button-dbgcmd pure-u-23-24">Send</button></div>
</div>
<div class="pure-g">
<textarea class="pure-u-1 terminal" id="weblog" name="weblog" wrap="off" readonly></textarea>
</div>
</fieldset>
</div>
</div>
<div class="panel" id="panel-sensors">
<div class="header">