You've already forked TEF6686_ESP32
64 lines
6.1 KiB
C
64 lines
6.1 KiB
C
#pragma once
|
|
|
|
/*! \def char AP_HTTP_HEAD[] PROGMEM
|
|
Start of HTML output
|
|
*/
|
|
const char AP_HTTP_HEAD[] PROGMEM = "<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"utf-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1, user-scalable=no\"/><title>{v}</title>";
|
|
/*! \def AP_HTTP_STYLE[] PROGMEM
|
|
Style for our access point
|
|
*/
|
|
const char AP_HTTP_STYLE[] PROGMEM = "<style type=\"text/css\">h1 { font-weight: normal; } .msgbox { font-size:1.2rem; line-height: 1.8em; padding: 0.5em; background-color: #ddffff; border-left: 6px solid #ccc; margin-bottom:1em; } .c{text-align:center}div,input{padding:5px;font-size:1em}input{width:95%;margin-top:5px;margin-bottom:10px}body{text-align:center;font-family:verdana;}button{border:0;border-radius:.3rem;background-color:#1fa3ec;color:#fff;line-height:2.6rem;font-size:1.2rem;width:100%}.q{float:right;width:64px;text-align:right}.l{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAALVBMVEX///8EBwfBwsLw8PAzNjaCg4NTVVUjJiZDRUUUFxdiZGSho6OSk5Pg4eFydHTCjaf3AAAAZElEQVQ4je2NSw7AIAhEBamKn97/uMXEGBvozkWb9C2Zx4xzWykBhFAeYp9gkLyZE0zIMno9n4g19hmdY39scwqVkOXaxph0ZCXQcqxSpgQpONa59wkRDOL93eAXvimwlbPbwwVAegLS1HGfZAAAAABJRU5ErkJggg==) no-repeat left center;background-size:1em;}.cfail,.cok{text-align:center; font-size:1.2rem; line-height: 2em; margin-top: 1em; padding: 0.7em; display:none;} .cfail{color: #FFFFFF;background-color: #ff8433;} .cok{ background-color: #6aff33;}</style>";
|
|
/** Scripts for our page */
|
|
const char AP_HTTP_SCRIPT[] PROGMEM = "<script>function c(l){document.getElementById('s').value=l.innerText||l.textContent;document.getElementById('p').focus();}</script>";
|
|
/** End of the header section and beginning of the body */
|
|
const char AP_HTTP_HEAD_END[] PROGMEM = "</head><body><div style='text-align:left;display:inline-block;min-width:260px;'>";
|
|
/** Start of our HTMl configuration Form */
|
|
const char AP_HTTP_PORTAL_OPTIONS[] PROGMEM = "<div class=\"msgbox\">Connect this device to a WiFi network. Select the option to find a WiFi network.</div><form action=\"/wifi\" method=\"get\"><button>Configure WiFi (Auto Scan)</button></form><br/><form action=\"/0wifi\" method=\"get\"><button style=\"background-color:#bbbbbb;\">Configure WiFi (Manual)</button></form><!--<br/><form action=\"/i\" method=\"get\"><button>Info</button></form><br/></form>-->";
|
|
/** HTML snippet for wifi scanning */
|
|
const char AP_HTTP_ITEM[] PROGMEM = "<div><a href='#p' onclick='c(this)'>{v}</a> <span class='q {i}'>{r}%</span></div>";
|
|
/** HTML form for saving wifi connection details */
|
|
const char AP_HTTP_FORM_START[] PROGMEM ="<form method=\"post\" action=\"wifisave\"><label>Enter WiFi Name ('SSID'):</label><input id=\"s\" name=\"s\" length=32 placeholder=\"Example: Home_Network_2002\"><label>Enter WiFi Password:</label><input id=\"p\" name=\"p\" length=64 type=\"password\" placeholder=\"Password123\"><br/>";;
|
|
/** HTML snippet for our custom parameters */
|
|
const char AP_HTTP_FORM_PARAM[] PROGMEM = "<br/><input id='{i}' name='{n}' maxlength={l} placeholder='{p}' value='{v}' {c}>";
|
|
/** The end of our HTML Form */
|
|
const char AP_HTTP_FORM_END[] PROGMEM = "<br/><button type='submit'>Save and Connect</button></form>";
|
|
/** HTML snippet to recan for networks */
|
|
const char AP_HTTP_SCAN_LINK[] PROGMEM = "<br/><div class=\"c\"><a href=\"/wifi\">Re-scan</a></div>";
|
|
/** HTML snippet for saved confirmation */
|
|
// https://stackoverflow.com/questions/20760635/why-does-setting-xmlhttprequest-responsetype-before-calling-open-throw
|
|
// https://esprima.org/demo/validate.html
|
|
// https://javascript-minifier.com/
|
|
|
|
/* Use JavaScript to ping the ESP periodically @ the AP IP address.
|
|
* If it comes back as an AP again then we know the connection to the WiFi didn't work.
|
|
* We wait about 30 seconds to determine this outcome. This isn't 100% foolproof, but should be good enough.
|
|
*/
|
|
/*
|
|
<script type="text/javascript">
|
|
function doPing() {
|
|
//if ( timeout_count > 20 ) {
|
|
if ( attempt_count > 20 ) { // wait about a minute
|
|
window.clearInterval(myPinger), document.getElementById("conn_ok").style.display = "block"
|
|
}
|
|
|
|
var o = new XMLHttpRequest;
|
|
o.onload = function() {
|
|
console.log(this.responseText), document.getElementById("conn_fail").style.display = "block", window.clearInterval(myPinger)
|
|
}, o.ontimeout = function(o) {
|
|
console.log("Timeout Counter is: " + timeout_count++)
|
|
}, o.open("GET", "/foo"), o.timeout = 1000, o.send(null), console.log("Ping counter is: " + attempt_count++)
|
|
}
|
|
|
|
attempt_count = 0;
|
|
timeout_count = 0;
|
|
var myPinger = window.setInterval(doPing, 3000);
|
|
|
|
</script>
|
|
*/
|
|
const char AP_HTTP_SAVED[] PROGMEM = "<div>Credentials Saved.<br />Attempting to connect to WiFi network. Please wait.... <br /><script type=\"text/javascript\">function doPing(){attempt_count>20&&(window.clearInterval(myPinger),document.getElementById(\"conn_ok\").style.display=\"block\");var t=new XMLHttpRequest;t.onload=function(){console.log(this.responseText),document.getElementById(\"conn_fail\").style.display=\"block\",window.clearInterval(myPinger)},t.ontimeout=function(t){console.log(\"Timeout Counter is: \"+timeout_count++)},t.open(\"GET\",\"/foo\"),t.timeout=1e3,t.send(null),console.log(\"Ping counter is: \"+attempt_count++)}attempt_count=0,timeout_count=0;var myPinger=window.setInterval(doPing,3e3);</script><div class=\"cok\" id=\"conn_ok\">Connected to {ap} !<br />You may now close this window. </div><div class=\"cfail\" id=\"conn_fail\">Failed to connect to {ap}!<br /><a href=\"/\">Click here</a> to try again.</div></div>";
|
|
/** End of the HTML page */
|
|
const char AP_HTTP_END[] PROGMEM = "</div></body></html>";
|
|
/** HTML snippet for our custom parameters portal form */
|
|
const char AP_HTTP_PORTAL_PARAM_OPTIONS[] PROGMEM = "<form action=\"/params\" method=\"get\"><button>Configure Parameters</button></form><br/><form action=\"/i\" method=\"get\"><button>Info</button></form><br/>";
|
|
/** HTML snippet for our custom parameters save */
|
|
const char AP_HTTP_FORM_PARAM_START[] PROGMEM ="<form method=\"get\" action=\"wifisave\">"; |