mirror of
https://github.com/Fluffy-Bean/image-gallery.git
synced 2024-12-29 10:56:12 +00:00
Added search function
This commit is contained in:
parent
b54fdbf81e
commit
23c54d6bd7
1
assets/icons/binoculars.svg
Normal file
1
assets/icons/binoculars.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="192" height="192" fill="#e8e3e3" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"></rect><line x1="104" y1="92" x2="152" y2="92" fill="none" stroke="#e8e3e3" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></line><path d="M229.6,154.3,185.9,55A24.1,24.1,0,0,0,152,55V168" fill="none" stroke="#e8e3e3" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></path><path d="M104,168V55a24.1,24.1,0,0,0-33.9,0L26.4,154.3" fill="none" stroke="#e8e3e3" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></path><circle cx="64" cy="168" r="40" fill="none" stroke="#e8e3e3" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></circle><circle cx="192" cy="168" r="40" fill="none" stroke="#e8e3e3" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></circle></svg>
|
After Width: | Height: | Size: 887 B |
|
@ -369,6 +369,8 @@ form * {
|
|||
|
||||
border: none;
|
||||
border-radius: var(--rad);
|
||||
|
||||
transition: outline 0.1s cubic-bezier(.19,1,.22,1);
|
||||
}
|
||||
.btn:hover {
|
||||
outline: var(--white) 3px solid;
|
||||
|
|
17
image.php
17
image.php
|
@ -61,8 +61,19 @@ if (isset($image['author'])) {
|
|||
<link href="https://fonts.googleapis.com/css2?family=Rubik" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@600&display=swap">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&display=swap">
|
||||
<?php echo "<meta property='og:image' content='https://superdupersecteteuploadtest.fluffybean.gay/".$image_path."'/>"; ?>
|
||||
<?php echo "<meta itemprop='image' content='https://superdupersecteteuploadtest.fluffybean.gay/".$image_path."'/>"; ?>
|
||||
<!-- Rich preview -->
|
||||
<meta property="og:type" content="object">
|
||||
<meta property="og:title" content="Only Legs">
|
||||
<?php echo "<meta property='og:image' content='https://superdupersecteteuploadtest.fluffybean.gay/".$image_path."'/>";
|
||||
|
||||
list($meta_width, $meta_height) = getimagesize($image_path);
|
||||
echo "<meta property='og:image:width' content='".$meta_width."'/>";
|
||||
echo "<meta property='og:image:height' content='".$meta_height."'/>";
|
||||
|
||||
echo "<meta property='og:image:alt' content='".$image['alt']."'/>"?>
|
||||
<meta property="og:site_name" content="Only Legs">
|
||||
<meta property="og:url" content="https://superdupersecteteuploadtest.fluffybean.gay">
|
||||
<meta property="og:description" content="Only Legs, a gallery made and hosted by Fluffy">
|
||||
</head>
|
||||
<body>
|
||||
<?php
|
||||
|
@ -202,7 +213,7 @@ if (isset($image['author'])) {
|
|||
// Clean tags before adding
|
||||
function clean($string) {
|
||||
// Change to lowercase
|
||||
$tags_string = strtolower($tags_string);
|
||||
$string = strtolower($string);
|
||||
// Replace hyphens
|
||||
$string = str_replace('-', '_', $string);
|
||||
// Regex
|
||||
|
|
90
index.php
90
index.php
|
@ -13,6 +13,9 @@
|
|||
<?php
|
||||
include("ui/header.php");
|
||||
|
||||
// Include flyout for extra actions
|
||||
include("ui/flyout.php");
|
||||
|
||||
// Deletion toast
|
||||
if ($_GET["del"] == "true") {
|
||||
echo "<p class='alert alert-high space-bottom'>Successfully deleted image: ".$_GET['id']."</p>";
|
||||
|
@ -22,6 +25,45 @@
|
|||
if ($_GET["login"] == "success") {
|
||||
echo "<p class='alert alert-high space-bottom'>O hi ".$_SESSION['username']."</p>";
|
||||
}
|
||||
|
||||
// Show search
|
||||
if ($_GET["srch"] == "show") {
|
||||
$header = "Search for a tags!";
|
||||
$content = "Here you can search for funnies! Like raccoons!!!!!!!!!";
|
||||
$action = "<form class='flex-down between' method='POST' enctype='multipart/form-data'>
|
||||
<input class='btn alert-default space-bottom' type='text' name='search' placeholder='👀'>
|
||||
<button class='btn alert-high' type='submit' name='search_confirm' value=''><img class='svg' src='assets/icons/binoculars.svg'>Search</button>
|
||||
</form>";
|
||||
|
||||
flyout($header, $content, $action);
|
||||
}
|
||||
/*
|
||||
Search Confirm
|
||||
*/
|
||||
if (isset($_POST['search_confirm'])) {
|
||||
// Unset all the variables, needed by flyout
|
||||
unset($header, $content, $action);
|
||||
|
||||
// Clean tags before adding
|
||||
function clean($string) {
|
||||
// Change to lowercase
|
||||
$string = strtolower($string);
|
||||
// Replace hyphens
|
||||
$string = str_replace('-', '_', $string);
|
||||
// Regex
|
||||
$string = preg_replace('/[^A-Za-z0-9\_ ]/', '', $string);
|
||||
// Return string
|
||||
return preg_replace('/ +/', ' ', $string);
|
||||
}
|
||||
|
||||
// Clean input
|
||||
$tags_string = clean(trim($_POST['search']));
|
||||
|
||||
header("Location:https://superdupersecteteuploadtest.fluffybean.gay?q=".$tags_string);
|
||||
}
|
||||
if (isset($_GET["q"])) {
|
||||
echo "<p class='alert alert-high space-bottom'>Search results for: ".$_GET['q']."</p>";
|
||||
}
|
||||
?>
|
||||
|
||||
<div class="info-text center">
|
||||
|
@ -47,22 +89,50 @@
|
|||
$image_request = mysqli_query($conn, "SELECT * FROM swag_table");
|
||||
|
||||
while ($image = mysqli_fetch_array($image_request)) {
|
||||
// Getting thumbnail
|
||||
if (file_exists("images/thumbnails/".$image['imagename'])) {
|
||||
$image_path = "images/thumbnails/".$image['imagename'];
|
||||
} else {
|
||||
$image_path = "images/".$image['imagename'];
|
||||
}
|
||||
// If search is set
|
||||
if (isset($_GET['q']) && !empty($_GET['q'])) {
|
||||
// Make search into an array
|
||||
$search_array = explode(" ", $_GET['q']);
|
||||
|
||||
// Image loading
|
||||
echo "<div class='gallery-item'>";
|
||||
echo "<a href='https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$image['id']."'><img class='gallery-image' loading='lazy' src='".$image_path."' id='".$image['id']."'></a>";
|
||||
echo "</div>";
|
||||
// Get images tags for comparing
|
||||
$image_tag_array = explode(" ", $image['tags']);
|
||||
|
||||
// Compare arrays
|
||||
$compare_results = array_intersect($image_tag_array, $search_array);
|
||||
if (count($compare_results) > 0) {
|
||||
// Getting thumbnail
|
||||
if (file_exists("images/thumbnails/".$image['imagename'])) {
|
||||
$image_path = "images/thumbnails/".$image['imagename'];
|
||||
} else {
|
||||
$image_path = "images/".$image['imagename'];
|
||||
}
|
||||
|
||||
// Image loading
|
||||
echo "<div class='gallery-item'>";
|
||||
echo "<a href='https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$image['id']."'><img class='gallery-image' loading='lazy' src='".$image_path."' id='".$image['id']."'></a>";
|
||||
echo "</div>";
|
||||
}
|
||||
} else {
|
||||
// Getting thumbnail
|
||||
if (file_exists("images/thumbnails/".$image['imagename'])) {
|
||||
$image_path = "images/thumbnails/".$image['imagename'];
|
||||
} else {
|
||||
$image_path = "images/".$image['imagename'];
|
||||
}
|
||||
|
||||
// Image loading
|
||||
echo "<div class='gallery-item'>";
|
||||
echo "<a href='https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$image['id']."'><img class='gallery-image' loading='lazy' src='".$image_path."' id='".$image['id']."'></a>";
|
||||
echo "</div>";
|
||||
}
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
// Must be included with flyout.php
|
||||
echo "<script src='scripts/flyout.js'></script>";
|
||||
|
||||
include("ui/top.html");
|
||||
include("ui/footer.php");
|
||||
?>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
console.log(" . . /|/| . . . . . . . \n .. /0 0 \\ . . . . . .. \n (III% . \\________, . . \n .. .\\_, .%###%/ \\'\\,.. \n . . . .||#####| |'\\ \\. \n .. . . ||. . .|/. .\\V. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . cc/ . .cc/ . . .")
|
||||
console.log(" . . /|/| . . . . . . . \n .. /0 0 \\ . . . . . .. \n (III% . \\________, . . \n .. .\\_, .%###%/ \\'\\,.. \n . . . .||#####| |'\\ \\. \n .. . . ||. . .|/. .\\V. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . .|| . . || . . . \n .. . . ||. . .||. . .. \n . . . cc/ . .cc/ . . .");
|
||||
|
||||
let show = document.querySelectorAll(".flyout-display");
|
||||
let hide = document.querySelector(".flyout-close");
|
||||
|
|
|
@ -19,7 +19,7 @@ function flyout($flyout_header, $flyout_content, $flyout_action) {
|
|||
}
|
||||
|
||||
// Exit button + Div End
|
||||
echo "<button class='btn alert-default space-top flyout-close'>Cancel</button>
|
||||
echo "<button class='btn alert-default space-top flyout-close'>Close</button>
|
||||
</div>";
|
||||
}
|
||||
?>
|
||||
|
|
|
@ -16,6 +16,8 @@ if (is_dir("assets/icons/")) {
|
|||
<?php
|
||||
echo "<a class='btn alert-default' href='https://superdupersecteteuploadtest.fluffybean.gay'><img class='svg' src='".$dir."house.svg'><span class='nav-hide'>Home</span></a>";
|
||||
echo "<hr>";
|
||||
echo "<a class='btn alert-default flyout-display' href='https://superdupersecteteuploadtest.fluffybean.gay?srch=show'><img class='svg' src='".$dir."binoculars.svg'><span class='nav-hide'>Search</span></a>";
|
||||
echo "<hr>";
|
||||
|
||||
if (isset($_SESSION["username"])) {
|
||||
echo "<a class='btn alert-default' href='https://superdupersecteteuploadtest.fluffybean.gay/upload.php'><img class='svg' src='".$dir."upload.svg'><span class='nav-hide'>Upload</span></a>";
|
||||
|
|
Loading…
Reference in a new issue