Ondřej Hruška 3 years ago
parent
commit
e5479ed79c
Signed by: Ondřej Hruška <ondra@ondrovo.com> GPG key ID: 2C5FD5035250423D
20 changed files with 322 additions and 2243 deletions
  1. 0 0
      .gitkeep
  2. 5 5
      about.html
  3. 2 2
      cfg_network.html
  4. 8 8
      cfg_system.html
  5. 70 100
      cfg_term.html
  6. 2 2
      cfg_wifi.html
  7. 8 8
      cfg_wifi_conn.html
  8. 0 2079
      css/app.310033b.css
  9. 113 7
      css/app.69e5b77.css
  10. 95 8
      help.html
  11. BIN
      img/adapter.jpg.orig
  12. BIN
      img/vt100.jpg.orig
  13. 0 0
      js/.gitkeep
  14. 0 2
      js/app.310033b.js
  15. 0 1
      js/app.310033b.js.map
  16. 4 0
      js/app.69e5b77.js
  17. 1 0
      js/app.69e5b77.js.map
  18. 0 2
      js/app.f5dd70a.js
  19. 0 1
      js/app.f5dd70a.js.map
  20. 14 18
      term.html

css/.gitkeep → .gitkeep View File


+ 5 - 5
about.html View File

@@ -5,8 +5,8 @@
5 5
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
6 6
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1">
7 7
 	<title>About ESPTerm :: ESPTerm</title>
8
-	<link href="/css/app.f5dd70a.css" rel="stylesheet">
9
-	<script src="/js/app.f5dd70a.js"></script>
8
+	<link href="/css/app.69e5b77.css" rel="stylesheet">
9
+	<script src="/js/app.69e5b77.js"></script>
10 10
 	<script>
11 11
 		var _root = location.host;
12 12
 		var _demo = 1;
@@ -52,12 +52,12 @@
52 52
 	<table>
53 53
 		<tr>
54 54
 			<th>ESPTerm</th>
55
-			<td>v2.0.0, built 2017-09-26 at&nbsp;18:29 CEST</td>
55
+			<td>v2.1.0, built 2017-10-02 at&nbsp;3:24 CEST</td>
56 56
 		</tr>
57 57
 		<tr>
58 58
 			<th>Git hash</th>
59
-			<td>back-end: <a href="https://github.com/espterm/espterm-firmware/commit/8c55202">8c55202</a>,
60
-				front-end: <a href="https://github.com/espterm/espterm-front-end/commit/f5dd70a">f5dd70a</td>
59
+			<td>back-end: <a href="https://github.com/espterm/espterm-firmware/commit/a72e2be">a72e2be</a>,
60
+				front-end: <a href="https://github.com/espterm/espterm-front-end/commit/69e5b77">69e5b77</td>
61 61
 		</tr>
62 62
 		<tr>
63 63
 			<th>libesphttpd</th>

+ 2 - 2
cfg_network.html View File

@@ -5,8 +5,8 @@
5 5
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
6 6
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1">
7 7
 	<title>Network Settings :: ESPTerm</title>
8
-	<link href="/css/app.f5dd70a.css" rel="stylesheet">
9
-	<script src="/js/app.f5dd70a.js"></script>
8
+	<link href="/css/app.69e5b77.css" rel="stylesheet">
9
+	<script src="/js/app.69e5b77.js"></script>
10 10
 	<script>
11 11
 		var _root = location.host;
12 12
 		var _demo = 1;

+ 8 - 8
cfg_system.html View File

@@ -5,8 +5,8 @@
5 5
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
6 6
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1">
7 7
 	<title>System Settings :: ESPTerm</title>
8
-	<link href="/css/app.f5dd70a.css" rel="stylesheet">
9
-	<script src="/js/app.f5dd70a.js"></script>
8
+	<link href="/css/app.69e5b77.css" rel="stylesheet">
9
+	<script src="/js/app.69e5b77.js"></script>
10 10
 	<script>
11 11
 		var _root = location.host;
12 12
 		var _demo = 1;
@@ -63,10 +63,10 @@
63 63
 
64 64
 	<div class="Row explain">
65 65
 		
66
-		ESP8266 can be overclocked from 80&nbsp;MHz to 160&nbsp;MHz. 
67
-		This will make it more responsive and allow faster screen updates
68
-		at the expense of slightly higher power consumption. This can also make 
69
-		it more susceptible to interference. Use with care.
66
+		ESP8266 can be overclocked from 80&nbsp;MHz to 160&nbsp;MHz. This will make 
67
+		it more responsive and allow faster screen updates at the expense of slightly 
68
+		higher power consumption. This can also make it more susceptible to interference.
69
+		Use with care.
70 70
 			</div>
71 71
 
72 72
 	<div class="Row checkbox" >
@@ -135,10 +135,10 @@
135 135
 
136 136
 	<div class="Row explain">
137 137
 		
138
-		The "admin password" is used to manipulate the stored default settings
138
+		The "admin password" is used to manipulate the stored default settings 
139 139
 		and to change access restrictions. This password is not saved as part 
140 140
 		of the main config, i.e. using save / restore does not affect this 
