index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <script src="require.js" data-main="main"></script>
    <style>
      .page { display: none; }
    </style>
  </head>
  <body style="width:800px;margin:0px auto" data-backend-uri="wss://unht-beta.heahdk.net:1234/sock/websocket" data-backend-secret="my_secret">

    <div id="message"></div>

    <div id="page-first" class="page">
      <div style="background:grey;width:650px;float:right;margin-top:50px">
        <form onsubmit="signIn();return false;">
          <p style="margin-left:30px"><input id="email1" placeholder="Email"/>
            <input id="pwd1" placeholder="Password" type="password" />
            <input type="submit" value="Sign in" onclick=""/></p>
        </form>
        <p style="margin-left:30px"><input id="remember" type="checkbox"/>Remember me | <a onclick="openForgotDialog();">Forgot password?</a></p>
      </div>
      <p style="clear:right; float:left; width:300px"><strong>Welcome to the web.</strong> Connect with friends and the world around you.
      </p>
      <ul style="clear:left; float:left; width:300px">
        <li>See photos and updates</li>
        <li>Share what's new</li>
        <li>Find more</li>
      </ul>
      <div style="background:grey; width:350px;float:right;clear:right;margin-top:50px">
        <p style="margin-left:30px"><strong>New to the web?</strong> Sign up</p>
        <p style="margin-left:30px"><input placeholder="Full name" id="fn" /></p>
        <p style="margin-left:30px"><input placeholder="Email" id="email" /></p>
        <p style="margin-left:30px"><input type="password" placeholder="Password" id="pwd" /></p>
        <p style="margin-right:30px;float:right"><a href="more.html">learn more</a>
             <input type="submit" value="Sign up for the web" onclick="step1();"/></p>
      </div>
    </div>


    <div id="page-forgot" class="page">
      <div style="background:grey;width:350px;float:right;margin-top:50px">
        <p style="margin-left:30px"><input id="email_forgot" placeholder="Email"/></p>
        <p style="margin-left:30px"><input type="submit" value="regen" onclick="genCaptcha();" />
            <img id="captcha_forgot" />
            <input id="solution_forgot" />
            <input type="submit" value="Send reminder" onclick="startForgotPassword();"/></p>
      </div>
    </div>


    <div class="page" id="page-resetPwd">
      <div style="background:grey;width:350px;float:right;margin-top:50px">
        <p style="margin-left:30px"><input id="password_reset" type="password" placeholder="New password"/></p>
        <p style="margin-left:30px"><input type="submit" value="Reset password" onclick="completeForgotPassword();"/></p>
      </div>
    </div>


    <div class="page" id="page-second">
      <p><input placeholder="yourname" id="host" /><strong>.un.ht</strong></p>
      <p><strong>Terms of Service:</strong></p>
      <p><textarea id="tos" readOnly=true>Be nice!</textarea></p>
      <p><input type="checkbox" id="agree">I agree to the Terms of Service</p>
      <input type="submit" value="regen" onclick="genCaptcha();" />
      <img id="captcha" />
      <input id="solution" />
      <input type="submit" value="register" onclick="register();" />
    </div>


    <div class="page" id="page-settings">
      <a href="?!">&laquo; Back</a>
      <h1>Settings</h1>
      <p>
        <input id="settingsEmail" /><input type="submit" value="Resend validation email" id="validateEmail"/>
        <input type="submit" value="Change" onclick="startChangeEmail();" />
      </p>
      <p>
        Current: <input id="currentPwd" type="password" />
        New: <input id="newPwd" type="password" />
        <input type="submit" value="Change password" onclick="changePwd();" />
        <input type="submit" value="Delete account" style="background:red" onclick="deleteAccount();" />
      </p>
    </div>


    <div class="page" id="page-cms">
      <h1>Choose life.</h1>
      <h2>Choose a career.</h2>
      <h3>Choose a profile picture.</h3>
      <h4>Choose a location.</h4>
      <h5>Choose a status.</h5>
      <h6>Or choose something else.</h6>
      <button onclick="jump('/settings');">settings</button>
      <button onclick="jump('/auth');">auth</button>
      <button onclick="location='http://'+localStorage.host+'.un.ht/';">view your profile</button>
      <button onclick="logout();">logout</button>
    </div>


    <div class="page" id="page-auth">
      <a href="?!/">&laquo; Back</a>
      <h1>List tokens</h1>
      <table id="auth_list" border="1"></table>

      <h2>New Token</h2>
      <form action="?!/auth">
        <div><label>Scope: <input name="scope" type="text"></label></div>
        <div><label>Redirect URI: <input name="redirect_uri" type="text"></label></div>
        <div><input type="submit" value="Request"></div>
      </form>
    </div>

    <div class="page" id="page-auth-ask-allow">
      <h2>Authorize</h2>
      <p>The app at <span style="font-weight:bold" id="ask-origin"></span> wants to access the following scopes:</p>
      <ul id="ask-scopes"></ul>
      <input type="hidden" id="ask-params">
      <button onclick="auth.allow();">Allow</button>
    </div>

    <div class="page" id="page-error">
      <h1>Error: <span id="page-error-message"></span></h1>
      <pre id="page-error-details"></pre>
    </div>

  </body>
</html>