espterm demo html

master
Ondřej Hruška 7 years ago
parent b58b0e9abd
commit 0086099d93
  1. 2
      README.md
  2. 114
      about.html
  3. 140
      cfg_network.html
  4. 139
      cfg_system.html
  5. 277
      cfg_term.html
  6. 165
      cfg_wifi.html
  7. 120
      cfg_wifi_conn.html
  8. 1810
      css/app.css
  9. BIN
      favicon.ico
  10. 959
      help.html
  11. 5
      img/cvut.svg
  12. BIN
      img/loader.gif
  13. BIN
      img/vt100.jpg
  14. 2
      index.html
  15. 2533
      js/app.js
  16. 1
      network_set.html
  17. 1
      reset_screen.html
  18. 1
      restore_defaults.html
  19. 1
      restore_hard.html
  20. 1
      system_set.html
  21. 123
      term.html
  22. 1
      term_set.html
  23. 1
      wifi_connstatus.html
  24. 1
      wifi_scan.html
  25. 1
      wifi_set.html
  26. 1
      write_defaults.html

@ -1,2 +0,0 @@
# espterm.github.io
ESPTerm website

@ -0,0 +1,114 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>About ESPTerm :: ESPTerm</title>
<link href="/css/app.css" rel="stylesheet">
<script src="/js/app.js"></script>
<script>
var _root = location.host;
var _demo = 1;
</script>
</head>
<body class="cfg page-about">
<div id="outer">
<nav id="menu">
<div id="brand" tabindex=0>ESPTerm</div>
<a href="term.html" class="icn-back">Back to Terminal</a>
<a href="cfg_term.html" class="icn-terminal ">Terminal Settings</a><a href="cfg_wifi.html" class="icn-wifi ">WiFi Settings</a><a href="cfg_network.html" class="icn-network ">Network Settings</a><a href="cfg_system.html" class="icn-configure ">System Settings</a><a href="help.html" class="icn-help ">Quick Reference</a><a href="about.html" class="icn-about selected">About ESPTerm</a></nav>
<script>
function menuOpen() { $('#menu').toggleClass('expanded') }
$('#brand').on('click', menuOpen).on('keypress', cr(menuOpen));
</script>
<div id="content">
<img src="/img/loader.gif" alt="Loading…" id="loader">
<h1>About ESPTerm</h1>
<div class="Box errors hidden">
<span class="lead">Validation errors for:</span>&nbsp;<span class="list"></span>
</div>
<div class="Box">
<img src="/img/cvut.svg" id="logo" class="mq-tablet-min">
<h2>ESP8266 Remote Terminal</h2>
<img src="/img/cvut.svg" id="logo2" class="mq-phone">
<p>
&copy; Ondřej Hruška, 2016-2017
&lt;<a href="mailto:ondra@ondrovo.com">ondra@ondrovo.com</a>&gt;
</p>
<p>
<a href="http://measure.feld.cvut.cz/" target="blank">Katedra měření, FEL ČVUT</a><br>
Department of Measurement, FEE CTU
</p>
</div>
<div class="Box">
<h2>Version</h2>
<table>
<tr>
<th>ESPTerm</th>
<td>v1.2.3, built 2017-09-07 at 16:17</td>
</tr>
<tr>
<th>libesphttpd</th>
<td>v4.5.6</td>
</tr>
<tr>
<th>ESP&nbsp;IoT&nbsp;SDK</th>
<td>v1.52</td>
</tr>
</table>
</div>
<div class="Box">
<h2>Issues</h2>
<p>
Please report any issues to the <a href="https://github.com/MightyPork/esp-vt100-firmware/issues">bugtracker</a> or send them by e-mail (see above).
</p>
<p>
Firmware updates can be downloaded from the <a href="https://github.com/MightyPork/esp-vt100-firmware/releases">releases page</a> and flashed
with <a href="https://github.com/espressif/esptool">esptool.py</a>.
</p>
</div>
<div class="Box">
<h2>Contributing</h2>
<p>
<i class="icn-github"></i> You're welcome to submit your improvements and ideas to our <a href="https://github.com/MightyPork/esp-vt100-firmware">GitHub repository</a>!
</p>
<p>
<i class="icn-donate"></i> If you'd like to donate, please try <a href="https://paypal.me/mightypork">PayPal</a> or
<a href="https://liberapay.com/MightyPork/">LiberaPay</a>.
</p>
</div>
<div class="Box">
<h2>Thanks</h2>
<p>
The webserver is based on a <a href="https://github.com/MightyPork/libesphttpd">fork</a> of the
<a href="https://github.com/Spritetm/esphttpd">esphttpd</a> library by Jeroen Domburg (Sprite_tm).
</p>
<p>
Using (modified) JS library <a href="https://github.com/kylebarrow/chibi">chibi.js</a> by
Kyle Barrow as a lightweight jQuery alternative.
</p>
</div>
<div class="botpad"></div>
<div class="NotifyMsg hidden" id="notif"></div>
</div>
</div>
</body>
</html>

