mirror of
https://github.com/Fluffy-Bean/image-gallery.git
synced 2024-12-28 18:36:22 +00:00
Updating Login to new AJAX system
This commit is contained in:
parent
10fbfc2067
commit
a5212b1d11
|
|
@ -43,7 +43,17 @@
|
|||
echo "<h3>Invite Codes</h3>";
|
||||
$token_request = mysqli_query($conn, "SELECT * FROM tokens WHERE used = 0");
|
||||
while ($token = mysqli_fetch_array($token_request)) {
|
||||
echo "<p>".$token['code']."</p>";
|
||||
?>
|
||||
<!-- Button that's displayed with the invite code -->
|
||||
<button onclick='copyCode()' class='btn btn-neutral'><?php echo $token['code']; ?></button>
|
||||
<!-- Copy code on click -->
|
||||
<script>
|
||||
function copyCode() {
|
||||
navigator.clipboard.writeText("<?php echo $token['code']; ?>");
|
||||
sniffleAdd("Info", "Invite code has been copied!", "var(--green)", "<?php echo $root_dir; ?>assets/icons/clipboard-text.svg");
|
||||
}
|
||||
</script>
|
||||
<?php
|
||||
}
|
||||
}
|
||||
?>
|
||||
|
|
|
|||
|
|
@ -33,81 +33,13 @@
|
|||
include "../ui/required.php";
|
||||
include "../ui/nav.php";
|
||||
|
||||
// Initialize the session
|
||||
session_start();
|
||||
|
||||
// Check if the user is already logged in, if yes then redirect him to welcome page
|
||||
if(isset($_SESSION["loggedin"]) && $_SESSION["loggedin"] === true){
|
||||
$success = "You're already logged in! No need to try this again";
|
||||
}
|
||||
|
||||
if (isset($_POST['login'])) {
|
||||
// Checking if Username is empty
|
||||
if (empty(trim($_POST["username"]))) {
|
||||
$error = "Who are you?";
|
||||
} else {
|
||||
$username = trim($_POST["username"]);
|
||||
}
|
||||
|
||||
// Check if Password is empty
|
||||
if (empty(trim($_POST["password"]))) {
|
||||
$error = "Pls enter super duper secrete password";
|
||||
} else {
|
||||
$password = trim($_POST["password"]);
|
||||
}
|
||||
|
||||
// Check if no errors occured
|
||||
if (empty($error)) {
|
||||
// Prepare so SQL doesnt get spooked
|
||||
$sql = "SELECT id, username, password FROM users WHERE username = ?";
|
||||
|
||||
if ($stmt = mysqli_prepare($conn, $sql)) {
|
||||
// Bind dis shit
|
||||
mysqli_stmt_bind_param($stmt, "s", $param_username);
|
||||
|
||||
// Set parameters
|
||||
$param_username = $username;
|
||||
|
||||
// Attempt to execute the prepared statement
|
||||
if (mysqli_stmt_execute($stmt)) {
|
||||
// Store result
|
||||
mysqli_stmt_store_result($stmt);
|
||||
|
||||
// Check if username exists, if yes then verify password
|
||||
if (mysqli_stmt_num_rows($stmt) == 1) {
|
||||
// Bind result variables
|
||||
mysqli_stmt_bind_result($stmt, $id, $username, $hashed_password);
|
||||
if (mysqli_stmt_fetch($stmt)) {
|
||||
if (password_verify($password, $hashed_password)) {
|
||||
// Password is correct, so start a new session
|
||||
session_start();
|
||||
|
||||
// Store data in session variables
|
||||
$_SESSION["loggedin"] = true;
|
||||
$_SESSION["id"] = $id;
|
||||
$_SESSION["username"] = $username;
|
||||
|
||||
// let the user know
|
||||
$success = "Yupee! You are now logged in";
|
||||
header("Location:https://superdupersecteteuploadtest.fluffybean.gay/index.php?login=success");
|
||||
} else {
|
||||
$error = "Username or Password sus, please try again :3";
|
||||
}
|
||||
}
|
||||
} else {
|
||||
$error = "Username or Password sus, please try again :3";
|
||||
}
|
||||
} else {
|
||||
$error = "Sowwy, something went wrong on our end :c";
|
||||
}
|
||||
|
||||
// Close statement
|
||||
mysqli_stmt_close($stmt);
|
||||
}
|
||||
}
|
||||
|
||||
// Close connection
|
||||
mysqli_close($conn);
|
||||
?>
|
||||
<script>
|
||||
sniffleAdd('Whatcha doing here?', 'You are already logged in! No need to try again', 'var(--black)', '<?php echo $root_dir; ?>assets/icons/warning.svg');
|
||||
</script>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
||||
|
|
@ -115,15 +47,29 @@
|
|||
<h2>Login</h2>
|
||||
<p>Passwords are important to keep safe. Don't tell anyone your password, not even Fluffy!</p>
|
||||
<br>
|
||||
<form method="POST" action="login.php" enctype="multipart/form-data">
|
||||
<input class="btn btn-neutral" type="text" name="username" placeholder="Username">
|
||||
<input class="btn btn-neutral" type="password" name="password" placeholder="Password">
|
||||
<form id="loginSubmit" method="POST" enctype="multipart/form-data">
|
||||
<input id="loginUsername" class="btn btn-neutral" type="text" name="username" placeholder="Username">
|
||||
<input id="loginPassword" class="btn btn-neutral" type="password" name="password" placeholder="Password">
|
||||
<br>
|
||||
<button class="btn btn-good" type="submit" name="login"><img class="svg" src="../assets/icons/sign-in.svg">Login</button>
|
||||
<button id="loginSubmit" class="btn btn-good" type="submit" name="login"><img class="svg" src="../assets/icons/sign-in.svg">Login</button>
|
||||
</form>
|
||||
<a class='btn btn-neutral' href='https://superdupersecteteuploadtest.fluffybean.gay/account/signup.php'><img class="svg" src="../assets/icons/sign-in.svg">Need an account? Sign up!</a>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$("#loginSubmit").submit(function(event) {
|
||||
event.preventDefault();
|
||||
var username = $("#loginUsername").val();
|
||||
var password = $("#loginPassword").val();
|
||||
var submit = $("#loginSubmit").val();
|
||||
$("#sniffle").load("../app/account/login.php", {
|
||||
username: username,
|
||||
password: password,
|
||||
submit: submit
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<?php include "../ui/footer.php"; ?>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
100
app/account/login.php
Normal file
100
app/account/login.php
Normal file
|
|
@ -0,0 +1,100 @@
|
|||
<?php
|
||||
/*
|
||||
|-------------------------------------------------------------
|
||||
| Login
|
||||
|-------------------------------------------------------------
|
||||
| This is annoying because I want to keep the website secure
|
||||
| but I have no clue how to keep things secure with HTML, PHP
|
||||
| or JS. So I hope seperating the scripts and putting all this
|
||||
| into a PHP file is a good secutiry mesure
|
||||
|-------------------------------------------------------------
|
||||
*/
|
||||
// Include server connection
|
||||
include "../server/conn.php";
|
||||
|
||||
if (isset($_POST['submit'])) {
|
||||
// Checking if Username is empty
|
||||
if (empty(trim($_POST["username"]))) {
|
||||
?>
|
||||
<script>
|
||||
sniffleAdd('Who dis?', 'You must enter a username to login!', 'var(--red)', '../assets/icons/cross.svg');
|
||||
</script>
|
||||
<?php
|
||||
} else {
|
||||
$username = trim($_POST["username"]);
|
||||
}
|
||||
|
||||
// Check if Password is empty
|
||||
if (empty(trim($_POST["password"]))) {
|
||||
?>
|
||||
<script>
|
||||
sniffleAdd('Whats the magic word?', 'Pls enter the super duper secrete word(s) to login!', 'var(--red)', '../assets/icons/cross.svg');
|
||||
</script>
|
||||
<?php
|
||||
} else {
|
||||
$password = trim($_POST["password"]);
|
||||
}
|
||||
|
||||
|
||||
// Prepare so SQL doesnt get spooked
|
||||
$sql = "SELECT id, username, password FROM users WHERE username = ?";
|
||||
|
||||
if ($stmt = mysqli_prepare($conn, $sql)) {
|
||||
// Bind dis shit
|
||||
mysqli_stmt_bind_param($stmt, "s", $param_username);
|
||||
|
||||
// Set parameters
|
||||
$param_username = $username;
|
||||
|
||||
// Attempt to execute the prepared statement
|
||||
if (mysqli_stmt_execute($stmt)) {
|
||||
// Store result
|
||||
mysqli_stmt_store_result($stmt);
|
||||
|
||||
// Check if username exists, if yes then verify password
|
||||
if (mysqli_stmt_num_rows($stmt) == 1) {
|
||||
// Bind result variables
|
||||
mysqli_stmt_bind_result($stmt, $id, $username, $hashed_password);
|
||||
if (mysqli_stmt_fetch($stmt)) {
|
||||
if (password_verify($password, $hashed_password)) {
|
||||
// Password is correct, so start a new session
|
||||
session_start();
|
||||
|
||||
// Store data in session variables
|
||||
$_SESSION["loggedin"] = true;
|
||||
$_SESSION["id"] = $id;
|
||||
$_SESSION["username"] = $username;
|
||||
|
||||
// let the user know
|
||||
?>
|
||||
<script>
|
||||
sniffleAdd('O hi <?php echo $_SESSION["username"]; ?>', 'You are now logged in! You will be redirected in a few seconds', 'var(--green)', '../assets/icons/hand-waving.svg');
|
||||
setTimeout(function(){window.location.href = "../index.php?login=success";}, 4000);
|
||||
</script>
|
||||
<?php
|
||||
} else {
|
||||
?>
|
||||
<script>
|
||||
sniffleAdd('Sus', 'Username or Password WRONG, please try again :3', 'var(--red)', '../assets/icons/cross.svg');
|
||||
</script>
|
||||
<?php
|
||||
}
|
||||
}
|
||||
} else {
|
||||
?>
|
||||
<script>
|
||||
sniffleAdd('Sus', 'Username or Password WRONG, please try again :3', 'var(--red)', '../assets/icons/cross.svg');
|
||||
</script>
|
||||
<?php
|
||||
}
|
||||
} else {
|
||||
?>
|
||||
<script>
|
||||
sniffleAdd('woops...', 'Sowwy, something went wrong on our end :c', 'var(--red)', '../assets/icons/cross.svg');
|
||||
</script>
|
||||
<?php
|
||||
}
|
||||
// Close statement
|
||||
mysqli_stmt_close($stmt);
|
||||
}
|
||||
}
|
||||
|
|
@ -338,10 +338,11 @@ nav .btn {
|
|||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: auto;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.tag {
|
||||
margin: 0.25rem;
|
||||
margin: 0 0.5rem 0.5rem 0;
|
||||
padding: 0.5rem;
|
||||
display: block;
|
||||
background-color: #8C977D;
|
||||
|
|
@ -669,7 +670,7 @@ body * {
|
|||
transition: outline 0.1s cubic-bezier(0.19, 1, 0.22, 1);
|
||||
}
|
||||
.btn:hover {
|
||||
outline: #E8E3E3 3px solid;
|
||||
outline: #E8E3E3 0.2rem solid;
|
||||
color: #E8E3E3;
|
||||
}
|
||||
.btn:where(input[type=file])::-webkit-file-upload-button {
|
||||
|
|
@ -759,7 +760,7 @@ br {
|
|||
bottom: 1rem;
|
||||
-o-object-position: center;
|
||||
object-position: center;
|
||||
background-color: #151515;
|
||||
background-color: rgba(21, 21, 21, 0.7333333333);
|
||||
-webkit-backdrop-filter: blur(8px);
|
||||
backdrop-filter: blur(8px);
|
||||
border-radius: 50%;
|
||||
|
|
|
|||
|
|
@ -83,7 +83,7 @@ body {
|
|||
transition: outline 0.1s cubic-bezier(.19, 1, .22, 1);
|
||||
|
||||
&:hover {
|
||||
outline: $white 3px solid;
|
||||
outline: $white 0.2rem solid;
|
||||
color: $fg;
|
||||
}
|
||||
|
||||
|
|
@ -177,7 +177,7 @@ br {
|
|||
|
||||
object-position: center;
|
||||
|
||||
background-color: $bg;
|
||||
background-color: $bg-alt;
|
||||
backdrop-filter: blur(8px);
|
||||
|
||||
border-radius: 50%;
|
||||
|
|
|
|||
|
|
@ -154,10 +154,11 @@
|
|||
|
||||
.tags {
|
||||
@include flexLeft(auto);
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.tag {
|
||||
margin: 0.25rem;
|
||||
margin: 0 0.5rem 0.5rem 0;
|
||||
padding: 0.5rem;
|
||||
|
||||
display: block;
|
||||
|
|
|
|||
Loading…
Reference in a new issue