267 lines
11 KiB
C
267 lines
11 KiB
C
// HTML data
|
|
#ifndef WIFICONFIG_WEBTITLE
|
|
# define WIFICONFIG_WEBTITLE "xPablo.cz Setup"
|
|
#endif
|
|
|
|
#ifndef WIFICONFIG_TITLE
|
|
# define WIFICONFIG_TITLE "ESP WiFiConfig"
|
|
#endif
|
|
|
|
static const char TEXTHTML[] PROGMEM = "text/html";
|
|
static const char TEXTPLAIN[] PROGMEM = "text/plain";
|
|
static const char TEXTJSON[] PROGMEM = "text/json";
|
|
|
|
static const char PAGE_INDEX1[] PROGMEM = R"=====(<!DOCTYPE html>
|
|
<html lang="en"><head><meta charset= "utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
|
<title>)=====" WIFICONFIG_WEBTITLE R"=====(</title>
|
|
<style>
|
|
.c{text-align: center;}
|
|
div,input{padding:5px;font-size:1em;}
|
|
input{width:95%;}
|
|
body{text-align: center;font-family:verdana;}
|
|
button{border:0;border-radius:0.3rem;background-color:#1fa3ec;color:#fff;line-height:2.4rem;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;}
|
|
#rssiBar{width: 100px;height: 15px;background: #fff;}
|
|
#rssiBar > div{width: 52px;height: 15px;background: #c20000;}
|
|
</style>
|
|
<script>
|
|
function c(l){document.getElementById('_s').value=l.innerText||l.textContent;document.getElementById('_p').focus();}
|
|
function hAP(){if (document.getElementById('_a').checked){document.getElementById('apconfig').style.display = 'block';}else{document.getElementById('apconfig').style.display = 'none';}}
|
|
function hSC(){if (document.getElementById('_st').checked){document.getElementById('staticip').style.display = 'block';}else{document.getElementById('staticip').style.display = 'none';}}
|
|
</script>
|
|
</head><body><h1>)=====" WIFICONFIG_TITLE R"=====(</h1><div style='text-align:left;display:inline-block;min-width:260px;'>
|
|
<div id="ssids">
|
|
</div>
|
|
<form method='post' action='s'>
|
|
<label>SSID<br><input id='_s' name='_s' maxlength=32 required placeholder='SSID' value="$SSID$"></label><br>
|
|
<label>Heslo<br><input id='_p' name='_p' onfocus="this.select();" maxlength=64 value="$PASS$" type='password' placeholder='heslo'></label><br>
|
|
<div>
|
|
<label><input id='_a' name='_a' type='checkbox' style="width: 10%; float: left; margin-top: 5px;" onclick='hAP();' $APMODE$>Režim AP</label>
|
|
<div id="apconfig">
|
|
<label>Kanál<br><input type="number" name="_ch" min="1" max="13" title='cislo kanalu v intervalu 1-13' value='$APCHAN$'></label><br>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label><input id='_st' name='_st' type='checkbox' style="width: 10%; float: left; margin-top: 5px;" onclick='hSC();' $STATIC$>Statická IP konfigurace</label>
|
|
<div id="staticip">
|
|
<label>IP adresa<br><input type="text" name="_i" value='$IP$'></label><br>
|
|
<label>Síťová maska<br><input type="text" name="_m" value='$MASK$'></label><br>
|
|
<label>Síťová brána<br><input type="text" name="_g" value='$GATE$'></label><br>
|
|
<label>Server DNS<br><input type="text" name="_d" value='$DNS$'></label><br>
|
|
</div>
|
|
</div>
|
|
$USER$
|
|
<br>
|
|
<button type='submit'>Uložit a restartovat</button></form>
|
|
<script>
|
|
window.onload = function() {
|
|
hAP();
|
|
hSC();
|
|
var req = new XMLHttpRequest();
|
|
req.open("GET", "/scan", true);
|
|
req.onreadystatechange = function() {
|
|
if (req.readyState != 4 || req.status != 200)
|
|
return;
|
|
ssids = document.getElementById('ssids');
|
|
data = JSON.parse(req.responseText);
|
|
status = data.status;
|
|
html = "";
|
|
if (status > 0) {
|
|
for (i= 0 ; i < status; ++i) {
|
|
lock = "";
|
|
if (data.ssids[i].secure != 0)
|
|
lock = "l";
|
|
value = data.ssids[i].rssi;
|
|
if (value <= -100)
|
|
value = 0;
|
|
else if (value >= -50)
|
|
value = 100;
|
|
else
|
|
value = 2 * (value + 100);
|
|
line = "<div><a href='#p' onclick='c(this)'>" + data.ssids[i].ssid + "</a> <span class='q " + lock + "'><meter value='" + value + "' min='0' low='30' optimum='70' high='60' max='100' style='width: 70%;'></meter></span></div>";
|
|
html += line;
|
|
}
|
|
ssids.innerHTML = html;
|
|
}
|
|
};
|
|
req.send();
|
|
};
|
|
</script>
|
|
</div>)====="
|
|
#if defined APP_NAME && defined APP_VERSION
|
|
R"=====(<div style='text-align:right;font-size:11px;'><hr/>)====="
|
|
APP_NAME
|
|
" v"
|
|
APP_VERSION
|
|
R"=====(</div>
|
|
)====="
|
|
#else
|
|
R"=====(<div style='text-align:right;font-size:11px;'><hr/><a href='http://xpablo.cz' target='_blank' style='color:#aaa;'>WiFiConfig by xPablo</a></div>)====="
|
|
#endif
|
|
R"=====(</body></html>
|
|
)=====";
|
|
|
|
// Uzivatelsky pridane polozky
|
|
static const char PAGE_PARAM_HDR[] PROGMEM = R"=====(
|
|
<hr>
|
|
<h2>Uživatelské položky</h2>
|
|
)=====";
|
|
|
|
static const char PAGE_PARAM[] PROGMEM = R"=====(
|
|
<label>%s<br><input name='%s' maxlength='%d' value='%s'></label><br>
|
|
)=====";
|
|
|
|
/*
|
|
<div style='text-align:right;font-size:11px;'><hr/><a href='http://xpablo.cz' target='_blank' style='color:#aaa;'>WiFiConfig by xPablo</a></div>
|
|
*/
|
|
// Nenalezeno zadne SSID
|
|
static const char PAGE_NO_SSID[] PROGMEM = R"=====(
|
|
<div>Nenalezená žádná síť. Občerstvi stránku pro nové hledání.</div>
|
|
)=====";
|
|
|
|
// Konfigurace ulozena - restartuji...
|
|
static const char PAGE_SAVED[] PROGMEM = R"=====(
|
|
<!DOCTYPE html><html lang="cs"><head><meta http-equiv="refresh" content="5;url=/"/>
|
|
<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1"/>
|
|
<title>xPablo Setup - Konfigurace uložena</title>
|
|
<style>div,input {margin-bottom: 5px;}body{width:200px;display:block;margin-left:auto;margin-right:auto;}</style>
|
|
</head><body>
|
|
Uloženo do Flash...<br/>
|
|
Restart za několik sekund.
|
|
</body></html>
|
|
)=====";
|
|
|
|
static const char PAGE_CAPTIVEPORTALCATCH[] PROGMEM = R"=====(<!DOCTYPE html>
|
|
<html lang="cs"><head><meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/><title>xPablo.cz Setup</title>
|
|
<style>.c{text-align: center;} div,input{padding:5px;font-size:1em;} input{width:95%;} body{text-align: center;font-family:verdana;} button{border:0;border-radius:0.3rem;background-color:#1fa3ec;color:#fff;line-height:2.4rem;font-size:1.2rem;width:100%;} .q{float: right;width: 64px;text-align: right;}
|
|
.vl-info {border-left: thick solid #1fa3ec;background: #cee6ff; text-align:left; display:inline-block; min-width:260px; margin-top:15px}
|
|
.red { background-color: #ff0000;}
|
|
.magenta { background-color: #ff00ff;}
|
|
.yellow { background-color: #FFD700;}
|
|
</style>
|
|
</head><body><div style='text-align:left;display:inline-block;min-width:260px;'>
|
|
<form action="/config" method="get">
|
|
<button>Konfigurace WiFi</button>
|
|
</form><br/>
|
|
<form action="/i" method="get">
|
|
<button>Informace o modulu</button>
|
|
</form><br/>
|
|
$RESTORE$
|
|
<form action="/r" method="post">
|
|
<button class="red">Reset</button></form><br>)====="
|
|
#if defined USE_WIFICONFIG_OTAUPDATE
|
|
R"=====(
|
|
</form><br/><form action="/u" method="get">
|
|
<button class="magenta">Aktualizace firmware</button></form><br>)====="
|
|
#endif
|
|
R"=====(
|
|
<div class=\"vl-info\">Pokus o připojení: $STATUS$</div>
|
|
)====="
|
|
#if defined APP_NAME && defined APP_VERSION
|
|
R"=====(<div style='text-align:right;font-size:11px;'><hr/>)====="
|
|
APP_NAME
|
|
" v"
|
|
APP_VERSION
|
|
R"=====(</div>
|
|
)====="
|
|
#else
|
|
R"=====(<div style='text-align:right;font-size:11px;'><hr/><a href='http://xpablo.cz' target='_blank' style='color:#aaa;'>WiFiConfig by xPablo</a></div>)====="
|
|
#endif
|
|
R"=====(</body></html>
|
|
)=====";
|
|
|
|
static const char PAGE_RESTART[] PROGMEM = R"=====(<!DOCTYPE html>
|
|
<html lang="cs"><head><meta http-equiv="refresh" content="5;url=/"/>
|
|
<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1"/>
|
|
<title>xPablo Setup - Restart</title>
|
|
<style>div,input {margin-bottom: 5px;}body{width:200px;display:block;margin-left:auto;margin-right:auto;}</style>
|
|
</head><body>
|
|
Restartuji...
|
|
</body></html>
|
|
)=====";
|
|
|
|
static const char PAGE_UPDATE[] PROGMEM = R"=====(
|
|
<html lang='en'>
|
|
<head>
|
|
<meta charset='utf-8'>
|
|
<meta name='viewport' content='width=device-width,initial-scale=1'/>
|
|
</head>
|
|
<body>
|
|
<form method="POST" action="#" enctype="multipart/form-data" id="upload_form">
|
|
<input type="file" name="update" accept='.bin' id="file">
|
|
<input type="submit" value="Update"> </form>
|
|
<div id="prg_wrap" style="border: 0px solid; width: 100%;">
|
|
<div id="prg" style="text-shadow: 2px 2px 3px black; padding: 5px 0; display: none; border: 1px solid #008aff; background: #002180; text-align: center; color: white;"></div>
|
|
</div>
|
|
<script>
|
|
var domReady = function(callback) {
|
|
document.readyState === "interactive" || document.readyState === "complete" ? callback() : document.addEventListener("DOMContentLoaded", callback);
|
|
};
|
|
domReady(function() {
|
|
var myform = document.getElementById('upload_form');
|
|
var filez = document.getElementById('file');
|
|
myform.onsubmit = function(event) {
|
|
event.preventDefault();
|
|
var formData = new FormData();
|
|
var file = filez.files[0];
|
|
if(!file) {
|
|
return false;
|
|
}
|
|
formData.append("files", file, file.name);
|
|
var xhr = new XMLHttpRequest();
|
|
xhr.upload.addEventListener("progress", function(evt) {
|
|
if(evt.lengthComputable) {
|
|
var per = Math.round((evt.loaded / evt.total) * 100);
|
|
var prg = document.getElementById('prg');
|
|
prg.innerHTML = per + "%"
|
|
prg.style.width = per + "%"
|
|
prg.style.display = "block"
|
|
}
|
|
}, false);
|
|
xhr.open('POST', location.href, true);
|
|
// Set up a handler for when the request finishes.
|
|
xhr.onload = function() {
|
|
if(xhr.status === 200) {
|
|
//alert('Success');
|
|
} else {
|
|
//alert('An error occurred!');
|
|
}
|
|
};
|
|
xhr.send(formData);
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|
|
)=====";
|
|
|
|
static const char PAGE_INFO[] PROGMEM = R"=====(
|
|
<!DOCTYPE html><html lang="en"><head><meta charset= "utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
|
<title>)=====" WIFICONFIG_WEBTITLE R"=====(</title>
|
|
<style>
|
|
.c{text-align: center;}
|
|
div,input{padding:5px;font-size:1em;}
|
|
input{width:95%;}
|
|
body{text-align: center;font-family:verdana;}
|
|
button{border:0;border-radius:0.3rem;background-color:#1fa3ec;color:#fff;line-height:2.4rem;font-size:1.2rem;width:100%;}
|
|
.q{float: right;width: 64px;text-align: right;}
|
|
</style>
|
|
</head><body><h1>)=====" WIFICONFIG_TITLE R"=====(</h1><div style='text-align:left;display:inline-block;min-width:260px;'>
|
|
<form><table><tr><th>System Info<th>
|
|
<tr><td>Core Version:<td>$SDK$
|
|
<tr><td>Flash Size:<td>$FS$ kB
|
|
<tr><td>Sketch Size/Free:<td>$SS$ kB / $FSS$ kB
|
|
<tr><td>STA MAC:<td>$STAMAC$
|
|
<tr><td>AP MAC:<td>$APMAC$
|
|
<tr><td>ESP Chip ID:<td>$ESPID$
|
|
<tr><td>Flash Chip ID:<td>$FID$
|
|
</table></form>
|
|
)=====";
|
|
|
|
static const char PAGE_RESTORE[] PROGMEM = R"=====(
|
|
<form action="/o" method="post">
|
|
<button class="yellow">Předminulá konfigurace</button>
|
|
</form><br/>
|
|
)=====";
|