]> git.cworth.org Git - lmno-server/blob - templates/login.html
Add some autofocus attributes to several forms
[lmno-server] / templates / login.html
1 {% extends "base.html" %}
2
3 {% block head %}
4 <script>
5   function lmno_login_loadend(request, username) {
6   if (request.status === 404) {
7     add_message("danger", "User authentication failed. Please try again.");
8     return;
9   }
10
11   /* Now that user is logged in, advance to the desired page (if any). */
12   const url = new URL(window.location);
13   const next_param = url.searchParams.get('next');
14   if (next_param) {
15     window.location.href = next_param;
16     return;
17   }
18
19   /* Otherwise, just report the successful login. */
20   add_message("success", `User ${username} logged in. Have fun.`);
21 }
22
23 function lmno_login(form) {
24   const username = form.username.value;
25   const password = form.password.value;
26
27   console.log("In lmno_login with username: " + username);
28   var request = new XMLHttpRequest();
29   request.addEventListener("loadend", () => lmno_login_loadend(request, username));
30
31   request.open("POST", "/login");
32   request.setRequestHeader("Content-Type", "application/json; charset=UTF-8");
33   request.send(`{"username": "${username}", "password": "${password}"}`);
34 }
35 </script>
36 {% endblock %}
37
38 {% block page %}
39 <!-- The return false prevents the page from being reloaded -->
40 <form id="login-form" onsubmit="lmno_login(this); return false">
41   <div class="form-field large">
42     <label for="username">Username</label>
43     <input type="text" id="username" required autofocus>
44   </div>
45
46   <div class="form-field large">
47     <label for="Password">Password</label>
48     <input type="password" id="password" required>
49   </div>
50
51   <div class="form-field large">
52     <button type="submit">
53       Login
54     </button>
55   </div>
56 </form>
57 {% endblock %}