topaLE
/
ahoy
mirror of https://github.com/lumapu/ahoy.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

improved async web setup page

pull/283/head
lumapu 2 years ago
parent
13c88b3626
commit
b6ac416665
8 changed files with 176 additions and 158 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 66
      tools/esp8266/api.cpp
  2. 4
      tools/esp8266/api.h
  3. 7
      tools/esp8266/app.h
  4. 2
      tools/esp8266/html/convert.py
  5. 175
      tools/esp8266/html/setup.html
  6. 2
      tools/esp8266/html/style.css
  7. 77
      tools/esp8266/web.cpp
  8. 1
      tools/esp8266/web.h

66
tools/esp8266/api.cpp
View File

@ -26,6 +26,10 @@ void api::setup(void) {
mSrv->on("/api/system", HTTP_GET, std::bind(&api::onSystem, this, std::placeholders::_1));
mSrv->on("/api/inverter/list", HTTP_GET, std::bind(&api::onInverterList, this, std::placeholders::_1));
mSrv->on("/api/mqtt", HTTP_GET, std::bind(&api::onMqtt, this, std::placeholders::_1));
mSrv->on("/api/ntp", HTTP_GET, std::bind(&api::onNtp, this, std::placeholders::_1));
mSrv->on("/api/pinout", HTTP_GET, std::bind(&api::onPinout, this, std::placeholders::_1));
mSrv->on("/api/radio", HTTP_GET, std::bind(&api::onRadio, this, std::placeholders::_1));
mSrv->on("/api/serial", HTTP_GET, std::bind(&api::onSerial, this, std::placeholders::_1));
}
@ -72,12 +76,13 @@ void api::onInverterList(AsyncWebServerRequest *request) {
obj[F("ch_name")][j] = iv->chName[j];
}
obj[F("power_limit")][F("limit")] = iv->powerLimit[0];
obj[F("power_limit")][F("limit_option")] = iv->powerLimit[1];
obj[F("power_limit")] = iv->powerLimit[0];
obj[F("power_limit_option")] = iv->powerLimit[1];
}
}
root[F("interval")] = String(mConfig->sendInterval);
root[F("retries")] = String(mConfig->maxRetransPerPyld);
root[F("max_num_inverters")] = MAX_NUM_INVERTERS;
response->setLength();
request->send(response);
@ -92,9 +97,64 @@ void api::onMqtt(AsyncWebServerRequest *request) {
root[F("broker")] = String(mConfig->mqtt.broker);
root[F("port")] = String(mConfig->mqtt.port);
root[F("user")] = String(mConfig->mqtt.user);
root[F("pwd")] = String(mConfig->mqtt.pwd); // TODO: not that nice!
root[F("pwd")] = (strlen(mConfig->mqtt.pwd) > 0) ? F("{PWD}") : String("");
root[F("topic")] = String(mConfig->mqtt.topic);
response->setLength();
request->send(response);
}
//-----------------------------------------------------------------------------
void api::onNtp(AsyncWebServerRequest *request) {
AsyncJsonResponse* response = new AsyncJsonResponse();
JsonObject root = response->getRoot();
root[F("addr")] = String(mConfig->ntpAddr);
root[F("port")] = String(mConfig->ntpPort);
response->setLength();
request->send(response);
}
//-----------------------------------------------------------------------------
void api::onPinout(AsyncWebServerRequest *request) {
AsyncJsonResponse* response = new AsyncJsonResponse();
JsonObject root = response->getRoot();
root[F("cs")] = mConfig->pinCs;
root[F("ce")] = mConfig->pinCe;
root[F("irq")] = mConfig->pinIrq;
response->setLength();
request->send(response);
}
//-----------------------------------------------------------------------------
void api::onRadio(AsyncWebServerRequest *request) {
AsyncJsonResponse* response = new AsyncJsonResponse();
JsonObject root = response->getRoot();
root[F("power_level")] = mConfig->amplifierPower;
response->setLength();
request->send(response);
}
//-----------------------------------------------------------------------------
void api::onSerial(AsyncWebServerRequest *request) {
AsyncJsonResponse* response = new AsyncJsonResponse();
JsonObject root = response->getRoot();
// next line cause a chrash but why?
//root[F("interval")] = mConfig->serialInterval;
root[F("show_live_data")] = mConfig->serialShowIv;
root[F("debug")] = mConfig->serialDebug;
response->setLength();
request->send(response);
}

