view index-rlg.html @ 39:e8ac0e3d2614

RLG-Web: separate logging in and starting a game. The user now logs in with a username and password, receiving a token which is then used for any actions requiring authentication. Starting a game is one such action. Games use a different set of id keys. This allows users to supply their passwords once and then play any number of successive games. Also, newly registered users do not need to supply their passwords again.
author John "Elwin" Edwards <elwin@sdf.org>
date Thu, 07 Jun 2012 15:43:06 -0700
parents 23a495e81725
children 1bbd0e76ba92
line wrap: on
line source

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>RLG-Web α</title>
<script type="text/javascript" src="termemu.js"></script>
<script type="text/javascript" src="termemu-keys.js"></script>
<script type="text/javascript" src="rlgterm.js"></script>
<link rel="stylesheet" type="text/css" href="tty.css">
<link rel="stylesheet" type="text/css" href="style-rlg.css">
</head>
<body onload="setup()" onkeydown="sendkey(event)">
<h1>RLG-Web α</h1>
<div id ="top">
  <span id="ttitle"></span>
  <img src="/bell.png" alt="bell" id="bell">
</div>
<div id="termwrap">TERM</div>
<div class="modal" id="keyboard">
<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>
<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>
<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>
<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="stop()">Stop</div>
<div class="rbutton">Font:
<span onclick="textsize(false)">Smaller</span>
<span onclick="textsize(true)">Larger</span>
</div>
</div>
<div class="modal" id="startgame">
<form id="startform" action="/play" method="post">
<div>
Choose game: <select name="game" id="input_game">
  <option label="Rogue V3" value="rogue3">Rogue V3</option>
  <option label="Rogue V4" value="rogue4">Rogue V4</option>
  <option label="Rogue V5" value="rogue5">Rogue V5</option>
  <option label="Super-Rogue" value="srogue">Super-Rogue</option>
</select>
</div>
<div>
<input type="submit" value="Play" onclick="startgame(event)">
</div>
</form>
</div>
<div class="modal" id="login">
<form id="loginform" action="/login" method="post">
<div>
Name: <input type="text" name="name" id="input_name"> 
</div>
<div>
Password: <input type="password" name="pw" id="input_pw">
</div>
<div>
<input type="submit" value="Log in" onclick="formlogin(event)">
</div>
</form>
<div class="rbutton" onclick="setmode('register')">Register</div>
</div>
<div class="modal" id="register">
<form id="regform" action="/addacct" method="post">
<div>
Name: <input type="text" name="name" id="regin_name"> 
</div>
<div>
Password: <input type="password" name="pw" id="regin_pw">
</div>
<div>
E-mail (optional): <input type="text" name="email" id="regin_email">
</div>
<div>
<input type="submit" value="Sign up" onclick="formreg(event)">
<input type="reset" value="Cancel" onclick="setmode('login', event)">
</div>
</form>
</div>
<div id="debug">
<p>Debugging Output</p>
</div>
</body>
</html>