141
-		password. When the admin password is forgotten, the easiest way to
141
+		password. When the admin password is forgotten, the easiest way to 
142 142
 		re-gain access is to wipe and re-flash the chip.<br>
143 143
 		The default admin password is "%def_admin_pw%".
144 144
 			</div>

+ 70 - 100
cfg_term.html View File

@@ -5,8 +5,8 @@
5 5
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
6 6
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1">
7 7
 	<title>Terminal Settings :: ESPTerm</title>
8
-	<link href="/css/app.f5dd70a.css" rel="stylesheet">
9
-	<script src="/js/app.f5dd70a.js"></script>
8
+	<link href="/css/app.69e5b77.css" rel="stylesheet">
9
+	<script src="/js/app.69e5b77.js"></script>
10 10
 	<script>
11 11
 		var _root = location.host;
12 12
 		var _demo = 1;
@@ -40,24 +40,28 @@
40 40
 	<div class="Row explain">
41 41
 		
42 42
 		To select default text and background color, click on the
43
-		preview palette. Alternatively, use numbers 0-15 for theme colors, 16-255 for standard 
44
-		colors and hex (#FFFFFF) for True Color (24-bit).
43
+		preview palette. Alternatively, use numbers 0-15 for theme colors,
44
+		16-255 for standard colors and hex (#FFFFFF) for True Color (24-bit).
45 45
 			</div>
46 46
 
47 47
 	<div class="Row">
48
-		<label for="theme">Color palette</label>
49
-		<select name="theme" id="theme" class="short" onchange="showColor()">
48
+		<label for="theme">Color Palette</label>
49
+		<select name="theme" id="theme">
50 50
 			<option value="0">Tango</option>
51 51
 			<option value="1">Linux (CGA)</option>
52 52
 			<option value="2">XTerm</option>
53 53
 			<option value="3">Rxvt</option>
54 54
 			<option value="4">Ambience</option>
55
-			<option value="5">Solarized</option>
55
+			<option value="5">Solarized Dark</option>
56
+			<option value="11">Solarized Dark, high contrast</option>
57
+			<option value="10">Solarized Light</option>
56 58
 			<option value="6">CGA NTSC</option>
57 59
 			<option value="7">ZX Spectrum</option>
58 60
 			<option value="8">Apple II</option>
59 61
 			<option value="9">Commodore</option>
60 62
 		</select>
63
+		<span onclick="TermConf.prevTheme()" class="mq-no-phone theme-nav-btn">◀</span>
64
+		<span onclick="TermConf.nextTheme()" class="mq-no-phone theme-nav-btn">▶</span>
61 65
 	</div>
62 66
 
63 67
 	<div class="Row color-preview">
@@ -91,53 +95,53 @@
91 95
 		<label>Foreground</label>
92 96
 		<div>
93 97
 			<div class="colorprev fg">
94
-				<span data-fg=0 data-bg=0 style="text-shadow: 0 0 4px white;">0</span><!--
95
-				--><span data-fg=1 data-bg=0>1</span><!--
96
-				--><span data-fg=2 data-bg=0>2</span><!--
97
-				--><span data-fg=3 data-bg=0>3</span><!--
98
-				--><span data-fg=4 data-bg=0>4</span><!--
99
-				--><span data-fg=5 data-bg=0>5</span><!--
100
-				--><span data-fg=6 data-bg=0>6</span><!--
101
-				--><span data-fg=7 data-bg=0>7</span>
98
+				<span data-fg=0>0</span><!--
99
+				--><span data-fg=1>1</span><!--
100
+				--><span data-fg=2>2</span><!--
101
+				--><span data-fg=3>3</span><!--
102
+				--><span data-fg=4>4</span><!--
103
+				--><span data-fg=5>5</span><!--
104
+				--><span data-fg=6>6</span><!--
105
+				--><span data-fg=7>7</span>
102 106
 			</div>
103 107
 
104 108
 			<div class="colorprev fg">
105
-				<span data-fg=8 data-bg=0>8</span><!--
106
-				--><span data-fg=9 data-bg=0>9</span><!--
107
-				--><span data-fg=10 data-bg=0>10</span><!--
108
-				--><span data-fg=11 data-bg=0>11</span><!--
109
-				--><span data-fg=12 data-bg=0>12</span><!--
110
-				--><span data-fg=13 data-bg=0>13</span><!--
111
-				--><span data-fg=14 data-bg=0>14</span><!--
112
-				--><span data-fg=15 data-bg=0>15</span>
109
+				<span data-fg=8>8</span><!--
110
+				--><span data-fg=9>9</span><!--
111
+				--><span data-fg=10>10</span><!--
112
+				--><span data-fg=11>11</span><!--
113
+				--><span data-fg=12>12</span><!--
114
+				--><span data-fg=13>13</span><!--
115
+				--><span data-fg=14>14</span><!--
116
+				--><span data-fg=15>15</span>
113 117
 			</div>
114 118
 		</div>
115 119
 	</div>
116 120
 
117 121
 	<div class="Row color-preview">
118
-		<label>Defaults</label>
122
+		<label></label>
119 123
 		<div class="color-example" data-fg="" data-bg="">
120 124
 			Default colors preview		</div>
121 125
 	</div>
122 126
 
123 127
 	<div class="Row color-preview">
124
-		<label>Presets</label>
128
+		<label>Defaults Presets</label>
125 129
 		<div id="fgbg_presets"></div>
126 130
 	</div>
127 131
 
128 132
 	<div class="Row">
129 133
 		<div class="SubRow">
130
-			<label for="default_fg">Default fg.</label>
134
+			<label for="default_fg">Default Fg.</label>
131 135
 			<input type="text" name="default_fg" id="default_fg" class="short" value="7">
132 136
 		</div>
133 137
 		<div class="SubRow">
134
-			<label for="default_bg">Default bg.</label>
138
+			<label for="default_bg">Default Bg.</label>
135 139
 			<input type="text" name="default_bg" id="default_bg" class="short" value="0">
136 140
 		</div>
137 141
 	</div>
138 142
 
139 143
 	<div class="Row">
140
-		<label>Cursor style</label>
144
+		<label>Cursor Style</label>
141 145
 		<select name="cursor_shape" id="cursor_shape">
142 146
 			<option value="0">Block, blinking</option>
143 147
 			<option value="2">Block, steady</option>
@@ -159,9 +163,9 @@
159 163
 
160 164
 	<div class="Row explain">
161 165
 		
162
-		Those are the initial settings used after ESPTerm powers on, or when the screen
163
-		reset command is received (<code>\ec</code>). They can be changed by the 
164
-		terminal application using escape sequences.
166
+		Those are the initial settings used after ESPTerm powers on, 
167
+		or when the screen reset command is received (<code>\ec</code>).
168
+		They can be changed by the terminal application using escape sequences.
165 169
 			</div>
166 170
 
167 171
 	<div class="Row">
@@ -176,7 +180,7 @@
176 180
 	</div>
177 181
 
178 182
 	<div class="Row">
179
-		<label for="term_title">Header text</label>
183
+		<label for="term_title">Header Text</label>
180 184
 		<input type="text" name="term_title" id="term_title" value="ESPTerm Web UI Demo" required>
181 185
 	</div>
182 186
 
@@ -187,7 +191,7 @@
187 191
 	</div>
188 192
 
189 193
 	<div class="Row">
190
-		<label>Button labels</label>
194
+		<label>Button Labels</label>
191 195
 		<input class="tiny" type="text" name="btn1" id="btn1" value="OK">
192 196
 		<input class="tiny" type="text" name="btn2" id="btn2" value="Cancel">
193 197
 		<input class="tiny" type="text" name="btn3" id="btn3" value="">
@@ -227,7 +231,7 @@
227 231
 
228 232
 	<div class="Row explain">
229 233
 		
230
-		This form controls the communication UART. The debug UART is fixed 
234
+		This form controls the communication UART. The debug UART is fixed
231 235
 		at 115.200 baud, one stop-bit and no parity.
232 236
 			</div>
233 237
 
@@ -287,31 +291,44 @@
287 291
 		Edit them only if you know what you're doing.	</div>
288 292
 
289 293
 	<div class="Row">
290
-		<label for="parser_tout_ms">Parser timeout<span class="mq-phone">&nbsp;(ms)</span></label>
294
+		<label for="parser_tout_ms">Parser Timeout<span class="mq-phone">&nbsp;(ms)</span></label>
291 295
 		<input type="number" step=1 min=0 name="parser_tout_ms" id="parser_tout_ms" value="10" required>
292 296
 		<span class="mq-no-phone">&nbsp;ms</span>
293 297
 	</div>
294 298
 
295 299
 	<div class="Row">
296
-		<label for="display_tout_ms">Redraw delay<span class="mq-phone">&nbsp;(ms)</span></label>
300
+		<label for="display_tout_ms">Redraw Delay<span class="mq-phone">&nbsp;(ms)</span></label>
297 301
 		<input type="number" step=1 min=0 name="display_tout_ms" id="display_tout_ms" value="15" required>
298 302
 		<span class="mq-no-phone">&nbsp;ms</span>
299 303
 	</div>
300 304
 
301 305
 	<div class="Row">
302
-		<label for="display_cooldown_ms">Redraw cooldown<span class="mq-phone">&nbsp;(ms)</span></label>
306
+		<label for="display_cooldown_ms">Redraw Cooldown<span class="mq-phone">&nbsp;(ms)</span></label>
303 307
 		<input type="number" step=1 min=0 name="display_cooldown_ms" id="display_cooldown_ms" value="35" required>
304 308
 		<span class="mq-no-phone">&nbsp;ms</span>
305 309
 	</div>
306 310
 
307 311
 	<div class="Row checkbox" >
312
+		<label>Debug internal state</label><!--
313
+		--><span class="box" tabindex=0 role=checkbox></span>
314
+		<input type="hidden" id="debugbar" name="debugbar" value="">
315
+	</div>
316
+
317
+	<div class="Row checkbox" >
318
+		<label>Display control codes</label><!--
319
+		--><span class="box" tabindex=0 role=checkbox></span>
320
+		<input type="hidden" id="ascii_debug" name="ascii_debug" value="">
321
+	</div>
322
+
323
+
324
+	<div class="Row checkbox" >
308 325
 		<label>SS3 Fn keys</label><!--
309 326
 		--><span class="box" tabindex=0 role=checkbox></span>
310 327
 		<input type="hidden" id="fn_alt_mode" name="fn_alt_mode" value="1">
311 328
 	</div>
312 329
 
313 330
 	<div class="Row checkbox" >
314
-		<label>Capture all keys<br>(F5, F11, F12…)</label><!--
331
+		<label>Capture F5, F11, F12</label><!--
315 332
 		--><span class="box" tabindex=0 role=checkbox></span>
316 333
 		<input type="hidden" id="want_all_fn" name="want_all_fn" value="0">
317 334
 	</div>
@@ -322,74 +339,27 @@
322 339
 		<input type="hidden" id="show_config_links" name="show_config_links" value="1">
323 340
 	</div>
324 341
 
342
+	<div class="Row checkbox" >
343
+		<label>Allow \e?12h/l</label><!--
344
+		--><span class="box" tabindex=0 role=checkbox></span>
345
+		<input type="hidden" id="allow_decopt_12" name="allow_decopt_12" value="0">
346
+	</div>
347
+
325 348
 	<div class="Row buttons">
326 349
 		<a class="button icn-ok" href="#" onclick="qs('#form-expert').submit()">Apply!</a>
327 350
 	</div>
328 351
 </form>
329 352
 
330 353
 <script>
331
-	$('#cursor_shape').val();
332
-	$('#theme').val(0);
333
-
334
-    $('#uart_baud').val(115200);
335
-    $('#uart_parity').val(2);
336
-    $('#uart_stopbits').val(1);
337
-
338
-	function showColor() {
339
-		var ex = qs('.color-example');
340
-		var fg = $('#default_fg').val();
341
-		var bg = $('#default_bg').val();
342
-
343
-		if (/^\d+$/.test(fg)) fg = +fg;
344
-		else if (!/^#[\da-f]{6}$/i.test(fg)) {
345
-		  fg = 'black';
346
-		}
347
-
348
-		if (/^\d+$/.test(bg)) bg = +bg;
349
-		else if (!/^#[\da-f]{6}$/i.test(bg)) {
350
-		  bg = 'black';
351
-		}
352
-
353
-		ex.dataset.fg = fg;
354
-		ex.dataset.bg = bg;
355
-
356
-		themes.themePreview(+$('#theme').val())
357
-	}
358
-	showColor();
359
-
360
-	$('#default_fg').on('input', showColor)
361
-	$('#default_bg').on('input', showColor)
362
-
363
-	$('.colorprev.bg span').on('click', function() {
364
-		var bg = this.dataset.bg;
365
-		if (typeof bg != 'undefined') $('#default_bg').val(bg);
366
-		showColor()
367
-	});
368
-
369
-	$('.colorprev.fg span').on('click', function() {
370
-		var fg = this.dataset.fg;
371
-		if (typeof fg != 'undefined') $('#default_fg').val(fg);
372
-		showColor()
373
-	});
374
-
375
-	var $presets = $('#fgbg_presets');
376
-	for(var i = 0; i < themes.fgbgThemes.length; i++) {
377
-	  fg = themes.fgbgThemes[i][0];
378
-	  bg = themes.fgbgThemes[i][1];
379
-      $presets
380
-        .htmlAppend(
381
-          '<span class="preset" ' +
382
-          'data-xfg="'+fg+'" data-xbg="'+bg+'" ' +
383
-          'style="color:'+fg+';background:'+bg+'">&nbsp;['+i+']&nbsp;</span>');
384
-
385
-	  if ((i+1)%5==0) $presets.htmlAppend('<br>');
386
-	}
387
-
388
-	$('.preset').on('click', function() {
389
-      $('#default_fg').val(this.dataset.xfg)
390
-      $('#default_bg').val(this.dataset.xbg)
391
-      showColor()
392
-	});
354
+  $.ready(function () {
355
+    $('#cursor_shape').val('');
356
+    $('#theme').val('0');
357
+    $('#uart_baud').val('115200');
358
+    $('#uart_parity').val('2');
359
+    $('#uart_stopbits').val('1');
360
+
361
+    TermConf.init();
362
+  });
393 363
 </script>
394 364
 
395 365
 <div class="botpad"></div>

+ 2 - 2
cfg_wifi.html View File

@@ -5,8 +5,8 @@
5 5
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
6 6
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1">
7 7
 	<title>WiFi Settings :: ESPTerm</title>
8
-	<link href="/css/app.f5dd70a.css" rel="stylesheet">
9
-	<script src="/js/app.f5dd70a.js"></script>
8
+	<link href="/css/app.69e5b77.css" rel="stylesheet">
9
+	<script src="/js/app.69e5b77.js"></script>
10 10
 	<script>
11 11
 		var _root = location.host;
12 12
 		var _demo = 1;

+ 8 - 8
cfg_wifi_conn.html View File

@@ -5,8 +5,8 @@
5 5
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
6 6
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1">
7 7
 	<title>Connecting to Network :: ESPTerm</title>
8
-	<link href="/css/app.f5dd70a.css" rel="stylesheet">
9
-	<script src="/js/app.f5dd70a.js"></script>
8
+	<link href="/css/app.69e5b77.css" rel="stylesheet">
9
+	<script src="/js/app.69e5b77.js"></script>
10 10
 	<script>
11 11
 		var _root = location.host;
12 12
 		var _demo = 1;
@@ -26,14 +26,14 @@
26 26
 
27 27
 <div class="Box">
28 28
 	<p>
29
-		If you're configuring ESPTerm via a smartphone, or were connected
30
-		from another external network, your device may lose connection and this 
31
-		progress indicator won't work. Please wait a while (~ 15 seconds), 
29
+		If you're configuring ESPTerm via a smartphone, or were connected 
30
+		from another external network, your device may lose connection and 
31
+		this progress indicator won't work. Please wait a while (~ 15 seconds), 
32 32
 		then check if the connection succeeded.</p>
33 33
 	<p>
34
-		To force enable the built-in AP, hold the BOOT 
35
-		button until the blue LED starts flashing. Hold the button longer (until the LED 
36
-		flashes rapidly) for a "factory reset".</p>
34
+		To force enable the built-in AP, hold the BOOT button until the blue LED 
35
+		starts flashing. Hold the button longer (until the LED flashes rapidly) 
36
+		for a "factory reset".</p>
37 37
 </div>
38 38
 
39 39
 <script>

File diff suppressed because it is too large
+ 0 - 2079
css/app.310033b.css


css/app.f5dd70a.css → css/app.69e5b77.css View File

@@ -452,7 +452,7 @@ html {
452 452
 }
453 453
 
454 454
 html {
455
-  font-family: Arial, sans-serif;
455
+  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
456 456
   color: #D0D0D0;
457 457
   background: #131315;
458 458
 }
@@ -681,7 +681,7 @@ ul {
681 681
 
682 682
 #content tbody th {
683 683
   text-align: right;
684
-  width: 180px;
684
+  width: 220px;
685 685
   color: white;
686 686
 }
687 687
 
@@ -1162,7 +1162,7 @@ input[type="number"], input[type="password"], input[type="text"], textarea, sele
1162 1162
   border-bottom: 2px solid #2972ba;
1163 1163
   background-color: #3c3c3c;
1164 1164
   color: white;
1165
-  padding: 6px;
1165
+  padding: 4px 6px;
1166 1166
   line-height: 1em;
1167 1167
   font-weight: normal;
1168 1168
 }
@@ -1303,7 +1303,7 @@ form {
1303 1303
 }
1304 1304
 
1305 1305
 .Row .spacer {
1306
-  width: 180px;
1306
+  width: 220px;
1307 1307
 }
1308 1308
 
1309 1309
 @media screen and (max-width: 544px) {
@@ -1359,7 +1359,7 @@ form {
1359 1359
   font-weight: bold;
1360 1360
   color: white;
1361 1361
   display: inline-block;
1362
-  width: 180px;
1362
+  width: 220px;
1363 1363
   text-align: right;
1364 1364
   text-shadow: 1px 1px 3px black;
1365 1365
   padding: 8px;
@@ -1635,7 +1635,6 @@ body.term #content h1 {
1635 1635
 #screen {
1636 1636
   white-space: nowrap;
1637 1637
   background: #111213;
1638
-  padding: 6px;
1639 1638
   display: inline-block;
1640 1639
   border: 2px solid #3983CD;
1641 1640
   position: relative;
@@ -1651,6 +1650,40 @@ body.term #content h1 {
1651 1650
   cursor: text;
1652 1651
 }
1653 1652
 
1653
+#screen .screen-margin {
1654
+  position: absolute;
1655
+  background: rgba(17, 18, 19, 0.2);
1656
+  -webkit-backdrop-filter: blur(10px);
1657
+  backdrop-filter: blur(10px);
1658
+  pointer-events: none;
1659
+}
1660
+
1661
+#screen .screen-margin.top {
1662
+  top: 0;
1663
+  left: 0;
1664
+  right: 0;
1665
+  height: 6px;
1666
+}
1667
+
1668
+#screen .screen-margin.left, #screen .screen-margin.right {
1669
+  top: 6px;
1670
+  left: 0;
1671
+  bottom: 0;
1672
+  width: 6px;
1673
+}
1674
+
1675
+#screen .screen-margin.right {
1676
+  left: auto;
1677
+  right: 0;
1678
+}
1679
+
1680
+#screen .screen-margin.bottom {
1681
+  left: 6px;
1682
+  right: 6px;
1683
+  bottom: 0;
1684
+  height: 6px;
1685
+}
1686
+
1654 1687
 #screen #softkb-input {
