frontend: Make signup/login/passwordreset/forgot forms submittable

Fixes #117

frontend/forgot.html

@@ -17,16 +17,22 @@
 
   <div class="auth-form-container">
     <div class="auth-form">
+      <form onsubmit="window.commento.sendResetHex(event)">
         <div class="form-title">
           Reset your Password
         </div>
+
         <div class="row">
           <div class="label">Email Address</div>
           <input class="input" type="text" name="email" id="email" placeholder="example@example.com">
         </div>
+
         <div class="err" id="err"></div>
         <div class="msg" id="msg"></div>
-      <button id="reset-button" class="button" onclick="window.commento.sendResetHex()">Send Reset Password Link</button>
+
+        <button id="reset-button" class="button" type="submit">Send Reset Password Link</button>
+      </form>
+
       <a class="link" href="[[[.Origin]]]/login">Suddenly remembered your password? Login.</a>
     </div>
   </div>

frontend/js/forgot.js

@@ -4,7 +4,9 @@
   (document);
 
   // Talks to the API and sends an reset email.
-  global.sendResetHex = function() {
+  global.sendResetHex = function(event) {
+    event.preventDefault();
+
     var allOk = global.unfilledMark(["#email"], function(el) {
       el.css("border-bottom", "1px solid red");
     });

frontend/js/login.js

@@ -43,7 +43,9 @@
 
 
   // Logs the user in and redirects to the dashboard.
-  global.login = function() {
+  global.login = function(event) {
+    event.preventDefault();
+
     var allOk = global.unfilledMark(["#email", "#password"], function(el) {
       el.css("border-bottom", "1px solid red");
     });

frontend/js/reset.js

@@ -1,7 +1,9 @@
 (function (global, document) {
   "use strict";
 
-  global.resetPassword = function() {
+  global.resetPassword = function(event) {
+    event.preventDefault();
+
     var allOk = global.unfilledMark(["#password", "#password2"], function(el) {
       el.css("border-bottom", "1px solid red");
     });

frontend/js/signup.js

@@ -4,7 +4,9 @@
   // Signs up the user and redirects to either the login page or the email
   // confirmation, depending on whether or not SMTP is configured in the
   // backend.
-  global.signup = function() {
+  global.signup = function(event) {
+    event.preventDefault();
+
     if ($("#password").val() !== $("#password2").val()) {
       global.textSet("#err", "The two passwords don't match");
       return;

frontend/login.html

@@ -25,6 +25,7 @@
 
   <div class="auth-form-container">
     <div class="auth-form">
+      <form onsubmit="window.commento.login(event)">
         <div class="form-title">
           Login to continue
         </div>
@@ -42,7 +43,8 @@
         <div class="err" id="err"></div>
         <div class="msg" id="msg"></div>
 
-      <button id="button" class="button" onclick="window.commento.login()">Login</button>
+        <button id="button" class="button" type="submit">Login</button>
+      </form>
 
       <a class="link" href="[[[.Origin]]]/forgot">Trouble logging in? Reset your password.</a>
       <a class="link" href="[[[.Origin]]]/signup">Don't have an account yet? Sign up.</a>

frontend/reset-password.html

@@ -17,6 +17,7 @@
 
   <div class="auth-form-container">
     <div class="auth-form">
+      <form onsubmit="window.commento.resetPassword(event)">
         <div class="form-title">
           Reset your Password
         </div>
@@ -33,7 +34,8 @@
 
         <div class="err" id="err"></div>
         <div class="msg" id="msg"></div>
-      <button id="reset-button" class="button" onclick="window.commento.resetPassword()">Reset Password</button>
+        <button id="reset-button" class="button" type="submit">Reset Password</button>
+      </form>
     </div>
   </div>
 

frontend/signup.html

@@ -24,6 +24,7 @@
 
   <div class="auth-form-container">
     <div class="auth-form">
+      <form onsubmit="window.commento.signup(event)">
         <div class="form-title">
           Create an account
         </div>
@@ -55,7 +56,8 @@
         <p class="cent">
         </p>
 
-      <button id="signup-button" class="button" onclick="window.commento.signup()">Sign up</button>
+        <button id="signup-button" class="button" type="submit">Sign up</button>
+      </form>
 
       <a class="link" href="[[[.Origin]]]/login">Already have an account? Login instead.</a>
     </div>