AJAX rewrite

This commit is contained in:
Michał 2022-08-03 17:46:50 +01:00
parent d003fbdf1e
commit dc89737cfc
16 changed files with 689 additions and 184 deletions

View file

@ -1,16 +1,26 @@
<?php include "ui/required.php"; ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gallery</title>
<link rel="stylesheet" href="../css/master.css">
<link href="https://fonts.googleapis.com/css2?family=Rubik" rel="stylesheet">
<title>Lynx Gallery</title>
<!-- Google Fonts -->
<link rel="stylesheet" href="css/master.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@600&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&amp;display=swap">
<!-- JQuery -->
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
</script>
</head>
<body>
<?php include("../ui/header.php"); ?>
<?php include "ui/nav.php"; ?>
<div class="about-root default-window">
<h2 id="about">What is Fluffys Amazing Gallery?</h2>
@ -31,8 +41,8 @@
</div>
<?php
include("../ui/top.html");
include("../ui/footer.php");
include "ui/top.html";
include "ui/footer.php";
?>
</body>
</html>

View file

@ -1,18 +1,27 @@
<?php include "../ui/required.php"; ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Account</title>
<title>Lynx Gallery</title>
<!-- Google Fonts -->
<link rel="stylesheet" href="../css/master.css">
<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&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&amp;display=swap">
<!-- JQuery -->
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
</script>
</head>
<body>
<?php
include "../ui/required.php";
include("../ui/header.php");
include "../ui/nav.php";
?>
<div class="account-root default-window">
@ -46,8 +55,8 @@
</div>
<?php
include("../ui/top.html");
include("../ui/footer.php");
include "../ui/top.html";
include "../ui/footer.php";
?>
</body>
</html>

View file

@ -1,18 +1,27 @@
<?php include "../ui/required.php"; ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login</title>
<title>Lynx Gallery</title>
<!-- Google Fonts -->
<link rel="stylesheet" href="../css/master.css">
<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&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&amp;display=swap">
<!-- JQuery -->
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
</script>
</head>
<body>
<?php
include "../ui/required.php";
include("../ui/header.php");
include "../ui/nav.php";
// Initialize the session
session_start();
@ -116,8 +125,8 @@
</div>
<?php
include("../ui/top.html");
include("../ui/footer.php");
include "../ui/top.html";
include "../ui/footer.php";
?>
</body>
</html>

View file

@ -1,18 +1,27 @@
<?php include "../ui/required.php"; ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Account</title>
<title>Lynx Gallery</title>
<!-- Google Fonts -->
<link rel="stylesheet" href="../css/master.css">
<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&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&amp;display=swap">
<!-- JQuery -->
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
</script>
</head>
<body>
<?php
include "../ui/required.php";
include("../ui/header.php");
include "../ui/nav.php";
// Initialize the session
session_start();
@ -95,8 +104,8 @@
</div>
<?php
include("../ui/top.html");
include("../ui/footer.php");
include "../ui/top.html";
include "../ui/footer.php";
?>
</body>
</html>

View file

