failed-galleries/php-gallery
1
0
Fork 0
mirror of https://github.com/Fluffy-Bean/image-gallery.git synced 2025-01-29 17:28:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

The process of suffering ended, fixed flyout scripts

Browse source
This commit is contained in:
Michał 2022-07-30 11:41:37 +01:00
parent dc80b37790
commit f8585feb25
4 changed files with 112 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
css/master.css
View file

@ -42,6 +42,8 @@ html {
background-attachment: fixed;
scroll-behavior: smooth;
overflow: auto;
}
body {
margin: 0 auto; padding: 1rem;

134
image.php
View file

@ -14,13 +14,20 @@
include("ui/header.php");
include_once("ui/conn.php");
// Update toast
// Include flyout for extra actions
include("ui/flyout.php");
/*
If theres a success in updating the image,
it'll let the user know
*/
if ($_GET["update"] == "success") {
echo "<p class='alert alert-high space-bottom-large'>Information updated</p>";
} elseif ($_GET["update"] == "skip") {
echo "<p class='alert alert-default space-bottom-large'>No alt, skip</p>";
}
// If ID present pull all image data
if (isset($_GET['id'])) {
$get_image = "SELECT * FROM swag_table WHERE id = ".$_GET['id'];
@ -49,12 +56,83 @@
$image_alt = "No image could be found, sowwy";
}
// Get all user details
if (isset($image['author'])) {
$get_user = "SELECT * FROM users WHERE id = ".$image['author'];
$user_results = mysqli_query($conn, $get_user);
$user = mysqli_fetch_assoc($user_results);
} else
}
/*
Check if the user is an admin session id = 1
Or the owner of the image, image author == session id
This may not be the best system of doing this, but much better than not having it at all
I plan on adding an array of privilaged users that user with the id of 1 can modify,
sort of like a mod/admin list of users
*/
if (isset($_SESSION['id']) && $image['author'] == $_SESSION['id'] || $_SESSION['id'] == 1) {
$privilaged = True;
} else {
$privilaged = False;
}
/*
Delete flyout
This goes with the confirm script below, to use flyout, you must include the js script and php function
*/
if (isset($_POST['delete_flyout']) && $privilaged) {
$header = "Are you sure?";
$content = "Deleting this image is pernament, there is no going back after this!!!!!";
$action = "<form method='POST' enctype='multipart/form-data'>
<button class='btn alert-low' type='submit' name='delete_confirm' value='".$image['id']."'><img class='svg' src='assets/icons/trash.svg'>Delete image</button>
</form>";
flyout($header, $content, $action);
}
/*
Confirm deleting user
user must be privilaged to do this action this the privilaged == true
*/
if (isset($_POST['delete_confirm']) && $privilaged) {
// Unset all the variables, needed by flyout
unset($header, $content, $action);
// Delete from table
$image_delete_request = "DELETE FROM swag_table WHERE id =".$image['id'];
$image_delete = mysqli_query($conn,$image_delete_request);
if ($image_delete) {
// See if image is in the directory
if (is_file("images/".$image['imagename'])) {
unlink("images/".$image['imagename']);
}
// Delete thumbnail if exitsts
if (is_file("images/thumbnails/".$image['imagename'])) {
unlink("images/thumbnails/".$image['imagename']);
}
header("Location:index.php?del=true&id=".$image['id']);
} else {
$error = "Could not delete image";
}
}
/*
Test flyout button
*/
if (isset($_POST['test_flyout'])) {
$header = "Sus";
$content = "This is a test UwU. You are currently viewing image: ".$_GET['id'];
$action = "<a class='btn alert-high'>This button does nothing!</a> <a class='btn alert-low space-top-small'>I'm another button, but scawwy</a>";
flyout($header, $content, $action);
}
?>
<div class="image-container">
@ -108,8 +186,9 @@
// Flyout test button
?>
<form method='POST'>
<button class='btn alert-high space-top flyout-display' type='submit' name='test_flyout'>Test button</button>
</form>
</div>
<div class="tags-root default-window">
@ -135,58 +214,25 @@
<?php
// Check if user is admin or the owner of image, if yes, display the edit and delete div
if (isset($_SESSION['id']) && $image['author'] == $_SESSION['id'] || $_SESSION['id'] == 1) {
// Deleting image
if (isset($_POST['delete'])) {
// Delete from table
$image_delete_request = "DELETE FROM swag_table WHERE id =".$image['id'];
$image_delete = mysqli_query($conn,$image_delete_request);
if ($image_delete) {
// See if image is in the directory
if (is_file("images/".$image['imagename'])) {
unlink("images/".$image['imagename']);
}
// Delete thumbnail if exitsts
if (is_file("images/thumbnails/".$image['imagename'])) {
unlink("images/thumbnails/".$image['imagename']);
}
header("Location:index.php?del=true&id=".$image['id']);
} else {
$error = "Could not delete image";
}
}
if ($privilaged) {
// Danger zone
echo "<div class='danger-zone flex-down default-window'>
<h2>Danger zone</h2>";
// Delete button
?>
// Delete Button
echo "<form method='POST'>
<button class='btn alert-low space-top flyout-display' type='submit' name='delete_flyout'><img class='svg' src='assets/icons/trash.svg'>Delete image</button>
</form>";
<button class="btn alert-low space-top flyout-display" onClick=" <?php
$flyout_header = "Are you sure?";
$flyout_content = "Deleting this image is pernament, there is no going back after this!!!!!";
$flyout_interaction = "<form class='detail' method='POST' enctype='multipart/form-data'>
<button class='btn alert-low' type='submit' name='delete' value='".$image['id']."'><img class='svg' src='assets/icons/trash.svg'>Delete image</button>
</form>";
?> ">Delete image</button>
<?php
// Edit image button
echo "<a class='btn alert-low space-top-small' href='https://superdupersecteteuploadtest.fluffybean.gay/edit.php?id=".$image['id']."'><img class='svg' src='assets/icons/edit.svg'>Modify image content</a>";
echo "</div>";
}
?>
<button class="btn alert-high space-top flyout-display" onClick=" <?php
$flyout_header = "Sus";
$flyout_content = "This is a test UwU. You are currently viewing image: ".$_GET['id'];
$flyout_interaction = "<a class='btn alert-high'>This button does nothing!</a> <a class='btn alert-low space-top-small'>I'm another button, but scawwy</a>";
?> ">Test button</button>
<?php
include_once("ui/flyout.php");
// Must be included with flyout.php
echo "<script src='scripts/flyout.js'></script>";
include("ui/top.html");
include("ui/footer.php");

14
scripts/flyout.js
View file

@ -1,20 +1,14 @@
let show = document.querySelectorAll(".flyout-display");
let hide = document.querySelector(".flyout-close");
show.forEach((pain) => {
pain.addEventListener("click", function(){
document.querySelector("html").style.overflow= "hidden";
document.querySelector(".flyout").style.transform= "translateX(-50%) scale(1)";
document.querySelector(".flyout").style.bottom= "-1rem";
document.querySelector(".flyout-dim").style.display= "block";
});
show.forEach(function(){
document.querySelector(".flyout").style.transform= "translateX(-50%) scale(1)";
document.querySelector(".flyout").style.bottom= "-1rem";
document.querySelector(".flyout-dim").style.display= "block";
});
hide.addEventListener("click", function(){
document.querySelector("html").style.overflow= "auto";
document.querySelector(".flyout").style.transform= "translateX(-50%) scale(0.8)";
document.querySelector(".flyout").style.bottom= "-20rem";
document.querySelector(".flyout-dim").style.display= "none";

33
ui/flyout.php
View file

@ -1,26 +1,25 @@
<div class="flyout-dim">
</div>
<div class="flyout flex-down default-window between">
<?php
<?php
function flyout($flyout_header, $flyout_description, $flyout_action) {
// Used for background dimming
echo "<div class='flyout-dim'></div>";
// Div Start
echo "<div class='flyout flex-down default-window between'>";
// Header for the flyout, must be included
if (isset($flyout_header) && !empty($flyout_header)) {
echo "<h2 class='space-bottom'>".$flyout_header."</h2>";
} else {
echo "<h2 class='space-bottom'>Missing Header</h2>";
}
// Flyout content, must be included!!!!
if (isset($flyout_content) && !empty($flyout_content)) {
echo "<p class='space-bottom'>".$flyout_content."</p>";
} else {
echo "<p class='space-bottom'>This is just being tested as a better alternative to some things, sowwy!</p>";
}
// Flyout button, not required so must need more information when added
if (isset($flyout_action) && !empty($flyout_action)) {
echo $flyout_action;
}
// Flyout button, not required so must need more information when added
if (isset($flyout_interaction) && !empty($flyout_interaction)) {
echo $flyout_interaction;
}
?>
<a class="btn alert-default space-top flyout-close">Cancel</a>
</div>
<script src="scripts/flyout.js"></script>
// Exit button + Div End
echo "<button class='btn alert-default space-top flyout-close'>Cancel</button>
</div>";
}
?>