kopia lustrzana https://github.com/tayfunulu/WiFiManager
Improve webinterface
rodzic
9d3094862a
commit
0370235697
230
wifimgr.py
230
wifimgr.py
|
@ -9,6 +9,109 @@ ap_authmode = 3 # WPA2
|
|||
|
||||
NETWORK_PROFILES = 'wifi.dat'
|
||||
|
||||
html_head = """
|
||||
<head>
|
||||
<title>WiFi Manager</title>
|
||||
<style>
|
||||
body {
|
||||
margin: 0px 20px;
|
||||
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
li {
|
||||
margin: 0px -10px;
|
||||
padding: 10px 10px 10px 10px;
|
||||
}
|
||||
|
||||
a, h1, h2, h3 {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
p > a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a > li,
|
||||
li[onclick] {
|
||||
background-color: #ffffff00;
|
||||
transition: background-color .5s;
|
||||
}
|
||||
|
||||
a:hover li, a:active li,
|
||||
li:hover[onclick], li:active[onclick] {
|
||||
background-color: #ddd;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
h1, form {
|
||||
position: relative;
|
||||
max-width: 750px;
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin: 10px 0px -10px 0px;
|
||||
}
|
||||
|
||||
select:-moz-focusring {
|
||||
color: transparent;
|
||||
text-shadow: 0 0 0 #000;
|
||||
}
|
||||
|
||||
button {
|
||||
position: relative;
|
||||
max-width: 750px;
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
padding: 10px 10px 10px 10px;
|
||||
display: block;
|
||||
text-align: left;
|
||||
border: none;
|
||||
background: transparent;
|
||||
font-size: 1em;
|
||||
background-color: #ffffff00;
|
||||
transition: background-color .5s;
|
||||
}
|
||||
|
||||
button:hover, button:active {
|
||||
background-color: #ddd;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#submit {
|
||||
border: none;
|
||||
background: transparent;
|
||||
padding: 0px;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.monospace {
|
||||
font-family: 'Roboto Mono', monospace;
|
||||
}
|
||||
|
||||
.fixedWidth {
|
||||
width: 100px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
"""
|
||||
|
||||
wlan_ap = network.WLAN(network.AP_IF)
|
||||
wlan_sta = network.WLAN(network.STA_IF)
|
||||
|
||||
|
@ -119,62 +222,58 @@ def handle_root(client):
|
|||
wlan_sta.active(True)
|
||||
ssids = sorted(ssid.decode('utf-8') for ssid, *_ in wlan_sta.scan())
|
||||
send_header(client)
|
||||
client.sendall("<html>")
|
||||
client.sendall(html_head)
|
||||
client.sendall("""\
|
||||
<html>
|
||||
<h1 style="color: #5e9ca0; text-align: center;">
|
||||
<span style="color: #ff0000;">
|
||||
Wi-Fi Client Setup
|
||||
</span>
|
||||
</h1>
|
||||
<form action="configure" method="post">
|
||||
<table style="margin-left: auto; margin-right: auto;">
|
||||
<tbody>
|
||||
<body>
|
||||
<form action="configure" method="post">
|
||||
<h1>
|
||||
Wi-Fi Client Setup
|
||||
</h1>
|
||||
<h3>
|
||||
SSIDs (click to select)
|
||||
</h3>
|
||||
<ul>
|
||||
""")
|
||||
while len(ssids):
|
||||
ssid = ssids.pop(0)
|
||||
client.sendall("""\
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<input type="radio" name="ssid" value="{0}" />{0}
|
||||
</td>
|
||||
</tr>
|
||||
<a onclick="document.getElementById('ssid').value = '{0}';" href="javascript:void(0)">
|
||||
<li>
|
||||
{0}
|
||||
</li>
|
||||
</a>
|
||||
""".format(ssid))
|
||||
client.sendall("""\
|
||||
<tr>
|
||||
<td>Password:</td>
|
||||
<td><input name="password" type="password" /></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p style="text-align: center;">
|
||||
<input type="submit" value="Submit" />
|
||||
</p>
|
||||
</form>
|
||||
<p> </p>
|
||||
<hr />
|
||||
<h5>
|
||||
<span style="color: #ff0000;">
|
||||
Your ssid and password information will be saved into the
|
||||
"%(filename)s" file in your ESP module for future usage.
|
||||
Be careful about security!
|
||||
</span>
|
||||
</h5>
|
||||
<hr />
|
||||
<h2 style="color: #2e6c80;">
|
||||
Some useful infos:
|
||||
</h2>
|
||||
<ul>
|
||||
<li>
|
||||
Original code from <a href="https://github.com/cpopp/MicroPythonSamples"
|
||||
target="_blank" rel="noopener">cpopp/MicroPythonSamples</a>.
|
||||
</li>
|
||||
<li>
|
||||
This code available at <a href="https://github.com/tayfunulu/WiFiManager"
|
||||
target="_blank" rel="noopener">tayfunulu/WiFiManager</a>.
|
||||
</li>
|
||||
</ul>
|
||||
<li onclick="document.getElementById('ssid').focus()">
|
||||
<span class="fixedWidth">SSID</span>
|
||||
<input id="ssid" name="ssid" type="text"/>
|
||||
</li>
|
||||
<li onclick="document.getElementById('password').focus()">
|
||||
<span class="fixedWidth">Password</span>
|
||||
<input id="password" name="password" type="password"/>
|
||||
</li>
|
||||
<li onclick="document.getElementById('submit').click()">
|
||||
<input id=submit type="submit" value="Submit" />
|
||||
</li>
|
||||
</ul>
|
||||
<div class="placeholder"></div>
|
||||
<h2>
|
||||
Infos:
|
||||
</h2>
|
||||
<p>
|
||||
Your ssid and password information will be saved into the "{}" file in your ESP module for future usage. Be careful about security!
|
||||
</p>
|
||||
<p>
|
||||
Original code from <a href="https://github.com/cpopp/MicroPythonSamples" target="_blank" rel="noopener">cpopp/MicroPythonSamples</a>.
|
||||
</p>
|
||||
<p>
|
||||
This code available at <a href="https://github.com/tayfunulu/WiFiManager" target="_blank" rel="noopener">tayfunulu/WiFiManager</a>.
|
||||
</p>
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
""" % dict(filename=NETWORK_PROFILES))
|
||||
""".format(NETWORK_PROFILES))
|
||||
client.close()
|
||||
|
||||
|
||||
|
@ -196,17 +295,14 @@ def handle_configure(client, request):
|
|||
if do_connect(ssid, password):
|
||||
response = """\
|
||||
<html>
|
||||
<center>
|
||||
<br><br>
|
||||
<h1 style="color: #5e9ca0; text-align: center;">
|
||||
<span style="color: #ff0000;">
|
||||
ESP successfully connected to WiFi network %(ssid)s.
|
||||
</span>
|
||||
{}
|
||||
<body>
|
||||
<h1>
|
||||
ESP successfully connected to WiFi network "<span class="monospace">{}</span>"
|
||||
</h1>
|
||||
<br><br>
|
||||
</center>
|
||||
</body>
|
||||
</html>
|
||||
""" % dict(ssid=ssid)
|
||||
""".format(html_head, ssid)
|
||||
send_response(client, response)
|
||||
try:
|
||||
profiles = read_profiles()
|
||||
|
@ -218,19 +314,15 @@ def handle_configure(client, request):
|
|||
else:
|
||||
response = """\
|
||||
<html>
|
||||
<center>
|
||||
<h1 style="color: #5e9ca0; text-align: center;">
|
||||
<span style="color: #ff0000;">
|
||||
ESP could not connect to WiFi network %(ssid)s.
|
||||
</span>
|
||||
{}
|
||||
<body>
|
||||
<h1>
|
||||
ESP could not connect to WiFi network "<span class="monospace">{}</span>"
|
||||
</h1>
|
||||
<br><br>
|
||||
<form>
|
||||
<input type="button" value="Go back!" onclick="history.back()"></input>
|
||||
</form>
|
||||
</center>
|
||||
<button onclick="history.back()">Go back</button>
|
||||
</body>
|
||||
</html>
|
||||
""" % dict(ssid=ssid)
|
||||
""".format(html_head, ssid)
|
||||
send_response(client, response)
|
||||
return False
|
||||
|
||||
|
@ -265,7 +357,7 @@ def start(port=80):
|
|||
client, addr = server_socket.accept()
|
||||
print('client connected from', addr)
|
||||
try:
|
||||
client.settimeout(5.0)
|
||||
client.settimeout(15.0)
|
||||
request = b""
|
||||
try:
|
||||
while "\r\n\r\n" not in request:
|
||||
|
|
Ładowanie…
Reference in New Issue