rlgwebd/index-sh.html
John "Elwin" Edwards d1ed2c911a Use SVG for the bell icon instead of PNG.
Browsers that support WebSockets tend to support SVG too.  This also
removes the need to install Inkscape to convert the file to PNG.
2013-10-31 20:44:35 -07:00

101 lines
4.2 KiB
HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>WebTTY</title>
<script type="text/javascript" src="termemu.js"></script>
<script type="text/javascript" src="termemu-keys.js"></script>
<script type="text/javascript" src="shterm.js"></script>
<link rel="stylesheet" type="text/css" href="tty.css">
</head>
<body onload="setup()" onkeydown="sendkey(event)">
<h1>WebTTY</h1>
<div id ="top">
<span id="ttitle"></span>
<img src="/bell.svg" alt="bell" id="bell">
</div>
<div id="termwrap">
Browsing with Javascript turned off? I sympathize. I didn't want Javascript to be necessary for WebTerm. Unfortunately, the only other way to make it work was Java applets.
</div>
<div class="keyrow">
<div class="key" onclick="vkey('`')">`</div>
<div class="key" onclick="vkey('1')">1</div>
<div class="key" onclick="vkey('2')">2</div>
<div class="key" onclick="vkey('3')">3</div>
<div class="key" onclick="vkey('4')">4</div>
<div class="key" onclick="vkey('5')">5</div>
<div class="key" onclick="vkey('6')">6</div>
<div class="key" onclick="vkey('7')">7</div>
<div class="key" onclick="vkey('8')">8</div>
<div class="key" onclick="vkey('9')">9</div>
<div class="key" onclick="vkey('0')">0</div>
<div class="key" onclick="vkey('-')">-</div>
<div class="key" onclick="vkey('=')">=</div>
<div class="key" onclick="vkey('\b')" style="width: 2.5em">Bksp</div>
<div class="rkey" onclick="vkey('KP9')"></div>
<div class="rkey" onclick="vkey('KP8')"></div>
<div class="rkey" onclick="vkey('KP7')"></div>
</div>
<div class="keyrow">
<div class="key" onclick="vkey('\t')" style="width: 2.5em">Tab</div>
<div class="key" onclick="vkey('q')">Q</div>
<div class="key" onclick="vkey('w')">W</div>
<div class="key" onclick="vkey('e')">E</div>
<div class="key" onclick="vkey('r')">R</div>
<div class="key" onclick="vkey('t')">T</div>
<div class="key" onclick="vkey('y')">Y</div>
<div class="key" onclick="vkey('u')">U</div>
<div class="key" onclick="vkey('i')">I</div>
<div class="key" onclick="vkey('o')">O</div>
<div class="key" onclick="vkey('p')">P</div>
<div class="key" onclick="vkey('[')">[</div>
<div class="key" onclick="vkey(']')">]</div>
<div class="key" onclick="vkey('\\')">\</div>
<div class="rkey" onclick="vkey('KP6')"></div>
<div class="rkey" onclick="vkey('KP5')">·</div>
<div class="rkey" onclick="vkey('KP4')"></div>
</div>
<div class="keyrow">
<div class="key" onclick="togglectrl()" id="ctrlkey">Ctrl</div>
<div class="key" onclick="vkey('a')">A</div>
<div class="key" onclick="vkey('s')">S</div>
<div class="key" onclick="vkey('d')">D</div>
<div class="key" onclick="vkey('f')">F</div>
<div class="key" onclick="vkey('g')">G</div>
<div class="key" onclick="vkey('h')">H</div>
<div class="key" onclick="vkey('j')">J</div>
<div class="key" onclick="vkey('k')">K</div>
<div class="key" onclick="vkey('l')">L</div>
<div class="key" onclick="vkey(';')">;</div>
<div class="key" onclick="vkey('\'')">'</div>
<div class="key" onclick="vkey('\n')" style="width: 4em">Ret</div>
<div class="rkey" onclick="vkey('KP3')"></div>
<div class="rkey" onclick="vkey('KP2')"></div>
<div class="rkey" onclick="vkey('KP1')"></div>
</div>
<div class="keyrow">
<div class="key" onclick="toggleshift()" id="shiftkey">Shift</div>
<div class="key" onclick="vkey('z')">Z</div>
<div class="key" onclick="vkey('x')">X</div>
<div class="key" onclick="vkey('c')">C</div>
<div class="key" onclick="vkey('v')">V</div>
<div class="key" onclick="vkey('b')">B</div>
<div class="key" onclick="vkey('n')">N</div>
<div class="key" onclick="vkey('m')">M</div>
<div class="key" onclick="vkey(',')">,</div>
<div class="key" onclick="vkey('.')">.</div>
<div class="key" onclick="vkey('/')">/</div>
</div>
<div class="keyrow">
<div class="key" onclick="vkey(' ')" id="spacebar"></div>
</div>
<div class="rbutton" onclick="login()">Log in</div>
<div class="rbutton" onclick="stop()">Stop</div>
<div class="rbutton">Font:
<span onclick="textsize(false)">Smaller</span>
<span onclick="textsize(true)">Larger</span>
</div>
<div id="debug">
<p>Debugging Output</p>
</div>
</body>
</html>