From 11572a7ade759484e72aae992902f43690ee8174 Mon Sep 17 00:00:00 2001 From: FractalParadigm Date: Mon, 10 Mar 2025 18:32:11 -0400 Subject: [PATCH] Added user editing page Changed some layouts Probably some other things I've forgotten about lol --- admin/admin_nav.php | 3 +- admin/data_management/tourney_form.php | 4 +- admin/user_management/add_user.php | 12 ++- admin/user_management/edit_user.php | 22 ++++- admin/user_management/user_edit_form.php | 96 ++++++++++++++++++++++ admin/user_management/user_edit_frame.php | 88 ++++++++++++++++++++ admin/user_management/user_form.php | 53 ++++++++++-- scripts/user_management.js | 63 +++++++++++---- styles/admin_nav.css | 1 + styles/primary.css | 11 +++ styles/user_management.css | 98 +++++++++++++++++++++-- user/account.php | 12 +-- 12 files changed, 423 insertions(+), 40 deletions(-) create mode 100644 admin/user_management/user_edit_form.php create mode 100644 admin/user_management/user_edit_frame.php diff --git a/admin/admin_nav.php b/admin/admin_nav.php index 01ec0db..f1de473 100644 --- a/admin/admin_nav.php +++ b/admin/admin_nav.php @@ -27,7 +27,8 @@

USER MANAGEMENT

 

diff --git a/admin/data_management/tourney_form.php b/admin/data_management/tourney_form.php index 90c10aa..209c87d 100644 --- a/admin/data_management/tourney_form.php +++ b/admin/data_management/tourney_form.php @@ -61,11 +61,11 @@ try { // Try opening the SQL database connection + + - - + + + + + USER EDITING FORM + + + +
+

 

+
+
+ +
+ + " id="discord" name="discord" class="newLine" style="width:100%" maxlength="50"/> + + " id="discordLink" name="discordLink" class="newLine" style="width:100%" maxlength="50"/> + + " id="twitch" name="twitch" class="newLine" style="width:100%" maxlength="50" /> + + " id="youtube" name="youtube" class="newLine" style="width:100%" maxlength="50" /> + + " id="youtubeLink" name="youtubeLink" class="newLine" style="width:100%" maxlength="50" /> +
+
+ +
+

EXTRA OPTIONS

+
User Type
+

+ + + + + + +

 

+

Moderators: More details coming soon

+

Administrators: Have FULL access to the admin panel

+
+

 

+ +
+ + +
+ +
+ +

 

+
+ + \ No newline at end of file diff --git a/admin/user_management/user_edit_frame.php b/admin/user_management/user_edit_frame.php new file mode 100644 index 0000000..73fae93 --- /dev/null +++ b/admin/user_management/user_edit_frame.php @@ -0,0 +1,88 @@ +setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); + + // Grab the list of users from the user list + $sqlGetUserData = $conn->prepare("SELECT username FROM " . $userTableName . ""); + + + // Execute SQL query + $sqlGetUserData->execute(); + + // Get results from the USERS table + $results = $sqlGetUserData->fetchAll(PDO::FETCH_ASSOC); + + // Create array to store values + $userList = array(); + + // Move results to their own array, easier to convert for Javascript + foreach ($results as $result) { + $userList[] = $result["username"]; + } +} catch (PDOException $e) { // failed connection + echo "Connection failed: " . $e->getMessage(); +} + +?> + + + + + + + + + + + + + + + + + + + + USER CREATION FORM + + + +
+

USER EDITING

+

Edit users here

+
+

+ +
+ + + +
+ +
+ +
+ +

 

+
+ + \ No newline at end of file diff --git a/admin/user_management/user_form.php b/admin/user_management/user_form.php index cdf4ae8..bcbfb8d 100644 --- a/admin/user_management/user_form.php +++ b/admin/user_management/user_form.php @@ -1,3 +1,37 @@ +setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); + + // Grab the list of users from the user list + $sqlGetUserData = $conn->prepare("SELECT username FROM " . $userTableName . ""); + + + // Execute SQL query + $sqlGetUserData->execute(); + + // Get results from the USERS table + $results = $sqlGetUserData->fetchAll(PDO::FETCH_ASSOC); + + // Create array to store values + $userList = array(); + + // Move results to their own array, easier to convert for Javascript + foreach ($results as $result) { + $userList[] = $result["username"]; + } +} catch (PDOException $e) { // failed connection + echo "Connection failed: " . $e->getMessage(); +} + +?> + + @@ -11,6 +45,7 @@ + USER CREATION FORM @@ -24,9 +59,10 @@
- + +

- + @@ -45,10 +81,17 @@

EXTRA OPTIONS

 

- - -

