Improved WEB dashboard, added a new API endpoint to retrieve AP information (not finished yet)
This commit is contained in:
parent
1fae8f51f2
commit
ff37020638
@ -28,6 +28,11 @@
|
|||||||
{
|
{
|
||||||
background-color: #f93 !important;
|
background-color: #f93 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
table.no-padding-margin tr td
|
||||||
|
{
|
||||||
|
margin:0px;padding:0px;
|
||||||
|
}
|
||||||
|
|
||||||
.mode-img
|
.mode-img
|
||||||
{
|
{
|
||||||
@ -144,21 +149,45 @@
|
|||||||
<div class="switch center-align">
|
<div class="switch center-align">
|
||||||
<label class="white-text">
|
<label class="white-text">
|
||||||
Disabled
|
Disabled
|
||||||
<input type="checkbox">
|
<input type="checkbox" id="ap_enabled_id">
|
||||||
<span class="lever"></span>
|
<span class="lever"></span>
|
||||||
Enabled
|
Enabled
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="row white-text left-align" style="font-size:1.2em;margin-top: 20px;margin-bottom: -40px;">
|
<div class="row white-text left-align" style="font-size:1.2em;margin-top: 20px;margin-bottom: -40px;">
|
||||||
<div class="col m6">
|
<div class="col m6">
|
||||||
Connected dev :
|
Connected devivces :
|
||||||
</div>
|
</div>
|
||||||
<div class="col m6">
|
<div class="col m6">
|
||||||
3
|
<span id="ap_connected_dev_count_id">0</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<input placeholder="SSID" id="ssid" type="text" class="validate white-text">
|
<div class="row white-text left-align" style="font-size:1.2em;margin-top: 20px;margin-bottom: -40px;">
|
||||||
<input onmouseleave="showHidePassword('pwd','hide')" onmouseover="showHidePassword('pwd','show');" value="somePassword" placeholder="Password" id="pwd" type="password" class="validate white-text">
|
<div class="col m3">
|
||||||
|
AP IP :
|
||||||
|
</div>
|
||||||
|
<div class="col m3">
|
||||||
|
<span id="apIP"></span>
|
||||||
|
</div>
|
||||||
|
<div class="col m3">
|
||||||
|
MAC :
|
||||||
|
</div>
|
||||||
|
<div class="col m3">
|
||||||
|
<span id="ap_mac"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table class="no-padding-margin">
|
||||||
|
<tr>
|
||||||
|
<td><label for="ssid" class="white-text" style="font-size:1em;">Advertised SSID :</label></td>
|
||||||
|
<td colspan="2"><input placeholder="SSID" id="ssid" type="text" class="validate white-text"></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><label for="ap_password" class="white-text" style="font-size:1em;">Password :</label></td>
|
||||||
|
<td><input placeholder="Password" id="ap_password" type="password" class="validate white-text"></td>
|
||||||
|
<td><img onmouseleave="showHidePassword('ap_password','hide')" onmouseover="showHidePassword('ap_password','show');" style="width:40px;" src="rsrc/show_pass.png"></td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="center-align">
|
<div class="center-align">
|
||||||
<button class="btn waves-effect waves-light green darken-3" type="submit" name="apply">
|
<button class="btn waves-effect waves-light green darken-3" type="submit" name="apply">
|
||||||
@ -187,11 +216,30 @@
|
|||||||
<div class="col m6">
|
<div class="col m6">
|
||||||
<span id="localIP"></span>
|
<span id="localIP"></span>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="col m6">
|
||||||
|
MAC :
|
||||||
|
</div>
|
||||||
|
<div class="col m6">
|
||||||
|
<span id="sta_mac"></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<select id="networksSelect">
|
|
||||||
<option value="" disabled selected>Click on scan</option>
|
<table class="no-padding-margin">
|
||||||
</select>
|
<tr>
|
||||||
<input placeholder="Password" id="pwd" type="password" class="validate white-text">
|
<td><label for="networksSelect" class="white-text" style="font-size:1em;">APs :</label></td>
|
||||||
|
<td colspan="2">
|
||||||
|
<select id="networksSelect">
|
||||||
|
<option value="" disabled selected>Click on scan</option>
|
||||||
|
</select>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><label for="sta_password" class="white-text" style="font-size:1em;">Password :</label></td>
|
||||||
|
<td><input placeholder="Password" id="sta_password" type="password" class="validate white-text"></td>
|
||||||
|
<td><img onmouseleave="showHidePassword('sta_password','hide')" onmouseover="showHidePassword('sta_password','show');" style="width:40px;" src="rsrc/show_pass.png"></td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col m6">
|
<div class="col m6">
|
||||||
@ -288,8 +336,8 @@
|
|||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="4">
|
<td colspan="4">
|
||||||
<div class="row" style="display:flex;">
|
<div class="row" style="display:flex;margin:0;padding:0;">
|
||||||
<div class="teal darken-1 col m3" style="margin: 7px 22px 7px 22px;border-radius: 5px;padding-bottom: 15px;">
|
<div class="teal darken-1 col m3" style="margin: 7px 5px 7px 10px;border-radius: 5px;padding-bottom: 15px;">
|
||||||
<div class="white-text">
|
<div class="white-text">
|
||||||
<h5 style="font-weight:bold;" class="center-align">DS3231 RTC</h5>
|
<h5 style="font-weight:bold;" class="center-align">DS3231 RTC</h5>
|
||||||
</div>
|
</div>
|
||||||
@ -301,9 +349,9 @@
|
|||||||
<hr>
|
<hr>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col m6 left-align">
|
<div class="col m6 left-align">
|
||||||
<button class="btn waves-effect waves-light green darken-3" onclick="setRtcTime();" name="apply">
|
<button class="btn waves-effect waves-light green darken-3" onclick="setRtcTime();" name="apply">
|
||||||
Apply ✔
|
Apply ✔
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="col m6 right-align">
|
<div class="col m6 right-align">
|
||||||
<button class="btn waves-effect waves-light green darken-3 tooltipped" onclick="setRtc2BrowserTime();" data-position="bottom" data-tooltip="Use the browser time to set the RTC time" name="browserTime">
|
<button class="btn waves-effect waves-light green darken-3 tooltipped" onclick="setRtc2BrowserTime();" data-position="bottom" data-tooltip="Use the browser time to set the RTC time" name="browserTime">
|
||||||
@ -312,7 +360,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="teal darken-1 col m3" style="margin: 7px 22px 7px 22px;border-radius: 5px;padding-bottom: 15px;">
|
<div class="teal darken-1 col m3" style="margin: 7px 20px 7px 5px;border-radius: 5px;padding-bottom: 15px;">
|
||||||
<div class="white-text">
|
<div class="white-text">
|
||||||
<h5 style="font-weight:bold;" class="center-align">SD Card</h5>
|
<h5 style="font-weight:bold;" class="center-align">SD Card</h5>
|
||||||
</div>
|
</div>
|
||||||
@ -343,7 +391,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="teal darken-1 col m3" style="margin: 7px 22px 7px 22px;border-radius: 5px;padding-bottom: 15px;">
|
<div class="teal darken-1 col m3" style="margin: 7px 5px 7px 0px;border-radius: 5px;padding-bottom: 15px;">
|
||||||
<div class="white-text">
|
<div class="white-text">
|
||||||
<h5 style="font-weight:bold;" class="center-align">WEB Server</h5>
|
<h5 style="font-weight:bold;" class="center-align">WEB Server</h5>
|
||||||
</div>
|
</div>
|
||||||
@ -356,32 +404,25 @@
|
|||||||
Enabled
|
Enabled
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<table>
|
<table class="no-padding-margin">
|
||||||
<tr>
|
<tr>
|
||||||
<td><label for="web_port" class="white-text" style="font-size:1em;">Port :</label></td>
|
<td><label for="web_port" class="white-text" style="font-size:1em;">Port :</label></td>
|
||||||
<td><input class="validate white-text" id="web_port" type="number" min="0" max="65535" ></td>
|
<td><input placeholder="WEB Server port" class="validate white-text" id="web_port" type="number" min="0" max="65535" ></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td><label for="web_root" class="white-text" style="font-size:1em;">Server root :</label></td>
|
<td><label for="web_root" class="white-text" style="font-size:1em;">Server root :</label></td>
|
||||||
<td><input class="validate white-text" id="web_root" type="text" ></td>
|
<td><input placeholder="Server root" class="validate white-text" id="web_root" type="text" ></td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="row">
|
<div class="center-align">
|
||||||
<div class="col m6">
|
<button class="btn waves-effect waves-light green darken-3" type="submit" name="apply">
|
||||||
<button class="btn waves-effect waves-light green darken-3" type="submit" name="apply">
|
Apply ✔
|
||||||
Apply ✔
|
</button>
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="col m6 right-align">
|
|
||||||
<button class="btn waves-effect waves-light red darken-3" type="submit" name="cancel">
|
|
||||||
Cancel ✘
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="teal darken-1 col m3" style="margin: 7px 22px 7px 22px;border-radius: 5px;padding-bottom: 15px;">
|
<div class="teal darken-1 col m3" style="margin: 7px 10px 7px 5px;border-radius: 5px;padding-bottom: 15px;">
|
||||||
<div class="white-text">
|
<div class="white-text">
|
||||||
<h5 style="font-weight:bold;" class="center-align">FTP Server</h5>
|
<h5 style="font-weight:bold;" class="center-align">FTP Server</h5>
|
||||||
</div>
|
</div>
|
||||||
@ -394,33 +435,33 @@
|
|||||||
Enabled
|
Enabled
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<table>
|
<table class="no-padding-margin">
|
||||||
<tr>
|
<tr>
|
||||||
<td><label for="ftp_port" class="white-text" style="font-size:1em;">Port :</label></td>
|
<td><label for="ftp_port" class="white-text" style="font-size:1em;">Port :</label></td>
|
||||||
<td><input class="validate white-text" id="ftp_port" type="number" min="0" max="65535" ></td>
|
<td colspan="2"><input placeholder="FTP Server port" class="validate white-text" id="ftp_port" type="number" min="0" max="65535" ></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><label for="username" class="white-text" style="font-size:1em;">User :</label></td>
|
||||||
|
<td colspan="2"><input placeholder="Login" id="username" type="text" class="validate white-text"></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><label for="user_password" class="white-text" style="font-size:1em;">Password :</label></td>
|
||||||
|
<td><input placeholder="Password" id="user_password" type="password" class="validate white-text"></td>
|
||||||
|
<td><img onmouseleave="showHidePassword('user_password','hide')" onmouseover="showHidePassword('user_password','show');" style="width:40px;" src="rsrc/show_pass.png"></td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
<input placeholder="Login" id="ssid" type="text" class="validate white-text">
|
|
||||||
<input placeholder="Password" id="pwd" type="password" class="validate white-text">
|
|
||||||
<hr>
|
<hr>
|
||||||
<div class="row">
|
<div class="center-align">
|
||||||
<div class="col m6">
|
<button class="btn waves-effect waves-light green darken-3" type="submit" name="apply">
|
||||||
<button class="btn waves-effect waves-light green darken-3" type="submit" name="apply">
|
Apply ✔
|
||||||
Apply ✔
|
</button>
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="col m6 right-align">
|
|
||||||
<button class="btn waves-effect waves-light red darken-3" type="submit" name="cancel">
|
|
||||||
Cancel ✘
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="4">
|
<td colspan="4" style="margin:0;padding:0;width:50%;">
|
||||||
<div style="margin:10px;padding:5px 0 10px 0;" class="grey lighten-2 z-depth-3">
|
<div style="margin:10px;padding:5px 0 10px 0;" class="grey lighten-2 z-depth-3">
|
||||||
<h5 class="center-align">IO's Mode and State</h5>
|
<h5 class="center-align">IO's Mode and State</h5>
|
||||||
</div>
|
</div>
|
||||||
@ -428,11 +469,12 @@
|
|||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="4">
|
<td colspan="4">
|
||||||
<div class="row" style="display:flex;">
|
<div class="row" style="display:flex;margin:0;padding:0;">
|
||||||
<div class="teal darken-1 col m12" style="margin: 7px 22px 7px 22px;border-radius: 5px;padding-bottom: 15px;">
|
<div class="teal darken-1 col m12" style="margin: 7px 10px 7px 10px;border-radius: 5px;padding-bottom: 15px;">
|
||||||
<div class="white-text">
|
<div class="white-text">
|
||||||
<h5 style="font-weight:bold;" class="center-align">IO Expander</h5>
|
<h5 style="font-weight:bold;" class="center-align">IO Expander</h5>
|
||||||
</div>
|
</div>
|
||||||
|
<hr>
|
||||||
<div class="white-text center-align" style="font-size:1.2em;">
|
<div class="white-text center-align" style="font-size:1.2em;">
|
||||||
<table>
|
<table>
|
||||||
<tr>
|
<tr>
|
||||||
@ -541,7 +583,7 @@
|
|||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
@ -557,8 +599,8 @@
|
|||||||
<h5 class="center-align">General settings</h5>
|
<h5 class="center-align">General settings</h5>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<footer class="page-footer blue-grey darken-4 center-align">
|
<footer style="padding:10px;" class="page-footer blue-grey darken-4 center-align">
|
||||||
<p>Anatole SCHRAMM-HENRY, all right reserved | Hosted by the board itself<br /> 2019-2020</p>
|
<p>Anatole SCHRAMM-HENRY, all right reserved | Hosted by the board itself<br /> 2019-2022</p>
|
||||||
</footer>
|
</footer>
|
||||||
<script src="rsrc/scriptV2.js"></script>
|
<script src="rsrc/scriptV2.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
@ -87,6 +87,7 @@ void setup()
|
|||||||
sab.getWebServerManager().getWEBServer().addApiRoutine("/esp/restart", &(espRestartApi), &sab, WEBServer<WEBClient>::GET);
|
sab.getWebServerManager().getWEBServer().addApiRoutine("/esp/restart", &(espRestartApi), &sab, WEBServer<WEBClient>::GET);
|
||||||
sab.getWebServerManager().getWEBServer().addApiRoutine("/esp/reset", &(espResetApi), &sab, WEBServer<WEBClient>::GET);
|
sab.getWebServerManager().getWEBServer().addApiRoutine("/esp/reset", &(espResetApi), &sab, WEBServer<WEBClient>::GET);
|
||||||
sab.getWebServerManager().getWEBServer().addApiRoutine("/sab/wifi/stainfo", &(staWifiInfoApi), &sab, WEBServer<WEBClient>::GET);
|
sab.getWebServerManager().getWEBServer().addApiRoutine("/sab/wifi/stainfo", &(staWifiInfoApi), &sab, WEBServer<WEBClient>::GET);
|
||||||
|
sab.getWebServerManager().getWEBServer().addApiRoutine("/sab/wifi/apinfo", &(apWifiInfoApi), &sab, WEBServer<WEBClient>::GET);
|
||||||
sab.getWebServerManager().getWEBServer().addApiRoutine("/sab/wifi/scanner", &(apScannerApi), NULL, WEBServer<WEBClient>::GET);
|
sab.getWebServerManager().getWEBServer().addApiRoutine("/sab/wifi/scanner", &(apScannerApi), NULL, WEBServer<WEBClient>::GET);
|
||||||
sab.getWebServerManager().getWEBServer().addApiRoutine("/sab/systeminfo", &(systemInfoApi), &sab, WEBServer<WEBClient>::GET);
|
sab.getWebServerManager().getWEBServer().addApiRoutine("/sab/systeminfo", &(systemInfoApi), &sab, WEBServer<WEBClient>::GET);
|
||||||
sab.getWebServerManager().getWEBServer().addApiRoutine("/sab/power/info", &(powerInfoApi), &sab, WEBServer<WEBClient>::GET);
|
sab.getWebServerManager().getWEBServer().addApiRoutine("/sab/power/info", &(powerInfoApi), &sab, WEBServer<WEBClient>::GET);
|
||||||
|
@ -226,7 +226,7 @@ boolean staWifiInfoApi(WEBServer<WEBClient>::HttpRequestData &HRD, WiFiClient *w
|
|||||||
SAB *p = (SAB *)pData;
|
SAB *p = (SAB *)pData;
|
||||||
char buffer[300];
|
char buffer[300];
|
||||||
IPAddress IP = p->getConnectivityManager().localIP();
|
IPAddress IP = p->getConnectivityManager().localIP();
|
||||||
|
|
||||||
sprintf(buffer,"{\"status\":\"ok\",\"RSSI\":%d,\"RSSI2\":%d,\"local IP\":\"%u.%u.%u.%u\",\"mac\":\"%s\"}", p->getConnectivityManager().RSSI(), p->getConnectivityManager().RSSIPercent(), IP[0], IP[1], IP[2], IP[3], p->getConnectivityManager().macAddress().c_str());
|
sprintf(buffer,"{\"status\":\"ok\",\"RSSI\":%d,\"RSSI2\":%d,\"local IP\":\"%u.%u.%u.%u\",\"mac\":\"%s\"}", p->getConnectivityManager().RSSI(), p->getConnectivityManager().RSSIPercent(), IP[0], IP[1], IP[2], IP[3], p->getConnectivityManager().macAddress().c_str());
|
||||||
|
|
||||||
WEBServer<WEBClient>::sendHTTPHeader(wc, HttpConstants::httpMIMETypeToString(HttpConstants::APPLICATION_JSON), strlen(buffer));
|
WEBServer<WEBClient>::sendHTTPHeader(wc, HttpConstants::httpMIMETypeToString(HttpConstants::APPLICATION_JSON), strlen(buffer));
|
||||||
@ -234,19 +234,32 @@ boolean staWifiInfoApi(WEBServer<WEBClient>::HttpRequestData &HRD, WiFiClient *w
|
|||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*boolean apWifiInfoApi(WEBServer<WEBClient>::HttpRequestData &HRD, WiFiClient *wc, void *pData)
|
boolean apWifiInfoApi(WEBServer<WEBClient>::HttpRequestData &HRD, WiFiClient *wc, void *pData)
|
||||||
{
|
{
|
||||||
SAB *p = (SAB *)pData;
|
SAB *p = (SAB *)pData;
|
||||||
char buffer[300];
|
char buffer[300];
|
||||||
|
|
||||||
p->getSdCardManager().getCFGFile(AP_CFG_FILE);
|
//We check if the AP is enabled
|
||||||
|
boolean apEnabled = p->getConnectivityManager().getMode() == WIFI_AP || p->getConnectivityManager().getMode() == WIFI_AP_STA;
|
||||||
|
|
||||||
|
if(apEnabled)
|
||||||
|
{
|
||||||
|
sprintf(buffer, "{\"status\":\"ok\",\"AP\":\"enabled\",\"AP IP\":\"%u.%u.%u.%u\",\"STA count\":%u,\"SSID\":\"%s\",\"Password\":\"%s\"}",
|
||||||
|
p->getConnectivityManager().softAPSSID().c_str(),
|
||||||
|
p->getConnectivityManager().softAPPSK().c_str());
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
sprintf(buffer, "{\"status\":\"ok\",\"AP\":\"disabled\",\"SSID\":\"%s\",\"Password\":\"%s\"}",
|
||||||
|
p->getConnectivityManager().softAPSSID().c_str(),
|
||||||
|
p->getConnectivityManager().softAPPSK().c_str());
|
||||||
|
}
|
||||||
|
|
||||||
sprintf(buffer, "");
|
|
||||||
WEBServer<WEBClient>::sendHTTPHeader(wc, HttpConstants::httpMIMETypeToString(HttpConstants::APPLICATION_JSON), strlen(buffer));
|
WEBServer<WEBClient>::sendHTTPHeader(wc, HttpConstants::httpMIMETypeToString(HttpConstants::APPLICATION_JSON), strlen(buffer));
|
||||||
|
|
||||||
wc->print(buffer);
|
wc->print(buffer);
|
||||||
return true;
|
return true;
|
||||||
}*/
|
}
|
||||||
|
|
||||||
boolean apScannerApi(WEBServer<WEBClient>::HttpRequestData &HRD, WiFiClient *wc, void *pData)
|
boolean apScannerApi(WEBServer<WEBClient>::HttpRequestData &HRD, WiFiClient *wc, void *pData)
|
||||||
{
|
{
|
||||||
|
Loading…
Reference in New Issue
Block a user