Reputation: 11
so i made this file system for my website. in the folder.php file theres a working search bar while the one inside my subfolder.php file for some reason doesnt work and idk how to fix it. if i put a folders name into the subfolder.php files search bar it just makes it so all folders get removes and the one i searched for doesnt show up either.
Folder.php (working)
<?php
$mainFolderPath = 'hmm';
$subfolders = scandir($mainFolderPath);
$filteredSubfolders = [];
// Check if a search query is provided
if (isset($_GET['search']) && !empty($_GET['search'])) {
$searchQuery = strtolower($_GET['search']);
// Filter subfolders based on the search query
$filteredSubfolders = array_filter($subfolders, function ($subfolder) use ($searchQuery, $mainFolderPath) {
return ($subfolder !== '.' && $subfolder !== '..' && is_dir($mainFolderPath . '/' . $subfolder) && strpos(strtolower($subfolder), $searchQuery) !== false);
});
} else {
// If no search query provided, show all subfolders
$filteredSubfolders = array_filter($subfolders, function ($subfolder) use ($mainFolderPath) {
return ($subfolder !== '.' && $subfolder !== '..' && is_dir($mainFolderPath . '/' . $subfolder));
});
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>hentai</title>
<style>
.nav-container {
display: flex;
justify-content: left;
align-items: left;
background-color: rgb(255, 255, 255);
padding: 10px;
}
.nav-link {
text-decoration: none;
color: black;
padding: 10px 20px;
margin: 0 1px;
border: 1px solid black;
border-radius: 1px;
}
.nav-link:hover {
background-color: #444;
}
.subfolder-link {
display: inline-block;
padding: 8px 16px;
background-color: #236;
color: white;
text-align: center;
text-decoration: none;
border-radius: 1px;
margin: 1px;
cursor: pointer;
}
/* Add this style for the search bar */
.search-container {
margin-bottom: 10px;
}
.search-container input[type="text"] {
padding: 5px;
width: 200px;
}
.search-container input[type="submit"] {
padding: 5px 10px;
background-color: #236;
color: white;
border: none;
cursor: pointer;
}
</style>
</head>
<body>
<header>
<a href="home.html">
<img src="img/logo.jpg" alt="Savekillqqp's Shares" width="35%" height="35%">
</a>
<head>
<link rel="shortcut icon" type="image/x-icon" href="faviconH.ico" />
</head>
</header>
<hr>
<nav>
<div class="nav-container">
<a class="nav-link" href="home.html">Home</a>
<a class="nav-link" href="citra.html">Citra</a>
<a class="nav-link" href="music.html">Music</a>
<a class="nav-link" href="movies.html">Movies</a>
<a class="nav-link" href="https://discord.gg/Ta9aamS7">Discord</a>
<a class="nav-link" href="test.html">Hentai</a>
</div>
</nav>
</hr>
<hr>
<header>
<h1>Hmm Folder:</h1>
<!-- Add this HTML code for the search bar -->
<div class="search-container">
<form method="GET" action="">
<input type="text" name="search" placeholder="Search for a subfolder...">
<input type="submit" value="Search">
</form>
</div>
<?php
if (empty($filteredSubfolders)) {
echo '<p>No matching subfolders found.</p>';
} else {
echo '<p>Matching subfolders:</p>';
echo '<ul>';
foreach ($filteredSubfolders as $subfolder) {
echo '<li><a class="subfolder-link" href="subfolder.php?subfolder=' . urlencode($subfolder) . '">' . $subfolder . '</a></li>';
}
echo '</ul>';
}
?>
</header>
</body>
</html>
Subfolder.php (not working)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>hentai</title>
</head>
<body>
<header>
<a href="home.html">
<img src="img/logo.jpg" alt="Savekillqqp's Shares" width="35%" height="35%">
</a>
<head>
<link rel="shortcut icon" type="image/x-icon" href="faviconH.ico" />
</head>
</header>
<hr>
<nav>
<div class="nav-container">
<a class="nav-link" href="home.html">Home</a>
<a class="nav-link" href="citra.html">Citra</a>
<a class="nav-link" href="music.html">Music</a>
<a class="nav-link" href="movies.html">Movies</a>
<a class="nav-link" href="https://discord.gg/Ta9aamS7">Discord</a>
<a class="nav-link" href="test.html">Hentai</a>
</div>
</nav>
</hr>
<hr>
<head>
<title>Hmm Subfolders</title>
<link rel="stylesheet" href="/node_modules/lightbox2/src/css/lightbox.css">
<style>
.nav-container {
display: flex;
justify-content: left;
align-items: left;
background-color: rgb(255, 255, 255);
padding: 10px;
}
.nav-link {
text-decoration: none;
color: black;
padding: 10px 20px;
margin: 0 1px;
border: 1px solid black;
border-radius: 1px;
}
.nav-link:hover {
background-color: #444;
}
.subfolder-link {
display: inline-block;
padding: 8px 16px;
background-color: #236;
color: white;
text-align: center;
text-decoration: none;
border-radius: 1px;
margin: 1px;
cursor: pointer;
}
#lightboxContainer {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: fixed;
top: 210px; /* Adjust this value as needed */
left: 120px; /* Adjust this value as needed */
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 255);
z-index: 9999; /* Ensure it's on top */
}
#lightboxImage {
max-width: 60%;
max-height: 60%;
}
#lightboxClose {
position: absolute;
top: 10px;
right: 10px;
}
#lightboxButtons {
display: flex;
margin-top: 10px; /* Add some spacing above the buttons */
}
#lightboxButtons button {
margin: 0 5px; /* Add some spacing between buttons */
}
#lightboxPrev,
#lightboxNext {
margin: 0 5px; /* Add some spacing between buttons */
padding: 10px 20px; /* Adjust padding for button size */
font-size: 13px; /* Adjust font size for button text */
background-color: #236; /* Change background color */
color: white; /* Change text color */
border: none; /* Remove border */
cursor: pointer;
}
.subfolder-link {
display: inline-block;
padding: 8px 16px;
background-color: #236;
color: white;
text-align: center;
text-decoration: none;
border-radius: 1px;
margin: 4px;
cursor: pointer;
}
/* Adjust image size on mobile */
@media (max-width: 300px) {
#lightboxImage {
max-width: 100%; /* Adjust the value as needed for mobile */
max-height: 100%; /* Adjust the value as needed for mobile */
}
}
</style>
</head>
<form method="get">
<input type="text" name="search" placeholder="Search subfolders...">
<input type="submit" value="Search">
</form>
</hr>
<?php
$mainFolderPath = 'hmm';
$subfolders = scandir($mainFolderPath);
$filteredSubfolders = [];
if (isset($_GET['subfolder'])) {
// ... (rest of your code for displaying subfolders, images, videos, etc.) ...
}
if (isset($_GET['subfolder'])) {
$subfolderPath = 'hmm/' . $_GET['subfolder'];
$contents = scandir($subfolderPath);
$processedSubSubfolders = array();
foreach ($contents as $content) {
if ($content !== '.' && $content !== '..') {
$fullPath = $subfolderPath . '/' . $content;
$fileExtension = strtolower(pathinfo($content, PATHINFO_EXTENSION));
if (is_dir($fullPath) && !in_array($content, $processedSubSubfolders)) {
$processedSubSubfolders[] = $content;
echo '<p><a class="subfolder-link" href="subfolder.php?subfolder=' . urlencode($_GET['subfolder'] . '/' . $content) . '">' . $content . '</a></p>';
} elseif (in_array($fileExtension, array('mp4', 'webm', 'ogg'))) {
echo '<video controls><source src="' . $subfolderPath . '/' . $content . '" type="video/' . $fileExtension . '">Your browser does not support the video tag.</video><br>';
} elseif (in_array($fileExtension, array('jpg', 'jpeg', 'TIFF', 'PDF', 'png', 'gif', 'img_webp'))) {
echo '<img src="' . $subfolderPath . '/' . $content . '" data-lightbox="images" alt="' . basename($content) . '" width="100"><br>';
} elseif ($fileExtension === 'mp3') {
echo '<audio controls><source src="' . $subfolderPath . '/' . $content . '" type="audio/mpeg">Your browser does not support the audio tag.</audio><br>';
}
}
}
}
if (isset($_GET['subfolder'])) {
$subfolderPath = 'hmm/' . $_GET['subfolder'];
$files = scandir($subfolderPath);
$imageFiles = array();
foreach ($files as $file) {
if ($file !== '.' && $file !== '..') {
$fileExtension = strtolower(pathinfo($file, PATHINFO_EXTENSION));
if (in_array($fileExtension, array('jpg', 'jpeg', 'PDF', 'TIFF', 'png', 'gif', 'mp4', 'IMG_WEBP'))) {
if (in_array($fileExtension, array('jpg', 'jpeg', 'PDF', 'TIFF', 'png', 'gif', 'mp4', 'IMG_WEBP'))) {
$imageFiles[] = $subfolderPath . '/' . $file;
} elseif (in_array($fileExtension, array('mp4', 'webm', 'ogg'))) {
echo '<video controls><source src="' . $subfolderPath . '/' . $file . '" type="video/' . $fileExtension . '">Your browser does not support the video tag.</video><br>';
} elseif ($fileExtension === 'mp3') {
echo '<audio controls><source src="' . $subfolderPath . '/' . $file . '" type="audio/mpeg">Your browser does not support the audio tag.</audio><br>';
}
}
}
}
foreach ($imageFiles as $imageFile) {
echo '<img src="' . $imageFile . '" data-lightbox="images" alt="' . basename($imageFile) . '" width="100"><br>';
}
}
?>
<div id="lightboxContainer" style="display: none;">
<img id="lightboxImage" src="" alt="">
<span id="lightboxClose">✖</span>
<div id="lightboxButtons">
<button id="lightboxPrev">Previous</button>
<button id="lightboxNext">Next</button>
</div>
</div>
<script src="/node_modules/lightbox2/src/js/lightbox.js"></script>
<script>
const images = document.querySelectorAll('[data-lightbox="images"]');
const lightboxContainer = document.getElementById('lightboxContainer');
const lightboxImage = document.getElementById('lightboxImage');
const lightboxClose = document.getElementById('lightboxClose');
const lightboxPrev = document.getElementById('lightboxPrev');
const lightboxNext = document.getElementById('lightboxNext');
let currentImageIndex = 0;
let touchStartX = 0;
let touchEndX = 0;
lightboxPrev.addEventListener('click', () => {
currentImageIndex = (currentImageIndex - 1 + images.length) % images.length;
showLightbox(images[currentImageIndex].getAttribute('src'));
});
lightboxNext.addEventListener('click', () => {
currentImageIndex = (currentImageIndex + 1) % images.length;
showLightbox(images[currentImageIndex].getAttribute('src'));
});
images.forEach((image, index) => {
image.addEventListener('click', () => {
currentImageIndex = index;
showLightbox(image.getAttribute('src'));
});
image.addEventListener('touchstart', (e) => {
touchStartX = e.touches[0].clientX;
});
image.addEventListener('touchend', (e) => {
touchEndX = e.changedTouches[0].clientX;
handleSwipe();
});
});
lightboxClose.addEventListener('click', () => {
lightboxContainer.style.display = 'none';
});
document.addEventListener('keydown', (event) => {
if (lightboxContainer.style.display === 'block') {
if (event.key === 'ArrowRight') {
currentImageIndex = (currentImageIndex + 1) % images.length;
showLightbox(images[currentImageIndex].getAttribute('src'));
} else if (event.key === 'ArrowLeft') {
currentImageIndex = (currentImageIndex - 1 + images.length) % images.length;
showLightbox(images[currentImageIndex].getAttribute('src'));
}
}
});
function showLightbox(src) {
lightboxImage.setAttribute('src', src);
lightboxContainer.style.display = 'block';
}
function handleSwipe() {
if (Math.abs(touchEndX - touchStartX) > 50) {
if (touchEndX > touchStartX) {
currentImageIndex = (currentImageIndex - 1 + images.length) % images.length;
showLightbox(images[currentImageIndex].getAttribute('src'));
} else {
currentImageIndex = (currentImageIndex + 1) % images.length;
showLightbox(images[currentImageIndex].getAttribute('src'));
}
}
}
</script>
</body>
</html>
i apologize if the code is hard to read throu im not the best with tidying up and im also quite new to coding so i apreciate all help i can get :D
Upvotes: 1
Views: 30