Fix folder share gallery view link

This commit is contained in:
Ryan
2025-04-17 02:38:32 -04:00
committed by GitHub
parent 766458f707
commit d839b3ac1c

View File

@@ -4,7 +4,8 @@
require_once __DIR__ . '/../../config/config.php'; require_once __DIR__ . '/../../config/config.php';
require_once PROJECT_ROOT . '/src/models/FolderModel.php'; require_once PROJECT_ROOT . '/src/models/FolderModel.php';
class FolderController { class FolderController
{
/** /**
* @OA\Post( * @OA\Post(
* path="/api/folder/createFolder.php", * path="/api/folder/createFolder.php",
@@ -45,7 +46,8 @@ class FolderController {
* *
* @return void Outputs a JSON response. * @return void Outputs a JSON response.
*/ */
public function createFolder(): void { public function createFolder(): void
{
header('Content-Type: application/json'); header('Content-Type: application/json');
// Ensure user is authenticated. // Ensure user is authenticated.
@@ -145,7 +147,8 @@ class FolderController {
* *
* @return void Outputs a JSON response. * @return void Outputs a JSON response.
*/ */
public function deleteFolder(): void { public function deleteFolder(): void
{
header('Content-Type: application/json'); header('Content-Type: application/json');
// Ensure user is authenticated. // Ensure user is authenticated.
@@ -238,7 +241,8 @@ class FolderController {
* *
* @return void Outputs a JSON response. * @return void Outputs a JSON response.
*/ */
public function renameFolder(): void { public function renameFolder(): void
{
header('Content-Type: application/json'); header('Content-Type: application/json');
// Ensure user is authenticated. // Ensure user is authenticated.
@@ -329,7 +333,8 @@ class FolderController {
* *
* @return void Outputs JSON response. * @return void Outputs JSON response.
*/ */
public function getFolderList(): void { public function getFolderList(): void
{
header('Content-Type: application/json'); header('Content-Type: application/json');
// Ensure user is authenticated. // Ensure user is authenticated.
@@ -396,7 +401,8 @@ class FolderController {
* *
* @return void Outputs HTML content. * @return void Outputs HTML content.
*/ */
public function shareFolder(): void { public function shareFolder(): void
{
// Retrieve GET parameters. // Retrieve GET parameters.
$token = filter_input(INPUT_GET, 'token', FILTER_SANITIZE_STRING); $token = filter_input(INPUT_GET, 'token', FILTER_SANITIZE_STRING);
$providedPass = filter_input(INPUT_GET, 'pass', FILTER_SANITIZE_STRING); $providedPass = filter_input(INPUT_GET, 'pass', FILTER_SANITIZE_STRING);
@@ -421,18 +427,48 @@ class FolderController {
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Enter Password</title> <title>Enter Password</title>
<style> <style>
body { font-family: Arial, sans-serif; padding: 20px; background-color: #f7f7f7; } body {
.container { max-width: 400px; margin: 80px auto; background: #fff; padding: 20px; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); } font-family: Arial, sans-serif;
input[type="password"], button { width: 100%; padding: 10px; margin: 10px 0; font-size: 1rem; } padding: 20px;
button { background-color: #007BFF; border: none; color: #fff; cursor: pointer; } background-color: #f7f7f7;
button:hover { background-color: #0056b3; } }
.container {
max-width: 400px;
margin: 80px auto;
background: #fff;
padding: 20px;
border-radius: 4px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
input[type="password"],
button {
width: 100%;
padding: 10px;
margin: 10px 0;
font-size: 1rem;
}
button {
background-color: #007BFF;
border: none;
color: #fff;
cursor: pointer;
}
button:hover {
background-color: #0056b3;
}
</style> </style>
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<h2>Folder Protected</h2> <h2>Folder Protected</h2>
@@ -445,6 +481,7 @@ class FolderController {
</form> </form>
</div> </div>
</body> </body>
</html> </html>
<?php <?php
exit; exit;
@@ -464,7 +501,8 @@ class FolderController {
$currentPage = $data['currentPage']; $currentPage = $data['currentPage'];
$totalPages = $data['totalPages']; $totalPages = $data['totalPages'];
function formatBytes($bytes) { function formatBytes($bytes)
{
if ($bytes < 1024) { if ($bytes < 1024) {
return $bytes . " B"; return $bytes . " B";
} elseif ($bytes < 1024 * 1024) { } elseif ($bytes < 1024 * 1024) {
@@ -481,33 +519,129 @@ class FolderController {
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Shared Folder: <?php echo htmlspecialchars($folderName, ENT_QUOTES, 'UTF-8'); ?></title> <title>Shared Folder: <?php echo htmlspecialchars($folderName, ENT_QUOTES, 'UTF-8'); ?></title>
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<style> <style>
body { background: #f2f2f2; font-family: Arial, sans-serif; padding: 20px; color: #333; } body {
.header { text-align: center; margin-bottom: 30px; } background: #f2f2f2;
.container { max-width: 800px; margin: 0 auto; background: #fff; border-radius: 4px; padding: 20px; box-shadow: 0 2px 12px rgba(0,0,0,0.1); } font-family: Arial, sans-serif;
table { width: 100%; border-collapse: collapse; margin-top: 20px; } padding: 20px;
th, td { padding: 12px; border-bottom: 1px solid #ddd; text-align: left; } color: #333;
th { background: #007BFF; color: #fff; } }
.pagination { text-align: center; margin-top: 20px; }
.pagination a, .pagination span { margin: 0 5px; padding: 8px 12px; background: #007BFF; color: #fff; border-radius: 4px; text-decoration: none; } .header {
.pagination span.current { background: #0056b3; } text-align: center;
margin-bottom: 30px;
}
.container {
max-width: 800px;
margin: 0 auto;
background: #fff;
border-radius: 4px;
padding: 20px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
th,
td {
padding: 12px;
border-bottom: 1px solid #ddd;
text-align: left;
}
th {
background: #007BFF;
color: #fff;
}
.pagination {
text-align: center;
margin-top: 20px;
}
.pagination a,
.pagination span {
margin: 0 5px;
padding: 8px 12px;
background: #007BFF;
color: #fff;
border-radius: 4px;
text-decoration: none;
}
.pagination span.current {
background: #0056b3;
}
/* Gallery view styles if needed */ /* Gallery view styles if needed */
.shared-gallery-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; padding: 10px 0; } .shared-gallery-container {
.shared-gallery-card { border: 1px solid #ccc; padding: 5px; text-align: center; } display: grid;
.shared-gallery-card img { max-width: 100%; display: block; margin: 0 auto; } grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 10px;
padding: 10px 0;
}
.shared-gallery-card {
border: 1px solid #ccc;
padding: 5px;
text-align: center;
}
.shared-gallery-card img {
max-width: 100%;
display: block;
margin: 0 auto;
}
/* Upload container */ /* Upload container */
.upload-container { margin-top: 30px; text-align: center; } .upload-container {
.upload-container h3 { font-size: 1.4rem; margin-bottom: 10px; } margin-top: 30px;
.upload-container form { display: inline-block; margin-top: 10px; } text-align: center;
.upload-container button { background-color: #28a745; border: none; color: #fff; padding: 10px 20px; font-size: 1rem; border-radius: 4px; cursor: pointer; } }
.upload-container button:hover { background-color: #218838; }
.footer { text-align: center; margin-top: 40px; font-size: 0.9rem; color: #777; } .upload-container h3 {
font-size: 1.4rem;
margin-bottom: 10px;
}
.upload-container form {
display: inline-block;
margin-top: 10px;
}
.upload-container button {
background-color: #28a745;
border: none;
color: #fff;
padding: 10px 20px;
font-size: 1rem;
border-radius: 4px;
cursor: pointer;
}
.upload-container button:hover {
background-color: #218838;
}
.footer {
text-align: center;
margin-top: 40px;
font-size: 0.9rem;
color: #777;
}
</style> </style>
</head> </head>
<body> <body>
<div class="header"> <div class="header">
<h1>Shared Folder: <?php echo htmlspecialchars($folderName, ENT_QUOTES, 'UTF-8'); ?></h1> <h1>Shared Folder: <?php echo htmlspecialchars($folderName, ENT_QUOTES, 'UTF-8'); ?></h1>
@@ -602,37 +736,50 @@ class FolderController {
// (Optional) JavaScript for toggling view modes (list/gallery). // (Optional) JavaScript for toggling view modes (list/gallery).
var viewMode = 'list'; var viewMode = 'list';
window.imageCache = window.imageCache || {}; window.imageCache = window.imageCache || {};
var filesData = <?php echo json_encode($files); ?>; var filesData = <?php echo json_encode($files); ?>;
function cacheImage(imgElem, key) { // Use the sharedfolder relative path (from your model), not realFolderPath
window.imageCache[key] = imgElem.src; // $data['folder'] should be something like "eafwef/testfolder2/test/new folder two"
} var rawRelPath = "<?php echo addslashes($data['folder']); ?>";
// Split into segments, encode each segment, then re-join
var folderSegments = rawRelPath
.split('/')
.map(encodeURIComponent)
.join('/');
function renderGalleryView() { function renderGalleryView() {
var galleryContainer = document.getElementById("galleryViewContainer"); var galleryContainer = document.getElementById("galleryViewContainer");
var html = '<div class="shared-gallery-container">'; var html = '<div class="shared-gallery-container">';
filesData.forEach(function(file) { filesData.forEach(function(file) {
var fileUrl = window.location.origin // Encode the filename too
+ "/uploads/<?php echo rawurlencode($folderName); ?>/" var fileName = encodeURIComponent(file);
+ encodeURIComponent(file); var fileUrl = window.location.origin +
'/uploads/' +
folderSegments +
'/' +
fileName +
'?t=' +
Date.now();
var ext = file.split('.').pop().toLowerCase(); var ext = file.split('.').pop().toLowerCase();
var thumbnail = ""; var thumbnail;
if (['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg', 'ico'].indexOf(ext) >= 0) { if (['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg', 'ico'].indexOf(ext) >= 0) {
var cacheKey = fileUrl; thumbnail = '<img src="' + fileUrl + '" alt="' + file + '">';
if (window.imageCache[cacheKey]) {
thumbnail = '<img src="'+window.imageCache[cacheKey]+'" alt="'+file+'">';
} else {
var imageUrl = fileUrl + '?t=' + new Date().getTime();
thumbnail = '<img src="'+imageUrl+'" onload="cacheImage(this, \''+cacheKey+'\')" alt="'+file+'">';
}
} else { } else {
thumbnail = '<span class="material-icons">insert_drive_file</span>'; thumbnail = '<span class="material-icons">insert_drive_file</span>';
} }
html += '<div class="shared-gallery-card">';
html += '<div class="gallery-preview" onclick="window.location.href=\''+fileUrl+'\'" style="cursor:pointer;">'+ thumbnail +'</div>'; html +=
html += '<div class="gallery-info"><span class="gallery-file-name">'+file+'</span></div>'; '<div class="shared-gallery-card">' +
html += '</div>'; '<div class="gallery-preview" ' +
'onclick="window.location.href=\'' + fileUrl + '\'" ' +
'style="cursor:pointer;">' +
thumbnail +
'</div>' +
'<div class="gallery-info">' +
'<span class="gallery-file-name">' + file + '</span>' +
'</div>' +
'</div>';
}); });
html += '</div>'; html += '</div>';
galleryContainer.innerHTML = html; galleryContainer.innerHTML = html;
@@ -654,6 +801,7 @@ class FolderController {
} }
</script> </script>
</body> </body>
</html> </html>
<?php <?php
exit; exit;
@@ -703,7 +851,8 @@ class FolderController {
* *
* @return void Outputs a JSON response. * @return void Outputs a JSON response.
*/ */
public function createShareFolderLink(): void { public function createShareFolderLink(): void
{
header('Content-Type: application/json'); header('Content-Type: application/json');
// Ensure user is authenticated. // Ensure user is authenticated.
@@ -785,7 +934,8 @@ class FolderController {
* *
* @return void Outputs the file with proper headers. * @return void Outputs the file with proper headers.
*/ */
public function downloadSharedFile(): void { public function downloadSharedFile(): void
{
// Retrieve and sanitize GET parameters. // Retrieve and sanitize GET parameters.
$token = filter_input(INPUT_GET, 'token', FILTER_SANITIZE_STRING); $token = filter_input(INPUT_GET, 'token', FILTER_SANITIZE_STRING);
$file = filter_input(INPUT_GET, 'file', FILTER_SANITIZE_STRING); $file = filter_input(INPUT_GET, 'file', FILTER_SANITIZE_STRING);
@@ -863,7 +1013,8 @@ class FolderController {
* *
* @return void Redirects upon successful upload or outputs JSON errors. * @return void Redirects upon successful upload or outputs JSON errors.
*/ */
public function uploadToSharedFolder(): void { public function uploadToSharedFolder(): void
{
// Ensure request is POST. // Ensure request is POST.
if ($_SERVER['REQUEST_METHOD'] !== 'POST') { if ($_SERVER['REQUEST_METHOD'] !== 'POST') {
http_response_code(405); http_response_code(405);