@ -0,0 +1,140 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Network Settings :: ESPTerm</title>
<link href="/css/app.css" rel="stylesheet">
<script src="/js/app.js"></script>
<script>
var _root = location.host;
var _demo = 1;
</script>
</head>
<body class="cfg">
<div id="outer">
<nav id="menu">
<div id="brand" tabindex=0>ESPTerm</div>
<a href="term.html" class="icn-back">Back to Terminal</a>
<a href="cfg_term.html" class="icn-terminal ">Terminal Settings</a><a href="cfg_wifi.html" class="icn-wifi ">WiFi Settings</a><a href="cfg_network.html" class="icn-network selected">Network Settings</a><a href="cfg_system.html" class="icn-configure ">System Settings</a><a href="help.html" class="icn-help ">Quick Reference</a><a href="about.html" class="icn-about ">About ESPTerm</a></nav>
<script>
function menuOpen() { $('#menu').toggleClass('expanded') }
$('#brand').on('click', menuOpen).on('keypress', cr(menuOpen));
</script>
<div id="content">
<img src="/img/loader.gif" alt="Loading…" id="loader">
<h1>Network Settings</h1>
<div class="Box errors hidden">
<span class="lead">Validation errors for:</span>&nbsp;<span class="list"></span>
</div>
<form class="Box str mobcol" action="network_set.html" method="GET" id="form-2">
<h2 tabindex=0>DHCP Client (Station)</h2>
<div class="Row explain">
Switch off Dynamic IP to configure the static IP address. </div>
<div class="Row checkbox x-static-toggle" >
<label>Use dynamic IP</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="sta_dhcp_enable" name="sta_dhcp_enable" value="1">
</div>
<div class="Row x-static">
<label for="sta_addr_ip">ESPTerm static IP</label>
<input type="text" name="sta_addr_ip" id="sta_addr_ip" value="192.168.0.33" pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$" required>
</div>
<div class="Row x-static">
<label for="sta_addr_mask">Subnet mask</label>
<input type="text" name="sta_addr_mask" id="sta_addr_mask" value="255.255.255.0" pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$" required>
</div>
<div class="Row x-static">
<label for="sta_addr_gw">Gateway IP</label>
<input type="text" name="sta_addr_gw" id="sta_addr_gw" value="192.168.0.1" pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$" required>
</div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-2').submit()">Apply!</a>
</div>
</form>
<form class="Box str mobcol" action="network_set.html" method="GET" id="form-1">
<h2 tabindex=0>DHCP Server (AP)</h2>
<div class="Row explain">
Those settings affect the built-in DHCP server in AP mode. </div>
<div class="Row">
<label for="ap_addr_mask">Subnet mask</label>
<input type="text" name="ap_addr_mask" id="ap_addr_mask" value="255.255.255.0" pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$" required>
</div>
<div class="Row">
<label for="ap_addr_ip">Own IP address</label>
<input type="text" name="ap_addr_ip" id="ap_addr_ip" value="192.168.4.1" pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$" required>
</div>
<div class="Row">
<label for="ap_dhcp_start">Pool start IP</label>
<input type="text" name="ap_dhcp_start" id="ap_dhcp_start" value="192.168.4.100" pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$" required>
</div>
<div class="Row">
<label for="ap_dhcp_end">Pool end IP</label>
<input type="text" name="ap_dhcp_end" id="ap_dhcp_end" value="192.168.4.200" pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$" required>
</div>
<div class="Row">
<label for="ap_dhcp_time">Lease time<span class="mq-phone">&nbsp;(min)</span></label>
<input type="number" step=1 min=1 max=2880 name="ap_dhcp_time" id="ap_dhcp_time" value="120" required>
<span class="mq-no-phone">&nbsp;min</span>
</div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-1').submit()">Apply!</a>
</div>
</form>
<div class="Box mobcol">
<h2>MAC addresses</h2>
<div class="Row">
<label>Station MAC</label><input type="text" readonly value="5c:cf:7f:02:74:51">
</div>
<div class="Row">
<label>AP MAC</label><input type="text" readonly value="5e:cf:7f:02:74:51">
</div>
</div>
<script>
function updateStaticDisp() {
var sttc = !parseInt($('#sta_dhcp_enable').val());
$('.x-static').toggleClass('hidden', !sttc);
}
$('.x-static-toggle').on('click', function() {
setTimeout(function() {
updateStaticDisp();
}, 0)
});
updateStaticDisp();
</script>
<div class="botpad"></div>
<div class="NotifyMsg hidden" id="notif"></div>
</div>
</div>
</body>
</html>

@ -0,0 +1,139 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>System Settings :: ESPTerm</title>
<link href="/css/app.css" rel="stylesheet">
<script src="/js/app.js"></script>
<script>
var _root = location.host;
var _demo = 1;
</script>
</head>
<body class="cfg">
<div id="outer">
<nav id="menu">
<div id="brand" tabindex=0>ESPTerm</div>
<a href="term.html" class="icn-back">Back to Terminal</a>
<a href="cfg_term.html" class="icn-terminal ">Terminal Settings</a><a href="cfg_wifi.html" class="icn-wifi ">WiFi Settings</a><a href="cfg_network.html" class="icn-network ">Network Settings</a><a href="cfg_system.html" class="icn-configure selected">System Settings</a><a href="help.html" class="icn-help ">Quick Reference</a><a href="about.html" class="icn-about ">About ESPTerm</a></nav>
<script>
function menuOpen() { $('#menu').toggleClass('expanded') }
$('#brand').on('click', menuOpen).on('keypress', cr(menuOpen));
</script>
<div id="content">
<img src="/img/loader.gif" alt="Loading…" id="loader">
<h1>System Settings</h1>
<div class="Box errors hidden">
<span class="lead">Validation errors for:</span>&nbsp;<span class="list"></span>
</div>
<div class="Box str mobcol">
<h2 tabindex=0>Save & Restore</h2>
<div class="Row explain nomargintop">
ESPTerm contains two persistent memory banks, one for default and
one for active settings. Active settings can be stored as defaults
by the administrator (password required).
</div>
<div class="Row buttons2">
<a class="button icn-restore"
onclick="return confirm('Restore all settings to their default values?');"
href="restore_defaults.html">
Reset active settings to defaults </a>
</div>
<div class="Row buttons2">
<a onclick="writeDefaults(); return false;" href="#">Save active settings as defaults</a>
</div>
<div class="Row buttons2">
<a onclick="return confirm('Restore to firmware default settings? This will reset all active settings and switch to AP mode with the default SSID.');"
href="restore_hard.html">
Reset active settings to firmware defaults </a>
</div>
</div>
<form class="Box str mobcol" action="system_set.html" method="GET" id="form-1">
<h2 tabindex=0>Serial Port</h2>
<div class="Row explain">
This form controls the primary, communication UART. The debug UART is fixed at 115.200 baud, one stop-bit and no parity.
</div>
<div class="Row">
<label for="uart_baud">Baud rate<span class="mq-phone">&nbsp;(bps)</span></label>
<select name="uart_baud" id="uart_baud" class="short">
<option value="300">300</option>
<option value="600">600</option>
<option value="1200">1.200</option>
<option value="2400">2.400</option>
<option value="4800">4.800</option>
<option value="9600">9.600</option>
<option value="19200">19.200</option>
<option value="38400">38.400</option>
<option value="57600">57.600</option>
<option value="74880">74.880</option>
<option value="115200">115.200</option>
<option value="230400">230.400</option>
<option value="460800">460.800</option>
<option value="921600">921.600</option>
<option value="1843200">1.843.200</option>
<option value="3686400">3.686.400</option>
</select>
<span class="mq-no-phone">&nbsp;bps</span>
</div>
<div class="Row">
<label for="uart_parity">Parity</label>
<select name="uart_parity" id="uart_parity" class="short">
<option value="2">None</option>
<option value="1">Odd</option>
<option value="0">Even</option>
</select>
</div>
<div class="Row">
<label for="uart_stopbits">Stop-bits</label>
<select name="uart_stopbits" id="uart_stopbits" class="short">
<option value="1">One</option>
<option value="2">One and half</option>
<option value="3">Two</option>
</select>
</div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-1').submit()">Apply!</a>
</div>
</form>
<script>
function writeDefaults() {
var pw = prompt('Enter admin password to confirm you want to store the current settings as defaults.');
if (!pw) return;
location.href = "write_defaults.html" + '?pw=' + pw;
}
$('#uart_baud').val(115200);
$('#uart_parity').val(2);
$('#uart_stopbits').val(1);
</script>
<div class="botpad"></div>
<div class="NotifyMsg hidden" id="notif"></div>
</div>
</div>
</body>
</html>

