Gnarwhal/achievements_project
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Can now switch between logging in and creating user

Browse source
This commit is contained in:
Gnarwhal 2021-02-05 08:25:41 -05:00
parent 5a1dd33dfe
commit 9e2ef9cfdc
Signed by: Gnarwhal
GPG key ID: 0989A73D8C421174
3 changed files with 33 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/webpage/login.html
View file

@ -27,7 +27,7 @@
<input id="password" class="login-field" type="password" placeholder="Password"></input>
<input id="confirm" class="login-field" type="password" placeholder="Confirm your password"></input>
<div id="login-buttons">
<div id="create-user-button" class="ap-button login">Create Account</div>
<div id="create-user-button" class="ap-button login">Create Account &gt;</div>
<div id="login-button" class="ap-button login">Login</div>
</div>
<p id="warning">WARNING! The security of this project is questionable at best. Please refrain from using any truly sensitive data.</p>

25
frontend/webpage/scripts/login.js
View file

@ -31,11 +31,17 @@ window.addEventListener("load", (loadEvent) => {
if (!frozen) {
fields.username.style.display = "block";
fields.confirm.style.display = "block";
login.style.display = "none";
header.textContent = "Create User";
login.style.flexGrow = "0";
login.textContent = "< Login";
createUser.style.flexGrow = "1";
createUser.textContent = "Create User";
createUser.removeEventListener("click", switchToCreateAction);
createUser.addEventListener("click", createUserAction);
login.removeEventListener("click", loginAction);
login.addEventListener("click", switchToLoginAction);
}
};
const createUserAction = (clickEvent) => {
@ -82,6 +88,23 @@ window.addEventListener("load", (loadEvent) => {
};
createUser.addEventListener("click", switchToCreateAction);
const switchToLoginAction = (clickEvent) => {
if (!frozen) {
fields.username.style.display = "none";
fields.confirm.style.display = "none";
header.textContent = "Login";
login.style.flexGrow = "1"
login.textContent = "Login";
createUser.style.flexGrow = "0";
createUser.textContent = "Create User >";
createUser.removeEventListener("click", createUserAction);
createUser.addEventListener("click", switchToCreateAction);
login.removeEventListener("click", switchToLoginAction);
login.addEventListener("click", loginAction);
}
};
const loginAction = (clickEvent) => {
if (!frozen) {
if (fields.email.value === '') {

9
frontend/webpage/styles/login.css
View file

@ -86,8 +86,15 @@
.ap-button.login {
margin: 0 calc(var(--element-spacing) / 2);
flex-basis: max-content;
}
#create-user-button {
flex-grow: 0;
}
#login-button {
flex-grow: 1;
flex-basis: 0px;
}
#warning {