user_account_settings
unknown
php
3 years ago
20 kB
5
Indexable
<?php
require 'session_init.php';
include 'user_ui_viewData.php';
include 'connection.php';
$user = $_SESSION['USER'];
$id = $_SESSION['USERID'];
$arrayUsers = array();
$sql = "SELECT username FROM users_tb";
$result = mysqli_query($connect, $sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
array_push($arrayUsers, $row['username']);
}
}
$sql = "SELECT profile_id from users_tb where userid = '$id'";
$profile_id = null;
$recordstat = null;
$result = mysqli_query($connect, $sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
$profile_id = $row['profile_id'];
}
}
else
echo mysqli_error($connect);
$sql = "SELECT record_status FROM residence_tb WHERE id = '$profile_id'";
$result = mysqli_query($connect, $sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
$recordstat = $row['record_status'];
}
}
else
echo mysqli_error($connect);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>Resident Account Settings - IBIMS</title>
<link href="https://cdn.jsdelivr.net/npm/simple-datatables@latest/dist/style.css" rel="stylesheet" />
<link href="../css/styles.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/js/all.min.js" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script type="text/javascript">
$(document).ready(function() {
var entry = '<tr><td><input class="form-control" type="text" name="fam_name[]" required></td><td> <select name="relationship[]" class="form-select form-select-lg mb-2" style="font-size: 15px;"><option value="Mother">Mother</option><option value="Father">Father</option><option value="Daughter">Daughter</option><option value="Son">Son</option><option value="Broher">Brother</option><option value="Sister">Sister</option></select></td><td><select name="samehs[]" class="form-select form-select-lg mb-2" style="font-size: 15px;"><option value="1">Yes</option><option value="0">No</option></select></td><td><input type="button" class="btn btn-danger" value="remove" name="delentry" id="delentry"> </td></tr>';
$("#addentry").click(function() {
$("#family_table").append(entry);
});
$("#family_table").on('click', '#delentry', function() {
$(this).closest('tr').remove();
});
});
function isNumberKey(evt) {
var charCode = (evt.which) ? evt.which : evt.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
</script>
</head>
<body class="sb-nav-fixed" style="background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url('../assets/img/seahorsesogod.png');background-repeat: no-repeat;background-size: cover; backdrop-filter: blur(1.5px);">
<script>
var element = document.getElementById("dashboard");
element.classList.add("active");
</script>
<!-- Enter Main Body content here-->
<div id="layoutSidenav_content">
<main>
<nav class="navbar navbar-expand-md navbar-dark justify-content-center" style="background:#192841;">
<a class="navbar-brand abs">IBIMS</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsingNavbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse" id="collapsingNavbar">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" id="navHome" href="../residentpage.php">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" id="navProfile" href="./user_profile_management.php">Resident Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" id="navAnnouncements" href="../resident_events_management.php" onclick=noAccess()>Announcements and Events</a>
</li>
<li class="nav-item">
<a class="nav-link" id="navReq" href="../resident_document_requests.php" onclick=noAccess()>Request Document</a>
</li>
</ul>
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link active" href="./user_account_settings.php"><?php echo ($_SESSION['USER'])?><i class="fas fa-user fa-fw"></i></a>
</li>
</ul>
</div>
</nav>
<script>
function noAccess()
{
var recordstat = '<?php echo $recordstat?>';
if (recordstat == '0' || '2' || null) // tanggalin mo nalang quotation kung di gumana
{
document.getElementById('navAnnouncements').href = "#";
document.getElementById('navReq').href = "#";
alert("You are not eligible to use this feature. You must have a verified profile first.");
}
else
{
document.getElementById('navAnnouncements').href = "../resident_events_management.php";
document.getElementById('navReq').href = "../resident_document_requests.php";
}
}
</script>
<br>
<!-- 1st Card -->
<div class="m-5">
<div class="card border-0">
<br>
<!-- Account settings start -->
<?php
require_once './connection.php';
$arrayUsers = array();
$arrayEmails = array();
$sql = "SELECT username, email FROM users_tb";
$result = mysqli_query($connect, $sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
array_push($arrayUsers, $row['username']);
array_push($arrayEmails, $row['email']);
}
}
?>
<div class="container">
<h3>Account Settings</h3>
<hr>
<?php
include './connection.php';
$query=mysqli_query($connect,"SELECT * FROM users_tb WHERE userid='$id' AND username='$user'");
$row=mysqli_fetch_array($query);
?>
<div class="row text-start px-3">
<form action="user_account.php" method="POST">
<div class="form-group row">
<label for="inputEmail3" class="col-sm-2 col-form-label">Username</label>
<div class="col-sm-6">
<input required disabled minlength="5" maxlength="20" type="text" class="form-control" id="username" name="username" style="height: 36px;" onkeypress="return /^[a-z0-9]+$/i.test(event.key)" value="<?php echo $row['username'];?>" >
<div hidden class="invalid-feedback" id="user_exist" style="display: block;">
Username already exists!
</div>
<div hidden class="valid-feedback" id="user_avail" style="display: block;">
Username available!
</div>
<div hidden class="invalid-feedback" id="user_input" style="display: block;">
Input username with a minimun of 6 characters and maximum of 25 characters.
</div>
</div>
<div hidden class="spinner-border text-primary col-sm-4" id="loadingicon" role="status">
<span class="visually-hidden" >Loading...</span>
</div>
</div>
<div class="form-group row">
<label for="inputEmail3" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-6">
<input required disabled type="email" class="form-control" id="email" name="email" style="height: 36px;" value="<?php echo $row['email'];?>">
<div hidden class="invalid-feedback" id="email_exist" style="display: block;">
Email already exists!
</div>
<div hidden class="valid-feedback" id="email_avail" style="display: block;">
Email available!
</div>
<div hidden class="invalid-feedback" id="email_input" style="display: block;">
Please input valid email.
</div>
</div>
<div hidden class="spinner-border text-primary col-sm-4" id="loadingeicon" role="status">
<span class="visually-hidden" >Loading...</span>
</div>
</div>
<div class="form-group row">
<label for="inputPassword3" class="col-sm-2 col-form-label">Current Password</label>
<div class="col-sm-6">
<input disabled type="password" class="form-control" id="old_password" name="old_password" style="height: 36px;" required placeholder="Enter Current Password">
<span toggle="#password-field" class="fas fa-eye field-icon toggle-password" onclick="toggleVisibility()"></span>
</div>
</div>
<div class="form-group row">
<label for="inputPassword3" class="col-sm-2 col-form-label">New Password</label>
<div class="col-sm-6">
<input disabled type="password" class="form-control" id="new_password" name="new_password" style="height: 36px;" placeholder="Enter New Password">
<span toggle="#password-field" class="fas fa-eye field-icon toggle-password" onclick="toggleVisibility1()"></span>
</div>
</div>
<div class="form-group row justify-content-end">
<div class="col-sm-6" id="editdiv" style="padding: 0px 40px 0px 40px;">
<button class="btn btn-primary d-block btn-user" type="button" style="margin: 20px 0px 0px 0px; font-size: 15px; width: 100%;" name="edit" id="editbtn" onclick="editAccount()">Edit</button>
</div>
<div hidden class="col-sm-6" id="updatediv" style="padding: 0px 40px 0px 40px;">
<button disabled class="btn btn-primary d-block btn-user" type="submit" style="margin: 20px 0px 0px 0px; font-size: 15px; width: 100%; " name="update" id="updatebtn">Update</button>
</div>
<div class="col-sm-6" style="padding: 0px 40px 0px 40px;">
<button disabled class="btn btn-secondary d-block btn-user" type="button" style="margin: 20px 0px 0px 0px; font-size: 15px; width: 100%;" name="cancel" id="cancelbtn" onclick="window.location.href='user_account_settings.php'">Cancel</button>
</div>
</div>
</form>
<br><br>
</div>
</div>
<br>
</div>
<br>
<!-- 2nd Card -->
<div class="mt-6 card border-0" style="background:transparent;">
<br>
<div class="container">
<div class="row px-3">
<div class="col-mb-3 text-center">
<button type="button" class="col-2 btn btn-danger text-white" onclick="window.location.href='./logout.php'">Logout</button>
<button type="button" class="col-2 btn btn-secondary text-white" onclick="window.location.href='../residentpage.php'">Back</button>
</div>
<br><br>
</div>
</div>
<br>
</div>
<script>
var users = <?php echo json_encode($arrayUsers) ?>;
var emails = <?php echo json_encode($arrayEmails) ?>;
var inputuser = document.getElementById('username');
var inputemail = document.getElementById('email');
var current_username = inputuser.value;
var current_email = inputemail.value;
$(document).ready(function() {
$("#username").on("input", function() {
document.getElementById('loadingicon').hidden = false;
document.getElementById('user_avail').hidden = true;
document.getElementById('user_exist').hidden = true;
document.getElementById('user_input').disabled = true;
document.getElementById('updatebtn').disabled = true;
var delayInMilliseconds = 1500; //1 second
setTimeout(function() {
if (users.includes(inputuser.value) && inputuser.value != current_username) {
document.getElementById('loadingicon').hidden = true;
document.getElementById('user_avail').hidden = true;
document.getElementById('user_exist').hidden = false;
document.getElementById('updatebtn').disabled = true;
} else if (inputuser.value == current_username) {
document.getElementById('loadingicon').hidden = true;
document.getElementById('user_avail').hidden = true;
document.getElementById('user_exist').hidden = true;
document.getElementById('user_input').hidden = true;
document.getElementById('updatebtn').disabled = true;
} else if (inputuser.value == "" || inputuser.value == null) {
document.getElementById('loadingicon').hidden = true;
document.getElementById('user_avail').hidden = true;
document.getElementById('user_exist').hidden = true;
document.getElementById('user_input').hidden = false;
document.getElementById('updatebtn').disabled = true;
} else if (inputuser.value.length > 5) {
document.getElementById('loadingicon').hidden = true;
document.getElementById('user_avail').hidden = false;
document.getElementById('user_exist').hidden = true;
document.getElementById('user_input').hidden = true;
document.getElementById('updatebtn').disabled = false;
}
}, delayInMilliseconds);
});
});
$(document).ready(function() {
$("#email").on("input", function() {
document.getElementById('loadingeicon').hidden = false;
document.getElementById('email_avail').hidden = true;
document.getElementById('email_exist').hidden = true;
document.getElementById('email_input').disabled = true;
document.getElementById('updatebtn').disabled = false;
var delayInMilliseconds = 1500; //1 second
setTimeout(function() {
if (emails.includes(inputemail.value) && inputuser.value != current_username) {
document.getElementById('loadingeicon').hidden = true;
document.getElementById('email_avail').hidden = true;
document.getElementById('email_exist').hidden = false;
document.getElementById('email_input').hidden = true;
document.getElementById('updatebtn').disabled = true;
} else if (inputemail.value == current_email) {
document.getElementById('loadingeicon').hidden = true;
document.getElementById('email_avail').hidden = true;
document.getElementById('email_exist').hidden = true;
document.getElementById('email_input').hidden = true;
document.getElementById('updatebtn').disabled = true;
} else if (inputemail.value == "" || inputemail.value == null) {
document.getElementById('loadingeicon').hidden = true;
document.getElementById('email_avail').hidden = true;
document.getElementById('email_exist').hidden = true;
document.getElementById('email_input').hidden = false;
document.getElementById('updatebtn').disabled = true;
}
}, delayInMilliseconds);
});
});
function toggleVisibility() {
var x = document.getElementById("old_password");
if (x.type === "password") {
x.type = "text";
} else {
x.type = "password";
}
}
function toggleVisibility1() {
var x = document.getElementById("new_password");
if (x.type === "password") {
x.type = "text";
} else {
x.type = "password";
}
}
function editAccount() {
document.getElementById('updatediv').hidden = false;
document.getElementById('editdiv').hidden = true;
document.getElementById('username').disabled = false;
document.getElementById('email').disabled = false;
document.getElementById('old_password').disabled = false;
document.getElementById('new_password').disabled = false;
document.getElementById('cancelbtn').disabled = false;
}
</script>
</div>
</main>
</div>
</body>
Editor is loading...