@ -0,0 +1,277 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Terminal Settings :: ESPTerm</title>
<link href="/css/app.css" rel="stylesheet">
<script src="/js/app.js"></script>
<script>
var _root = location.host;
var _demo = 1;
</script>
</head>
<body class="cfg">
<div id="outer">
<nav id="menu">
<div id="brand" tabindex=0>ESPTerm</div>
<a href="term.html" class="icn-back">Back to Terminal</a>
<a href="cfg_term.html" class="icn-terminal selected">Terminal Settings</a><a href="cfg_wifi.html" class="icn-wifi ">WiFi Settings</a><a href="cfg_network.html" class="icn-network ">Network Settings</a><a href="cfg_system.html" class="icn-configure ">System Settings</a><a href="help.html" class="icn-help ">Quick Reference</a><a href="about.html" class="icn-about ">About ESPTerm</a></nav>
<script>
function menuOpen() { $('#menu').toggleClass('expanded') }
$('#brand').on('click', menuOpen).on('keypress', cr(menuOpen));
</script>
<div id="content">
<img src="/img/loader.gif" alt="Loading…" id="loader">
<h1>Terminal Settings</h1>
<div class="Box errors hidden">
<span class="lead">Validation errors for:</span>&nbsp;<span class="list"></span>
</div>
<div class="Box">
<a href="reset_screen.html">Reset screen & parser</a>
</div>
<form class="Box mobopen str" action="term_set.html" method="GET" id='form-1'>
<h2>Initial Settings</h2>
<div class="Row explain">
Those are the initial settings used after ESPTerm powers on or when the screen
reset command is received. Some options can be changed by the application via escape sequences,
those changes won't be saved in Flash.
</div>
<div class="Row">
<label for="theme">Color scheme</label>
<select name="theme" id="theme" class="short" onchange="showColor()">
<option value="0">Tango</option>
<option value="1">Linux</option>
<option value="2">XTerm</option>
<option value="3">Rxvt</option>
<option value="4">Ambience</option>
<option value="5">Solarized</option>
</select>
</div>
<div class="Row color-preview">
<div class="colorprev">
<span data-fg=0 class="bg0 fg0">30</span><!--
--><span data-fg=1 class="bg0 fg1">31</span><!--
--><span data-fg=2 class="bg0 fg2">32</span><!--
--><span data-fg=3 class="bg0 fg3">33</span><!--
--><span data-fg=4 class="bg0 fg4">34</span><!--
--><span data-fg=5 class="bg0 fg5">35</span><!--
--><span data-fg=6 class="bg0 fg6">36</span><!--
--><span data-fg=7 class="bg0 fg7">37</span>
</div>
<div class="colorprev">
<span data-fg=8 class="bg0 fg8">90</span><!--
--><span data-fg=9 class="bg0 fg9">91</span><!--
--><span data-fg=10 class="bg0 fg10">92</span><!--
--><span data-fg=11 class="bg0 fg11">93</span><!--
--><span data-fg=12 class="bg0 fg12">94</span><!--
--><span data-fg=13 class="bg0 fg13">95</span><!--
--><span data-fg=14 class="bg0 fg14">96</span><!--
--><span data-fg=15 class="bg0 fg15">97</span>
</div>
<div class="colorprev">
<span data-bg=0 class="bg0 fg15">40</span><!--
--><span data-bg=1 class="bg1 fg15">41</span><!--
--><span data-bg=2 class="bg2 fg15">42</span><!--
--><span data-bg=3 class="bg3 fg0">43</span><!--
--><span data-bg=4 class="bg4 fg15">44</span><!--
--><span data-bg=5 class="bg5 fg15">45</span><!--
--><span data-bg=6 class="bg6 fg15">46</span><!--
--><span data-bg=7 class="bg7 fg0">47</span>
</div>
<div class="colorprev">
<span data-bg=8 class="bg8 fg15">100</span><!--
--><span data-bg=9 class="bg9 fg0">101</span><!--
--><span data-bg=10 class="bg10 fg0">102</span><!--
--><span data-bg=11 class="bg11 fg0">103</span><!--
--><span data-bg=12 class="bg12 fg0">104</span><!--
--><span data-bg=13 class="bg13 fg0">105</span><!--
--><span data-bg=14 class="bg14 fg0">106</span><!--
--><span data-bg=15 class="bg15 fg0">107</span>
</div>
</div>
<div class="Row color-preview">
<div style="
" id="color-example">
Default colors preview </div>
</div>
<div class="Row">
<label>Text / background</label>
<select name="default_fg" id="default_fg" class="short" onchange="showColor()">
<option value="0">Black</option>
<option value="1">Red</option>
<option value="2">Green</option>
<option value="3">Yellow</option>
<option value="4">Blue</option>
<option value="5">Purple</option>
<option value="6">Cyan</option>
<option value="7">Silver</option>
<option value="8">Gray</option>
<option value="9">Light Red</option>
<option value="10">Light Green</option>
<option value="11">Light Yellow</option>
<option value="12">Light Blue</option>
<option value="13">Light Purple</option>
<option value="14">Light Cyan</option>
<option value="15">White</option>
</select>&nbsp;<!--
--><select name="default_bg" id="default_bg" class="short" onchange="showColor()">
<option value="0">Black</option>
<option value="1">Red</option>
<option value="2">Green</option>
<option value="3">Yellow</option>
<option value="4">Blue</option>
<option value="5">Purple</option>
<option value="6">Cyan</option>
<option value="7">Silver</option>
<option value="8">Gray</option>
<option value="9">Light Red</option>
<option value="10">Light Green</option>
<option value="11">Light Yellow</option>
<option value="12">Light Blue</option>
<option value="13">Light Purple</option>
<option value="14">Light Cyan</option>
<option value="15">White</option>
</select>
</div>
<div class="Row">
<label for="term_width">Width / height</label>
<input type="number" step=1 min=1 max=255 name="term_width" id="term_width" value="80" required>&nbsp;<!--
--><input type="number" step=1 min=1 max=255 name="term_height" id="term_height" value="25" required>
</div>
<div class="Row">
<label for="term_title">Header text</label>
<input type="text" name="term_title" id="term_title" value="TESPTerm Web UI Demo" required>
</div>
<div class="Row">
<label>Button labels</label>
<input class="short" type="text" name="btn1" id="btn1" value="OK">&nbsp;
<input class="short" type="text" name="btn2" id="btn2" value="Cancel">&nbsp;
<input class="short" type="text" name="btn3" id="btn3" value="">&nbsp;
<input class="short" type="text" name="btn4" id="btn4" value="">&nbsp;
<input class="short" type="text" name="btn5" id="btn5" value="Help">
</div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-1').submit()">Apply!</a>
</div>
</form>
<form class="Box fold str" action="term_set.html" method="GET" id='form-2'>
<h2>Expert Options</h2>
<div class="Row explain">
Those are advanced config options that usually don't need to be changed.
Edit them only if you know what you're doing. </div>
<div class="Row">
<label for="parser_tout_ms">Parser timeout<span class="mq-phone">&nbsp;(ms)</span></label>
<input type="number" step=1 min=0 name="parser_tout_ms" id="parser_tout_ms" value="10" required>
<span class="mq-no-phone">&nbsp;ms</span>
</div>
<div class="Row">
<label for="display_tout_ms">Redraw delay<span class="mq-phone">&nbsp;(ms)</span></label>
<input type="number" step=1 min=0 name="display_tout_ms" id="display_tout_ms" value="15" required>
<span class="mq-no-phone">&nbsp;ms</span>
</div>
<div class="Row">
<label for="display_cooldown_ms">Redraw cooldown<span class="mq-phone">&nbsp;(ms)</span></label>
<input type="number" step=1 min=0 name="display_cooldown_ms" id="display_cooldown_ms" value="35" required>
<span class="mq-no-phone">&nbsp;ms</span>
</div>
<div class="Row">
<label>Button codes<br>(ASCII, dec, CSV)</label>
<input class="short" type="text" name="bm1" id="bm1" value="01,121">&nbsp;
<input class="short" type="text" name="bm2" id="bm2" value="01,110">&nbsp;
<input class="short" type="text" name="bm3" id="bm3" value="">&nbsp;
<input class="short" type="text" name="bm4" id="bm4" value="">&nbsp;
<input class="short" type="text" name="bm5" id="bm5" value="05">
</div>
<div class="Row checkbox" >
<label>SS3 Fn keys</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="fn_alt_mode" name="fn_alt_mode" value="1">
</div>
<div class="Row checkbox" >
<label>Show buttons</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="show_buttons" name="show_buttons" value="1">
</div>
<div class="Row checkbox" >
<label>Show nav links</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="show_config_links" name="show_config_links" value="1">
</div>
<div class="Row checkbox" >
<label>Local Echo</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="loopback" name="loopback" value="">
</div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-2').submit()">Apply!</a>
</div>
</form>
<script>
$('#default_fg').val(7);
$('#default_bg').val(0);
$('#theme').val(0);
function showColor() {
var ex = qs('#color-example');
ex.className = '';
ex.classList.add('fg'+$('#default_fg').val());
ex.classList.add('bg'+$('#default_bg').val());
var th = $('#theme').val();
$('.color-preview').forEach(function(e) {
e.className = 'Row color-preview theme-'+th;
});
}
showColor();
$('.colorprev span').on('click', function() {
var fg = this.dataset.fg;
var bg = this.dataset.bg;
if (typeof fg != 'undefined') $('#default_fg').val(fg);
if (typeof bg != 'undefined') $('#default_bg').val(bg);
showColor()
});
</script>
<div class="botpad"></div>
<div class="NotifyMsg hidden" id="notif"></div>
</div>
</div>
</body>
</html>