An administrator will have FULL access to the administrator panel. In the hands of the wrong user, THIS COULD CAUSE SERIOUS DAMAGE AND IRREPARABLE HARM TO YOUR SERVER! Proceed with caution, and only with those you trust.

+
User Type

+ + + + + + +

 

+

Moderators: More details coming soon

+

Administrators: Have FULL access to the admin panel

 

diff --git a/scripts/user_management.js b/scripts/user_management.js index 74a3b78..04d50c9 100644 --- a/scripts/user_management.js +++ b/scripts/user_management.js @@ -1,7 +1,6 @@ function randomPassword() { - // Grab the length of password the user wants - var passwordLength = document.getElementById("passwordLength").value; var password = ""; + var passwordLength = 8; // The character set of the password. Modify this at your discretion var charset = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890"; @@ -12,7 +11,10 @@ function randomPassword() { } // Set the password field to what we've generated - document.getElementById("password").value = password; + //document.getElementById("password").value = password; + //document.getElementById("confirmPassword").value = password; + console.log(password); + return password; } function verifyInput() { @@ -65,13 +67,13 @@ function passwordConfirm() { if (confirmPassword == "") { document.getElementById("matchingPasswords").style.visibility = "hidden"; document.getElementById("matchingPasswordsText").style.visibility = "hidden"; - document.getElementById("confirmPassword").style.border = null; + 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.border = "1px solid green"; + document.getElementById("confirmPassword").style.outline = "1px solid green"; document.getElementById("matchingPasswordsText").style.visibility = "visible"; document.getElementById("matchingPasswordsText").innerHTML = "Match!"; return true; @@ -79,7 +81,7 @@ function passwordConfirm() { document.getElementById("matchingPasswords").style.visibility = "visible"; document.getElementById("matchingPasswords").style.color = "red"; document.getElementById("matchingPasswords").innerHTML = "Χ "; - document.getElementById("confirmPassword").style.border = "2px solid red"; + document.getElementById("confirmPassword").style.outline = "2px solid red"; document.getElementById("matchingPasswordsText").style.visibility = "visible"; document.getElementById("matchingPasswordsText").innerHTML = "Not a match!"; return false; @@ -94,13 +96,13 @@ function passwordConfirmLite() { // If the field is empty we'll hide the results if (confirmPassword == "") { - document.getElementById("confirmPassword").style.border = null; + document.getElementById("confirmPassword").style.outline = null; return false; } else if (password == confirmPassword) { // If they match - document.getElementById("confirmPassword").style.border = "1px solid green"; + document.getElementById("confirmPassword").style.outline = "1px solid green"; return true; } else if (password != confirmPassword) { - document.getElementById("confirmPassword").style.border = "2px solid red"; + document.getElementById("confirmPassword").style.outline = "2px solid red"; return false; } } @@ -116,19 +118,19 @@ function usernameConfirm() { // If the name is there, return false if (username == "") { document.getElementById("confirmUsername").style.visibility = "hidden"; - document.getElementById("username").style.border = null; + document.getElementById("username").style.outline = null; return false; } else if (listOfUsers.includes(username)) { document.getElementById("confirmUsername").style.visibility = "visible"; document.getElementById("confirmUsername").style.color = "red"; document.getElementById("confirmUsername").innerHTML = "Taken"; - document.getElementById("username").style.border = "2px solid red"; + 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 = "green"; document.getElementById("confirmUsername").innerHTML = ""; - document.getElementById("username").style.border = "1px solid green"; + document.getElementById("username").style.outline = "1px solid green"; return true; // this means the user does not already exist and is good to go } } @@ -138,15 +140,16 @@ function checkPasswordRequirements() { console.log(password); if (password == "") { - document.getElementById("password").style.border = null; + document.getElementById("password").style.outline = null; } else if (password.length < 6) { - document.getElementById("password").style.border = "2px solid red"; + document.getElementById("password").style.outline = "2px solid red"; } else { - document.getElementById("password").style.border = "1px solid green"; + document.getElementById("password").style.outline = "1px solid green"; } } function togglePWChange() { + // This function handles the switch between showing the socials edit panel and the password change panel var socialsDiv = document.getElementById("accountSocialsPanel"); var pwChangeDiv = document.getElementById("passwordChangePanel"); @@ -167,6 +170,32 @@ function togglePWChange() { pwChangeDiv.style.display = "flex"; pwChangeDiv.style.zIndex = "1"; } - - } + +function editUser() { + console.log("YAASSS"); + var div = document.getElementById("userEditFrameDiv"); + username = document.getElementById("user").value; + var html = ""; + + + html += ""; + + div.innerHTML = html; + + console.log(html); +} + +function setPrivilegeLevel(privileges) { + switch (privileges){ + case 0: + document.getElementById("regular").checked = true; + break; + case 1: + document.getElementById("administrator").checked = true; + break; + case 2: + document.getElementById("moderator").checked = true; + break; + } +} \ No newline at end of file diff --git a/styles/admin_nav.css b/styles/admin_nav.css index e2be44c..acd7b88 100644 --- a/styles/admin_nav.css +++ b/styles/admin_nav.css @@ -2,6 +2,7 @@ width: 800px; margin: auto; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + overflow: hidden; } #informationContentPanel { diff --git a/styles/primary.css b/styles/primary.css index ce91e75..23e876f 100644 --- a/styles/primary.css +++ b/styles/primary.css @@ -23,6 +23,17 @@ line-height: 0.25em; } +.underlined { + text-decoration-line: underline; +} + +.bolded { + font-weight: bold; +} + +.larger { + font-size: 1.25em; +} .backgroundImage { position: absolute; diff --git a/styles/user_management.css b/styles/user_management.css index 09320bc..e367115 100644 --- a/styles/user_management.css +++ b/styles/user_management.css @@ -1,13 +1,20 @@ #userFormPanel { width: 500px; + margin: auto; + text-align: center; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } - -#userFormPanel { +#userEditPanel { + width: 500px; + min-height: 400px; margin: auto; text-align: center; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } +#userEditBody { + margin: auto; +} #createAccountPanel { margin: auto; @@ -20,6 +27,7 @@ flex-direction: row; margin-bottom: 20px; margin: auto; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } #accountSocialsPanel { @@ -29,7 +37,6 @@ width: 45%; border: 1px solid black; border-radius: 8px; - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; margin-right: 2%; padding: 5px; padding-bottom: 25px; @@ -181,6 +188,7 @@ flex-wrap: wrap; flex-direction: row; margin: auto; + width:70% } #userForm input { @@ -191,6 +199,7 @@ #userForm label { text-align: left; font-weight: bold; + align-content: center; } #userForm input[type="submit"] { @@ -228,6 +237,78 @@ padding: 7px 10px; margin: 1% 6%; } + + +.userForm input { + background-color: rgba(255, 255, 255, 0.6); + border: 1px solid rgb(0, 0, 255); +} + +.userForm label { + text-align: left; + font-weight: bold; + align-content: center; +} + +.userForm button { + margin: auto; + padding: 8px 25px; + font-size: 150%; + font-weight: bold; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + background-color: rgba(255, 255, 255, 0); + border-radius: 6px; + border: 1px solid rgb(0, 0, 255); + box-shadow: 0px 2px 4px; +} + +.userForm button:hover { + color: black; + background-color: rgba(255, 165, 0, .6); +} + +.userForm button:active { + box-shadow: 0px 0px 2px; + transform: translateY(2px); +} + +.userForm input[type="button"] { + margin: auto; + padding: 8px 25px; + font-size: 150%; + font-weight: bold; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + background-color: rgba(255, 255, 255, 0); + border-radius: 6px; + border: 1px solid rgb(0, 0, 255); + box-shadow: 0px 2px 4px; +} + +.userForm input[type="button"]:hover { + color: black; + background-color: rgba(255, 165, 0, .6); +} + +.userForm input[type="button"]:active { + box-shadow: 0px 0px 2px; + transform: translateY(2px); +} + +.userForm input[type="text"] { + border-radius: 5px; + width: 150px; + padding: 7px 10px; + margin: 1% 6%; +} + +.userForm input[type="password"] { + border-radius: 5px; + width: 150px; + padding: 7px 10px; + margin: 1% 6%; +} + + .inputLabel { width:100%; } @@ -237,13 +318,14 @@ flex-wrap: wrap; flex-direction: row; margin: auto; + justify-content: center; } #extraOptions h4 { text-align: center; margin: auto; } #extraOptions p { - text-align: left; + text-align: center; margin: auto; } @@ -277,7 +359,7 @@ text-align: center; flex-direction: row; font-size: 100%; - font-weight: normal; + font-weight: normal !important; padding: 0 20px; } @@ -314,3 +396,9 @@ overflow: hidden; } + +.normalButton { + padding: 4px 15px !important; + font-size: 100% !important; + font-weight: normal !important; +} \ No newline at end of file diff --git a/user/account.php b/user/account.php index a13c147..5f9d315 100644 --- a/user/account.php +++ b/user/account.php @@ -91,8 +91,8 @@ try { // Try opening the SQL database connection

 

-

Info

-

+

Info

+

Username:

Date Joined:

@@ -119,8 +119,8 @@ try { // Try opening the SQL database connection if (mb_strtolower($username) == mb_strtolower($_SESSION["username"])) { echo ("
-

Edit

-

+

Edit

+

Twitch (name):

YouTube (name):

@@ -149,8 +149,8 @@ try { // Try opening the SQL database connection "/* PASSWORD CHANGE */ . " "/* */ . "
-

Change Password

-

+

Change Password

+

Old Password: