2022-07-21 14:53:04 +00:00
<! DOCTYPE html >
< html >
2022-08-15 10:56:05 +00:00
2022-07-21 14:53:04 +00:00
< head >
2022-09-13 16:07:01 +00:00
< ? php require_once __DIR__ . " /ui/header.php " ; ?>
2022-07-21 14:53:04 +00:00
</ head >
2022-08-15 10:56:05 +00:00
2022-09-06 16:14:43 +00:00
2022-07-21 14:53:04 +00:00
< body >
2022-08-15 10:56:05 +00:00
< ? php
/*
|-------------------------------------------------------------
| Import Required
|-------------------------------------------------------------
| These are common scripts used across all pages of the
| website . At some point I want the whole website to be only
| one index page . But that ' s going to require many many many
| many rewrites and hours of learning ....
|-------------------------------------------------------------
*/
2022-09-13 16:07:01 +00:00
require_once __DIR__ . " /ui/required.php " ;
require_once __DIR__ . " /ui/nav.php " ;
2022-09-08 13:29:45 +00:00
2022-09-12 14:15:16 +00:00
use App\Account ;
use App\Image ;
2022-08-15 10:56:05 +00:00
2022-09-12 14:15:16 +00:00
$image_info = new Image ;
$user_info = new Account ;
2022-08-15 10:56:05 +00:00
/*
|-------------------------------------------------------------
| Get image ID
|-------------------------------------------------------------
| Image ID should be written in the URL of the page as ? id = 69
| If ID cannot be obtained , give error . ID going here ^^
|-------------------------------------------------------------
*/
if ( isset ( $_GET [ 'id' ]) && is_numeric ( $_GET [ 'id' ])) {
// Get all image info
2022-09-12 14:15:16 +00:00
$image = $image_info -> get_image_info ( $conn , $_GET [ 'id' ]);
2022-08-15 10:56:05 +00:00
// Check if image is avalible
if ( isset ( $image [ 'imagename' ])) {
$image_present = True ;
} else {
?>
< script >
2022-09-12 14:15:16 +00:00
sniffleAdd ( 'Woops' , 'Something happened, either image with the ID <?php echo $_GET[' id ']; ?> was deleted or never existed, either way it could not be found!' , 'var(--red)' , 'assets/icons/cross.svg' );
2022-08-15 10:56:05 +00:00
</ script >
2022-09-12 14:15:16 +00:00
< ? php
2022-08-15 10:56:05 +00:00
$image_present = False ;
}
} else {
?>
< script >
2022-09-12 14:15:16 +00:00
sniffleAdd ( 'Where is da image?' , 'The link you followed seems to be broken, or there was some other error, who knows!' , 'var(--red)' , 'assets/icons/cross.svg' );
2022-08-15 10:56:05 +00:00
</ script >
2022-09-12 14:15:16 +00:00
< ? php
2022-08-15 10:56:05 +00:00
$image_present = False ;
}
/*
|-------------------------------------------------------------
| Image verification
|-------------------------------------------------------------
| Doublechecking if all information on images exists , if yes
| display it , otherwise don ' t display at all or replace with
| blank or filler info
|-------------------------------------------------------------
*/
if ( $image_present ) {
/*
|-------------------------------------------------------------
| Check user details
|-------------------------------------------------------------
*/
if ( isset ( $image [ 'author' ])) {
// Get all information on the user
2022-09-12 14:15:16 +00:00
$user = $user_info -> get_user_info ( $conn , $image [ 'author' ]);
2022-08-15 10:56:05 +00:00
if ( isset ( $user [ 'username' ])) {
$image_author = $user [ 'username' ];
} else {
$image_author = " Deleted User " ;
}
} else {
$image_author = " No author " ;
}
/*
|-------------------------------------------------------------
| Check if image path is good
|-------------------------------------------------------------
*/
if ( isset ( $image [ 'imagename' ])) {
2022-09-07 18:19:17 +00:00
$image_path = " images/ " . $image [ 'imagename' ];
2022-08-15 10:56:05 +00:00
$image_alt = $image [ 'alt' ];
} else {
$image_path = " assets/no_image.png " ;
$image_alt = " No image could be found, sowwy " ;
}
/*
|-------------------------------------------------------------
| If description not set or empty , replace with filler
|-------------------------------------------------------------
*/
if ( ! isset ( $image_alt ) || empty ( $image_alt )) {
$image_alt = " No description avalible " ;
}
} else {
/*
|-------------------------------------------------------------
| Image was not present
|-------------------------------------------------------------
*/
$image_path = " assets/no_image.png " ;
$image_alt = " No image could be found, sowwy " ;
}
/*
|-------------------------------------------------------------
| Check user privilge
|-------------------------------------------------------------
*/
2022-09-12 14:15:16 +00:00
if ( $image_info -> image_privilage ( $image [ 'author' ]) || $user_info -> is_admin ( $_SESSION [ 'id' ])) {
2022-08-15 10:56:05 +00:00
$privilaged = True ;
} else {
$privilaged = False ;
}
2022-09-09 15:37:34 +00:00
if ( is_file ( " images/previews/ " . $image [ 'imagename' ])) {
echo " <div class='image-container'>
< img class = 'image' id = '".$image[' id ']."' src = 'images/previews/".$image[' imagename ']."' alt = '".$image_alt."' >
< button class = 'preview-button' onclick = 'showFull()' > Show full quality </ button >
</ div > " ;
?>
< script >
function showFull () {
document . querySelector ( " .image " ) . style . opacity = 0 ;
document . querySelector ( " .preview-button " ) . style . display = " none " ;
setTimeout ( function (){
document . querySelector ( " .image " ) . src = " <?php echo $image_path ;?> " ;
document . querySelector ( " .image " ) . style . opacity = 1 ;
}, 500 );
}
</ script >
< ? php
} else {
echo " <div class='image-container'>
< img class = 'image' id = '".$image[' id ']."' src = '".$image_path."' alt = '".$image_alt."' >
</ div > " ;
}
2022-08-15 10:56:05 +00:00
/*
|-------------------------------------------------------------
| Start of displaying all info on image
|-------------------------------------------------------------
*/
if ( $image_present ) {
?>
< div class = " image-description default-window " >
< h2 > Description </ h2 >
2022-09-13 13:24:48 +00:00
< p >< ? php echo htmlentities ( $image_alt , ENT_QUOTES ); ?> </p>
2022-08-15 10:56:05 +00:00
</ div >
2022-09-08 19:41:47 +00:00
< div class = " image-detail " >
2022-08-15 10:56:05 +00:00
< h2 > Details </ h2 >
2022-09-08 19:41:47 +00:00
< div >
< div >
< ? php
// User
2022-09-14 18:59:02 +00:00
if ( $user_info -> is_admin ( $image [ 'author' ])) {
echo " <p>Author: " . $image_author . " <img class='svg' style='margin: 0 0 0.1rem 0.2rem;' src='assets/icons/crown-simple.svg'></p> " ;
} else {
echo " <p>Author: " . $image_author . " </p> " ;
}
2022-09-08 19:41:47 +00:00
// Image ID
echo " <p>ID: " . $image [ 'id' ] . " </p> " ;
2022-09-13 13:24:48 +00:00
// Last time image was updated
$update_time = new DateTime ( $image [ 'upload' ]);
echo " <p id='updateTime'>Last updated: " . $update_time -> format ( 'd/m/Y H:i:s T' ) . " </p> " ;
2022-09-08 19:41:47 +00:00
?>
2022-09-13 13:24:48 +00:00
< script >
// Updating time to Viewers local
var updateDate = new Date ( '<?php echo $update_time->format(' m / d / Y H : i : s T '); ?>' );
var format = { year : 'numeric' ,
month : 'short' ,
day : 'numeric' ,
hour : '2-digit' ,
minute : '2-digit'
};
updateDate = updateDate . toLocaleDateString ( 'en-GB' , format );
$ ( " #updateTime " ) . html ( " Last updated: " + updateDate );
</ script >
2022-09-08 19:41:47 +00:00
</ div >
< div >
< ? php
// File name
$image_pathinfo = pathinfo ( $image [ 'imagename' ]);
echo " <p>File Name: " . $image_pathinfo [ 'filename' ] . " </p> " ;
// File extention
echo " <p>File Type: " . pathinfo ( $image [ 'imagename' ], PATHINFO_EXTENSION ) . " </p> " ;
// Image resolution
list ( $width , $height ) = getimagesize ( $image_path );
echo " <p>Image resolution: " . $width . " x " . $height . " </p> " ;
2022-09-09 16:39:22 +00:00
function human_filesize ( $bytes , $decimals = 2 ) {
$sz = 'BKMGTP' ;
$factor = floor (( strlen ( $bytes ) - 1 ) / 3 );
return sprintf ( " %. { $decimals } f " , $bytes / pow ( 1024 , $factor )) . @ $sz [ $factor ];
}
echo " <p>File size: " . human_filesize ( filesize ( $image_path ), 2 ) . " </p> " ;
2022-09-08 19:41:47 +00:00
?>
</ div >
</ div >
2022-08-15 10:56:05 +00:00
< ? php
2022-09-08 19:41:47 +00:00
// Image download
echo " <a class='btn btn-good' href='images/ " . $image [ 'imagename' ] . " ' download=' " . $image [ 'imagename' ] . " '><img class='svg' src='assets/icons/download.svg'>Download image</a> " ;
2022-08-15 10:56:05 +00:00
?>
2022-09-08 19:41:47 +00:00
< button class = 'btn btn-good' onclick = 'copyLink()' >< img class = 'svg' src = 'assets/icons/clipboard-text.svg' > Copy image link </ button >
2022-08-15 10:56:05 +00:00
< script >
function copyLink () {
navigator . clipboard . writeText ( window . location . href );
sniffleAdd ( " Info " , " Link has been copied! " , " var(--green) " , " assets/icons/clipboard-text.svg " );
}
</ script >
</ div >
< div class = " tags-root default-window " >
< h2 > Tags </ h2 >
< div class = " tags " >
< ? php
// Get image tags
if ( isset ( $image [ 'tags' ]) && ! empty ( $image [ 'tags' ])) {
$image_tags_array = explode ( " " , $image [ 'tags' ]);
foreach ( $image_tags_array as $tag ) {
if ( $tag == " nsfw " ) {
2022-09-07 18:19:17 +00:00
echo " <p id='tag' class='tag btn-bad'> " . $tag . " </p> " ;
2022-08-15 10:56:05 +00:00
} else {
2022-09-07 18:19:17 +00:00
echo " <p id='tag' class='tag btn-good'> " . $tag . " </p> " ;
2022-08-15 10:56:05 +00:00
}
}
} else {
echo " <p>No tags present</p> " ;
}
?>
</ div >
</ div >
< ? php
/*
|-------------------------------------------------------------
| Check if user is privilaged ,
|-------------------------------------------------------------
| If yes , grant them access to the Danger zone , or " the place
| that can fuck things up "
|-------------------------------------------------------------
*/
if ( $privilaged ) {
?>
<!-- Danger zone -->
< div class = 'danger-zone flex-down default-window' >
< h2 > Danger zone </ h2 >
<!--
|-------------------------------------------------------------
| Delete
|-------------------------------------------------------------
| sus
| I cannot describe the anxiety this gives me . pls help
|-------------------------------------------------------------
-->
< button id = 'deleteButton' class = 'btn btn-bad' >< img class = 'svg' src = 'assets/icons/trash.svg' > Delete image </ button >
< script >
$ ( '#deleteButton' ) . click ( function () {
var header = " Are you sure? " ;
var description = " Deleting this image is pernament, there is no going back after this!!!!! " ;
var actionBox = " <form id='deleteConfirm' method='POST'> \
2022-09-07 13:40:58 +00:00
< button id = 'deleteSubmit' class = 'btn btn-bad' type = 'submit' >< img class = 'svg' src = 'assets/icons/trash.svg' > Delete image </ button > \
</ form > " ;
2022-08-15 10:56:05 +00:00
flyoutShow ( header , description , actionBox );
$ ( " #deleteConfirm " ) . submit ( function ( event ) {
event . preventDefault ();
var deleteSubmit = $ ( " #deleteSubmit " ) . val ();
2022-09-09 11:41:41 +00:00
$ ( " #sniffle " ) . load ( " app/image/image.php " , {
2022-08-15 10:56:05 +00:00
id : < ? php echo $_GET [ 'id' ]; ?> ,
2022-09-09 11:41:41 +00:00
submit_delete : deleteSubmit
2022-08-15 10:56:05 +00:00
});
});
});
</ script >
<!--
|-------------------------------------------------------------
| Edit Description
|-------------------------------------------------------------
| Most people reading through the code will probably say how
| shit it is . YOU HAVE NO FUCKING CLUE HOW LONG THIS TOOK ME
| TO FIGURE OUT . i hate js .
|-------------------------------------------------------------
-->
< button id = 'descriptionButton' class = 'btn btn-bad' >< img class = 'svg' src = 'assets/icons/edit.svg' > Edit description </ button >
< script >
$ ( '#descriptionButton' ) . click ( function () {
var header = " Enter new Description/Alt " ;
var description = " Whatcha gonna put in there 👀 " ;
var actionBox = " <form id='descriptionConfirm' action='app/image/edit_description.php' method='POST'> \
2022-09-07 13:40:58 +00:00
< textarea id = 'descriptionInput' class = 'btn btn-neutral space-bottom' placeholder = 'Description/Alt for image' rows = '3' ></ textarea > \
< button id = 'descriptionSubmit' class = 'btn btn-bad' type = 'submit' >< img class = 'svg' src = 'assets/icons/edit.svg' > Update information </ button > \
</ form > " ;
2022-08-15 10:56:05 +00:00
flyoutShow ( header , description , actionBox );
2022-09-13 13:24:48 +00:00
$ ( '#descriptionInput' ) . val ( " <?php echo str_replace(' " ', ' \ " ', $image_alt ); ?> " );
2022-08-15 10:56:05 +00:00
$ ( " #descriptionConfirm " ) . submit ( function ( event ) {
event . preventDefault ();
var descriptionInput = $ ( " #descriptionInput " ) . val ();
var descriptionSubmit = $ ( " #descriptionSubmit " ) . val ();
2022-09-09 11:41:41 +00:00
$ ( " #sniffle " ) . load ( " app/image/image.php " , {
2022-08-15 10:56:05 +00:00
id : < ? php echo $_GET [ 'id' ]; ?> ,
input : descriptionInput ,
2022-09-09 11:41:41 +00:00
submit_description : descriptionSubmit
2022-08-15 10:56:05 +00:00
});
});
});
</ script >
<!--
|-------------------------------------------------------------
| Edit Tags
|-------------------------------------------------------------
| Literally no amount of work will get tags / lists to play well
| with SQL so I gave up and made my own shitty system . It
| works but once I re - add the search function this will make
| anyone cry . I am so sorry .
|-------------------------------------------------------------
-->
< button id = 'tagsButton' class = 'btn btn-bad' >< img class = 'svg' src = 'assets/icons/tag.svg' > Add image tags </ button >
< script >
$ ( '#tagsButton' ) . click ( function () {
var header = " Tags " ;
2022-09-14 19:43:43 +00:00
var description = " Tags are seperated by spaces, only alowed characters are a-z and underscores, all hyphens are converted to underscores. There are also special tags such as nsfw that'll blur images in the overview " ;
2022-08-15 10:56:05 +00:00
var actionBox = " <form id='tagsConfirm' action='app/image/edit_tags.php' method='POST'> \
2022-09-07 13:40:58 +00:00
< textarea id = 'tagsInput' class = 'btn btn-neutral space-bottom' placeholder = 'Tags are seperated by spaces' row = '3' ></ textarea > \
< button id = 'tagsSubmit' class = 'btn btn-bad' type = 'submit' >< img class = 'svg' src = 'assets/icons/edit.svg' > Edit tags </ button > \
</ form > " ;
2022-08-15 10:56:05 +00:00
flyoutShow ( header , description , actionBox );
2022-09-07 13:40:58 +00:00
$ ( '#tagsInput' ) . val ( " <?php echo $image['tags'] ; ?> " );
2022-09-07 11:00:53 +00:00
2022-08-15 10:56:05 +00:00
$ ( " #tagsConfirm " ) . submit ( function ( event ) {
event . preventDefault ();
var tagsInput = $ ( " #tagsInput " ) . val ();
var tagsSubmit = $ ( " #tagsSubmit " ) . val ();
2022-09-09 11:41:41 +00:00
$ ( " #sniffle " ) . load ( " app/image/image.php " , {
2022-08-15 10:56:05 +00:00
id : < ? php echo $_GET [ 'id' ]; ?> ,
input : tagsInput ,
2022-09-09 11:41:41 +00:00
submit_tags : tagsSubmit
2022-08-15 10:56:05 +00:00
});
});
});
</ script >
<!--
|-------------------------------------------------------------
| Edit Author
|-------------------------------------------------------------
| You must be a super cool person to see this section ; 3
|-------------------------------------------------------------
-->
< ? php
2022-09-12 14:15:16 +00:00
if ( $user_info -> is_admin ( $_SESSION [ 'id' ])) {
2022-08-15 10:56:05 +00:00
?>
< button id = 'authorButton' class = 'btn btn-bad' >< img class = 'svg' src = 'assets/icons/edit.svg' > Edit author </ button >
< script >
$ ( '#authorButton' ) . click ( function () {
var header = " Who owns the image????? " ;
var description = " Enter ID of image owner " ;
var actionBox = " <form id='authorConfirm' action='app/image/edit_author.php' method='POST'> \
2022-09-07 13:40:58 +00:00
< input id = 'authorInput' class = 'btn btn-neutral space-bottom' type = 'text' placeholder = 'le author' > \
< button id = 'authorSubmit' class = 'btn btn-bad' type = 'submit' >< img class = 'svg' src = 'assets/icons/edit.svg' > Edit author </ button > \
</ form > " ;
2022-08-15 10:56:05 +00:00
flyoutShow ( header , description , actionBox );
$ ( " #authorConfirm " ) . submit ( function ( event ) {
event . preventDefault ();
var authorInput = $ ( " #authorInput " ) . val ();
var authorSubmit = $ ( " #authorSubmit " ) . val ();
2022-09-09 11:41:41 +00:00
$ ( " #sniffle " ) . load ( " app/image/image.php " , {
2022-08-15 10:56:05 +00:00
id : < ? php echo $_GET [ 'id' ]; ?> ,
input : authorInput ,
2022-09-09 11:41:41 +00:00
submit_author : authorSubmit
2022-08-15 10:56:05 +00:00
});
});
});
</ script >
< ? php
}
echo " </div> " ;
}
/*
|-------------------------------------------------------------
| End of displaying all user info
|-------------------------------------------------------------
*/
}
?>
2022-09-13 16:07:01 +00:00
< ? php require_once __DIR__ . " /ui/footer.php " ; ?>
2022-07-21 14:53:04 +00:00
</ body >
2022-08-15 10:56:05 +00:00
2022-08-12 11:28:19 +00:00
</ html >