@ -0,0 +1,165 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>WiFi Settings :: ESPTerm</title>
<link href="/css/app.css" rel="stylesheet">
<script src="/js/app.js"></script>
<script>
var _root = location.host;
var _demo = 1;
var _demo_aps = "{\n \"result\": {\n \"inProgress\": 0,\n \"APs\": [\n {\"essid\": \"Cisco\", \"bssid\": \"88:f7:c7:52:b3:99\", \"rssi\": 205, \"rssi_perc\": 100, \"enc\": 4, \"channel\": 7},\n {\"essid\": \"UPC Wi-Free\", \"bssid\": \"8a:f7:c7:52:b3:9b\", \"rssi\": 203, \"rssi_perc\": 100, \"enc\": 5, \"channel\": 1},\n {\"essid\": \"UPC Wi-Free\", \"bssid\": \"0a:95:2a:0c:84:31\", \"rssi\": 166, \"rssi_perc\": 32, \"enc\": 5, \"channel\": 1},\n {\"essid\": \"MujO2Internet_2EEB96\", \"bssid\": \"d0:60:8c:2e:eb:96\", \"rssi\": 174, \"rssi_perc\": 48, \"enc\": 4, \"channel\": 4},\n {\"essid\": \"Internet\", \"bssid\": \"38:72:c0:32:bd:0d\", \"rssi\": 164, \"rssi_perc\": 28, \"enc\": 2, \"channel\": 10},\n {\"essid\": \"MyO2Internet_08C850\", \"bssid\": \"78:c1:a7:08:c8:50\", \"rssi\": 186, \"rssi_perc\": 72, \"enc\": 4, \"channel\": 11},\n {\"essid\": \"UPC Wi-Free\", \"bssid\": \"06:7c:34:9a:6f:7c\", \"rssi\": 167, \"rssi_perc\": 34, \"enc\": 0, \"channel\": 11},\n {\"essid\": \"Internet_B0\", \"bssid\": \"5c:f4:ab:11:3b:b3\", \"rssi\": 175, \"rssi_perc\": 50, \"enc\": 3, \"channel\": 13},\n {\"essid\": \"UPC5716805\", \"bssid\": \"08:95:2a:0c:84:3f\", \"rssi\": 165, \"rssi_perc\": 30, \"enc\": 4, \"channel\": 1}\n ]\n }\n}"; </script>
</head>
<body class="cfg">
<div id="outer">
<nav id="menu">
<div id="brand" tabindex=0>ESPTerm</div>
<a href="term.html" class="icn-back">Back to Terminal</a>
<a href="cfg_term.html" class="icn-terminal ">Terminal Settings</a><a href="cfg_wifi.html" class="icn-wifi selected">WiFi Settings</a><a href="cfg_network.html" class="icn-network ">Network Settings</a><a href="cfg_system.html" class="icn-configure ">System Settings</a><a href="help.html" class="icn-help ">Quick Reference</a><a href="about.html" class="icn-about ">About ESPTerm</a></nav>
<script>
function menuOpen() { $('#menu').toggleClass('expanded') }
$('#brand').on('click', menuOpen).on('keypress', cr(menuOpen));
</script>
<div id="content">
<img src="/img/loader.gif" alt="Loading…" id="loader">
<h1>WiFi Settings</h1>
<div class="Box errors hidden">
<span class="lead">Validation errors for:</span>&nbsp;<span class="list"></span>
</div>
<form class="Box str mobcol" action="wifi_set.html" method="GET" id="form-1">
<h2 tabindex=0>Built-in Access Point</h2>
<div class="Row checkbox x-ap-toggle">
<label>Enabled</label><!--
--><span class="box" tabindex=0></span>
<input type="hidden" id="ap_enabled" name="ap_enable" value="1">
</div>
<div class="Row x-ap-on">
<label for="ap_ssid">AP SSID</label>
<input type="text" name="ap_ssid" id="ap_ssid" value="TERM-027451" required>
</div>
<div class="Row x-ap-on">
<label for="ap_password">Password</label>
<input type="text" name="ap_password" id="ap_password" value="">
</div>
<div class="Row x-ap-on">
<label for="ap_channel">Channel</label>
<input type="number" name="ap_channel" id="ap_channel" min=1 max=14 value="7" required>
</div>
<div class="Row range x-ap-on">
<label for="tpw">
Transmit power <span class="display x-disp1 mq-phone"></span>
</label>
<input type="range" name="tpw" id="tpw" step=1 min=0 max=82 value="60">
<span class="display x-disp2 mq-no-phone"></span>
</div>
<div class="Row checkbox x-ap-on">
<label>Hide SSID</label><!--
--><span class="box" tabindex=0></span>
<input type="hidden" name="ap_hidden" value="0">
</div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-1').submit()">Apply!</a>
</div>
</form>
<form class="Box str mobcol expanded" action="wifi_set.html" method="GET" id="form-2">
<h2 tabindex=0>Join Existing Network</h2>
<div class="Row checkbox x-sta-toggle">
<label>Enabled</label><!--
--><span class="box" tabindex=0></span>
<input type="hidden" id="sta_enabled" name="sta_enable" value="1">
</div>
<div class="Row explain nomargintop x-sta-on">
<span class="spacer"></span>
After selecting a network, press Apply to connect. </div>
<input type="hidden" name="sta_ssid" id="sta_ssid" value="">
<input type="hidden" name="sta_password" id="sta_password" value="">
<div class="Row sta-info x-sta-on">
<label>Selected</label>
<div class="AP-preview hidden" id="sta-nw">
<div class="wrap">
<div class="inner">
<div class="essid"></div>
<div class="passwd">🔒 Password saved</div>
<div class="nopasswd">🔓 Open access</div>
<div class="ip"></div>
</div>
<a class="forget" href="#" id="forget-sta">×</a>
</div>
</div>
<div class="AP-preview-nil" id="sta-nw-nil">
None </div>
</div>
<div id="ap-box" class="x-sta-on">
<label>Available networks:</label>
<div id="ap-scan"><a href="#" onclick="WiFi.startScanning(); return false">Click here to start scanning!</a></div>
<div id="ap-loader" class="hidden">Scanning<span class="anim-dots">.</span></div>
<div id="ap-list" class="hidden"></div>
</div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-2').submit()">Apply!</a>
</div>
</form>
<script>
WiFi.scan_url = '/cfg/wifi/scan';
WiFi.init({
sta_ssid: 'Cisco',
sta_password: 'Passw0rd!',
sta_active_ip: '192.168.82.66',
sta_active_ssid: 'Cisco',
});
function updateApDisp() {
var a = !!parseInt($('#ap_enabled').val());
$('.x-ap-on').toggleClass('hidden', !a);
}
$('.x-ap-toggle').on('click', function() {
setTimeout(function() {
updateApDisp();
}, 0)
});
function updateStaDisp() {
var a = !!parseInt($('#sta_enabled').val());
$('.x-sta-on').toggleClass('hidden', !a);
}
$('.x-sta-toggle').on('click', function() {
setTimeout(function() {
updateStaDisp();
}, 0)
});
updateApDisp();
updateStaDisp();
</script>
<div class="botpad"></div>
<div class="NotifyMsg hidden" id="notif"></div>
</div>
</div>
</body>
</html>

