diff --git a/src/client/scripts/login.js b/src/client/scripts/login.js index 72bff97e7..c42feb0b9 100644 --- a/src/client/scripts/login.js +++ b/src/client/scripts/login.js @@ -2,23 +2,19 @@ const usernameInputElement = document.getElementById('username'); const passwordInputElement = document.getElementById('password'); const submitButton = document.getElementById('submit'); -let loginErrorElement = undefined; const forgotElement = document.getElementById('forgot'); +let loginErrorElement = undefined; -usernameInputElement.addEventListener('input', (event) => { // When username field changes... - loginErrorElement?.remove(); - loginErrorElement = undefined; - updateSubmitButton(); - // Make forgot password message hidden - forgotElement.className = 'forgothidden'; -}); -passwordInputElement.addEventListener('input', (event) => { // When username field changes... - loginErrorElement?.remove(); - loginErrorElement = undefined; - updateSubmitButton(); - // Make forgot password message hidden - forgotElement.className = 'forgothidden'; +//Event Listeners +usernameInputElement.addEventListener('input', handleInput); // When username field changes... +passwordInputElement.addEventListener('input', handleInput); // When username field changes... + +//Checks for autofilled inputs on load +window.addEventListener('load', (event) => { + if (usernameInputElement.value && passwordInputElement.value) { + updateSubmitButton(); + } }); submitButton.addEventListener('click', (event) => { @@ -27,6 +23,17 @@ submitButton.addEventListener('click', (event) => { if (usernameInputElement.value && passwordInputElement.value && !loginErrorElement) sendLogin(usernameInputElement.value, passwordInputElement.value); }); +function handleInput(event) { + if (loginErrorElement) { + loginErrorElement.remove(); + loginErrorElement = undefined; + } + + updateSubmitButton(); + // Make forgot password message hidden + forgotElement.className = 'forgothidden'; +} + const sendLogin = (username, password) => { submitButton.disabled = true; @@ -45,7 +52,7 @@ const sendLogin = (username, password) => { .then((result) => { if (OK) { // Username & password accepted! Handle our access token // const token = getCookieValue('token') - + // Check for a redirectTo query parameter, and if it exists, use it const redirectTo = getQueryParam('redirectTo'); if (redirectTo) window.location.href = redirectTo; @@ -87,10 +94,10 @@ function createErrorElement(id, insertAfter) { function getCookieValue(cookieName) { const cookieArray = document.cookie.split("; "); - + for (let i = 0; i < cookieArray.length; i++) { const cookiePair = cookieArray[i].split("="); - + if (cookiePair[0] === cookieName) { return cookiePair[1]; } diff --git a/src/client/scripts/validation.js b/src/client/scripts/validation.js index f7778077b..e7ecfd2de 100644 --- a/src/client/scripts/validation.js +++ b/src/client/scripts/validation.js @@ -81,7 +81,7 @@ const validation = (function(){ /** * Inits our token, and, if we're logged in, inits member, and changes navigation links if we're logged in. - * + * * If we're not signed in, the server will give/renew us a browser-id cookie for validation. */ function refreshToken() { @@ -131,13 +131,13 @@ const validation = (function(){ if (areLoggedIn) { loginLink.setAttribute('href', `/member/${member.toLowerCase()}`); loginText.textContent = 'Profile'; - + createaccountLink.setAttribute('href', '/logout'); createaccountText.textContent = 'Log Out'; } else { loginLink.setAttribute('href', `/login`); loginText.textContent = 'Log In'; - + createaccountLink.setAttribute('href', '/createaccount'); createaccountText.textContent = 'Create Account'; } @@ -150,7 +150,7 @@ const validation = (function(){ */ function getCookieValue(cookieName) { const cookieArray = document.cookie.split("; "); - + for (let i = 0; i < cookieArray.length; i++) { const cookiePair = cookieArray[i].split("="); if (cookiePair[0] === cookieName) return cookiePair[1];