diff --git a/admin/user_management/user_form.php b/admin/user_management/user_form.php index 8c8d995..ec839d9 100644 --- a/admin/user_management/user_form.php +++ b/admin/user_management/user_form.php @@ -59,7 +59,7 @@ try { // Try opening the SQL database connection
- +

diff --git a/scripts/user_management.js b/scripts/user_management.js index 8984713..00caf9f 100644 --- a/scripts/user_management.js +++ b/scripts/user_management.js @@ -65,24 +65,19 @@ function passwordConfirm() { // If the field is empty we'll hide the results if (confirmPassword == "") { document.getElementById("matchingPasswords").style.visibility = "hidden"; - document.getElementById("matchingPasswordsText").style.visibility = "hidden"; document.getElementById("confirmPassword").style.outline = null; return false; } else if (password == confirmPassword) { // If they match, show them green and return true document.getElementById("matchingPasswords").style.visibility = "visible"; document.getElementById("matchingPasswords").style.color = "green" ; document.getElementById("matchingPasswords").innerHTML = "✓ "; - document.getElementById("confirmPassword").style.outline = "1px solid green"; - document.getElementById("matchingPasswordsText").style.visibility = "visible"; - document.getElementById("matchingPasswordsText").innerHTML = "Match!"; + document.getElementById("confirmPassword").style.outline = "2px solid green"; return true; } else if (password != confirmPassword) { document.getElementById("matchingPasswords").style.visibility = "visible"; document.getElementById("matchingPasswords").style.color = "red"; document.getElementById("matchingPasswords").innerHTML = "Χ "; document.getElementById("confirmPassword").style.outline = "2px solid red"; - document.getElementById("matchingPasswordsText").style.visibility = "visible"; - document.getElementById("matchingPasswordsText").innerHTML = "Not a match!"; return false; } } @@ -98,7 +93,7 @@ function passwordConfirmLite() { document.getElementById("confirmPassword").style.outline = null; return false; } else if (password == confirmPassword) { // If they match - document.getElementById("confirmPassword").style.outline = "1px solid green"; + document.getElementById("confirmPassword").style.outline = "2px solid green"; return true; } else if (password != confirmPassword) { document.getElementById("confirmPassword").style.outline = "2px solid red"; @@ -112,6 +107,8 @@ function usernameConfirm() { // Temporarily convert the userlist to lower case. This will allow us to compare input vs. saved var listOfUsers = userList.map(e => e.toLowerCase()); + var confirmRegEx = new RegExp("^[a-zA-Z0-9]+([._-]?[a-zA-Z0-9])+([._-]?)$"); + // If the username is blank, clear the notice // Otherwise, we'll check the userlist created by PHP which was converted for JS // If the name is there, return false @@ -119,6 +116,12 @@ function usernameConfirm() { document.getElementById("confirmUsername").style.visibility = "hidden"; document.getElementById("username").style.outline = null; return false; + } else if (!confirmRegEx.test(username)) { + document.getElementById("confirmUsername").style.visibility = "visible"; + document.getElementById("confirmUsername").style.color = "red"; + document.getElementById("confirmUsername").innerHTML = "Invalid"; + document.getElementById("username").style.outline = "2px solid red"; + return false; // we return false for a match - a match is not what we want! } else if (listOfUsers.includes(username)) { document.getElementById("confirmUsername").style.visibility = "visible"; document.getElementById("confirmUsername").style.color = "red"; @@ -129,9 +132,9 @@ function usernameConfirm() { document.getElementById("confirmUsername").style.visibility = "visible"; document.getElementById("confirmUsername").style.color = "green"; document.getElementById("confirmUsername").innerHTML = ""; - document.getElementById("username").style.outline = "1px solid green"; + document.getElementById("username").style.outline = "2px solid green"; return true; // this means the user does not already exist and is good to go - } + } } function checkPasswordRequirements() { @@ -142,7 +145,7 @@ function checkPasswordRequirements() { } else if (password.length < 6) { document.getElementById("password").style.outline = "2px solid red"; } else { - document.getElementById("password").style.outline = "1px solid green"; + document.getElementById("password").style.outline = "2px solid green"; } } diff --git a/styles/user_management.css b/styles/user_management.css index 4c5c5c5..c847394 100644 --- a/styles/user_management.css +++ b/styles/user_management.css @@ -414,17 +414,11 @@ visibility: hidden; height: 0px; } - -#matchingPasswordsText { - visibility: hidden; - height: 0px; - font-size: 90%; -} - #confirmUsername { visibility: hidden; height: 0px; font-size: 90%; + font-weight: normal; } .noUser { diff --git a/styles/user_management_mobile.css b/styles/user_management_mobile.css index a4b3ea0..0f76420 100644 --- a/styles/user_management_mobile.css +++ b/styles/user_management_mobile.css @@ -24,12 +24,6 @@ height: 0; width: 0; } -#matchingPasswordsText { - visibility: hidden !important; - height: 0; - width: 0; -} - #accountDetailsBody { width: auto; flex-direction: column; diff --git a/user/create_account.php b/user/create_account.php index 3d1438e..5af01cf 100644 --- a/user/create_account.php +++ b/user/create_account.php @@ -66,17 +66,15 @@ try { // Try opening the SQL database connection
- - -

+ + - - +

+ + - -

-

+