1655 1688
   position: absolute;
1656 1689
   top: 6px;
@@ -1680,8 +1713,20 @@ body.term #content h1 {
1680 1713
   display: block;
1681 1714
 }
1682 1715
 
1716
+#screen .debug-canvas {
1717
+  position: absolute;
1718
+  top: 6px;
1719
+  left: 6px;
1720
+  pointer-events: none;
1721
+}
1722
+
1683 1723
 #screen .debug-toolbar {
1684 1724
   line-height: 1.5;
1725
+  text-align: left;
1726
+  padding: 6px;
1727
+  font-family: "DejaVu Sans Mono", "Liberation Mono", "Inconsolata", "Menlo", monospace;
1728
+  font-size: 12px;
1729
+  white-space: normal;
1685 1730
 }
1686 1731
 
1687 1732
 #action-buttons {
@@ -1701,6 +1746,10 @@ body.term #content h1 {
1701 1746
   outline: 0 none !important;
1702 1747
 }
1703 1748
 
1749
+#action-buttons button.inactive {
1750
+  opacity: 0.2;
1751
+}
1752
+
1704 1753
 #load-failed {
1705 1754
   color: red;
1706 1755
   font-size: 18px;
@@ -1772,7 +1821,7 @@ body.term #content h1 {
1772 1821
 }