@ -0,0 +1,120 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Connecting to Network :: ESPTerm</title>
<link href="/css/app.css" rel="stylesheet">
<script src="/js/app.js"></script>
<script>
var _root = location.host;
var _demo = 1;
</script>
</head>
<body class="">
<div id="outer">
<div id="content">
<img src="/img/loader.gif" alt="Loading…" id="loader">
<h1>Connecting to Network</h1>
<div class="Box">
<p><b>Status:</b> <span id="status"></span><span class="anim-dots">.</span></p>
<a href="cfg_wifi.html" id="backbtn" class="button">Back to WiFi config</a>
</div>
<div class="Box">
<p>
If you're configuring ESPTerm via a smartphone, or were connected
from another external network, your device may lose connection and this
progress indicator won't work. Please wait a while (~ 15 seconds),
then check if the connection succeeded.</p>
<p>
To force enable the built-in AP, hold the BOOT
button until the blue LED starts flashing. Hold the button longer (until the LED
flashes rapidly) for a "factory reset".</p>
</div>
<script>
var xhr = new XMLHttpRequest();
var abortTmeo;
var failCounter = 0;
var messages = {"disabled":"Station mode is disabled.","idle":"Idle, not connected and has no IP.","success":"Connected! Received IP ","working":"Connecting to selected AP","fail":"Connection failed, check settings & try again. Cause: "};
function onFail() {
$("#status").html("Telemetry lost; something went wrong, or your device disconnected.");
$('.anim-dots').addClass('hidden');
}
function getStatus() {
xhr.open("GET", 'http://'+_root+'/cfg/wifi/connstatus');
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
clearTimeout(abortTmeo);
try {
var data = JSON.parse(xhr.responseText);
var done = false;
var msg = messages[data.status] || '...';
if (data.status == 'success') {
msg += data.ip;
done = true;
}
if (data.status == 'fail') {
msg += data.cause;
done = true;
}
$("#status").html(msg);
if (done) {
// $('#backbtn').removeClass('hidden');
$('.anim-dots').addClass('hidden');
} else {
// ask again after a short delay
window.setTimeout(getStatus, 1000);
}
} catch(e) {
failCounter++;
console.log(e);
// repeat
if (failCounter > 5) {
onFail();
}
else {
window.setTimeout(getStatus, 1000);
}
}
} else {
onFail();
}
}
};
// XHR timeout
abortTmeo = setTimeout(function () {
xhr.abort();
onFail();
}, 4000);
xhr.send();
}
getStatus();
</script>
<div class="botpad"></div>
<div class="NotifyMsg hidden" id="notif"></div>
</div>
</div>
</body>
</html>

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 318 B

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 8.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

