mirror of https://github.com/jeelabs/esp-link.git
parent
8bb8e1124b
commit
7ade39d986
@ -1,14 +1,19 @@ |
|||||||
<html><head><title>MCU Console - ESP Link</title> |
%head% |
||||||
<link rel="stylesheet" type="text/css" href="style.css"> |
|
||||||
</head> |
<div id="main"> |
||||||
<body> |
<div class="header"> |
||||||
<div id="main"> |
<h1><span class="esp">esp</span> link - Microcontroller Console</h1> |
||||||
<div id="topnav">%topnav%</div> |
</div> |
||||||
<h1><span class="esp">esp</span> link - Microcontroller Console</h1> |
|
||||||
<p>The Microcontroller console shows the last 1024 characters received from UART0, to which |
<div class="content"> |
||||||
a microcontroller is tpically attached.</p> |
<p>The Microcontroller console shows the last 1024 characters received from UART0, to which |
||||||
<pre class="console"> |
a microcontroller is typically attached.</p> |
||||||
|
<pre class="console"> |
||||||
%console% |
%console% |
||||||
</pre> |
</pre> |
||||||
|
</div> |
||||||
|
</div> |
||||||
</div> |
</div> |
||||||
|
|
||||||
|
<script src="ui.js"></script> |
||||||
</body></html> |
</body></html> |
||||||
|
@ -0,0 +1,16 @@ |
|||||||
|
<html><head> |
||||||
|
<title>ESP Link</title> |
||||||
|
<link rel="stylesheet" href="/pure-min.css"> |
||||||
|
<link rel="stylesheet" href="/style.css"> |
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<div id="layout"> |
||||||
|
<a href="#menu" id="menuLink" class="menu-link"><span></span></a> |
||||||
|
|
||||||
|
<div id="menu"> |
||||||
|
<div class="pure-menu"> |
||||||
|
<a class="pure-menu-heading" href="/">esp-link</a> |
||||||
|
<ul class="pure-menu-list">%topnav%</ul> |
||||||
|
</div> |
||||||
|
</div> |
@ -1,14 +1,17 @@ |
|||||||
<html> |
%head% |
||||||
<head><title>ESP Link</title> |
|
||||||
<link rel="stylesheet" type="text/css" href="style.css"> |
<div id="main"> |
||||||
</head> |
<div class="header"> |
||||||
<body> |
<h1><span class="esp">esp</span> link</h1> |
||||||
<div id="main"> |
</div> |
||||||
<div id="topnav">%topnav%</div> |
|
||||||
<h1><span class="esp">esp</span> link</h1> |
<div class="content"> |
||||||
<p> |
<p>The ESP Link connects the ESP's serial port to Wifi and it can |
||||||
The ESP Link connects the ESP's serial port to Wifi and it can |
program microcontrollers over the serial port, in particular Arduinos, AVRs, and |
||||||
program microcontrollers over the serial port, in particular Arduinos, AVRs, and |
NXP's LPC800-series ARM processors.</p> |
||||||
NXP's LPC800-series ARM processors.</p> |
</div> |
||||||
|
</div> |
||||||
</div> |
</div> |
||||||
|
|
||||||
|
<script src="ui.js"></script> |
||||||
</body></html> |
</body></html> |
||||||
|
@ -1,14 +1,19 @@ |
|||||||
<html><head><title>Log - ESP Link</title> |
%head% |
||||||
<link rel="stylesheet" type="text/css" href="style.css"> |
|
||||||
</head> |
<div id="main"> |
||||||
<body> |
<div class="header"> |
||||||
<div id="main"> |
<h1><span class="esp">esp</span> link - Debug Log</h1> |
||||||
<div id="topnav">%topnav%</div> |
</div> |
||||||
<h1><span class="esp">esp</span> link - Debug Log</h1> |
|
||||||
<p>The debug log shows the 1024 last characters printed by the esp-link software itself to |
<div class="content"> |
||||||
its own debug log.</p> |
<p>The debug log shows the 1024 last characters printed by the esp-link software itself to |
||||||
<pre class="console"> |
its own debug log.</p> |
||||||
|
<pre class="console"> |
||||||
%log% |
%log% |
||||||
</pre> |
</pre> |
||||||
|
</div> |
||||||
|
</div> |
||||||
</div> |
</div> |
||||||
|
|
||||||
|
<script src="ui.js"></script> |
||||||
</body></html> |
</body></html> |
||||||
|
File diff suppressed because one or more lines are too long
@ -0,0 +1,35 @@ |
|||||||
|
(function (window, document) { |
||||||
|
|
||||||
|
var layout = document.getElementById('layout'), |
||||||
|
menu = document.getElementById('menu'), |
||||||
|
menuLink = document.getElementById('menuLink'); |
||||||
|
|
||||||
|
function toggleClass(element, className) { |
||||||
|
var classes = element.className.split(/\s+/), |
||||||
|
length = classes.length, |
||||||
|
i = 0; |
||||||
|
|
||||||
|
for(; i < length; i++) { |
||||||
|
if (classes[i] === className) { |
||||||
|
classes.splice(i, 1); |
||||||
|
break; |
||||||
|
} |
||||||
|
} |
||||||
|
// The className is not found
|
||||||
|
if (length === classes.length) { |
||||||
|
classes.push(className); |
||||||
|
} |
||||||
|
|
||||||
|
element.className = classes.join(' '); |
||||||
|
} |
||||||
|
|
||||||
|
menuLink.onclick = function (e) { |
||||||
|
var active = 'active'; |
||||||
|
|
||||||
|
e.preventDefault(); |
||||||
|
toggleClass(layout, active); |
||||||
|
toggleClass(menu, active); |
||||||
|
toggleClass(menuLink, active); |
||||||
|
}; |
||||||
|
|
||||||
|
}(this, this.document)); |
@ -1,97 +1,103 @@ |
|||||||
<html><head><title>WiFi connection - ESP Link</title> |
%head% |
||||||
<link rel="stylesheet" type="text/css" href="/style.css"> |
|
||||||
<script type="text/javascript" src="140medley.min.js"></script> |
<div id="main"> |
||||||
|
<div class="header"> |
||||||
|
<h1><span class="esp">esp</span> link - Wifi Configuration</h1> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="content"> |
||||||
|
<h2 class="content-subhead">Current Wifi State</h2> |
||||||
|
<p> |
||||||
|
WiFi mode: %WiFiMode%<br> |
||||||
|
Configured network: %currSsid% Status: %currStatus% Phy:%currPhy% |
||||||
|
</p> |
||||||
|
<p>%WiFiapwarn%</p> |
||||||
|
|
||||||
|
<h2 class="content-subhead">Change Wifi association</h2> |
||||||
|
<form name="wifiform" action="connect.cgi" method="post"> |
||||||
|
<p>To connect to a WiFi network, please select one of the detected networks, |
||||||
|
enter the password, and hit the connect button...<p> |
||||||
|
<div id="aps">Scanning...</div> |
||||||
|
<p>WiFi password, if applicable: <br /> |
||||||
|
<input type="text" name="passwd" val="%WiFiPasswd%"> |
||||||
|
<input type="submit" name="connect" value="Connect!"> |
||||||
|
</p> |
||||||
|
</form> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<script src="ui.js"></script> |
||||||
|
<script src="140medley.min.js"></script> |
||||||
<script type="text/javascript"> |
<script type="text/javascript"> |
||||||
|
|
||||||
var xhr=j(); |
var xhr=j(); |
||||||
var currAp="%currSsid%"; |
var currAp="%currSsid%"; |
||||||
|
|
||||||
function createInputForAp(ap) { |
function createInputForAp(ap) { |
||||||
if (ap.essid=="" && ap.rssi==0) return; |
if (ap.essid=="" && ap.rssi==0) return; |
||||||
var div=document.createElement("div"); |
var div=document.createElement("div"); |
||||||
div.id="apdiv"; |
div.id="apdiv"; |
||||||
var rssi=document.createElement("div"); |
var rssi=document.createElement("div"); |
||||||
var rssiVal=-Math.floor(ap.rssi/51)*32; |
var rssiVal=-Math.floor(ap.rssi/51)*32; |
||||||
rssi.className="lock-icon"; |
rssi.className="lock-icon"; |
||||||
rssi.style.backgroundPosition="0px "+rssiVal+"px"; |
rssi.style.backgroundPosition="0px "+rssiVal+"px"; |
||||||
var encrypt=document.createElement("div"); |
var encrypt=document.createElement("div"); |
||||||
var encVal="-64"; //assume wpa/wpa2 |
var encVal="-64"; //assume wpa/wpa2 |
||||||
if (ap.enc=="0") encVal="0"; //open |
if (ap.enc=="0") encVal="0"; //open |
||||||
if (ap.enc=="1") encVal="-32"; //wep |
if (ap.enc=="1") encVal="-32"; //wep |
||||||
encrypt.className="lock-icon"; |
encrypt.className="lock-icon"; |
||||||
encrypt.style.backgroundPosition="-32px "+encVal+"px"; |
encrypt.style.backgroundPosition="-32px "+encVal+"px"; |
||||||
var input=document.createElement("input"); |
var input=document.createElement("input"); |
||||||
input.type="radio"; |
input.type="radio"; |
||||||
input.name="essid"; |
input.name="essid"; |
||||||
input.value=ap.essid; |
input.value=ap.essid; |
||||||
if (currAp==ap.essid) input.checked="1"; |
if (currAp==ap.essid) input.checked="1"; |
||||||
input.id="opt-"+ap.essid; |
input.id="opt-"+ap.essid; |
||||||
var label=document.createElement("label"); |
var label=document.createElement("label"); |
||||||
label.htmlFor="opt-"+ap.essid; |
label.htmlFor="opt-"+ap.essid; |
||||||
label.textContent=ap.essid+" ("+ap.rssi+")"; |
label.textContent=ap.essid+" ("+ap.rssi+")"; |
||||||
div.appendChild(input); |
div.appendChild(input); |
||||||
div.appendChild(rssi); |
div.appendChild(rssi); |
||||||
div.appendChild(encrypt); |
div.appendChild(encrypt); |
||||||
div.appendChild(label); |
div.appendChild(label); |
||||||
return div; |
return div; |
||||||
} |
} |
||||||
|
|
||||||
function getSelectedEssid() { |
function getSelectedEssid() { |
||||||
var e=document.forms.wifiform.elements; |
var e=document.forms.wifiform.elements; |
||||||
for (var i=0; i<e.length; i++) { |
for (var i=0; i<e.length; i++) { |
||||||
if (e[i].type=="radio" && e[i].checked) return e[i].value; |
if (e[i].type=="radio" && e[i].checked) return e[i].value; |
||||||
} |
} |
||||||
return currAp; |
return currAp; |
||||||
} |
} |
||||||
|
|
||||||
|
|
||||||
function scanAPs() { |
function scanAPs() { |
||||||
xhr.open("GET", "wifiscan.cgi"); |
xhr.open("GET", "wifiscan.cgi"); |
||||||
xhr.onreadystatechange=function() { |
xhr.onreadystatechange=function() { |
||||||
if (xhr.readyState==4 && xhr.status>=200 && xhr.status<300) { |
if (xhr.readyState==4 && xhr.status>=200 && xhr.status<300) { |
||||||
var data=JSON.parse(xhr.responseText); |
var data=JSON.parse(xhr.responseText); |
||||||
currAp=getSelectedEssid(); |
currAp=getSelectedEssid(); |
||||||
if (data.result.inProgress=="0" && data.result.APs.length>1) { |
if (data.result.inProgress=="0" && data.result.APs.length>1) { |
||||||
$("#aps").innerHTML=""; |
$("#aps").innerHTML=""; |
||||||
for (var i=0; i<data.result.APs.length; i++) { |
for (var i=0; i<data.result.APs.length; i++) { |
||||||
if (data.result.APs[i].essid=="" && data.result.APs[i].rssi==0) continue; |
if (data.result.APs[i].essid=="" && data.result.APs[i].rssi==0) continue; |
||||||
$("#aps").appendChild(createInputForAp(data.result.APs[i])); |
$("#aps").appendChild(createInputForAp(data.result.APs[i])); |
||||||
} |
} |
||||||
window.setTimeout(scanAPs, 20000); |
window.setTimeout(scanAPs, 20000); |
||||||
} else { |
} else { |
||||||
window.setTimeout(scanAPs, 1000); |
window.setTimeout(scanAPs, 1000); |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
xhr.send(); |
xhr.send(); |
||||||
} |
} |
||||||
|
|
||||||
|
|
||||||
window.onload=function(e) { |
window.onload=function(e) { |
||||||
scanAPs(); |
scanAPs(); |
||||||
}; |
}; |
||||||
</script> |
</script> |
||||||
</head> |
</body></html> |
||||||
<body> |
|
||||||
<div id="main"> |
|
||||||
<div id="topnav">%topnav%</div> |
|
||||||
<h1><span class="esp">esp</span> link - Wifi Configuration</h1> |
|
||||||
<p> |
|
||||||
Current WiFi mode: %WiFiMode%<br> |
|
||||||
Current network: %currSsid% Status: %currStatus% Phy:%currPhy% |
|
||||||
</p> |
|
||||||
<p> |
|
||||||
Note: %WiFiapwarn% |
|
||||||
</p> |
|
||||||
<form name="wifiform" action="connect.cgi" method="post"> |
|
||||||
<p> |
|
||||||
To connect to a WiFi network, please select one of the detected networks...<br> |
|
||||||
<div id="aps">Scanning...</div> |
|
||||||
<br> |
|
||||||
WiFi password, if applicable: <br /> |
|
||||||
<input type="text" name="passwd" val="%WiFiPasswd%"> <br /> |
|
||||||
<input type="submit" name="connect" value="Connect!"> |
|
||||||
</p> |
|
||||||
</div> |
|
||||||
</body> |
|
||||||
</html> |
|
||||||
|
Loading…
Reference in new issue