1773 1822
 
1774 1823
 #fu_form label {
1775
-  width: 8em;
1824
+  width: 10em;
1776 1825
   display: inline-block;
1777 1826
 }
1778 1827
 
@@ -1825,6 +1874,7 @@ body.term #content h1 {
1825 1874
   background: #d1d5db;
1826 1875
   padding: 5px 10px;
1827 1876
   overflow-x: auto;
1877
+  margin: 6px;
1828 1878
 }
1829 1879
 
1830 1880
 #keyboard-shortcut-bar:not(.open) {
@@ -1848,6 +1898,40 @@ body.term #content h1 {
1848 1898
   color: #000;
1849 1899
 }
1850 1900
 
1901
+body.pseudo-fullscreen #screen .screen-margin,
1902
+body.pseudo-fullscreen #keyboard-shortcut-bar {
1903
+  display: none;
1904
+}
1905
+
1906
+body.pseudo-fullscreen #outer {
1907
+  position: static;
1908
+}
1909
+
1910
+body.pseudo-fullscreen #screen {
1911
+  position: fixed;
1912
+  top: 0;
1913
+  left: 0;
1914
+  width: 100%;
1915
+  height: 100%;
1916
+  border: none;
1917
+}
1918
+
1919
+body.pseudo-fullscreen #screen canvas {
1920
+  position: fixed;
1921
+  top: 0;
1922
+  left: 0;
1923
+  z-index: 99;
1924
+}
1925
+
1926
+body.pseudo-fullscreen #term-nav {
1927
+  position: fixed;
1928
+  width: 100%;
1929
+  bottom: 0;
1930
+  z-index: 98;
1931
+  height: 24px;
1932
+  padding: 0;
1933
+}
1934
+
1851 1935
 .bold {
1852 1936
   font-weight: bold !important;
1853 1937
 }
