You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
148 lines
5.5 KiB
148 lines
5.5 KiB
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>{appname} {appversion} - Configuration</title>
|
|
<meta charset="utf-8" />
|
|
<link rel="stylesheet" href="index.css" />
|
|
<script src="jquery-1.12.3.min.js"></script>
|
|
<script>
|
|
|
|
$(function() {
|
|
|
|
$("#config").submit(function(event) {
|
|
$(":submit").prop("value", "Wait...").attr("disabled", true);
|
|
$.ajax({
|
|
'method': 'POST',
|
|
'url': '/save',
|
|
'dataType': 'json',
|
|
'data': $(this).serializeArray()
|
|
}).done(function(data) {
|
|
$(":submit").prop("value", "Connect").removeAttr("disabled");
|
|
}).fail(function() {
|
|
$(":submit").prop("value", "Connect").removeAttr("disabled");
|
|
});
|
|
event.preventDefault();
|
|
});
|
|
|
|
function update() {
|
|
$.ajax({
|
|
'method': 'GET',
|
|
'url': '/status',
|
|
'dataType': 'json'
|
|
}).done(function(data) {
|
|
$("span.network").html(data.wifi ? data.network.toUpperCase() : "NOT CONNECTED");
|
|
$("span.ip").html(data.wifi ? "("+data.ip+")" : "");
|
|
$("span.mqtt").html(data.mqtt ? "CONNECTED" : "NOT CONNECTED");
|
|
$("span.relay").html(data.relay ? "ON" : "OFF");
|
|
});
|
|
}
|
|
|
|
update();
|
|
var updateTimer = setInterval(update, 5000);
|
|
|
|
});
|
|
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<form id="config" action="/" method="post">
|
|
|
|
<header>
|
|
<h2>{appname} {appversion} - Configuration</h2>
|
|
<div>This form lets you define the WIFI network this device should try to join.</div>
|
|
</header>
|
|
|
|
<div>
|
|
<p>Wifi: <span class="network"></span> <span class="ip"></span></p>
|
|
<p>MQTT: <span class="mqtt"></span></p>
|
|
<p>Relay: <span class="relay"></span></p>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="ssid0">Network SSID 0</label>
|
|
<div>
|
|
<input id="ssid0" name="ssid0" type="text" class="field text fn" value="{ssid0}" size="8" tabindex="1">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="pass0">Network Password 0</label>
|
|
<div>
|
|
<input id="pass0" name="pass0" type="text" spellcheck="false" value="{pass0}" maxlength="255" tabindex="2">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="ssid1">Network SSID 1</label>
|
|
<div>
|
|
<input id="ssid1" name="ssid1" type="text" class="field text fn" value="{ssid1}" size="8" tabindex="3">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="pass1">Network Password 1</label>
|
|
<div>
|
|
<input id="pass1" name="pass1" type="text" spellcheck="false" value="{pass1}" maxlength="255" tabindex="4">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="ssid2">Network SSID 2</label>
|
|
<div>
|
|
<input id="ssid2" name="ssid2" type="text" class="field text fn" value="{ssid2}" size="8" tabindex="5">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="pass2">Network Password 2</label>
|
|
<div>
|
|
<input id="pass2" name="pass2" type="text" spellcheck="false" value="{pass2}" maxlength="255" tabindex="6">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="mqtt_server">MQTT Server</label>
|
|
<div>
|
|
<input id="mqtt_server" name="mqtt_server" type="text" class="field text fn" value="{mqtt_server}" size="8" tabindex="7">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="mqtt_port">MQTT Port</label>
|
|
<div>
|
|
<input id="mqtt_port" name="mqtt_port" type="text" spellcheck="false" value="{mqtt_port}" maxlength="255" tabindex="8">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="mqtt_topic">MQTT Topic</label>
|
|
<div>
|
|
<input id="mqtt_topic" name="mqtt_topic" type="text" class="field text fn" value="{mqtt_topic}" size="8" tabindex="9">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="mqtt_port">RF Channel</label>
|
|
<div>
|
|
<input id="rf_channel" name="rf_channel" type="text" spellcheck="false" value="{rf_channel}" maxlength="255" tabindex="8">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="desc" for="mqtt_topic">RF Device</label>
|
|
<div>
|
|
<input id="rf_device" name="rf_device" type="text" class="field text fn" value="{rf_device}" size="8" tabindex="9">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<div>
|
|
<input id="submit" name="submit" type="submit" value="Connect">
|
|
</div>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</body>
|
|
</html>
|