Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
 MightyPork
|
f87f638f03 | ||
|
MightyPork
|
16f81cd411 | ||
|
MightyPork
|
e62c4ece90 |
@@ -65,7 +65,7 @@ LIBS += esphttpd
|
||||
# compiler flags using during compilation of source files
|
||||
CFLAGS = -Os -ggdb -std=gnu99 -Werror -Wpointer-arith -Wundef -Wall -Wl,-EL -fno-inline-functions \
|
||||
-nostdlib -mlongcalls -mtext-section-literals -D__ets__ -DICACHE_FLASH \
|
||||
-Wno-address -Wno-unused
|
||||
-Wno-address -Wno-unused -DHTTPD_MAX_BACKLOG_SIZE=8192
|
||||
|
||||
# linker flags used to generate the main object file
|
||||
LDFLAGS = -nostdlib -Wl,--no-check-sections -u call_user_start -Wl,-static
|
||||
|
||||
@@ -2,6 +2,11 @@
|
||||
|
||||
echo "-- Preparing WWW files --"
|
||||
|
||||
rm -r html
|
||||
mkdir -p html/img
|
||||
mkdir -p html/js
|
||||
mkdir -p html/css
|
||||
|
||||
# Join scripts
|
||||
DD=html_orig/jssrc
|
||||
cat $DD/chibi.js \
|
||||
@@ -17,6 +22,9 @@ sass --sourcemap=none html_orig/sass/app.scss html_orig/css/app.css
|
||||
cp html_orig/css/app.css html/css/app.css
|
||||
cp html_orig/term.html html/term.tpl
|
||||
cp html_orig/wifi.html html/wifi.tpl
|
||||
cp html_orig/about.html html/about.tpl
|
||||
cp html_orig/help.html html/help.tpl
|
||||
cp html_orig/wifi_conn.html html/wifi_conn.tpl
|
||||
cp html_orig/img/loader.gif html/img/loader.gif
|
||||
cp html_orig/img/cvut.svg html/img/cvut.svg
|
||||
cp html_orig/favicon.ico html/favicon.ico
|
||||
|
||||
@@ -0,0 +1,80 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>About - ESP8266 Remote Terminal</title>
|
||||
<meta name="viewport" content="width=device-width,shrink-to-fit=no,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="/css/app.css">
|
||||
<script src="/js/app.js"></script>
|
||||
</head>
|
||||
<body class="page-about">
|
||||
|
||||
<h1 onclick="location.href='/'">About</h1>
|
||||
|
||||
<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>© Ondřej Hruška, 2017 <<a href="mailto:ondra@ondrovo.com">ondra@ondrovo.com</a>></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>Firmware</h2>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Firmware</th>
|
||||
<td>v%vers_fw%, build <i>%date%</i> at <i>%time%</i></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>libesphttpd</th>
|
||||
<td>v%vers_httpd%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>ESP IoT SDK</th>
|
||||
<td>v%vers_sdk%</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Issues</h2>
|
||||
<p>
|
||||
Please report any issues to the <a href="%githubrepo%/issues">bugtracker</a> or send them by e-mail.
|
||||
</p>
|
||||
<p>
|
||||
Firmware updates can be downloaded from the <a href="%githubrepo%/releases">releases page</a>.
|
||||
Flash the images using <a href="https://github.com/espressif/esptool">esptool</a>.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Contributing</h2>
|
||||
<p>
|
||||
Submit your improvements and ideas to the project on <a href="%githubrepo%">GitHub</a>.<br>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Acknowledgements</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>
|
||||
|
||||
<nav id="botnav">
|
||||
<a href="/">Terminal</a><!--
|
||||
--><a href="/help">Help</a><!--
|
||||
--><a href="/wifi">WiFi config</a>
|
||||
</nav>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
+163
-2
@@ -461,8 +461,6 @@ h1 {
|
||||
h2 {
|
||||
font-size: 1.26563em;
|
||||
margin-bottom: 0.61805rem; }
|
||||
h2:first-child {
|
||||
margin-top: 0; }
|
||||
|
||||
td, th {
|
||||
padding: 0.38198rem;
|
||||
@@ -498,6 +496,21 @@ tbody td input[type="text"], tbody td input[type="number"] {
|
||||
#loader.show {
|
||||
opacity: 1; }
|
||||
|
||||
ul > * {
|
||||
padding-top: .1em;
|
||||
padding-bottom: .1em; }
|
||||
|
||||
#botnav {
|
||||
padding-top: 1.5em;
|
||||
text-align: center; }
|
||||
#botnav a {
|
||||
padding: 0 0.38198rem;
|
||||
text-decoration: underline; }
|
||||
#botnav a, #botnav a:visited, #botnav a:link {
|
||||
color: #2e4d6e; }
|
||||
#botnav a:hover {
|
||||
color: #5abfff; }
|
||||
|
||||
button, input[type=submit], .button {
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
@@ -687,6 +700,8 @@ input[type="number"], input[type="password"], input[type="text"], textarea, sele
|
||||
@media screen and (max-width: 544px) {
|
||||
.page-term #screen span:hover {
|
||||
outline: 0 none; } }
|
||||
.page-term #screen .fg8, .page-term #screen .fg9, .page-term #screen .fg10, .page-term #screen .fg11, .page-term #screen .fg12, .page-term #screen .fg13, .page-term #screen .fg14, .page-term #screen .fg15 {
|
||||
font-weight: bold; }
|
||||
.page-term #buttons {
|
||||
margin-top: 10px;
|
||||
white-space: nowrap; }
|
||||
@@ -701,3 +716,149 @@ input[type="number"], input[type="password"], input[type="text"], textarea, sele
|
||||
|
||||
#termwrap {
|
||||
text-align: center; }
|
||||
|
||||
.page-about .Box {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem; }
|
||||
.page-about .Box a {
|
||||
font-weight: bold; }
|
||||
.page-about #logo {
|
||||
float: right;
|
||||
height: 130px; }
|
||||
.page-about #logo2 {
|
||||
max-width: 100%; }
|
||||
.page-about td {
|
||||
white-space: normal; }
|
||||
|
||||
.colorprev {
|
||||
margin-top: 0.38198rem;
|
||||
margin-bottom: 0.38198rem; }
|
||||
.colorprev span {
|
||||
display: inline-block;
|
||||
width: 2em;
|
||||
padding: 0.38198rem 0;
|
||||
text-align: center; }
|
||||
|
||||
.ansiref, .ansiref td, .ansiref th {
|
||||
border: 1px solid #666; }
|
||||
.ansiref th, .ansiref td {
|
||||
white-space: normal; }
|
||||
.ansiref th {
|
||||
background-color: rgba(255, 255, 255, 0.1); }
|
||||
.ansiref td:nth-child(1) {
|
||||
font-family: monospace; }
|
||||
.ansiref.w100 {
|
||||
width: 100%; }
|
||||
.ansiref.w100 td:nth-child(1) {
|
||||
width: 6em; }
|
||||
.ansiref.w100 td:nth-child(2) {
|
||||
width: 8em; }
|
||||
|
||||
.fg0 {
|
||||
color: #111213; }
|
||||
|
||||
.bg0 {
|
||||
background-color: #111213; }
|
||||
|
||||
.fg1 {
|
||||
color: #CC0000; }
|
||||
|
||||
.bg1 {
|
||||
background-color: #CC0000; }
|
||||
|
||||
.fg2 {
|
||||
color: #4E9A06; }
|
||||
|
||||
.bg2 {
|
||||
background-color: #4E9A06; }
|
||||
|
||||
.fg3 {
|
||||
color: #C4A000; }
|
||||
|
||||
.bg3 {
|
||||
background-color: #C4A000; }
|
||||
|
||||
.fg4 {
|
||||
color: #3465A4; }
|
||||
|
||||
.bg4 {
|
||||
background-color: #3465A4; }
|
||||
|
||||
.fg5 {
|
||||
color: #75507B; }
|
||||
|
||||
.bg5 {
|
||||
background-color: #75507B; }
|
||||
|
||||
.fg6 {
|
||||
color: #06989A; }
|
||||
|
||||
.bg6 {
|
||||
background-color: #06989A; }
|
||||
|
||||
.fg7 {
|
||||
color: #D3D7CF; }
|
||||
|
||||
.bg7 {
|
||||
background-color: #D3D7CF; }
|
||||
|
||||
.fg8 {
|
||||
color: #555753; }
|
||||
|
||||
.bg8 {
|
||||
background-color: #555753; }
|
||||
|
||||
.fg9 {
|
||||
color: #EF2929; }
|
||||
|
||||
.bg9 {
|
||||
background-color: #EF2929; }
|
||||
|
||||
.fg10 {
|
||||
color: #8AE234; }
|
||||
|
||||
.bg10 {
|
||||
background-color: #8AE234; }
|
||||
|
||||
.fg11 {
|
||||
color: #FCE94F; }
|
||||
|
||||
.bg11 {
|
||||
background-color: #FCE94F; }
|
||||
|
||||
.fg12 {
|
||||
color: #729FCF; }
|
||||
|
||||
.bg12 {
|
||||
background-color: #729FCF; }
|
||||
|
||||
.fg13 {
|
||||
color: #AD7FA8; }
|
||||
|
||||
.bg13 {
|
||||
background-color: #AD7FA8; }
|
||||
|
||||
.fg14 {
|
||||
color: #34E2E2; }
|
||||
|
||||
.bg14 {
|
||||
background-color: #34E2E2; }
|
||||
|
||||
.fg15 {
|
||||
color: #EEEEEC; }
|
||||
|
||||
.bg15 {
|
||||
background-color: #EEEEEC; }
|
||||
|
||||
@media screen and (min-width: 545px) {
|
||||
.mq-phone {
|
||||
display: none; } }
|
||||
@media screen and (max-width: 544px) {
|
||||
.mq-tablet-min {
|
||||
display: none; } }
|
||||
@media screen and (min-width: 1001px) {
|
||||
.mq-tablet-max {
|
||||
display: none; } }
|
||||
@media screen and (max-width: 1000px) {
|
||||
.mq-normal-min {
|
||||
display: none; } }
|
||||
|
||||
+326
@@ -0,0 +1,326 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Help - ESP8266 Remote Terminal</title>
|
||||
<meta name="viewport" content="width=device-width,shrink-to-fit=no,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="/css/app.css">
|
||||
<script src="/js/app.js"></script>
|
||||
</head>
|
||||
<body class="page-help">
|
||||
|
||||
<h1 onclick="location.href='/'">Quick Reference</h1>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Wiring</h2>
|
||||
|
||||
<ul>
|
||||
<li>Communication UART on pins <b>Rx, Tx</b> at 115200-8-1-N</li>
|
||||
<li>Debug log on pin <b>GPIO2</b> at 115200-8-1-N</li>
|
||||
<li>Use 3.3V logic, or 5V with protection resistors (10k)</li>
|
||||
<li>Connect Rx and Tx with a piece of wire to test the terminal alone, you should see what you type in the browser.
|
||||
NOTE: This won't work if your ESP8266 board has a built-in USB-serial.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Screen</h2>
|
||||
|
||||
<ul>
|
||||
<li>Most ANSI escape sequences are supported.</li>
|
||||
<li>The max screen size is 2000 characters (eg. <b>25x80</b>), default is <b>10x26</b>. Set using <code>\e]W?;?\a</code> with rows;cols.</li>
|
||||
<li>The screen will automatically scroll, can be used for log output.</li>
|
||||
<li>Display update is sent <b>after 20 ms of inactivity</b>.</li>
|
||||
<li>The browser display needs WebSockets for the real-time updating. It may not work on really old phones / browsers.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Color Reference</h2>
|
||||
|
||||
<p>Color is set using <code>\e[?m</code> or <code>\e[?;?m</code> where "?" are numbers from the following tables:</p>
|
||||
|
||||
<b>Foreground</b>
|
||||
|
||||
<div class="colorprev">
|
||||
<span class="fg0" style="background:#333">30</span>
|
||||
<span class="bg0 fg1">31</span>
|
||||
<span class="bg0 fg2">32</span>
|
||||
<span class="bg0 fg3">33</span>
|
||||
<span class="bg0 fg4">34</span>
|
||||
<span class="bg0 fg5">35</span>
|
||||
<span class="bg0 fg6">36</span>
|
||||
<span class="bg0 fg7">37</span>
|
||||
</div>
|
||||
|
||||
<div class="colorprev">
|
||||
<span class="bg0 fg8">90</span>
|
||||
<span class="bg0 fg9">91</span>
|
||||
<span class="bg0 fg10">92</span>
|
||||
<span class="bg0 fg11">93</span>
|
||||
<span class="bg0 fg12">94</span>
|
||||
<span class="bg0 fg13">95</span>
|
||||
<span class="bg0 fg14">96</span>
|
||||
<span class="bg0 fg15">97</span>
|
||||
</div>
|
||||
|
||||
<b>Background</b>
|
||||
|
||||
<div class="colorprev">
|
||||
<span class="bg0 fg15">30</span>
|
||||
<span class="bg1 fg15">31</span>
|
||||
<span class="bg2 fg15">32</span>
|
||||
<span class="bg3 fg0">33</span>
|
||||
<span class="bg4 fg15">34</span>
|
||||
<span class="bg5 fg15">35</span>
|
||||
<span class="bg6 fg15">36</span>
|
||||
<span class="bg7 fg0">37</span>
|
||||
</div>
|
||||
|
||||
<div class="colorprev">
|
||||
<span class="bg8 fg15">100</span>
|
||||
<span class="bg9 fg0">101</span>
|
||||
<span class="bg10 fg0">102</span>
|
||||
<span class="bg11 fg0">103</span>
|
||||
<span class="bg12 fg0">104</span>
|
||||
<span class="bg13 fg0">105</span>
|
||||
<span class="bg14 fg0">106</span>
|
||||
<span class="bg15 fg0">107</span>
|
||||
</div>
|
||||
|
||||
<p>Bright foreground can also be set using the "bold" attribute 1 (eg. <code>\e[31;1m</code>). For more details, see the ANSI code reference below.</p>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>User Input</h2>
|
||||
|
||||
<p>
|
||||
All the user types on their keyboard is sent as-is to the UART, including ESC, ANSI sequences for arrow keys and CR-LF for Enter.
|
||||
The input is limited to ASCII codes 32-126, backspace 8 and tab 9.
|
||||
</p>
|
||||
|
||||
<p>The buttons under the screen send ASCII codes 1, 2, 3, 4, 5.</p>
|
||||
|
||||
<p>
|
||||
<b>Mouse input</b> (click/tap) is sent as <code>\e?;?M</code> with row;column. You can use this for on-screen buttons, menu navigation etc.
|
||||
<i>Please note this is a custom sequence, not supported by PuTTY or other terminals.</i>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Supported ANSI Escape Sequences</h2>
|
||||
|
||||
<p>Sequences are started by ASCII code 27 (ESC, <code>\e</code>, <code>\x1b</code>, <code>\033</code>)</p>
|
||||
|
||||
<p>Instead of <code>\a</code> (BELL, ASCII 7) in the commands, you can use `\e\` (ESC + backslash). It's the Text Separator code.</p>
|
||||
|
||||
<h3>Text Attributes</h3>
|
||||
|
||||
<p>
|
||||
All text attributes are set using <code>\e[...m</code> where the dots are numbers separated by semicolons.
|
||||
You can combine up to 3 attributes in a single command.
|
||||
</p>
|
||||
|
||||
<table class="ansiref">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Attribute</th>
|
||||
<th>Meaning</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>0</td>
|
||||
<td>Reset text attributes to default</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>7</td>
|
||||
<td>Inverse (fg/bg swap when printing)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>27</td>
|
||||
<td>Inverse OFF</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>30-37, 90-97</td>
|
||||
<td>Foreground color, normal and bright</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>40-47, 100-107</td>
|
||||
<td>Background color, normal and bright</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>Cursor</h3>
|
||||
|
||||
<p>Movement commands scroll the screen if needed. The coordinates are 1-based, origin top left.</p>
|
||||
|
||||
<table class="ansiref w100">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Code</th>
|
||||
<th>Params</th>
|
||||
<th>Meaning</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>\e[?A</td>
|
||||
<td>[count]</td>
|
||||
<td>Move cursor up</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?B</td>
|
||||
<td>[count]</td>
|
||||
<td>Move cursor down</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?C</td>
|
||||
<td>[count]</td>
|
||||
<td>Move cursor forward (right)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?D</td>
|
||||
<td>[count]</td>
|
||||
<td>Move cursor backward (left)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?E</td>
|
||||
<td>[count]</td>
|
||||
<td>Go N line down, start of line</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?F</td>
|
||||
<td>[count]</td>
|
||||
<td>Go N lines up, start of line</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?G</td>
|
||||
<td>column</td>
|
||||
<td>Go to column</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?;?G</td>
|
||||
<td>[row=1];[col=1]</td>
|
||||
<td>Go to row and column</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[6n</td>
|
||||
<td>--</td>
|
||||
<td>Query cursor position. Position is sent back as <code>\e[?;?R</code> with row;column.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[s</td>
|
||||
<td>--</td>
|
||||
<td>Store position</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[u</td>
|
||||
<td>--</td>
|
||||
<td>Restore position</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e7</td>
|
||||
<td>--</td>
|
||||
<td>Store position & attributes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e8</td>
|
||||
<td>--</td>
|
||||
<td>Restore position & attributes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?25l</td>
|
||||
<td>--</td>
|
||||
<td>Hide cursor (literal question mark, lowercase L!)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?25h</td>
|
||||
<td>--</td>
|
||||
<td>Show cursor (literal question mark!)</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>Screen</h3>
|
||||
|
||||
<table class="ansiref w100">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Code</th>
|
||||
<th>Params</th>
|
||||
<th>Meaning</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>\e[?J</td>
|
||||
<td>[mode=0]</td>
|
||||
<td>Clear screen. Mode: 0 - from cursor, 1 - to cursor, 2 - all</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?K</td>
|
||||
<td>[mode=0]</td>
|
||||
<td>Erase line. Mode: 0 - from cursor, 1 - to cursor, 2 - all</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?S</td>
|
||||
<td>[lines]</td>
|
||||
<td>Scroll screen content up, add empty line at the bottom</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?T</td>
|
||||
<td>[lines]</td>
|
||||
<td>Scroll screen content down, add empty line at the top</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e]W?;?\a</td>
|
||||
<td>rows;cols</td>
|
||||
<td>Set screen size, maximum 25x80 (resp. total 2000 characters). This also clears the screen.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>System Commands</h3>
|
||||
|
||||
<table class="ansiref w100">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Code</th>
|
||||
<th>Params</th>
|
||||
<th>Meaning</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>\ec</td>
|
||||
<td>--</td>
|
||||
<td>
|
||||
"Device Reset" - clear screen, reset attributes, show cursor & move it to 1,1.
|
||||
The screen size and WiFi settings stay unchanged.
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e]FR\a</td>
|
||||
<td>--</td>
|
||||
<td>"Factory Reset", emergency code when you mess up the WiFi, restores SSID to unique default, clears stored credentials & enters Client+AP mode.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[5n</td>
|
||||
<td>--</td>
|
||||
<td>Query device status, replies with <code>\e[0n</code> "device is OK". Can be used to check if the UART works.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<nav id="botnav">
|
||||
<a href="/">Terminal</a><!--
|
||||
--><a href="/wifi">WiFi config</a><!--
|
||||
--><a href="/about">About</a>
|
||||
</nav>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Executable
+5
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.8 KiB |
+6
-5
@@ -958,9 +958,10 @@ $._loader = function(vis) {
|
||||
bg = inv ? cell.fg : cell.bg;
|
||||
// Update
|
||||
e.innerText = (cell.t+' ')[0];
|
||||
e.style.color = colorHex(fg);
|
||||
e.style.backgroundColor = colorHex(bg);
|
||||
e.style.fontWeight = fg > 7 ? 'bold' : 'normal';
|
||||
e.classList.className = 'fg'+fg+' bg'+bg;
|
||||
// e.style.color = colorHex(fg);
|
||||
// e.style.backgroundColor = colorHex(bg);
|
||||
// e.style.fontWeight = fg > 7 ? 'bold' : 'normal';
|
||||
}
|
||||
|
||||
/** Show entire screen */
|
||||
@@ -1286,7 +1287,7 @@ $._loader = function(vis) {
|
||||
|
||||
/** Ask the CGI what APs are visible (async) */
|
||||
function scanAPs() {
|
||||
$.get('/wifi/scan', onScan);
|
||||
$.get('http://'+_root+'/wifi/scan', onScan);
|
||||
}
|
||||
|
||||
function rescan(time) {
|
||||
@@ -1340,7 +1341,7 @@ $._loader = function(vis) {
|
||||
var abortTmeo;
|
||||
|
||||
function getStatus() {
|
||||
xhr.open("GET", "/wifi/connstatus");
|
||||
xhr.open("GET", 'http://'+_root+"/wifi/connstatus");
|
||||
xhr.onreadystatechange = function () {
|
||||
if (xhr.readyState == 4 && xhr.status >= 200 && xhr.status < 300) {
|
||||
clearTimeout(abortTmeo);
|
||||
|
||||
@@ -24,6 +24,12 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav id="botnav">
|
||||
<a href="/wifi">WiFi config</a><!--
|
||||
--><a href="/help">Help</a><!--
|
||||
--><a href="/about">About</a>
|
||||
</nav>
|
||||
|
||||
<script>
|
||||
_root = window.location.host;
|
||||
termInit(%screenData%);
|
||||
|
||||
@@ -64,6 +64,12 @@
|
||||
<div id="ap-list" style="display:none"></div>
|
||||
</div>
|
||||
|
||||
<nav id="botnav">
|
||||
<a href="/">Terminal</a><!--
|
||||
--><a href="/help">Help</a><!--
|
||||
--><a href="/about">About</a>
|
||||
</nav>
|
||||
|
||||
<div class="Modal hidden" id="psk-modal">
|
||||
<div class="Dialog">
|
||||
<form action="/wifi/connect" method="post" id="conn-form">
|
||||
|
||||
@@ -0,0 +1,80 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>About - ESP8266 Remote Terminal</title>
|
||||
<meta name="viewport" content="width=device-width,shrink-to-fit=no,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="/css/app.css">
|
||||
<script src="/js/app.js"></script>
|
||||
</head>
|
||||
<body class="page-about">
|
||||
|
||||
<h1 onclick="location.href='/'">About</h1>
|
||||
|
||||
<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>© Ondřej Hruška, 2017 <<a href="mailto:ondra@ondrovo.com">ondra@ondrovo.com</a>></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>Firmware</h2>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Firmware</th>
|
||||
<td>v%vers_fw%, build <i>%date%</i> at <i>%time%</i></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>libesphttpd</th>
|
||||
<td>v%vers_httpd%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>ESP IoT SDK</th>
|
||||
<td>v%vers_sdk%</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Issues</h2>
|
||||
<p>
|
||||
Please report any issues to the <a href="%githubrepo%/issues">bugtracker</a> or send them by e-mail.
|
||||
</p>
|
||||
<p>
|
||||
Firmware updates can be downloaded from the <a href="%githubrepo%/releases">releases page</a>.
|
||||
Flash the images using <a href="https://github.com/espressif/esptool">esptool</a>.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Contributing</h2>
|
||||
<p>
|
||||
Submit your improvements and ideas to the project on <a href="%githubrepo%">GitHub</a>.<br>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Acknowledgements</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>
|
||||
|
||||
<nav id="botnav">
|
||||
<a href="/">Terminal</a><!--
|
||||
--><a href="/help">Help</a><!--
|
||||
--><a href="/wifi">WiFi config</a>
|
||||
</nav>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
+163
-2
@@ -461,8 +461,6 @@ h1 {
|
||||
h2 {
|
||||
font-size: 1.26563em;
|
||||
margin-bottom: 0.61805rem; }
|
||||
h2:first-child {
|
||||
margin-top: 0; }
|
||||
|
||||
td, th {
|
||||
padding: 0.38198rem;
|
||||
@@ -498,6 +496,21 @@ tbody td input[type="text"], tbody td input[type="number"] {
|
||||
#loader.show {
|
||||
opacity: 1; }
|
||||
|
||||
ul > * {
|
||||
padding-top: .1em;
|
||||
padding-bottom: .1em; }
|
||||
|
||||
#botnav {
|
||||
padding-top: 1.5em;
|
||||
text-align: center; }
|
||||
#botnav a {
|
||||
padding: 0 0.38198rem;
|
||||
text-decoration: underline; }
|
||||
#botnav a, #botnav a:visited, #botnav a:link {
|
||||
color: #2e4d6e; }
|
||||
#botnav a:hover {
|
||||
color: #5abfff; }
|
||||
|
||||
button, input[type=submit], .button {
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
@@ -687,6 +700,8 @@ input[type="number"], input[type="password"], input[type="text"], textarea, sele
|
||||
@media screen and (max-width: 544px) {
|
||||
.page-term #screen span:hover {
|
||||
outline: 0 none; } }
|
||||
.page-term #screen .fg8, .page-term #screen .fg9, .page-term #screen .fg10, .page-term #screen .fg11, .page-term #screen .fg12, .page-term #screen .fg13, .page-term #screen .fg14, .page-term #screen .fg15 {
|
||||
font-weight: bold; }
|
||||
.page-term #buttons {
|
||||
margin-top: 10px;
|
||||
white-space: nowrap; }
|
||||
@@ -701,3 +716,149 @@ input[type="number"], input[type="password"], input[type="text"], textarea, sele
|
||||
|
||||
#termwrap {
|
||||
text-align: center; }
|
||||
|
||||
.page-about .Box {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem; }
|
||||
.page-about .Box a {
|
||||
font-weight: bold; }
|
||||
.page-about #logo {
|
||||
float: right;
|
||||
height: 130px; }
|
||||
.page-about #logo2 {
|
||||
max-width: 100%; }
|
||||
.page-about td {
|
||||
white-space: normal; }
|
||||
|
||||
.colorprev {
|
||||
margin-top: 0.38198rem;
|
||||
margin-bottom: 0.38198rem; }
|
||||
.colorprev span {
|
||||
display: inline-block;
|
||||
width: 2em;
|
||||
padding: 0.38198rem 0;
|
||||
text-align: center; }
|
||||
|
||||
.ansiref, .ansiref td, .ansiref th {
|
||||
border: 1px solid #666; }
|
||||
.ansiref th, .ansiref td {
|
||||
white-space: normal; }
|
||||
.ansiref th {
|
||||
background-color: rgba(255, 255, 255, 0.1); }
|
||||
.ansiref td:nth-child(1) {
|
||||
font-family: monospace; }
|
||||
.ansiref.w100 {
|
||||
width: 100%; }
|
||||
.ansiref.w100 td:nth-child(1) {
|
||||
width: 6em; }
|
||||
.ansiref.w100 td:nth-child(2) {
|
||||
width: 8em; }
|
||||
|
||||
.fg0 {
|
||||
color: #111213; }
|
||||
|
||||
.bg0 {
|
||||
background-color: #111213; }
|
||||
|
||||
.fg1 {
|
||||
color: #CC0000; }
|
||||
|
||||
.bg1 {
|
||||
background-color: #CC0000; }
|
||||
|
||||
.fg2 {
|
||||
color: #4E9A06; }
|
||||
|
||||
.bg2 {
|
||||
background-color: #4E9A06; }
|
||||
|
||||
.fg3 {
|
||||
color: #C4A000; }
|
||||
|
||||
.bg3 {
|
||||
background-color: #C4A000; }
|
||||
|
||||
.fg4 {
|
||||
color: #3465A4; }
|
||||
|
||||
.bg4 {
|
||||
background-color: #3465A4; }
|
||||
|
||||
.fg5 {
|
||||
color: #75507B; }
|
||||
|
||||
.bg5 {
|
||||
background-color: #75507B; }
|
||||
|
||||
.fg6 {
|
||||
color: #06989A; }
|
||||
|
||||
.bg6 {
|
||||
background-color: #06989A; }
|
||||
|
||||
.fg7 {
|
||||
color: #D3D7CF; }
|
||||
|
||||
.bg7 {
|
||||
background-color: #D3D7CF; }
|
||||
|
||||
.fg8 {
|
||||
color: #555753; }
|
||||
|
||||
.bg8 {
|
||||
background-color: #555753; }
|
||||
|
||||
.fg9 {
|
||||
color: #EF2929; }
|
||||
|
||||
.bg9 {
|
||||
background-color: #EF2929; }
|
||||
|
||||
.fg10 {
|
||||
color: #8AE234; }
|
||||
|
||||
.bg10 {
|
||||
background-color: #8AE234; }
|
||||
|
||||
.fg11 {
|
||||
color: #FCE94F; }
|
||||
|
||||
.bg11 {
|
||||
background-color: #FCE94F; }
|
||||
|
||||
.fg12 {
|
||||
color: #729FCF; }
|
||||
|
||||
.bg12 {
|
||||
background-color: #729FCF; }
|
||||
|
||||
.fg13 {
|
||||
color: #AD7FA8; }
|
||||
|
||||
.bg13 {
|
||||
background-color: #AD7FA8; }
|
||||
|
||||
.fg14 {
|
||||
color: #34E2E2; }
|
||||
|
||||
.bg14 {
|
||||
background-color: #34E2E2; }
|
||||
|
||||
.fg15 {
|
||||
color: #EEEEEC; }
|
||||
|
||||
.bg15 {
|
||||
background-color: #EEEEEC; }
|
||||
|
||||
@media screen and (min-width: 545px) {
|
||||
.mq-phone {
|
||||
display: none; } }
|
||||
@media screen and (max-width: 544px) {
|
||||
.mq-tablet-min {
|
||||
display: none; } }
|
||||
@media screen and (min-width: 1001px) {
|
||||
.mq-tablet-max {
|
||||
display: none; } }
|
||||
@media screen and (max-width: 1000px) {
|
||||
.mq-normal-min {
|
||||
display: none; } }
|
||||
|
||||
@@ -0,0 +1,326 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Help - ESP8266 Remote Terminal</title>
|
||||
<meta name="viewport" content="width=device-width,shrink-to-fit=no,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="/css/app.css">
|
||||
<script src="/js/app.js"></script>
|
||||
</head>
|
||||
<body class="page-help">
|
||||
|
||||
<h1 onclick="location.href='/'">Quick Reference</h1>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Wiring</h2>
|
||||
|
||||
<ul>
|
||||
<li>Communication UART on pins <b>Rx, Tx</b> at 115200-8-1-N</li>
|
||||
<li>Debug log on pin <b>GPIO2</b> at 115200-8-1-N</li>
|
||||
<li>Use 3.3V logic, or 5V with protection resistors (10k)</li>
|
||||
<li>Connect Rx and Tx with a piece of wire to test the terminal alone, you should see what you type in the browser.
|
||||
NOTE: This won't work if your ESP8266 board has a built-in USB-serial.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Screen</h2>
|
||||
|
||||
<ul>
|
||||
<li>Most ANSI escape sequences are supported.</li>
|
||||
<li>The max screen size is 2000 characters (eg. <b>25x80</b>), default is <b>10x26</b>. Set using <code>\e]W?;?\a</code> with rows;cols.</li>
|
||||
<li>The screen will automatically scroll, can be used for log output.</li>
|
||||
<li>Display update is sent <b>after 20 ms of inactivity</b>.</li>
|
||||
<li>The browser display needs WebSockets for the real-time updating. It may not work on really old phones / browsers.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Color Reference</h2>
|
||||
|
||||
<p>Color is set using <code>\e[?m</code> or <code>\e[?;?m</code> where "?" are numbers from the following tables:</p>
|
||||
|
||||
<b>Foreground</b>
|
||||
|
||||
<div class="colorprev">
|
||||
<span class="fg0" style="background:#333">30</span>
|
||||
<span class="bg0 fg1">31</span>
|
||||
<span class="bg0 fg2">32</span>
|
||||
<span class="bg0 fg3">33</span>
|
||||
<span class="bg0 fg4">34</span>
|
||||
<span class="bg0 fg5">35</span>
|
||||
<span class="bg0 fg6">36</span>
|
||||
<span class="bg0 fg7">37</span>
|
||||
</div>
|
||||
|
||||
<div class="colorprev">
|
||||
<span class="bg0 fg8">90</span>
|
||||
<span class="bg0 fg9">91</span>
|
||||
<span class="bg0 fg10">92</span>
|
||||
<span class="bg0 fg11">93</span>
|
||||
<span class="bg0 fg12">94</span>
|
||||
<span class="bg0 fg13">95</span>
|
||||
<span class="bg0 fg14">96</span>
|
||||
<span class="bg0 fg15">97</span>
|
||||
</div>
|
||||
|
||||
<b>Background</b>
|
||||
|
||||
<div class="colorprev">
|
||||
<span class="bg0 fg15">30</span>
|
||||
<span class="bg1 fg15">31</span>
|
||||
<span class="bg2 fg15">32</span>
|
||||
<span class="bg3 fg0">33</span>
|
||||
<span class="bg4 fg15">34</span>
|
||||
<span class="bg5 fg15">35</span>
|
||||
<span class="bg6 fg15">36</span>
|
||||
<span class="bg7 fg0">37</span>
|
||||
</div>
|
||||
|
||||
<div class="colorprev">
|
||||
<span class="bg8 fg15">100</span>
|
||||
<span class="bg9 fg0">101</span>
|
||||
<span class="bg10 fg0">102</span>
|
||||
<span class="bg11 fg0">103</span>
|
||||
<span class="bg12 fg0">104</span>
|
||||
<span class="bg13 fg0">105</span>
|
||||
<span class="bg14 fg0">106</span>
|
||||
<span class="bg15 fg0">107</span>
|
||||
</div>
|
||||
|
||||
<p>Bright foreground can also be set using the "bold" attribute 1 (eg. <code>\e[31;1m</code>). For more details, see the ANSI code reference below.</p>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>User Input</h2>
|
||||
|
||||
<p>
|
||||
All the user types on their keyboard is sent as-is to the UART, including ESC, ANSI sequences for arrow keys and CR-LF for Enter.
|
||||
The input is limited to ASCII codes 32-126, backspace 8 and tab 9.
|
||||
</p>
|
||||
|
||||
<p>The buttons under the screen send ASCII codes 1, 2, 3, 4, 5.</p>
|
||||
|
||||
<p>
|
||||
<b>Mouse input</b> (click/tap) is sent as <code>\e?;?M</code> with row;column. You can use this for on-screen buttons, menu navigation etc.
|
||||
<i>Please note this is a custom sequence, not supported by PuTTY or other terminals.</i>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="Box">
|
||||
<h2>Supported ANSI Escape Sequences</h2>
|
||||
|
||||
<p>Sequences are started by ASCII code 27 (ESC, <code>\e</code>, <code>\x1b</code>, <code>\033</code>)</p>
|
||||
|
||||
<p>Instead of <code>\a</code> (BELL, ASCII 7) in the commands, you can use `\e\` (ESC + backslash). It's the Text Separator code.</p>
|
||||
|
||||
<h3>Text Attributes</h3>
|
||||
|
||||
<p>
|
||||
All text attributes are set using <code>\e[...m</code> where the dots are numbers separated by semicolons.
|
||||
You can combine up to 3 attributes in a single command.
|
||||
</p>
|
||||
|
||||
<table class="ansiref">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Attribute</th>
|
||||
<th>Meaning</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>0</td>
|
||||
<td>Reset text attributes to default</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>7</td>
|
||||
<td>Inverse (fg/bg swap when printing)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>27</td>
|
||||
<td>Inverse OFF</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>30-37, 90-97</td>
|
||||
<td>Foreground color, normal and bright</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>40-47, 100-107</td>
|
||||
<td>Background color, normal and bright</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>Cursor</h3>
|
||||
|
||||
<p>Movement commands scroll the screen if needed. The coordinates are 1-based, origin top left.</p>
|
||||
|
||||
<table class="ansiref w100">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Code</th>
|
||||
<th>Params</th>
|
||||
<th>Meaning</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>\e[?A</td>
|
||||
<td>[count]</td>
|
||||
<td>Move cursor up</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?B</td>
|
||||
<td>[count]</td>
|
||||
<td>Move cursor down</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?C</td>
|
||||
<td>[count]</td>
|
||||
<td>Move cursor forward (right)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?D</td>
|
||||
<td>[count]</td>
|
||||
<td>Move cursor backward (left)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?E</td>
|
||||
<td>[count]</td>
|
||||
<td>Go N line down, start of line</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?F</td>
|
||||
<td>[count]</td>
|
||||
<td>Go N lines up, start of line</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?G</td>
|
||||
<td>column</td>
|
||||
<td>Go to column</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?;?G</td>
|
||||
<td>[row=1];[col=1]</td>
|
||||
<td>Go to row and column</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[6n</td>
|
||||
<td>--</td>
|
||||
<td>Query cursor position. Position is sent back as <code>\e[?;?R</code> with row;column.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[s</td>
|
||||
<td>--</td>
|
||||
<td>Store position</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[u</td>
|
||||
<td>--</td>
|
||||
<td>Restore position</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e7</td>
|
||||
<td>--</td>
|
||||
<td>Store position & attributes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e8</td>
|
||||
<td>--</td>
|
||||
<td>Restore position & attributes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?25l</td>
|
||||
<td>--</td>
|
||||
<td>Hide cursor (literal question mark, lowercase L!)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?25h</td>
|
||||
<td>--</td>
|
||||
<td>Show cursor (literal question mark!)</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>Screen</h3>
|
||||
|
||||
<table class="ansiref w100">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Code</th>
|
||||
<th>Params</th>
|
||||
<th>Meaning</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>\e[?J</td>
|
||||
<td>[mode=0]</td>
|
||||
<td>Clear screen. Mode: 0 - from cursor, 1 - to cursor, 2 - all</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?K</td>
|
||||
<td>[mode=0]</td>
|
||||
<td>Erase line. Mode: 0 - from cursor, 1 - to cursor, 2 - all</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?S</td>
|
||||
<td>[lines]</td>
|
||||
<td>Scroll screen content up, add empty line at the bottom</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[?T</td>
|
||||
<td>[lines]</td>
|
||||
<td>Scroll screen content down, add empty line at the top</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e]W?;?\a</td>
|
||||
<td>rows;cols</td>
|
||||
<td>Set screen size, maximum 25x80 (resp. total 2000 characters). This also clears the screen.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>System Commands</h3>
|
||||
|
||||
<table class="ansiref w100">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Code</th>
|
||||
<th>Params</th>
|
||||
<th>Meaning</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>\ec</td>
|
||||
<td>--</td>
|
||||
<td>
|
||||
"Device Reset" - clear screen, reset attributes, show cursor & move it to 1,1.
|
||||
The screen size and WiFi settings stay unchanged.
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e]FR\a</td>
|
||||
<td>--</td>
|
||||
<td>"Factory Reset", emergency code when you mess up the WiFi, restores SSID to unique default, clears stored credentials & enters Client+AP mode.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\e[5n</td>
|
||||
<td>--</td>
|
||||
<td>Query device status, replies with <code>\e[0n</code> "device is OK". Can be used to check if the UART works.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<nav id="botnav">
|
||||
<a href="/">Terminal</a><!--
|
||||
--><a href="/wifi">WiFi config</a><!--
|
||||
--><a href="/about">About</a>
|
||||
</nav>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
+5
-3
@@ -894,6 +894,7 @@ $._loader = function(vis) {
|
||||
var W, H;
|
||||
var cursor = {a: false, x: 0, y: 0, suppress: false, hidden: false};
|
||||
var screen = [];
|
||||
var blinkIval;
|
||||
|
||||
/** Colors table */
|
||||
var CLR = [// dark gray #2E3436
|
||||
@@ -1071,7 +1072,8 @@ $._loader = function(vis) {
|
||||
}
|
||||
|
||||
/* Cursor blinking */
|
||||
setInterval(function() {
|
||||
clearInterval(blinkIval);
|
||||
blinkIval = setInterval(function() {
|
||||
cursor.a = !cursor.a;
|
||||
if (cursor.hidden) {
|
||||
cursor.a = false;
|
||||
@@ -1284,7 +1286,7 @@ $._loader = function(vis) {
|
||||
|
||||
/** Ask the CGI what APs are visible (async) */
|
||||
function scanAPs() {
|
||||
$.get('/wifi/scan', onScan);
|
||||
$.get('http://'+_root+'/wifi/scan', onScan);
|
||||
}
|
||||
|
||||
function rescan(time) {
|
||||
@@ -1338,7 +1340,7 @@ $._loader = function(vis) {
|
||||
var abortTmeo;
|
||||
|
||||
function getStatus() {
|
||||
xhr.open("GET", "/wifi/connstatus");
|
||||
xhr.open("GET", 'http://'+_root+"/wifi/connstatus");
|
||||
xhr.onreadystatechange = function () {
|
||||
if (xhr.readyState == 4 && xhr.status >= 200 && xhr.status < 300) {
|
||||
clearTimeout(abortTmeo);
|
||||
|
||||
@@ -70,9 +70,10 @@
|
||||
bg = inv ? cell.fg : cell.bg;
|
||||
// Update
|
||||
e.innerText = (cell.t+' ')[0];
|
||||
e.style.color = colorHex(fg);
|
||||
e.style.backgroundColor = colorHex(bg);
|
||||
e.style.fontWeight = fg > 7 ? 'bold' : 'normal';
|
||||
e.classList.className = 'fg'+fg+' bg'+bg;
|
||||
// e.style.color = colorHex(fg);
|
||||
// e.style.backgroundColor = colorHex(bg);
|
||||
// e.style.fontWeight = fg > 7 ? 'bold' : 'normal';
|
||||
}
|
||||
|
||||
/** Show entire screen */
|
||||
|
||||
@@ -75,7 +75,7 @@
|
||||
|
||||
/** Ask the CGI what APs are visible (async) */
|
||||
function scanAPs() {
|
||||
$.get('/wifi/scan', onScan);
|
||||
$.get('http://'+_root+'/wifi/scan', onScan);
|
||||
}
|
||||
|
||||
function rescan(time) {
|
||||
@@ -129,7 +129,7 @@
|
||||
var abortTmeo;
|
||||
|
||||
function getStatus() {
|
||||
xhr.open("GET", "/wifi/connstatus");
|
||||
xhr.open("GET", 'http://'+_root+"/wifi/connstatus");
|
||||
xhr.onreadystatechange = function () {
|
||||
if (xhr.readyState == 4 && xhr.status >= 200 && xhr.status < 300) {
|
||||
clearTimeout(abortTmeo);
|
||||
|
||||
@@ -103,7 +103,7 @@ h1 {
|
||||
h2 {
|
||||
font-size: fsize(2);
|
||||
margin-bottom: dist(-1);
|
||||
&:first-child{margin-top:0}
|
||||
//&:first-child{margin-top:0}
|
||||
}
|
||||
|
||||
td, th {
|
||||
@@ -153,3 +153,26 @@ tbody td {
|
||||
opacity:1;
|
||||
}
|
||||
}
|
||||
|
||||
ul > * {
|
||||
padding-top: .1em;
|
||||
padding-bottom: .1em;
|
||||
}
|
||||
|
||||
#botnav {
|
||||
padding-top: 1.5em;
|
||||
text-align: center;
|
||||
|
||||
a {
|
||||
padding: 0 dist(-2);
|
||||
text-decoration: underline;
|
||||
|
||||
&, &:visited, &:link {
|
||||
color: #2e4d6e;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #5abfff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
$term-colors:
|
||||
// 0 black, 1 red, 2 green, 3 yellow
|
||||
// 4 blue, 5 mag, 6 cyan, 7 white
|
||||
#111213, #CC0000, #4E9A06, #C4A000,
|
||||
#3465A4, #75507B, #06989A, #D3D7CF,
|
||||
// BRIGHT
|
||||
// 8 black, 9 red, 10 green, 11 yellow
|
||||
// 12 blue, 13 mag, 14 cyan, 15 white
|
||||
#555753, #EF2929, #8AE234, #FCE94F,
|
||||
#729FCF, #AD7FA8, #34E2E2, #EEEEEC;
|
||||
|
||||
@for $i from 1 through length($term-colors) {
|
||||
$c: nth($term-colors, $i);
|
||||
.fg#{$i - 1} { color: $c; }
|
||||
.bg#{$i - 1} { background-color: $c; }
|
||||
}
|
||||
@@ -39,3 +39,23 @@ $c-form-highlight-a: #2972ba;
|
||||
// import all our pages
|
||||
@import "pages/wifi";
|
||||
@import "pages/term";
|
||||
@import "pages/about";
|
||||
@import "term-colors";
|
||||
|
||||
// media queries
|
||||
|
||||
@include media($tablet-min) {
|
||||
.mq-phone { display: none; }
|
||||
}
|
||||
|
||||
@include media($phone) {
|
||||
.mq-tablet-min { display: none; }
|
||||
}
|
||||
|
||||
@include media($normal-min) {
|
||||
.mq-tablet-max { display: none; }
|
||||
}
|
||||
|
||||
@include media($tablet-max) {
|
||||
.mq-normal-min { display: none; }
|
||||
}
|
||||
|
||||
@@ -0,0 +1,63 @@
|
||||
.page-about {
|
||||
.Box {
|
||||
padding-left:dist(0);
|
||||
padding-right:dist(0);
|
||||
|
||||
a {font-weight: bold;}
|
||||
}
|
||||
|
||||
#logo {
|
||||
float:right;
|
||||
height: 130px;
|
||||
}
|
||||
|
||||
// mobile friendly
|
||||
#logo2 {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
td {
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.colorprev {
|
||||
margin-top: dist(-2);
|
||||
margin-bottom: dist(-2);
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 2em;
|
||||
padding: dist(-2) 0;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.ansiref {
|
||||
&,td,th{
|
||||
border: 1px solid #666;
|
||||
}
|
||||
|
||||
th,td {
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
th {
|
||||
background-color: rgba(255,255,255,.1);
|
||||
}
|
||||
|
||||
td:nth-child(1) {
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
&.w100 {
|
||||
width: 100%;
|
||||
|
||||
td:nth-child(1) {
|
||||
width: 6em;
|
||||
}
|
||||
|
||||
td:nth-child(2) {
|
||||
width: 8em;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -8,26 +8,28 @@
|
||||
|
||||
#screen {
|
||||
@include noselect();
|
||||
|
||||
font-family: monospace;
|
||||
font-size: 16pt;
|
||||
white-space: nowrap;
|
||||
background: #111213;
|
||||
padding: 6px;
|
||||
display: inline-block;
|
||||
|
||||
border: 2px solid #3983CD;//#1bc249;
|
||||
border: 2px solid #3983CD; //#1bc249;
|
||||
|
||||
span {
|
||||
white-space: pre;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
outline: 1px solid rgba(#ffffff,0.4);
|
||||
outline: 1px solid rgba(#ffffff, 0.4);
|
||||
@include media($phone) {
|
||||
outline: 0 none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fg8, .fg9, .fg10, .fg11, .fg12, .fg13, .fg14, .fg15 {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
#buttons {
|
||||
|
||||
@@ -24,6 +24,12 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav id="botnav">
|
||||
<a href="/wifi">WiFi config</a><!--
|
||||
--><a href="/help">Help</a><!--
|
||||
--><a href="/about">About</a>
|
||||
</nav>
|
||||
|
||||
<script>
|
||||
_root = window.location.host;
|
||||
termInit(%screenData%);
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
<?php
|
||||
|
||||
$f = file_get_contents('term.html');
|
||||
|
||||
$f = str_replace('%screenData%',
|
||||
'{
|
||||
"w": 26, "h": 10,
|
||||
"x": 0, "y": 0,
|
||||
"cv": 1,
|
||||
"screen": "70 t259"
|
||||
}', $f);
|
||||
|
||||
$f = str_replace('window.location.host', '"192.168.0.15"', $f);
|
||||
|
||||
echo $f;
|
||||
@@ -64,6 +64,12 @@
|
||||
<div id="ap-list" style="display:none"></div>
|
||||
</div>
|
||||
|
||||
<nav id="botnav">
|
||||
<a href="/">Terminal</a><!--
|
||||
--><a href="/help">Help</a><!--
|
||||
--><a href="/about">About</a>
|
||||
</nav>
|
||||
|
||||
<div class="Modal hidden" id="psk-modal">
|
||||
<div class="Dialog">
|
||||
<form action="/wifi/connect" method="post" id="conn-form">
|
||||
|
||||
@@ -0,0 +1,13 @@
|
||||
<?php
|
||||
|
||||
$f = file_get_contents('wifi.html');
|
||||
|
||||
$f = str_replace('%StaSSID%', 'Chlivek', $f);
|
||||
$f = str_replace('%StaIP%', '192.168.0.15', $f);
|
||||
$f = str_replace('%WiFiModeNum%', '1', $f);
|
||||
$f = str_replace('%WiFiMode%', 'Client', $f);
|
||||
$f = str_replace('%WiFiChannel%', '1', $f);
|
||||
|
||||
$f = str_replace('window.location.host', '"192.168.0.15"', $f);
|
||||
|
||||
echo $f;
|
||||
+1
-1
Submodule libesphttpd updated: fba7cec0b6...03003ea591
@@ -1,8 +1,13 @@
|
||||
#include <esp8266.h>
|
||||
#include <httpd.h>
|
||||
#include <esp_sdk_ver.h>
|
||||
|
||||
#include "cgi_main.h"
|
||||
#include "screen.h"
|
||||
#include "user_main.h"
|
||||
|
||||
#define STR_HELPER(x) #x
|
||||
#define STR(x) STR_HELPER(x)
|
||||
|
||||
/**
|
||||
* Main page template substitution
|
||||
@@ -32,3 +37,29 @@ httpd_cgi_state ICACHE_FLASH_ATTR tplScreen(HttpdConnData *connData, char *token
|
||||
return HTTPD_CGI_DONE;
|
||||
}
|
||||
|
||||
/** "About" page */
|
||||
httpd_cgi_state ICACHE_FLASH_ATTR tplAbout(HttpdConnData *connData, char *token, void **arg)
|
||||
{
|
||||
if (token == NULL) return HTTPD_CGI_DONE;
|
||||
|
||||
if (streq(token, "vers_fw")) {
|
||||
httpdSend(connData, FIRMWARE_VERSION, -1);
|
||||
}
|
||||
else if (streq(token, "date")) {
|
||||
httpdSend(connData, __DATE__, -1);
|
||||
}
|
||||
else if (streq(token, "time")) {
|
||||
httpdSend(connData, __TIME__, -1);
|
||||
}
|
||||
else if (streq(token, "vers_httpd")) {
|
||||
httpdSend(connData, HTTPDVER, -1);
|
||||
}
|
||||
else if (streq(token, "vers_sdk")) {
|
||||
httpdSend(connData, STR(ESP_SDK_VERSION), -1);
|
||||
}
|
||||
else if (streq(token, "githubrepo")) {
|
||||
httpdSend(connData, TERMINAL_GITHUB_REPO, -1);
|
||||
}
|
||||
|
||||
return HTTPD_CGI_DONE;
|
||||
}
|
||||
|
||||
@@ -2,5 +2,6 @@
|
||||
#define CGI_MAIN_H
|
||||
|
||||
httpd_cgi_state tplScreen(HttpdConnData *connData, char *token, void **arg);
|
||||
httpd_cgi_state tplAbout(HttpdConnData *connData, char *token, void **arg);
|
||||
|
||||
#endif // CGI_MAIN_H
|
||||
|
||||
+7
-12
@@ -6,28 +6,26 @@
|
||||
#include "uart_driver.h"
|
||||
#include "screen.h"
|
||||
|
||||
static volatile bool timer_running = false;
|
||||
static ETSTimer notifyTim;
|
||||
#define SOCK_BUF_LEN 2048
|
||||
static char sock_buff[SOCK_BUF_LEN];
|
||||
|
||||
static void notifyTimCb(void *arg) {
|
||||
timer_running = false;
|
||||
|
||||
void *data = NULL;
|
||||
|
||||
const int bufsiz = 1024;
|
||||
char buff[bufsiz];
|
||||
for (int i = 0; i < 20; i++) {
|
||||
httpd_cgi_state cont = screenSerializeToBuffer(buff, bufsiz, &data);
|
||||
httpd_cgi_state cont = screenSerializeToBuffer(sock_buff, SOCK_BUF_LEN, &data);
|
||||
int flg = 0;
|
||||
if (cont == HTTPD_CGI_MORE) flg |= WEBSOCK_FLAG_MORE;
|
||||
if (i > 0) flg |= WEBSOCK_FLAG_CONT;
|
||||
cgiWebsockBroadcast(URL_WS_UPDATE, buff, (int) strlen(buff), flg);
|
||||
cgiWebsockBroadcast(URL_WS_UPDATE, sock_buff, (int) strlen(sock_buff), flg);
|
||||
if (cont == HTTPD_CGI_DONE) break;
|
||||
}
|
||||
|
||||
screenSerializeToBuffer(NULL, bufsiz, &data);
|
||||
screenSerializeToBuffer(NULL, SOCK_BUF_LEN, &data);
|
||||
}
|
||||
|
||||
static ETSTimer notifyTim;
|
||||
|
||||
/**
|
||||
* Broadcast screen state to sockets.
|
||||
* This is a callback for the Screen module,
|
||||
@@ -35,9 +33,6 @@ static void notifyTimCb(void *arg) {
|
||||
*/
|
||||
void ICACHE_FLASH_ATTR screen_notifyChange(void)
|
||||
{
|
||||
if (timer_running) return;
|
||||
|
||||
timer_running = true;
|
||||
os_timer_disarm(¬ifyTim);
|
||||
os_timer_setfn(¬ifyTim, notifyTimCb, NULL);
|
||||
os_timer_arm(¬ifyTim, 20, 0);
|
||||
|
||||
@@ -27,6 +27,8 @@ HttpdBuiltInUrl routes[] = {
|
||||
|
||||
// --- Web pages ---
|
||||
ROUTE_TPL_FILE("/", tplScreen, "/term.tpl"),
|
||||
ROUTE_TPL_FILE("/about", tplAbout, "/about.tpl"),
|
||||
ROUTE_FILE("/help", "/help.tpl"),
|
||||
|
||||
// --- Sockets ---
|
||||
ROUTE_WS(URL_WS_UPDATE, updateSockConnect),
|
||||
|
||||
+2
-2
@@ -18,12 +18,12 @@
|
||||
#include <captdns.h>
|
||||
#include <espfs.h>
|
||||
#include <webpages-espfs.h>
|
||||
#include <cgiflash.h>
|
||||
#include "serial.h"
|
||||
#include "io.h"
|
||||
#include "screen.h"
|
||||
#include "routes.h"
|
||||
|
||||
#define FIRMWARE_VERSION "0.3"
|
||||
#include "user_main.h"
|
||||
|
||||
#ifdef ESPFS_POS
|
||||
CgiUploadFlashDef uploadParams={
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
#ifndef USER_MAIN_H_H
|
||||
#define USER_MAIN_H_H
|
||||
|
||||
#define FIRMWARE_VERSION "0.4"
|
||||
#define TERMINAL_GITHUB_REPO "https://github.com/MightyPork/esp-vt100-firmware"
|
||||
|
||||
#endif //USER_MAIN_H_H
|
||||
Reference in New Issue
Block a user