@@ -1915,6 +1999,28 @@ body.term #content h1 {
1915 1999
   padding: 5px;
1916 2000
 }
1917 2001
 
2002
+.theme-nav-btn {
2003
+  width: 2em;
2004
+  height: 2em;
2005
+  display: flex;
2006
+  align-items: center;
2007
+  justify-content: space-around;
2008
+  background: #4c4c4c;
2009
+  color: #eaeaea;
2010
+  margin: 5px;
2011
+  border-radius: 5px;
2012
+  -webkit-user-select: none;
2013
+  -moz-user-select: none;
2014
+  -ms-user-select: none;
2015
+  user-select: none;
2016
+  cursor: pointer;
2017
+  position: relative;
2018
+}
2019
+
2020
+.theme-nav-btn:active {
2021
+  top: 1px;
2022
+}
2023
+
1918 2024
 .page-about .Box {
1919 2025
   padding-left: 1rem;
1920 2026
   padding-right: 1rem;

+ 95 - 8
help.html View File

@@ -5,8 +5,8 @@
5 5
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
6 6
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1">
7 7
 	<title>Quick Reference :: ESPTerm</title>
8
-	<link href="/css/app.f5dd70a.css" rel="stylesheet">
9
-	<script src="/js/app.f5dd70a.js"></script>
8
+	<link href="/css/app.69e5b77.css" rel="stylesheet">
9
+	<script src="/js/app.69e5b77.js"></script>
10 10
 	<script>
11 11
 		var _root = location.host;
12 12
 		var _demo = 1;
@@ -51,15 +51,14 @@
51 51
 				appear on the screen. Set <i>Parser Timeout = 0</i> in <a href="cfg_term.html">Terminal Settings</a>
52 52
 				to be able to manually enter escape sequences.
53 53
 
54
-			<li>There is very little RAM available to the webserver, and it can support at most 4 connections at the same time.
55
-				Each terminal session (open window with the terminal screen) uses one persistent connection for screen updates.
56
-				<b>Avoid leaving unused windows open</b>, or either the RAM or connections may be exhausted.
54
+			<li>Use Ctrl+F12 to open a screen debug panel. Additional debugging can be enabled in the
55
+				<a href="cfg_term.html">Terminal Settings</a> (near the bottom).
57 56
 
58 57
 			<li><b>For best performance</b>, use the module in Client mode (connected to external network) and minimize the number
59 58
 				of simultaneous connections. Enabling AP consumes extra RAM because the DHCP server and Captive Portal
60 59
 				DNS server are started.
61 60
 
62
-			<li>In AP mode, <b>check that the WiFi channel used is clear</b>; interference may cause flaky connection.
61
+			<li><b>Check that the WiFi channel used is clear</b>; interference may cause flaky connection.
63 62
 				A good mobile app to use for this is
64 63
 				<a href="https://play.google.com/store/apps/details?id=com.farproc.wifi.analyzer">WiFi Analyzer (Google Play)</a>.
65 64
 				Adjust the hotspot strength and range using the <i>Tx Power setting</i>.
@@ -513,7 +512,7 @@
513 512
 </div>
514 513
 
515 514
 <div class="Box fold">
516
-	<h2>Commands: Style attributes</h2>
515
+	<h2>Commands: Style Attributes</h2>
517 516
 
518 517
 	<div class="Row v">
519 518
 		<p>
@@ -553,7 +552,7 @@
553 552
 
554 553
 
555 554
 <div class="Box fold">
556
-	<h2>Commands: Color attributes</h2>
555
+	<h2>Commands: Color Attributes</h2>
557 556
 
558 557
 	<div class="Row v">
559 558
 		<p>
@@ -931,6 +930,94 @@
931 930
 </div>
932 931
 
933 932
 <div class="Box fold">
933
+	<h2>Commands: Networking</h2>
934
+
935
+	<div class="Row v">
936
+		<p>
937
+			ESPTerm implements commands for device-to-device messaging and for requesting external
938
+			servers. This can be used e.g. for remote control, status reporting or data upload / download.
939
+		</p>
940
+
941
+		<p>
942
+			Networking commands use the format <code>\e^...\a</code>, a Privacy Message (PM).
943
+			PM is similar to OSC, which uses <code>]</code> in place of <code>^</code>. The PM payload (text between <code>\e^</code> and <code>\a</code>)
944
+			must be shorter than 256 bytes,	and should not contain any control characters (ASCII < 32).
945
+		</p>
946
+
947
+		<h3>Device-to-device Messaging</h3>
948
+
949
+		<p>
950
+			To send a message to another ESPTerm module, use: <code>\e^M;<i>DestIP</i>;<i>message</i>\a</code>.
951
+		</p>
952
+
953
+		<p>
954
+			This command sends a POST request to <code>http://<i>&lt;DestIP&gt;</i>/api/v1/msg</code>.
955
+			The IP address may be appended by a port, if needed (eg. :8080).
956
+		</p>
957
+
958
+		<p>
959
+			Each ESPTerm listens for such requests and relays them to UART:
960
+			<code>\e^m;<i>SrcIP</i>;L=<i>length</i>;<i>message</i>\a</code>, with <i>length</i> being the byte length of
961
+			<i>message</i>, as ASCII.
962
+		</p>
963
+
964
+		<p>
965
+			Notice a pattern with the first letter: capital is always a command, lower case a response.
966
+			This is followed with the HTTP commands and any networking commands added in the future.
967
+		</p>
968
+
969
+		<p>
970
+			<b>Example:</b> Node 192.168.0.10 sends a message to 192.168.0.19: <code>\e^M;192.168.0.19;Hello\a</code>.
971
+			Node 192.168.0.19 receives <code>\e^m;192.168.0.10;L=5;Hello\a</code> on the UART. Note that the IP
972
+			address in the reception message is that of the first node, thus it can be used to send a message back.
973
+		</p>
974
+
975
+		<h3>External HTTP requests</h3>
976
+
977
+		<p>
978
+			To request an external server, use <code>\e^H;<i>method</i>;<i>options</i>;<i>url</i>\n<i>body</i>\a</code>.
979
+		</p>
980
+
981
+		<ul>
982
+			<li><code><i>method</i></code> - can be any usual HTTP verb, such as <code>GET</code>, <code>POST</code>, <code>PUT</code>, <code>HEAD</code>.
983
+			<li><code><i>options</i></code> - is a comma-separated list of flags and parameters:
984
+				<ul>
985
+					<li><code>H</code> - get response headers
986
+					<li><code>B</code> - get response body
987
+					<li><code>X</code> - ignore the response, return nothing
988
+					<li><code>T=<i>ms</i></code> - request timeout (default 5000&nbsp;ms), in milliseconds
989
+					<li><code>L=<i>bytes</i></code> - limit response length (default 0 = don't limit). Applies to the head, body, or both combined, depending on the <code>H</code> and <code>B</code> flags
990
+					<li><code>l=<i>bytes</i></code> - limit the response buffer size (default 5000&nbsp;B).
991
+						This can reduce RAM usage, however it shouldn't be set too small, as this buffer
992
+						is used for both headers and the response body.
993
+				</ul>
994
+			<li><code><i>url</i></code> - full request URL, including <code>http://</code>. Port may be specified if different from :80,
995
+				and GET arguments may be appended to the URL if needed.
996
+			<li><code><i>body</i></code> - optional, separated from <code><i>url</i></code> by a single line feed character (<code>\n</code>).
997
+				This can be used for POST and PUT requests. Note: the command may be truncated to the
998
+				maximum total length of 256 characters if too long.
999
+		</ul>
1000
+
1001
+		<p>The response has the following format: <code>\e^h;<i>status</i>;<i>options</i>;<i>response</i>\a</code></p>
1002
+
1003
+		<ul>
1004
+			<li><code><i>status</i></code> - a HTTP status code, eg. 200 is OK, 404 Not found.
1005
+			<li><code><i>options</i></code> - similar to those in the request, here describing the response data.
1006
+				This field can contain comma-separated <code>B</code>, <code>H</code> and <code>L=<i>bytes</i></code>.
1007
+			<li><code><i>response</i></code> - the response, as requested. If both headers and body are received,
1008
+				they will be separated by an empty line (i.e. <code>\r\n\r\n</code>). Response can be up to several
1009
+				kilobytes long, depending on the <code>L=</code> and <code>l=</code> options.
1010
+		</ul>
1011
+
1012
+		<p>
1013
+			<b>Example:</b> <code>\e^H;GET;B;http://wtfismyip.com/text\a</code> - get the body of a web page
1014
+			(wtfismyip.com is a service that sends back your IP address).
1015
+			A response could be <code>\e^h;200;B,L=11;80.70.60.50\a</code>.
1016
+		</p>
1017
+	</div>
1018
+</div>
1019
+
1020
+<div class="Box fold">
934 1021
 	<h2>Commands: System Functions</h2>
935 1022
 
936 1023
 	<div class="Row v">

BIN
img/adapter.jpg.orig View File


BIN
img/vt100.jpg.orig View File


+ 0 - 0
js/.gitkeep View File


File diff suppressed because it is too large
+ 0 - 2
js/app.310033b.js


File diff suppressed because it is too large
+ 0 - 1
js/app.310033b.js.map


File diff suppressed because it is too large
+ 4 - 0
js/app.69e5b77.js


File diff suppressed because it is too large
+ 1 - 0
js/app.69e5b77.js.map


File diff suppressed because it is too large
+ 0 - 2
js/app.f5dd70a.js


File diff suppressed because it is too large
+ 0 - 1
js/app.f5dd70a.js.map


+ 14 - 18
term.html View File

@@ -5,8 +5,8 @@
5 5
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
6 6
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1">
7 7
 	<title>Terminal :: ESPTerm</title>
8
-	<link href="/css/app.f5dd70a.css" rel="stylesheet">
9
-	<script src="/js/app.f5dd70a.js"></script>
8
+	<link href="/css/app.69e5b77.css" rel="stylesheet">
9
+	<script src="/js/app.69e5b77.js"></script>
10 10
 	<script>
11 11
 		var _root = location.host;
12 12
 		var _demo = 1;
@@ -37,7 +37,7 @@
37 37
 				<textarea id="fu_text"></textarea>
38 38
 			</p>
39 39
 			<p>
40
-				<label for="fu_crlf">Line Endings:</label>
40
+				<label for="fu_crlf">Line endings:</label>
41 41
 				<select id="fu_crlf">
42 42
 					<option value="CR">CR (Enter key)</option>
43 43
 					<option value="CRLF">CR LF (Windows)</option>
@@ -45,9 +45,13 @@
45 45
 				</select>
46 46
 			</p>
47 47
 			<p>
48
-				<label for="fu_delay">Line Delay (ms):</label>
48
+				<label for="fu_delay">Chunk delay (ms):</label>
49 49
 				<input id="fu_delay" type="number" value=1 min=0>
50 50
 			</p>
51
+			<p>
52
+				<label for="fu_chunk">Chunk size (0=line):</label>
53
+				<input id="fu_chunk" type="number" value=0 min=0 max=100>
54
+			</p>
51 55
 		</div>
52 56
 		<div class="fu-buttons">
53 57
 			<button id="term-fu-start" class="icn-ok x-fu-go">Start</button>&nbsp;
@@ -66,15 +70,13 @@
66 70
 		<div id="touch-select-menu">
67 71
 			<button id="touch-select-copy-btn">Copy</button>
68 72
 		</div>
73
+		<div class="screen-margin top"></div>
74
+		<div class="screen-margin left"></div>
75
+		<div class="screen-margin right"></div>
76
+		<div class="screen-margin bottom"></div>
69 77
 	</div>
70 78
 
71
-	<div id="action-buttons">
72
-		<button data-n="1"></button><!--
73
-		--><button data-n="2"></button><!--
74
-		--><button data-n="3"></button><!--
75
-		--><button data-n="4"></button><!--
76
-		--><button data-n="5"></button>
77
-	</div>
79
+	<div id="action-buttons"></div>
78 80
 </div>
79 81
 
80 82
 <nav id="term-nav">
@@ -89,13 +91,7 @@
89 91
 <script>
90 92
   try {
91 93
     window.noAutoShow = true;
92
-    termInit({
93
-      labels: 'TESPTerm Web UI Demo\u0001OK\u0001Cancel\u0001\u0001\u0001Help',
94
-	  theme: +'0',
95
-      defaultFg: +'7',
96
-	  defaultBg: +'0',
97
-	  allFn: !!+'0',
98
-    });
94
+    termInit({ allFn: !!+'0', });
99 95
   } catch (e) {
100 96
     console.error(e);
101 97
 	      console.error("Fail, reloading in 3s…");