4
tools/esp8266/api.h
View File

@ -20,6 +20,10 @@ class api {
void onSystem(AsyncWebServerRequest *request);
void onInverterList(AsyncWebServerRequest *request);
void onMqtt(AsyncWebServerRequest *request);
void onNtp(AsyncWebServerRequest *request);
void onPinout(AsyncWebServerRequest *request);
void onRadio(AsyncWebServerRequest *request);
void onSerial(AsyncWebServerRequest *request);
AsyncWebServer *mSrv;
app *mApp;

7
tools/esp8266/app.h
View File

@ -36,13 +36,6 @@ typedef HmRadio<DEF_RF24_CE_PIN, DEF_RF24_CS_PIN, BufferType> RadioType;
typedef Inverter<float> InverterType;
typedef HmSystem<RadioType, BufferType, MAX_NUM_INVERTERS, InverterType> HmSystemType;
const char* const wemosPins[] = {"D3 (GPIO0)", "TX (GPIO1)", "D4 (GPIO2)", "RX (GPIO3)",
"D2 (GPIO4)", "D1 (GPIO5)", "GPIO6", "GPIO7", "GPIO8",
"GPIO9", "GPIO10", "GPIO11", "D6 (GPIO12)", "D7 (GPIO13)",
"D5 (GPIO14)", "D8 (GPIO15)", "D0 (GPIO16 - no IRQ!)"};
const char* const pinNames[] = {"CS", "CE", "IRQ"};
const char* const pinArgNames[] = {"pinCs", "pinCe", "pinIrq"};
typedef struct {
uint8_t invId;

2
tools/esp8266/html/convert.py
View File

@ -21,7 +21,7 @@ def convert2Header(inFile, compress):
if False == compress:
if fileType == "html":
data = re.sub(r"\>\s+\<", '><', data) # whitespaces between xml tags
data = re.sub(r"(\;|\}|\>|\{)\s+", r'\1', data) # whitespaces inner javascript
data = re.sub(r"(\s?\;|\}|\>|\{|\=)\s+", r'\1', data) # whitespaces inner javascript
length = len(data) # get unescaped length
data = re.sub(r"\"", '\\\"', data) # escape quotation marks
else:

175
tools/esp8266/html/setup.html
View File

@ -1,7 +1,7 @@
<!doctype html>
<html>
<head>
<title>Setup - {#DEVICE}</title>
<title>Setup</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript">
@ -69,7 +69,7 @@
<label for="ssid">SSID</label>
<input type="text" name="ssid" class="text"/>
<label for="pwd">Password</label>
<input type="password" class="text" name="pwd" value="{#PWD}"/>
<input type="password" class="text" name="pwd" value="{PWD}"/>
</fieldset>
</div>
@ -78,6 +78,7 @@
<fieldset>
<legend class="des">Inverter</legend>
<div id="inverter"></div><br/>
<input type="button" name="btnAdd" value="Add Inverter"/>
<p class="subdes">General</p>
<label for="invInterval">Interval [s]</label>
<input type="text" class="text" name="invInterval"/>
@ -91,9 +92,9 @@
<fieldset>
<legend class="des">NTP Server</legend>
<label for="ntpAddr">NTP Server / IP</label>
<input type="text" class="text" name="ntpAddr" value="{#NTP_ADDR}"/>
<input type="text" class="text" name="ntpAddr"/>
<label for="ntpPort">NTP Port</label>
<input type="text" class="text" name="ntpPort" value="{#NTP_PORT}"/>
<input type="text" class="text" name="ntpPort"/>
</fieldset>
</div>
@ -119,25 +120,24 @@
<fieldset>
<legend class="des">System Config</legend>
<p class="des">Pinout (Wemos)</p>
{#PINOUT}
<div id="pinout"></div>
<p class="des">Radio (NRF24L01+)</p>
<label for="rf24Power">Amplifier Power Level</label>
<select name="rf24Power">{#RF24}</select>
<div id="rf24"></div>
<p class="des">Serial Console</p>
<label for="serEn">print inverter data</label>
<input type="checkbox" class="cb" name="serEn" {#SER_VAL_CB}/><br/>
<input type="checkbox" class="cb" name="serEn"/><br/>
<label for="serDbg">Serial Debug</label>
<input type="checkbox" class="cb" name="serDbg" {#SER_DBG_CB}/><br/>
<input type="checkbox" class="cb" name="serDbg"/><br/>
<label for="serIntvl">Interval [s]</label>
<input type="text" class="text" name="serIntvl" value="{#SER_INTVL}"/>
<input type="text" class="text" name="serIntvl"/>
</fieldset>
</div>
<label for="reboot">Reboot device after successful save</label>
<input type="checkbox" class="cb" name="reboot"/>
<input type="submit" value="save" class="btn" />
<input type="submit" value="save" class="btn"/>
</form>
</div>
</div>
@ -151,19 +151,24 @@
</div>
<script type="text/javascript">
var coll = document.getElementsByClassName("s_collapsible");
var i;
for (i = 0; i < coll.length; i++) {
coll[i].addEventListener("click", function() {
for(it of document.getElementsByClassName("s_collapsible")) {
it.addEventListener("click", function() {
this.classList.toggle("active");
var content = this.nextElementSibling;
content.style.display = (content.style.display === "block") ? "none" : "block";
});
}
var highestId = 0;
var maxInv = 0;
document.getElementsByName("btnAdd")[0].addEventListener("click", function() {
if(highestId < (maxInv-1))
ivHtml(JSON.parse('{"name":"","serial":"","channels":4,"ch_max_power":[0,0,0,0],"ch_name":["","","",""],"power_limit":1500,"power_limit_option":65535}'), highestId + 1);
});
function getAjax(url, ptr) {
var http = null;
http = new XMLHttpRequest();
var http = new XMLHttpRequest();
if(http != null) {
http.open("GET", url, true);
http.onreadystatechange = p;
@ -171,7 +176,7 @@
}
function p() {
if(http.readyState == 4)
ptr(http.responseText);
ptr(JSON.parse(http.responseText));
}
}
@ -191,7 +196,6 @@
function inp(name, val, max=32, cl=["text"]) {
e = document.createElement('input');
e.classList.add(...cl);
e.name = name;
e.value = val;
@ -202,11 +206,11 @@
function sel(name, opt, selId) {
e = document.createElement('select');
e.name = name;
for(i = 0; i < opt.length; i++) {
for(it of opt) {
o = document.createElement('option');
o.value = opt[i][0];
o.innerHTML = opt[i][1];
if(opt[i][0] == selId)
o.value = it[0];
o.innerHTML = it[1];
if(it[0] == selId)
o.selected = true;
e.appendChild(o);
}
@ -220,18 +224,17 @@
}
function ivHtml(obj, id) {
highestId = id;
if(highestId == (maxInv - 1))
toggle("btnAdd", true);
iv = document.getElementById("inverter");
id = "inv" + id;
iv.appendChild(des("Inverter " + id));
id = "inv" + id;
iv.appendChild(lbl(id + "Addr", "Adress*"));
iv.appendChild(inp(id + "Addr", obj.serial, 12));
iv.appendChild(lbl(id + "Name", "Name*"));
iv.appendChild(inp(id + "Name", obj.name));
iv.appendChild(lbl(id + "ActivePowerLimit", "Active Power Limit"));
iv.appendChild(inp(id + "ActivePowerLimit", obj.power_limit.limit, 5));
for(var i of [["Addr", "serial", "Address*", 12], ["Name", "name", "Name*", 32], ["ActivePowerLimit", "power_limit", "Active Power Limit", 5]]) {
iv.appendChild(lbl(id + i[0], i[2]));
iv.appendChild(inp(id + i[0], obj[i[1]], i[3]));
}
iv.appendChild(lbl(id + "ActivePowerLimitConType", "Active Power Limit Control Type"));
iv.appendChild(sel(id + "ActivePowerLimitConType", [
@ -240,61 +243,91 @@
[1, "absolute in Watt persistent"],
[256, "relativ in percent non persistent"],
[257, "relativ in percent persistent"]
], obj.power_limit.limit_option));
iv.appendChild(lbl(id + "ModPwr", "Max Module Power (Wp)"));
d = div("modpwr");
for(i = 0; i < obj.channels; i++) {
d.appendChild(inp(id + "ModPwr" + i, obj.ch_max_power[i], 4, ["text", "sh"]))
], obj.power_limit_option));
for(var j of [["ModPwr", "ch_max_power", "Max Module Power (Wp)"], ["ModName", "ch_name", "Module Name"]]) {
iv.appendChild(lbl(id + j[0], j[2]));
d = div(j[0]);
i = 0;
for(it of obj[j[1]]) {
d.appendChild(inp(id + j[0] + i, it, 4, ["text", "sh"]));
i++;
}
iv.appendChild(d);
}
iv.appendChild(d);
iv.appendChild(lbl(id + "ModName", "Module Name"));
d = div("modname");
for(i = 0; i < obj.channels; i++) {
d.appendChild(inp(id + "ModName" + i, obj.ch_name[i], 4, ["text", "sh"]))
}
iv.appendChild(d);
}
function ivGlob(obj) {
e = document.getElementsByName("invInterval");
e[0].value = obj["interval"];
e = document.getElementsByName("invRetry");
e[0].value = obj["retries"];
for(var i of [["invInterval", "interval"], ["invRetry", "retries"]])
document.getElementsByName(i[0])[0].value = obj[i[1]];
}
function parseSys(json) {
obj = JSON.parse(json);
e = document.getElementsByName("device");
e[0].value = obj.device_name;
e = document.getElementsByName("ssid");
e[0].value = obj.ssid;
function parseSys(obj) {
for(var i of [["device", "device_name"], ["ssid", "ssid"]])
document.getElementsByName(i[0])[0].value = obj[i[1]];
}
function parseIv(json) {
obj = JSON.parse(json);
ivHtml(obj.inverter[0], 0);
function parseIv(obj) {
for(var i = 0; i < obj.inverter.length; i++)
ivHtml(obj.inverter[i], i);
ivGlob(obj);
maxInv = obj["max_num_inverters"];
}
function parseMqtt(obj) {
for(var i of [["Addr", "broker"], ["Port", "port"], ["User", "user"], ["Pwd", "pwd"], ["Topic", "topic"]])
document.getElementsByName("mqtt"+i[0])[0].value = obj[i[1]];
}
function parseNtp(obj) {
for(var i of [["ntpAddr", "addr"], ["ntpPort", "port"]])
document.getElementsByName(i[0])[0].value = obj[i[1]];
}
function parsePinout(obj) {
var e = document.getElementById("pinout");
pins = [['cs', 'pinCs'], ['ce', 'pinCe'], ['irq', 'pinIrq']];
for(p of pins) {
e.appendChild(lbl(p[1], p[0].toUpperCase()));
e.appendChild(sel(p[1], [
[0, "D3 (GPIO0)"],
[1, "TX (GPIO1)"],
[2, "D4 (GPIO2)"],
[3, "RX (GPIO3)"],
[4, "D2 (GPIO4)"],
[5, "D1 (GPIO5)"],
[6, "GPIO6"],
[7, "GPIO7"],
[8, "GPIO8"],
[9, "GPIO9"],
[10, "GPIO10"],
[11, "GPIO11"],
[12, "D6 (GPIO12)"],
[13, "D7 (GPIO13)"],
[14, "D5 (GPIO14)"],
[15, "D8 (GPIO15)"],
[16, "D0 (GPIO16 - no IRQ!)"]
], obj[p[0]]));
}
}
function parseMqtt(json) {
obj = JSON.parse(json);
e = document.getElementsByName("mqttAddr");
e[0].value = obj["broker"];
e = document.getElementsByName("mqttPort");
e[0].value = obj["port"];
e = document.getElementsByName("mqttUser");
e[0].value = obj["user"];
e = document.getElementsByName("mqttPwd");
e[0].value = obj["pwd"];
e = document.getElementsByName("mqttTopic");
e[0].value = obj["topic"];
function parseRadio(obj) {
var e = document.getElementById("rf24");
e.appendChild(lbl("rf24Power", "Amplifier Power Level"));
e.appendChild(sel("rf24Power", [
[0, "MIN"],
[1, "LOW"],
[2, "HIGH"],
[3, "MAX"]
], obj["power_level"]));
}
getAjax("/api/system", parseSys);
getAjax("/api/inverter/list", parseIv);
getAjax("/api/mqtt", parseMqtt);
getAjax("/api/ntp", parseNtp);
getAjax("/api/pinout", parsePinout);
getAjax("/api/radio", parseRadio);
</script>
</body>
</html>

2
tools/esp8266/html/style.css
View File

@ -231,7 +231,7 @@ div.ts {
padding: 7px;
}
div.modpwr, div.modname {
div.ModPwr, div.ModName {
width:70%;
display: inline-block;
}

77
tools/esp8266/web.cpp
View File

@ -17,22 +17,7 @@
#include "html/h/visualization_html.h"
#include "html/h/update_html.h"
const uint16_t pwrLimitOptionValues[] {
NoPowerLimit,
AbsolutNonPersistent,
AbsolutPersistent,
RelativNonPersistent,
RelativPersistent
};
const char* const pwrLimitOptions[] {
"no power limit",
"absolute in Watt non persistent",
"absolute in Watt persistent",
"relativ in percent non persistent",
"relativ in percent persistent"
};
const char* const pinArgNames[] = {"pinCs", "pinCe", "pinIrq"};
//-----------------------------------------------------------------------------
web::web(app *main, sysConfig_t *sysCfg, config_t *config, char version[]) {
@ -211,8 +196,6 @@ void web::showFactoryRst(AsyncWebServerRequest *request) {
void web::showSetup(AsyncWebServerRequest *request) {
DPRINTLN(DBG_VERBOSE, F("app::showSetup"));
//tmplProc *proc = new tmplProc(request, 11000);
//proc->process(setup_html, setup_html_len, std::bind(&web::showSetupCb, this, std::placeholders::_1));
AsyncWebServerResponse *response = request->beginResponse_P(200, F("text/html"), setup_html, setup_html_len);
response->addHeader(F("Content-Encoding"), "gzip");
request->send(response);
@ -306,7 +289,8 @@ void web::showSave(AsyncWebServerRequest *request) {
if(request->arg("mqttAddr") != "") {
request->arg("mqttAddr").toCharArray(mConfig->mqtt.broker, MQTT_ADDR_LEN);
request->arg("mqttUser").toCharArray(mConfig->mqtt.user, MQTT_USER_LEN);
request->arg("mqttPwd").toCharArray(mConfig->mqtt.pwd, MQTT_PWD_LEN);
if(request->arg("mqttPwd") != "{PWD}")
request->arg("mqttPwd").toCharArray(mConfig->mqtt.pwd, MQTT_PWD_LEN);
request->arg("mqttTopic").toCharArray(mConfig->mqtt.topic, MQTT_TOPIC_LEN);
mConfig->mqtt.port = request->arg("mqttPort").toInt();
}
@ -575,61 +559,6 @@ String web::replaceHtmlGenericKeys(char *key) {
}
//-----------------------------------------------------------------------------
String web::showSetupCb(char* key) {
// PWD will be left at the default value (for protection)
// -> the PWD will only be changed if it does not match the placeholder "{PWD}"
String generic = replaceHtmlGenericKeys(key);
if(generic.length() == 0) {
if(0 == strncmp(key, "SSID", 4)) return mSysCfg->stationSsid;
else if(0 == strncmp(key, "PWD", 3)) return F("{PWD}");
else if(0 == strncmp(key, "PINOUT", 6)) {
String pinout = "";
for(uint8_t i = 0; i < 3; i++) {
pinout += F("<label for=\"") + String(pinArgNames[i]) + "\">" + String(pinNames[i]) + F("</label>");
pinout += F("<select name=\"") + String(pinArgNames[i]) + "\">";
for(uint8_t j = 0; j <= 16; j++) {
pinout += F("<option value=\"") + String(j) + "\"";
switch(i) {
default: if(j == mConfig->pinCs) pinout += F(" selected"); break;
case 1: if(j == mConfig->pinCe) pinout += F(" selected"); break;
case 2: if(j == mConfig->pinIrq) pinout += F(" selected"); break;
}
pinout += ">" + String(wemosPins[j]) + F("</option>");
}
pinout += F("</select>");
}
return pinout;
}
else if(0 == strncmp(key, "RF24", 4)) {
String rf24 = "";
for(uint8_t i = 0; i <= 3; i++) {
rf24 += F("<option value=\"") + String(i) + "\"";
if(i == mConfig->amplifierPower)
rf24 += F(" selected");
rf24 += ">" + String(rf24AmpPowerNames[i]) + F("</option>");
}
return rf24;
}
else if(0 == strncmp(key, "INV_INTVL", 9)) return String(mConfig->sendInterval);
else if(0 == strncmp(key, "INV_RETRIES", 11)) return String(mConfig->maxRetransPerPyld);
else if(0 == strncmp(key, "SER_INTVL", 9)) return String(mConfig->serialInterval);
else if(0 == strncmp(key, "SER_VAL_CB", 10)) return (mConfig->serialShowIv) ? "checked" : "";
else if(0 == strncmp(key, "SER_DBG_CB", 10)) return (mConfig->serialDebug) ? "checked" : "";
else if(0 == strncmp(key, "NTP_ADDR", 8)) return String(mConfig->ntpAddr);
else if(0 == strncmp(key, "NTP_PORT", 8)) return String(mConfig->ntpPort);
else if(0 == strncmp(key, "MQTT_ADDR", 9)) return String(mConfig->mqtt.broker);
else if(0 == strncmp(key, "MQTT_PORT", 9)) return String(mConfig->mqtt.port);
else if(0 == strncmp(key, "MQTT_USER", 9)) return String(mConfig->mqtt.user);
else if(0 == strncmp(key, "MQTT_PWD", 8)) return String(mConfig->mqtt.pwd);
else if(0 == strncmp(key, "MQTT_TOPIC", 10)) return String(mConfig->mqtt.topic);
}
return generic;
}
//-----------------------------------------------------------------------------
String web::showUpdateFormCb(char *key) {
String generic = replaceHtmlGenericKeys(key);

1
tools/esp8266/web.h
View File

@ -49,7 +49,6 @@ class web {
private:
String replaceHtmlGenericKeys(char *key);
String showSetupCb(char* key);
String showUpdateFormCb(char* key);
AsyncWebServer *mWeb;

Write Preview
Loading…
Cancel
Save