@ -1 +1 @@
this is a test file <!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

File diff suppressed because it is too large Load Diff

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

@ -0,0 +1,123 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Terminal :: ESPTerm</title>
<link href="/css/app.css" rel="stylesheet">
<script src="/js/app.js"></script>
<script>
var _root = location.host;
var _demo = 1;
var _demo_screen = "S\u0019\u0001Q\u0001\u0017\u0001K\u0001\u0015\u0004\u0003\b\u0001 \u0002P\u0001┌ESPTerm─Demo─\u0002\u0002\u0001\u0003\u0002\u000131\u0003\u0003\u000132\u0003\u0004\u00013\u0002\u0002\u0001\u0003\u0005\u000134\u0003\u0006\u000135\u0003\u0007\u000136\u0003\b\u000137\u0003\t\u000190\u0003\n\u000191\u0003\u000b\u000192\u0003\f\u000193\u0003\r\u000194\u0003\u000e\u000195\u0003\u000f\u000196\u0003\u0010\u000197\u0003\b\u0001─\u0002\r\u0001┐ \u0002\u0015\u0001│ \u00029\u0001│ \u0002\u0004\u0001│\u0002\t\u0001 \u0002\b\u0001│\u0004\u0002\u0001Bold \u0004\u0003\u0001F\u0004\u0003\u0001a\u0004\u0003\u0001i\u0004\u0003\u0001n\u0004\u0003\u0001t\u0004\u0003\u0001 \u0004\u0005\u0001I\u0004\u0005\u0001t\u0004\u0005\u0001a\u0004\u0005\u0001l\u0004\u0005\u0001i\u0004\u0005\u0001c\u0004\u0005\u0001 \u0004\t\u0001U\u0004\t\u0001n\u0004\t\u0001d\u0004\t\u0001e\u0004\t\u0001r\u0004\t\u0001l\u0004\t\u0001i\u0004\t\u0001n\u0004\t\u0001e\u0004\u0001\u0001 \u0004\u0011\u0001B\u0004\u0011\u0001l\u0004\u0011\u0001i\u0004\u0011\u0001n\u0004\u0011\u0001k\u0004\u0011\u0001 \u0001q\u0001\u0001Inverse\u0003\b\u0001 \u0004A\u0001S\u0004A\u0001t\u0004A\u0001r\u0004A\u0001i\u0004A\u0001k\u0004A\u0001e\u0004\u0001\u0001 \u0004!\u0001F\u0004!\u0001r\u0004!\u0001a\u0004!\u0001k\u0004!\u0001t\u0004!\u0001u\u0004!\u0001r\u0004\u0001\u0001 │ \u0002\u0002\u0001─\u0002\u0002\u0001\u0003\n\u0002 \u0002\t\u0001\u0003\b\u0001─\u0002\u0002\u0001 \u0002\u0006\u0001│ \u00029\u0001│ \u0002\u0002\u0001─\u0002\u0002\u0001\u0003\n\u0002 \u0003\u0002\u0002ESP826\u0002\u0002\u0001\u0003\n\u0002 \u0003\b\u0001─\u0002\u0002\u0001 \u0002\u0006\u0001└─\u00029\u0001┤ \u0002\u0002\u0001─\u0002\u0002\u0001\u0003\n\u0002 \u0002\t\u0001\u0003\b\u0001─\u0002\u0002\u0001 \u0002@\u0001│ \u0002\u0002\u0001─\u0002\u0002\u0001\u0003\n\u0002 \u0003\u0002\u0002(@)#\u0002\u0004\u0001\u0003\n\u0002 \u0003\b\u0001─\u0002\u0002\u0001 \u0002\u0007\u0001\u0003O\u0001 This is a static demo of the ESPTerm Web Interface \u0002\u0004\u0001\u0003\b\u0001 \u0002\u0002\u0001│ \u0002\u0002\u0001─\u0002\u0002\u0001\u0003\n\u0002 \u0002\t\u0001\u0003\b\u0001─\u0002\u0002\u0001 \u0002\u0007\u0001\u0003O\u0001 \u00027\u0001\u0003\b\u0001 \u0002\u0002\u0001│ \u0002\u0004\u0001│\u0002\t\u0001 \u0002\t\u0001\u0003O\u0001 Try the links beneath this scre\u0002\u0002\u0001n to browse the menu. \u0003\b\u0001 \u0002\u0002\u0001♦ \u0002\u0016\u0001\u0003O\u0001 \u00027\u0001\u0003\b\u0001 \u0002\u0019\u0001\u0003O\u0001 <°)\u0002\u0003\u0001>< ESPTerm ful\u0002\u0002\u0001y sup\u0002\u0002\u0001orts UTF-8 \u0002\u0002\u0001><(\u0002\u0003\u0001°> \u0003\b\u0001 \u0002\u0019\u0001\u0003O\u0001 \u00027\u0001\u0003\b\u0001 \u0002i\u0001\u0003\u000b\u0001Other interesting features:\u0003\b\u0001 \u0002\u0018\u0001↓ \u0002n\u0001\u0003\u0003\u0001- Almost ful\u0002\u0002\u0001 VT10\u0002\u0002\u0001 emulation \u0003\b\u0001 \u0003\u0006\u0001()\u0003\b\u0001 \u0003\u0006\u0001()\u0003\b\u0001 \u0002\b\u0001Funguje tu čeština! \u0002\u0011\u0001\u0003\u0005\u0001- Xterm-like mouse tracking\u0003\b\u0001 \u0002\u0003\u0001=\u0002\u0002\u0001\u0003\t\u0002°.°\u0003\b\u0001=\u0002\u0002\u0001 \u0003\u0006\u0001<-\u0002\u0003\u0001, \u0003\b\u0001 \u0002$\u0001\u0003\u0004\u0001- File upload utility\u0003\b\u0001 \u0002\n\u0001'\u0002\u0002\u0001 '\u0002\u0002\u0001 \u0002\u0002\u0001\u0003\u0006\u0001 \u0002\u0004\u0001mouse\u0003\b\u0001 \u0002!\u0001\u0003\u0002\u0001- User-friendly config interface\u0003\b\u0001 \u00020\u0001\u0003\u000e\u0001-\u0003\u0002\u0001 \u0003\u000e\u0001Advanced WiFi & network set\u0002\u0002\u0001ings\u0003\b\u0001 \u0002\u0011\u0001\u0003\f\u0001Try ESPTerm today!\u0003\b\u0001 \u0002\u000b\u0001- Built-in help page \u0002\u001a\u0001\u0003\u0007\u0001-\u0002\u0002\u0001>\u0003\b\u0001 \u0002\u0002\u0001\u0003\f\u0001Pre-built binaries\u0003\b\u0001 \u0003\f\u0001are\u0003\b\u0001 \u0002\"\u0001\u0003\u0007\u0001link on the About page \u0002\u0002\u0001\u0003\f\u0001available on GitHub! \u0003\b\u0001 \u0002U\u0001"; </script>
</head>
<body class="term">
<div id="outer">
<div id="content">
<img src="/img/loader.gif" alt="Loading…" id="loader">
<script>
// Workaround for badly loaded page
setTimeout(function() {
if (typeof termInit == 'undefined' || typeof $ == 'undefined') {
console.error("Page load failed, refreshing…");
location.reload(true);
}
}, 3000);
</script>
<div class="Modal light hidden" id="fu_modal">
<div id="fu_form" class="Dialog">
<div class="fu-content">
<h2>Text Upload</h2>
<p>
<label for="fu_file">Load a text file:</label>
<input type="file" id="fu_file" accept="text/*" /><br>
<textarea id="fu_text"></textarea>
</p>
<p>
<label for="fu_crlf">Line Endings:</label>
<select id="fu_crlf">
<option value="CR">CR (Enter key)</option>
<option value="CRLF">CR LF (Windows)</option>
<option value="LF">LF (Linux)</option>
</select>
</p>
<p>
<label for="fu_delay">Line Delay (ms):</label>
<input id="fu_delay" type="number" value=1 min=0>
</p>
</div>
<div class="fu-buttons">
<button onclick="TermUpl.start()" class="icn-ok x-fu-go">Start</button>&nbsp;
<button onclick="TermUpl.close()" class="icn-cancel x-fu-cancel">Cancel</button>&nbsp;
<i class="fu-prog-box">Upload: <span id="fu_prog"></span></i>
</div>
</div>
</div>
<h1><!-- Screen title gets loaded here by JS --></h1>
<div id="term-wrap">
<div id="screen" class="theme-0"></div>
<div id="action-buttons">
<button data-n="1"></button><!--
--><button data-n="2"></button><!--
--><button data-n="3"></button><!--
--><button data-n="4"></button><!--
--><button data-n="5"></button>
</div>
</div>
<textarea id="softkb-input" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"></textarea>
<nav id="term-nav">
<a href="#" onclick="kbOpen(true);return false" class="mq-tablet-max"><i class="icn-keyboard"></i><span>Keyboard</span></a><!--
--><a href="#" onclick="TermUpl.open();return false"><i class="icn-download"></i><span>Upload</a><!--
--><a href="cfg_term.html" class="x-term-conf-btn"><i class="icn-configure"></i><span>Config</span></a><!--
--><a href="cfg_wifi.html" class="x-term-conf-btn"><i class="icn-wifi"></i><span>WiFi</span></a><!--
--><a href="help.html" class="x-term-conf-btn"><i class="icn-help"></i><span>Help</span></a><!--
--><a href="about.html" class="x-term-conf-btn"><i class="icn-about"></i><span>About</span></a>
</nav>
<script>
try {
window.noAutoShow = true;
termInit(); // the screen will be loaded via ajax
Screen.load('TESPTerm Web UI Demo\u0001OK\u0001Cancel\u0001\u0001\u0001Help');
// auto-clear the input box
$('#softkb-input').on('input', function(e) {
setTimeout(function(){
var str = $('#softkb-input').val();
$('#softkb-input').val('');
Input.sendString(str);
}, 1);
});
} catch(e) {
console.error(e);
console.error("Fail, reloading in 3s…");
setTimeout(function() {
location.reload(true);
}, 3000);
}
function kbOpen(yes) {
var i = qs('#softkb-input');
if (yes) i.focus();
else i.blur();
}
</script>
<div class="botpad"></div>
<div class="NotifyMsg hidden" id="notif"></div>
</div>
</div>
</body>
</html>

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">

@ -0,0 +1 @@
<!DOCTYPE HTML><meta http-equiv="refresh" content="0;url=term.html">
Loading…
Cancel
Save