This commit is contained in:
j3d1 2021-07-19 23:58:00 +02:00
parent d5c10e441d
commit 15fb96bb02
3 changed files with 321 additions and 0 deletions

View file

@ -17,6 +17,8 @@
<label for="bmenub" class="burger pseudo button">&#9776;</label>
<div class="menu">
<a href="/#" class="button icon-picture">Dashboard</a>
<a href="/#io" class="button icon-puzzle">I/O</a>
<a href="/#wifi" class="button icon-puzzle">Wifi Settings</a>
<a href="/#ota" class="button icon-picture">System</a>
</div>
</nav>
@ -75,6 +77,125 @@
</article>
</section>
<section id="io">
<h2>I/O</h2>
<article class="card">
<header>
<h3>Protocols</h3>
</header>
<div class="table">
<div class="row">
<label>MQTT</label>
<span><input type="checkbox" class="plain"/></span>
</div>
<div class="row">
<span><input type="reset" class="button"/></span>
<span><input type="submit" value="Save"></span>
</div>
</div>
</article>
<article class="card">
<header>
<h3>Station Mode <span class="label success">current connection</span></h3>
</header>
<div class="table">
<div class="row">
<label>WS2812 via I2S</label>
<span><input type="checkbox" class="plain"/></span>
<span><input type="color"/></span>
</div>
<div class="row">
<label>APA102C via SPI</label>
<span><input type="checkbox" class="plain"/></span>
<span><input type="color"/></span>
</div>
<div class="row">
<label>6 Channel SPI Dimmer</label>
<span><input type="checkbox" class="plain"/></span>
<span><input type="color"/></span>
</div>
<div class="row">
<label>Binary Output on GPIO4</label>
<span><input type="checkbox" class="plain"/></span>
<span><button class="toggle button">Toggle</button></span>
</div>
<div class="row">
<label>Binary Output on GPIO5</label>
<span><input type="checkbox" class="plain"/></span>
<span><button class="toggle button">Toggle</button></span>
</div>
<div class="row">
<span><input type="reset" class="button"/></span>
<span><input type="submit" value="Save"></span>
</div>
</div>
</article>
</section>
<section id="wifi">
<h2>Wifi Settings</h2>
<article class="card">
<header>
<h3>AP Mode</h3>
</header>
<div class="table">
<div class="row">
<label>Enable</label>
<span><input id="ap_toggle" type="checkbox" class="plain"/></span>
</div>
<div class="row">
<label>SSID</label>
<span><input id="ap_ssid" type="text" placeholder="SSID"/></span>
</div>
<div class="row">
<label>Password</label>
<span><input id="ap_pw" type="password" placeholder="Password"/></span>
</div>
<div class="row">
<span>AP IP</span>
<span><span class="postfill_apip">N/A</span></span>
</div>
<div class="row">
<span>AP MAC</span>
<span><span class="postfill_apmac">N/A</span></span>
</div>
<div class="row">
<span><input type="reset" class="button"/></span>
<span><input onclick="ap_update();" type="submit" value="Save"></span>
</div>
</div>
</article>
<article class="card">
<header>
<h3>Station Mode <span class="label success">current connection</span></h3>
</header>
<div class="table">
<div class="row">
<label>Eanable</label>
<span><input id="sta_toggle" type="checkbox" class="plain"/></span>
</div>
<div class="row">
<label>SSID</label>
<span><input id="sta_ssid" type="text" placeholder="SSID"/></span>
</div>
<div class="row">
<label>Password</label>
<span><input id="sta_pw" type="password" placeholder="Password"/></span>
</div>
<div class="row">
<span>Sation IP</span>
<span><span class="postfill_staip">N/A</span></span>
</div>
<div class="row">
<span>Station MAC</span>
<span><span class="postfill_stamac">N/A</span></span>
</div>
<div class="row">
<span><input type="reset" class="button"/></span>
<span><input onclick="sta_update();" type="submit" value="Save"></span>
</div>
</div>
</article>
</section>
<section id="dashboard">
<h2>Status</h2>
<div class="flex">
@ -175,6 +296,16 @@
<header>
<h3>I/O</h3>
</header>
<div class="table">
<div class="row">
<span>Channel 1-6</span>
<span>SPI Dimmer</span>
</div>
<div class="row">
<span>Channel 7-127</span>
<span>WS2812 via I2S</span>
</div>
</div>
<footer>
<label>
<input type="checkbox" name="onoffswitch" id="led-switch" onclick="gpio()">
@ -433,6 +564,46 @@
}
}
var sta_toggle = document.getElementById("sta_toggle");
var sta_ssid = document.getElementById("sta_ssid");
var sta_pw = document.getElementById("sta_pw");
function sta_update() {
var en = sta_toggle.checked;
const ssid = sta_ssid.value;
const password = sta_pw.value;
const buffer = new ArrayBuffer(ssid.length + password.length + 4);
const view1 = new DataView(buffer);
var tx_len = 0;
view1.setChar(tx_len++, 'S');
view1.setChar(tx_len++, (en ? "E" : "D"));
tx_len = view1.setString(tx_len, ssid);
tx_len = view1.setString(tx_len, password);
wsWrite(buffer);
}
var ap_toggle = document.getElementById("ap_toggle");
var ap_ssid = document.getElementById("ap_ssid");
var ap_pw = document.getElementById("ap_pw");
function ap_update() {
var en = ap_toggle.checked;
const ssid = ap_ssid.value;
const password = ap_pw.value;
const buffer = new ArrayBuffer(ssid.length + password.length + 4);
const view1 = new DataView(buffer);
var tx_len = 0;
view1.setChar(tx_len++, 'A');
view1.setChar(tx_len++, (en ? "E" : "D"));
tx_len = view1.setString(tx_len, ssid);
tx_len = view1.setString(tx_len, password);
wsWrite(buffer);
}
function update_progress(progressBar, progress) {
var iP = Math.floor(progress);
var dBar = document.getElementById("progress_bar_" + progressBar);