Untitled

<!DOCTYPE html>
<html>
    <head>
        <style>
            * {
             margin: 0; padding: 0;
            }

            body {
             color: #555;
             text-shadow: 0 1px 1px #fff;
             font: 12px arial,sans-serif;
            }


            #container {
             margin: 0 auto;
             margin-top: 100px;
             width: 200px;
             padding: 15px;
             background: rgba(0,0,0,.05);
             -moz-border-radius: 6px;
             border-radius: 6px;
             box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.298);
            }

            #container h1 {
             font-size: 28px;
            }

            button {
              cursor: pointer;
              background: #e3e3e3;
              border: 1px solid #bbb;
              -moz-border-radius: 3px;
              border-radius: 3px;
              box-shadow: inset 0 0 1px 1px #f6f6f6;
              color: #333;
              font-weight: bold;
              padding: 20px 70px;
              line-height: 1;
              text-align: center;
              text-shadow: 0 1px 0 #fff;
              -webkit-transition: background-color .8s ease-in;
            }

            button:hover {
             background-color: #ccc;
            }

            input[type="text"] {
             font-weight: bold;
             font-size: 14px;
             height: 25px;
             padding: 0 5px;
             width: 140px;
            }

            input[type="submit"] {
             height: 30px;
             width: 40px;
            }

        </style>

    </head>

    <body>

        <div id="container">
            <h1>Etherpad Lite</h1>
            <br>
            <button id="button" onclick="go2Random()">New Pad</button>
            <br><br>
            or create a Pad with the name
            <br>
            <input type="text" id="padname"> <input type="submit" value="OK" onclick="go2Name();return false;">
        </div>


        <script type="text/javascript">
              function go2Name()
              {
                var padname = document.getElementById("padname").value;
                if(padname.length > 0)
                {
                  window.location = "p/" + padname;
                }
              }

              function go2Random()
              {
                window.location = "p/" + randomPadName() ;
              }

              function randomPadName()
              {
                  var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
                  var string_length = 10;
                  var randomstring = '';
                  for (var i=0; i<string_length; i++) {
                      var rnum = Math.floor(Math.random() * chars.length);
                      randomstring += chars.substring(rnum,rnum+1);
                  }
                  return randomstring;
              }
        </script>

    </body>

</html>