diff options
Diffstat (limited to 'templates/user.html')
| -rw-r--r-- | templates/user.html | 110 |
1 files changed, 110 insertions, 0 deletions
diff --git a/templates/user.html b/templates/user.html new file mode 100644 index 0000000..cde9267 --- /dev/null +++ b/templates/user.html @@ -0,0 +1,110 @@ + +<div id="user-stuff"> + <button id="login">Show Login</button> + <div id="login-info"> + <br> + <input id="login-username" type="text" placeholder="Username"> <br> + <input id="login-password" type="password" placeholder="Password"> <br> + <button id="login-submit">Login</button> <br><br> + </div> + + <button id="register">Show Register</button> + <div id="register-info"> + <br> + <input id="register-username" type="text" placeholder="Username"> <br> + <input id="register-password1" type="password" placeholder="Password"> <br> + <input id="register-password2" type="password" placeholder="Confirm Password"> <br> + <button id="register-submit">Register</button> <br> <br> + </div> +</div> +<script> + +var login = {} +login.button = document.getElementById("login") +login.info = document.getElementById("login-info") +login.info.style.display = "none" +login.username = document.getElementById("login-username") +login.password = document.getElementById("login-password") +login.submit = document.getElementById("login-submit") +login.show = false + +var register = {} +register.button = document.getElementById("register") +register.info = document.getElementById("register-info") +register.info.style.display = "none" +register.username = document.getElementById("register-username") +register.password1 = document.getElementById("register-password1") +register.password2 = document.getElementById("register-password2") +register.submit = document.getElementById("register-submit") +register.show = false + +login.button.onclick = ()=> { + if(!login.show){ + login.button.textContent = "Hide Login" + login.show = true + login.info.style.display = "block" + } else { + login.button.textContent = "Show Login" + login.show = false + login.info.style.display = "none" + } +} + +login.submit.onclick = async ()=> { + var username = login.username.value, + password = login.password.value; + + var req = { + username, + password + } + var res = await fetch('/login',{ + method: 'POST', + credentials: 'same-origin', + body: JSON.stringify(req) + }) + res = await res.json() + console.log(res) + + // How is your response formatted? Was it a success or a failure? + // If the user is now logged in, then maybe hide all the login/register stuff? + +} + +register.button.onclick = () => { + if(!register.show){ + register.button.textContent = "Hide Register" + register.show = true + register.info.style.display = "block" + } else { + register.button.textContent = "Show Register" + register.show = false + register.info.style.display = "none" + } +} + +register.submit.onclick = async ()=> { + var username = register.username.value, + password1 = register.password1.value, + password2 = register.password2.value; + if (password1 != password2) + return alert("The passwords don't match") + + var req = { + username, + password: password1 + } + var res = await fetch('/register',{ + method: 'POST', + credentials: 'same-origin', + body: JSON.stringify(req) + }) + res = await res.json() + console.log(res) + // How is your response formatted? Was it a success or a failure? + // If the user is now logged in, then maybe hide all the login/register stuff? + + +} + +</script>
\ No newline at end of file |
