72 lines
2.4 KiB
HTML
72 lines
2.4 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Register{% endblock %}
|
|
{% block headers %}
|
|
|
|
{% endblock %}
|
|
|
|
|
|
{% block content %}
|
|
<h1>Login</h1>
|
|
<form action="/api/user/register" method="POST">
|
|
<div>
|
|
<label for="email">Email:</label>
|
|
<input type="text" id="email" name="email">
|
|
<span id="email_error" style="color:red; margin-left:5px;"></span>
|
|
</div>
|
|
<div>
|
|
<label for="username">Username:</label>
|
|
<input type="text" id="username" name="username">
|
|
<span id="username_error" style="color:red; margin-left:5px;"></span>
|
|
</div>
|
|
<div>
|
|
<label for="username">Password:</label>
|
|
<input type="password" id="password" name="password">
|
|
<span id="password_error" style="color:red; margin-left:5px;"></span>
|
|
</div>
|
|
<div>
|
|
<label for="password">Password:</label>
|
|
<input type="password" id="password2">
|
|
<span id="confirm_error" style="color:red; margin-left:5px;"></span>
|
|
</div>
|
|
<button type="submit" id="submit_btn">Register</button>
|
|
</form>
|
|
|
|
|
|
<script>
|
|
const password = document.getElementById('password');
|
|
const password2 = document.getElementById('password2');
|
|
const submit_btn = document.getElementById('submit_btn');
|
|
const username = document.getElementById('username');
|
|
const email = document.getElementById('email');
|
|
|
|
// const password_error = document.getElementById('password_error');
|
|
// const password2_error = document.getElementById('confirm_error');
|
|
|
|
function validate() {
|
|
submit_btn.disabled = false;
|
|
if (!(password.value && password2.value) || password.value !== password2.value) {
|
|
submit_btn.disabled = true;
|
|
} else {
|
|
|
|
}
|
|
if (password.length < 8) {
|
|
submit_btn.disabled = true;
|
|
}
|
|
if (username.length < 3) {
|
|
submit_btn.disabled = true;
|
|
}
|
|
if (email.length < 5) {
|
|
submit_btn.disabled = true;
|
|
}
|
|
}
|
|
|
|
// check on every key press
|
|
password.addEventListener('input', validate);
|
|
confirmPassword.addEventListener('input', validate);
|
|
username.addEventListener("input", validate);
|
|
email.addEventListener("input", validate);
|
|
|
|
</script>
|
|
{% endblock %}
|