@ -1,18 +1,27 @@
<?php include "../ui/required.php"; ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sign Up</title>
<title>Lynx Gallery</title>
<!-- Google Fonts -->
<link rel="stylesheet" href="../css/master.css">
<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&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&amp;display=swap">
<!-- JQuery -->
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
</script>
</head>
<body>
<?php
include "../ui/required.php";
include("../ui/header.php");
include "../ui/nav.php";
// Validate susness of Username
if (isset($_POST['signup'])) {
@ -181,8 +190,8 @@
</div>
<?php
include("../ui/top.html");
include("../ui/footer.php");
include "../ui/top.html";
include "../ui/footer.php";
?>
</body>
</html>

View file

@ -1,3 +1,12 @@
/*
Normalize CSS
This ensures that the website looks the same across all devices
and browsers, regardless if I waisted my time making a tag look
good or not
*/
@import "normalize.css";
@import "nav.css";
@import "footer.css";
@ -321,8 +330,14 @@ body {
/*
-=-=-= ALERT =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
*/
.alert-banner {
margin: 0; padding: 0;
/*
Notification system
This is the notification system used by the website. Probably a little too much for what its used for
*/
.notify-root {
margin: 0; padding: 1rem;
max-width: 621px; width: calc(100% - 2rem);
height: auto;
@ -330,7 +345,19 @@ body {
top: 1rem; left: 50%;
transform: translateX(-50%);
position: fixed; z-index: 9999999;
position: fixed; z-index: 999;
}
.notify {
margin-bottom: 1rem; padding: 0.5rem;
width: auto;
text-align: center;
display: block;
border-radius: var(--rad);
outline: 0.5rem solid var(--bg);
}
.alert {

View file

@ -19,7 +19,7 @@ nav {
box-shadow: var(--shadow);
}
nav h3 {
nav p {
margin: 0;
vertical-align: middle;
}
@ -29,7 +29,7 @@ nav hr {
opacity: 0;
}
.nav-name h3, .nav-name {
.nav-name p, .nav-name {
display: block;
}
.nav-links {
@ -37,7 +37,7 @@ nav hr {
justify-content: space-between;
}
@media (max-width: 800px) {
.nav-name h3, .nav-name hr, .nav-name {
.nav-name p, .nav-name hr, .nav-name {
display: none;
}
.nav-links {

349
css/normalize.css vendored Normal file
View file

@ -0,0 +1,349 @@
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
margin: 0;
}
/**
* Render the `main` element consistently in IE.
*/
main {
display: block;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}

165
image.php
View file

@ -1,25 +1,101 @@
<?php
// 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
echo "<h2 class='space-bottom'>Header</h2>";
// Flyout content, must be included!!!!
echo "<p class='space-bottom'>Description</p>";
// Flyout button, not required so must need more information when added
echo $action;
// Exit button + Div End
echo "<button class='btn alert-default space-top flyout-close'>Close</button>
</div>";
// Must be included with flyout.php
echo "<script src='scripts/flyout.js'></script>";
?>
<?php
include "ui/required.php";
/*
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'])) {
// Get all image info
$image = get_image_info($conn, $_GET['id']);
// Check if image is avalible
if (isset($image['imagename'])) {
// Display image
$image_path = "images/".$image['imagename'];
$image_alt = $image['alt'];
} else {
// ID not avalible toast
echo "<p class='alert alert-low space-bottom-large'>Could not find image with ID: ".$_GET['id']."</p>";
// Replacement "no image" image and description
$image_path = "assets/no_image.png";
$image_alt = "No image could be found, sowwy";
}
} else {
// No ID toast
//echo "<p class='alert alert-low space-bottom-large'>No ID present</p>";
// Replacement "no image" image and description
//$image_path = "assets/no_image.png";
//$image_alt = "No image could be found, sowwy";
}
/*
Get all user details
This gets the user info from the image
*/
if (isset($image['author'])) {
$user = get_user_info($conn, $image['author']);
}
/*
Check user privilge
This requires the user to be logged in or an admin
*/
if (image_privilage($image['author']) || is_admin($_SESSION['id'])) {
$privilaged = True;
} else {
$privilaged = False;
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gallery</title>
<title>Lynx Gallery</title>
<!-- Google Fonts -->
<link rel="stylesheet" href="css/master.css">
<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&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&amp;display=swap">
<!-- Rich preview -->
<meta property="og:type" content="object">
<meta property="og:title" content="Only Legs">
<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">
<!-- JQuery -->
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
</script>
</head>
<body>
<?php
include "ui/required.php";
include("ui/header.php");
?>
<?php include"ui/nav.php"; ?>
<div class="alert-banner">
<?php
@ -36,50 +112,11 @@
echo notify("Failed to delete image", "low");
}
?>
<p class='alert alert-high space-bottom-large' onclick='closeAlert(this)'></p>
<script src='scripts/alert.js'></script>
</div>
<?php
// If ID present pull all image data
if (isset($_GET['id'])) {
$image = get_image_info($conn, $_GET['id']);
// Check if image is avalible
if (isset($image['imagename'])) {
// Display image
$image_path = "images/".$image['imagename'];
$image_alt = $image['alt'];
} else {
// ID not avalible toast
echo "<p class='alert alert-low space-bottom-large'>Could not find image with ID: ".$_GET['id']."</p>";
// Replacement "no image" image and description
$image_path = "assets/no_image.png";
$image_alt = "No image could be found, sowwy";
}
} else {
// No ID toast
echo "<p class='alert alert-low space-bottom-large'>No ID present</p>";
// Replacement "no image" image and description
$image_path = "assets/no_image.png";
$image_alt = "No image could be found, sowwy";
}
// Get all user details
if (isset($image['author'])) {
$user = get_user_info($conn, $image['author']);
}
// Check user privilge
if (image_privilage($image['author']) || is_admin($_SESSION['id'])) {
$privilaged = True;
} else {
$privilaged = False;
}
/*
Delete flyout
@ -155,9 +192,9 @@
// Attempt to execute the prepared statement
if (mysqli_stmt_execute($stmt)) {
header("Location:https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$image["id"]."&update=success");
header("Location:image.php?id=".$image["id"]."&update=success");
} else {
header("Location:https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$image["id"]."&update=error");
header("Location:image.php?id=".$image["id"]."&update=error");
}
}
}
@ -210,9 +247,9 @@
// Attempt to execute the prepared statement
if (mysqli_stmt_execute($stmt)) {
header("Location:https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$image["id"]."&update=success");
header("Location:image.php?id=".$image["id"]."&update=success");
} else {
header("Location:https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$image["id"]."&update=error");
header("Location:image.php?id=".$image["id"]."&update=error");
}
}
}
@ -250,9 +287,9 @@
// Attempt to execute the prepared statement
if (mysqli_stmt_execute($stmt)) {
header("Location:https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$image["id"]."&update=success");
header("Location:image.php?id=".$image["id"]."&update=success");
} else {
header("Location:https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$image["id"]."&update=error");
header("Location:image.php?id=".$image["id"]."&update=error");
}
}
}
@ -265,6 +302,7 @@
?>
</div>
<div class="image-description default-window">
<h2>Description</h2>
<?php
@ -277,6 +315,7 @@
?>
</div>
<div class="image-detail flex-down default-window">
<h2>Details</h2>
<?php
@ -362,8 +401,10 @@
// Edit authro
if (is_admin($_SESSION['id'])) {
echo "<form method='POST'>
<button class='btn alert-low space-top-small flyout-display' type='submit' name='author_flyout'><img class='svg' src='assets/icons/edit.svg'>Edit author</button>
echo "<form id='author_form' method='POST' action='ui/image_interaction.php'>
<input id='author_header' type='hidden' name='header' value='Who owns the image?????'>
<input id='author_description' type='hidden' name='description' value='Enter ID of image owner'>
<button id='author_submit' class='btn alert-low space-top-small flyout-display' type='submit' name='author_flyout'><img class='svg' src='assets/icons/edit.svg'>Edit author</button>
</form>";
}
@ -375,8 +416,8 @@
// Must be included with flyout.php
echo "<script src='scripts/flyout.js'></script>";
include("ui/top.html");
include("ui/footer.php");
include "ui/top.html";
include "ui/footer.php";
?>
</body>
</html>

View file

@ -1,18 +1,27 @@
<?php include "ui/required.php"; ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gallery</title>
<title>Lynx Gallery</title>
<!-- Google Fonts -->
<link rel="stylesheet" href="css/master.css">
<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&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&amp;display=swap">
<!-- JQuery -->
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
</script>
</head>
<body>
<?php
include "ui/required.php";
include "ui/header.php";
include "ui/nav.php";
?>
<div class="alert-banner">
@ -55,7 +64,7 @@
// Clean input
$tags_string = tag_clean(trim($_POST['search']));
header("Location:https://superdupersecteteuploadtest.fluffybean.gay?q=".$tags_string);
header("Location:index.php?q=".$tags_string);
}
if (isset($_GET["q"])) {
echo "<p class='alert alert-default space-bottom'>Search results for: ".$_GET['q']."</p>";
@ -103,7 +112,7 @@
// 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 "<a href='image.php?id=".$image['id']."'><img class='gallery-image' loading='lazy' src='".$image_path."' id='".$image['id']."'></a>";
echo "</div>";
}
} else {
@ -116,7 +125,7 @@
// 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 "<a href='image.php?id=".$image['id']."'><img class='gallery-image' loading='lazy' src='".$image_path."' id='".$image['id']."'></a>";
echo "</div>";
}
}
@ -124,8 +133,8 @@
</div>
<?php
include("ui/top.html");
include("ui/footer.php");
include "ui/top.html";
include "ui/footer.php";
?>
</body>
</html>

View file

@ -1,5 +1,3 @@
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/ . . .");
$(document).ready(function() {
let show = document.querySelectorAll(".flyout-display");
let hide = document.querySelector(".flyout-close");
@ -19,6 +17,6 @@ $(document).ready(function() {
setTimeout(function(){
document.querySelector(".flyout-dim").style.display= "none";
}, 600);
}, 621);
});
});

View file

@ -1,43 +1,43 @@
<?php
if (is_dir("assets/icons/")) {
$dir = "assets/icons/";
} else {
$dir = "../assets/icons/";
}
?>
<footer class="footer-root flex-left around">
<footer class="flex-left around">
<div class="footer-child center flex-down">
<h3>Contact me</h3>
<a class='link' href="https://t.me/Fluffy_Bean">
<img class='svg' src='<?php echo $dir; ?>telegram-logo.svg'>
Telegram</a>
<img class='svg' src='<?php echo $root_dir; ?>assets/icons/telegram-logo.svg'>
Telegram
</a>
<a class='link' href="https://twitter.com/fluffybeanUwU">
<img class='svg' src='<?php echo $dir; ?>twitter-logo.svg'>
Twitter</a>
<img class='svg' src='<?php echo $root_dir; ?>assets/icons/twitter-logo.svg'>
Twitter
</a>
<a class='link' href="https://github.com/Fluffy-Bean">
<img class='svg' src='<?php echo $dir; ?>github-logo.svg'>
GitHub</a>
<img class='svg' src='<?php echo $root_dir; ?>assets/icons/github-logo.svg'>
GitHub
</a>
</div>
<div class="footer-child center flex-down">
<h3>Information</h3>
<a class='link' href="https://superdupersecteteuploadtest.fluffybean.gay/info/about.php">
<img class='svg' src='<?php echo $dir; ?>scroll.svg'>
About</a>
<a class='link' href="about.php">
<img class='svg' src='<?php echo $root_dir; ?>assets/icons/scroll.svg'>
About
</a>
<a href="https://github.com/Fluffy-Bean/image-gallery">
<img class='svg' src='<?php echo $dir; ?>github-logo.svg'>
Project Code</a>
<img class='svg' src='<?php echo $root_dir; ?>assets/icons/github-logo.svg'>
Project Code
</a>
<a href="https://github.com/Fluffy-Bean/image-gallery/blob/main/LICENSE.md">
<img class='svg' src='<?php echo $dir; ?>link.svg'>
Legal</a>
<img class='svg' src='<?php echo $root_dir; ?>assets/icons/link.svg'>
Legal
</a>
</div>
<div class="footer-child center flex-down">
<h3>Other Work</h3>
<a class='link' href="https://testing.fluffybean.gay">
<img class='svg' src='<?php echo $dir; ?>link.svg'>
Testing Page</a>
<img class='svg' src='<?php echo $root_dir; ?>assets/icons/link.svg'>
Testing Page
</a>
<a class='link' href="https://gay.fluffybean.gay">
<img class='svg' src='<?php echo $dir; ?>link.svg'>
My website!</a>
<img class='svg' src='<?php echo $root_dir; ?>assets/icons/link.svg'>
My website!
</a>
</div>
</footer>

View file

@ -1,30 +0,0 @@
<?php
// Check which directory icons are in
if (is_dir("assets/icons/")) {
$dir = "assets/icons/";
} else {
$dir = "../assets/icons/";
}
?>
<nav class="nav-root flex-left between">
<div class="nav-name flex-left">
<h3>OnlyLegs</h3>
</div>
<div class="nav-links flex-left">
<?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 (loggedin()) {
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>";
echo "<hr>";
echo "<a class='btn alert-default' href='https://superdupersecteteuploadtest.fluffybean.gay/account/account.php'><img class='svg' src='".$dir."user-circle.svg'><span class='nav-hide'>".substr($_SESSION["username"], 0, 15)."</span></a>";
} else {
echo "<a class='btn alert-high' href='https://superdupersecteteuploadtest.fluffybean.gay/account/login.php'><img class='svg' src='".$dir."user-circle-plus.svg'><span class='nav-hide'>Login</span></a>";
}
?>
</div>
</nav>

20
ui/nav.php Normal file
View file

@ -0,0 +1,20 @@
<nav class="nav-root flex-left between">
<div class="nav-name flex-left">
<p>Lynx Gallery</p>
</div>
<div class="nav-links flex-left">
<a class='btn alert-default' href='index.php'><img class='svg' src='<?php echo $root_dir; ?>assets/icons/house.svg'><span class='nav-hide'>Home</span></a>
<hr>
<a class='btn alert-default' href='search.php'><img class='svg' src='<?php echo $root_dir; ?>assets/icons/binoculars.svg'><span class='nav-hide'>Search</span></a>
<hr>
<?php
if (loggedin()) {
echo "<a class='btn alert-default' href='upload.php'><img class='svg' src='".$root_dir."assets/icons/upload.svg'><span class='nav-hide'>Upload</span></a>";
echo "<hr>";
echo "<a class='btn alert-default' href='/account/account.php'><img class='svg' src='".$root_dir."assets/icons/user-circle.svg'><span class='nav-hide'>".substr($_SESSION["username"], 0, 15)."</span></a>";
} else {
echo "<a class='btn alert-default' href='/account/login.php'><img class='svg' src='".$root_dir."assets/icons/user-circle-plus.svg'><span class='nav-hide'>Login</span></a>";
}
?>
</div>
</nav>

View file

@ -1,20 +1,56 @@
<?php
// Include required files and commands by every page on header
/*
Connect to database
In the future I want this section to be configurable, but that'll require some work to be done.
For now it's hard-coded, shouldn't be an issue as most people wont be changing this often anyway
*/
// Setting up connection variables
$conn_ip = "localhost";
$conn_username = "uwu";
$conn_password = "fennec621";
$conn_database = "swag";
$conn = mysqli_connect($conn_ip, $conn_username, $conn_password , $conn_database);
if ($conn->connect_error) {
// Send notification that connection couldn't be made
}
/*
Start session
This is important as most pages use the PHP session and will complain if its not possible to access.
*/
session_start();
if (is_dir("ui/")) {
include_once("ui/functions.php");
/*
Check which directory user is in
I don't know if theres a better way of doing this? If there is please let me know
*/
if (is_file("index.php")) {
$root_dir = "";
} else {
include_once("../ui/functions.php");
$root_dir = "../";
}
$conn = mysqli_connect("localhost", "uwu", "fennec621", "swag");
if ($conn->connect_error) {
echo "<p class='alert alert-low'>Could not connect to database</p>";
}
/*
Include functions
Maybe I should put all the functions in this file? Dunno
*/
include $root_dir."ui/functions.php";
/*
Notification system
This is the notification system used by the website. Probably a little too much for what its used for
*/
echo "<div id='notify-root' class='notify-root'></div>";
?>
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
<script>
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/ . . .");
</script>

View file

@ -1,18 +1,27 @@
<?php include "ui/required.php"; ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Upload</title>
<title>Lynx Gallery</title>
<!-- Google Fonts -->
<link rel="stylesheet" href="css/master.css">
<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&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&amp;display=swap">
<!-- JQuery -->
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
</script>
</head>
<body>
<?php
include "ui/required.php";
include("ui/header.php");
include "ui/nav.php";
// Check if user is logged in
if (loggedin()) {
@ -93,8 +102,8 @@
</div>
<?php
include("ui/top.html");
include("ui/footer.php");
include "ui/top.html";
include "ui/footer.php";
?>
</body>
</html>