I'm in a rush to release so I am adding features that are needed to make it usable.

This commit is contained in:
Cody Cook 2025-02-17 22:03:33 -08:00
commit 4c2857b445
25 changed files with 2475 additions and 3475 deletions

171
login.php
View file

@ -1,66 +1,149 @@
<?php
require_once 'includes/globals.php';
if (isset($_SESSION['user'])) {
header("Location: /profile");
exit;
}
require_once 'vendor/autoload.php';
use DJMixHosting\Database;
use DJMixHosting\User;
// Generate a CSRF token if one is not set
if (!isset($_SESSION['csrf_token'])) {
$_SESSION['csrf_token'] = bin2hex(random_bytes(32));
}
$title = $locale['home'];
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
if (isset($_POST['email'], $_POST['password'], $_POST['csrf_token'])) {
if (isset($_POST['username']) && isset($_POST['password'])) {
$username = $_POST['username'];
$password = $_POST['password'];
// Check the CSRF token
if ($_POST['csrf_token'] !== $_SESSION['csrf_token']) {
$_SESSION['error'] = $locale['message'] . ": Invalid form submission. Please try again.";
} else {
$email = $_POST['email'];
$password = $_POST['password'];
$db = new Database($config);
$user = new User($db);
$user->login($username, $password);
$db = new Database($config);
$user = new User($db);
$result = $user->login($email, $password);
if ($result === true) {
// Successful login, redirect to profile page
header("Location: profile.php");
exit;
} else {
// Set error message from login method (includes lockout messages)
$_SESSION['error'] = $result;
}
}
}
}
require_once 'includes/header.php'; ?>
<section>
<div class="container py-5">
<div class="row">
<div class="col">
<nav aria-label="breadcrumb" class="bg-body-tertiary rounded-3 p-3 mb-4">
<ol class="breadcrumb mb-0">
<li class="breadcrumb-item"><a href="/"><?php echo $locale['home']; ?></a></li>
<li class="breadcrumb-item active"><a href="/login.php"><?php echo $locale['login']; ?></a>
</li>
</ol>
</nav>
</div>
</div>
</div>
</section>
<section>
<div class="container py-5">
<div class="row">
<div class="col-lg-6 offset-lg-3">
<div class="card">
<div class="card-body">
<h5 class="card-title"><?php echo $locale['login']; ?></h5>
<form action="login.php" method="post">
<div class="mb-3">
<label for="username" class="form-label"><?php echo $locale['username']; ?></label>
<input type="text" class="form-control" id="username" name="username" required>
require_once 'includes/header.php';
?>
<section class="login-section py-5">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-5">
<?php
if (isset($_SESSION['error'])) {
echo '<div class="alert alert-danger alert-dismissible fade show mb-4" role="alert">
' . htmlspecialchars($_SESSION['error']) . '
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>';
unset($_SESSION['error']);
}
?>
<div class="card shadow-sm border-0">
<div class="card-body p-4">
<h3 class="text-center mb-4">Login</h3>
<form action="login.php" method="post" class="needs-validation" novalidate>
<div class="mb-3">
<label for="email" class="form-label">Email</label>
<input type="email" class="form-control form-control-lg" id="email" name="email" required>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<div class="input-group">
<input type="password" class="form-control form-control-lg" id="password" name="password" required>
<button class="btn btn-outline-secondary px-3" type="button" id="togglePassword"
style="border-left: none;">
<i class="bi bi-eye-fill fs-5"></i>
</button>
</div>
<div class="mb-3">
<label for="password" class="form-label"><?php echo $locale['password']; ?></label>
<input type="password" class="form-control" id="password" name="password" required>
</div>
<button type="submit" class="btn btn-primary"><?php echo $locale['login']; ?></button>
</form>
</div>
</div>
<div class="mb-4 form-check">
<input type="checkbox" class="form-check-input" id="rememberMe" name="remember_me">
<label class="form-check-label" for="rememberMe">Remember me</label>
</div>
<input type="hidden" name="csrf_token" value="<?php echo htmlspecialchars($_SESSION['csrf_token']); ?>">
<button type="submit" class="btn btn-primary w-100 btn-lg mb-3">Login</button>
<div class="text-center">
<a href="forgot-password.php" class="text-decoration-none">Forgot password?</a>
</div>
</form>
</div>
</div>
<div class="text-center mt-4">
<p class="mb-0">Don't have an account? <a href="register.php" class="text-decoration-none">Sign up</a></p>
</div>
</div>
</div>
</div>
</section>
</section>
<style>
.login-section {
min-height: calc(100vh - 200px); /* Adjust based on your header/footer height */
}
<?php require_once 'includes/footer.php'; ?>
.form-control:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.15);
}
#togglePassword:hover {
background-color: #f8f9fa;
}
#togglePassword:focus {
box-shadow: none;
}
.input-group .form-control:focus {
border-right: 1px solid #86b7fe;
}
.input-group .btn {
border-left: 0;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', function() {
// Form validation
const form = document.querySelector('.needs-validation');
form.addEventListener('submit', function(event) {
if (!form.checkValidity()) {
event.preventDefault();
event.stopPropagation();
}
form.classList.add('was-validated');
}, false);
// Password visibility toggle with improved UX
const togglePassword = document.querySelector('#togglePassword');
const password = document.querySelector('#password');
togglePassword.addEventListener('click', function() {
const type = password.getAttribute('type') === 'password' ? 'text' : 'password';
password.setAttribute('type', type);
this.querySelector('i').classList.toggle('bi-eye-fill');
this.querySelector('i').classList.toggle('bi-eye-slash-fill');
});
});
</script>
<?php require_once 'includes/footer.php'; ?>