See espterm.github.io
25개 이상의 토픽을 선택하실 수 없습니다. Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
espterm-demo-website/cfg_term.html

404 lines
13 KiB

<!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, maximum-scale=1">
<title>Terminal Settings :: ESPTerm</title>
<link href="/css/app.8b43b1d-en.css" rel="stylesheet">
<script src="/js/app.8b43b1d-en.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<sup> DEMO</sup></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>
<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 message hidden"></div>
<div class="Box errmessage hidden"></div>
<div class="Box">
<a href="reset_screen.html">Reset screen & parser</a>
</div>
<!-- Theme -->
<form class="Box mobcol str" action="term_set.html" method="GET" id='form-scheme'>
<h2>Color Scheme</h2>
<div class="Row explain">
To select default text and background color, click on the
preview palette. Alternatively, use numbers 0-15 for theme colors,
16-255 for standard colors and hex (#FFFFFF) for True Color (24-bit).
</div>
<div class="Row">
<label for="theme">Color Palette</label>
<select name="theme" id="theme">
<option value="0">Tango</option>
<option value="1">Linux (CGA)</option>
<option value="2">XTerm</option>
<option value="3">Rxvt</option>
<option value="4">Ambience</option>
<option value="5">Solarized Dark</option>
<option value="11">Solarized Dark, high contrast</option>
<option value="10">Solarized Light</option>
<option value="6">CGA NTSC</option>
<option value="7">ZX Spectrum</option>
<option value="8">Apple II</option>
<option value="9">Commodore</option>
</select>
<span onclick="TermConf.prevTheme()" class="mq-no-phone theme-nav-btn"></span>
<span onclick="TermConf.nextTheme()" class="mq-no-phone theme-nav-btn"></span>
</div>
<div class="Row color-preview">
<label>Background</label>
<div>
<div class="colorprev bg">
<span data-bg=0 data-fg=15>0</span><!--
--><span data-bg=1 data-fg=15>1</span><!--
--><span data-bg=2 data-fg=15>2</span><!--
--><span data-bg=3 data-fg=0>3</span><!--
--><span data-bg=4 data-fg=15>4</span><!--
--><span data-bg=5 data-fg=15>5</span><!--
--><span data-bg=6 data-fg=15>6</span><!--
--><span data-bg=7 data-fg=0>7</span>
</div>
<div class="colorprev bg">
<span data-bg=8 data-fg=15>8</span><!--
--><span data-bg=9 data-fg=0>9</span><!--
--><span data-bg=10 data-fg=0>10</span><!--
--><span data-bg=11 data-fg=0>11</span><!--
--><span data-bg=12 data-fg=0>12</span><!--
--><span data-bg=13 data-fg=0>13</span><!--
--><span data-bg=14 data-fg=0>14</span><!--
--><span data-bg=15 data-fg=0>15</span>
</div>
</div>
</div>
<div class="Row color-preview">
<label>Foreground</label>
<div>
<div class="colorprev fg">
<span data-fg=0>0</span><!--
--><span data-fg=1>1</span><!--
--><span data-fg=2>2</span><!--
--><span data-fg=3>3</span><!--
--><span data-fg=4>4</span><!--
--><span data-fg=5>5</span><!--
--><span data-fg=6>6</span><!--
--><span data-fg=7>7</span>
</div>
<div class="colorprev fg">
<span data-fg=8>8</span><!--
--><span data-fg=9>9</span><!--
--><span data-fg=10>10</span><!--
--><span data-fg=11>11</span><!--
--><span data-fg=12>12</span><!--
--><span data-fg=13>13</span><!--
--><span data-fg=14>14</span><!--
--><span data-fg=15>15</span>
</div>
</div>
</div>
<div class="Row color-preview">
<label></label>
<div class="color-example" data-fg="" data-bg="">
Default colors preview </div>
</div>
<div class="Row color-preview">
<label>Defaults Presets</label>
<div id="fgbg_presets"></div>
</div>
<div class="Row">
<div class="SubRow">
<label for="default_fg">Default Fg.</label>
<input type="text" name="default_fg" id="default_fg" class="short" value="7">
</div>
<div class="SubRow">
<label for="default_bg">Default Bg.</label>
<input type="text" name="default_bg" id="default_bg" class="short" value="0">
</div>
</div>
<div class="Row">
<label>Cursor Style</label>
<select name="cursor_shape" id="cursor_shape">
<option value="0">Block, blinking</option>
<option value="2">Block, steady</option>
<option value="3">Underline, blinking</option>
<option value="4">Underline, steady</option>
<option value="5">I-bar, blinking</option>
<option value="6">I-bar, steady</option>
</select>
</div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-scheme').submit()">Apply!</a>
</div>
</form>
<!-- Initials -->
<form class="Box mobcol str" action="term_set.html" method="GET" id='form-initial'>
<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 (<code>\ec</code>).
They can be changed by the terminal application using escape sequences.
</div>
<div class="Row">
<div class="SubRow">
<label for="width">Width</label>
<input type="number" step=1 min=1 max=255 name="width" id="width" value="80" required>
</div>
<div class="SubRow">
<label for="height">Height</label>
<input type="number" step=1 min=1 max=255 name="height" id="height" value="25" required>
</div>
</div>
<div class="Row">
<label for="title">Header Text</label>
<input type="text" name="title" id="title" value="ESPTerm Web UI Demo" required>
</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">
<label for="button_count">Button count</label>
<input type="number" step=1 min=0 max=5 name="button_count" id="button_count" value="5" required>
</div>
<div class="Row">
<label>Button Labels</label>
<input class="tiny" type="text" name="btn1" id="btn1" value="OK">
<input class="tiny" type="text" name="btn2" id="btn2" value="Cancel">
<input class="tiny" type="text" name="btn3" id="btn3" value="">
<input class="tiny" type="text" name="btn4" id="btn4" value="">
<input class="tiny" type="text" name="btn5" id="btn5" value="Help">
</div>
<div class="Row">
<label>Button codes<br>(ASCII, dec, CSV)</label>
<input class="tiny" type="text" name="bm1" id="bm1" value="01,121">
<input class="tiny" type="text" name="bm2" id="bm2" value="01,110">
<input class="tiny" type="text" name="bm3" id="bm3" value="">
<input class="tiny" type="text" name="bm4" id="bm4" value="">
<input class="tiny" type="text" name="bm5" id="bm5" value="05">
</div>
<div class="Row">
<label>Button colors</label>
<input class="tiny" type="text" name="bc1" id="bc1" value="">
<input class="tiny" type="text" name="bc2" id="bc2" value="">
<input class="tiny" type="text" name="bc3" id="bc3" value="">
<input class="tiny" type="text" name="bc4" id="bc4" value="">
<input class="tiny" type="text" name="bc5" id="bc5" value="">
</div>
<div class="Row">
<label for="backdrop">Background image URL</label>
<input type="text" name="backdrop" id="backdrop" value="" required>
</div>
<div class="Row checkbox" >
<label>Enter = CR+LF (LNM)</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="crlf_mode" name="crlf_mode" value="">
</div>
<div class="Row checkbox" >
<label>Local Echo (<span style="text-decoration:overline">SRM</span>)</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-initial').submit()">Apply!</a>
</div>
</form>
<!-- UART -->
<form class="Box mobcol str" action="term_set.html" method="GET" id="form-uart">
<h2 tabindex=0>Serial Port Parameters</h2>
<div class="Row explain">
This form controls the communication UART. The debug UART is fixed
at 115.200 baud, one stop-bit and no parity.
</div>
<div class="Row">
<label for="uart_baudrate">Baud rate<span class="mq-phone">&nbsp;(bps)</span></label>
<select name="uart_baudrate" id="uart_baudrate" 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-uart').submit()">Apply!</a>
</div>
</form>
<!-- Expert terminal opts -->
<form class="Box mobcol str" action="term_set.html" method="GET" id='form-expert'>
<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="font_stack">Font stack</label>
<input type="text" name="font_stack" id="font_stack" value="" required>
</div>
<div class="Row">
<label for="font_size">Font size<span class="mq-phone">&nbsp;(px)</span></label>
<input type="number" step=1 min=0 name="font_size" id="font_size" value="20" required>
<span class="mq-no-phone">&nbsp;px</span>
</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 checkbox" >
<label>Debug internal state</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="debugbar" name="debugbar" value="">
</div>
<div class="Row checkbox" >
<label>Display control codes</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="ascii_debug" name="ascii_debug" value="">
</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>Capture F5, F11, F12</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="want_all_fn" name="want_all_fn" value="0">
</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>Allow \e?12h/l</label><!--
--><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" id="allow_decopt_12" name="allow_decopt_12" value="0">
</div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-expert').submit()">Apply!</a>
</div>
</form>
<script>
$.ready(function () {
$('#cursor_shape').val('');
$('#theme').val('0');
$('#uart_baudrate').val('115200');
$('#uart_parity').val('2');
$('#uart_stopbits').val('1');
TermConf.init();
});
</script>
<div class="botpad"></div>
<div class="NotifyMsg hidden" id="notif"></div>
</div>
</div>
</body>
</html>