diff options
| author | Daniel Hader <[email protected]> | 2026-05-29 18:14:31 -0500 |
|---|---|---|
| committer | Daniel Hader <[email protected]> | 2026-05-29 18:14:31 -0500 |
| commit | 772c7844c4ca1de632f64eb9428e8e97eea64ac1 (patch) | |
| tree | 2b038268f0d15a02830f4c4e465a323f43ce3c35 /static | |
| parent | 334867ba0732f85a48ad88ef8f3201c10bc1da4e (diff) | |
login page interaction with server
Diffstat (limited to 'static')
| -rw-r--r-- | static/login.html | 18 | ||||
| -rw-r--r-- | static/login.js | 38 | ||||
| -rw-r--r-- | static/main.js | 3 |
3 files changed, 49 insertions, 10 deletions
diff --git a/static/login.html b/static/login.html index 37035dc..c6cd992 100644 --- a/static/login.html +++ b/static/login.html @@ -5,21 +5,25 @@ <meta charset="utf-8" /> <title>Code Golf Login</title> <link rel="stylesheet" href="default.css"> - <script type="text/javascript" src="main.js"></script> + <script type="text/javascript" src="login.js"></script> </head> - <body> + <body onload="init()"> <div id="layout"> <div id="container"> <div id="content"> <h1>C&! Code Golf Leaderboard</h1> <h2>Login</h2> - <form id="login-form" action="" method="get" onsubmit="login()"> - <label for="login-email">Email</label><br> - <input type="text" id="login-email" name="login-email"> + <form id="login-form" method="POST" action="/login"> + <div id="error" hidden> + <span id="error-message" style="color: red"></span> + <br><br> + </div> + <label for="email">Email</label><br> + <input type="text" id="login-email" name="email"> <br><br> - <label for="login-password">Password</label><br> - <input type="password" id="login-password" name="login-password"> + <label for="password">Password</label><br> + <input type="password" id="login-password" name="password"> <br><br> <input type="submit" value="Login"> </form> diff --git a/static/login.js b/static/login.js new file mode 100644 index 0000000..ee135f8 --- /dev/null +++ b/static/login.js @@ -0,0 +1,38 @@ + +function display_error(message) { + document.getElementById("error-message").innerHTML = `Error: ${message}`; + document.getElementById("error").hidden = false; +} + +function init() { + const form = document.getElementById("login-form"); + form.addEventListener("submit", async (e) => { + e.preventDefault(); + + const body = {} + new FormData(form).forEach((value, key) => body[key] = value); + + try { + console.log(); + + const res = await fetch("/login", { + method: "POST", + headers: { "Content-Type": "application/json" }, + credentials: "include", + body: JSON.stringify(body) + }); + + if (!res.ok) { + const error = await res.json(); + display_error(error.error); + return; + } + + //const result = await res.json(); + + } catch (err) { + console.log(err); + //display_error("network error"); + } + }); +} diff --git a/static/main.js b/static/main.js index 2bde100..f18cbef 100644 --- a/static/main.js +++ b/static/main.js @@ -41,6 +41,3 @@ async function on_load() { } -async function login() { - console.log("login pressed"); -} |