joachim/FileRise
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix folder share gallery view link

Browse Source
This commit is contained in:
Ryan
2025-04-17 02:38:32 -04:00
committed by GitHub
parent 766458f707
commit d839b3ac1c
1 changed files with 386 additions and 235 deletions
Download Patch File Download Diff File Expand all files Collapse all files

511
src/controllers/folderController.php
View File

@@ -4,7 +4,8 @@
require_once __DIR__ . '/../../config/config.php';
require_once PROJECT_ROOT . '/src/models/FolderModel.php';
class FolderController {
class FolderController
{
/**
* @OA\Post(
* path="/api/folder/createFolder.php",
@@ -45,7 +46,8 @@ class FolderController {
*
* @return void Outputs a JSON response.
*/
public function createFolder(): void {
public function createFolder(): void
{
header('Content-Type: application/json');
// Ensure user is authenticated.
@@ -106,7 +108,7 @@ class FolderController {
exit;
}
/**
/**
* @OA\Post(
* path="/api/folder/deleteFolder.php",
* summary="Delete an empty folder",
@@ -145,7 +147,8 @@ class FolderController {
*
* @return void Outputs a JSON response.
*/
public function deleteFolder(): void {
public function deleteFolder(): void
{
header('Content-Type: application/json');
// Ensure user is authenticated.
@@ -198,7 +201,7 @@ class FolderController {
exit;
}
/**
/**
* @OA\Post(
* path="/api/folder/renameFolder.php",
* summary="Rename a folder",
@@ -238,7 +241,8 @@ class FolderController {
*
* @return void Outputs a JSON response.
*/
public function renameFolder(): void {
public function renameFolder(): void
{
header('Content-Type: application/json');
// Ensure user is authenticated.
@@ -329,7 +333,8 @@ class FolderController {
*
* @return void Outputs JSON response.
*/
public function getFolderList(): void {
public function getFolderList(): void
{
header('Content-Type: application/json');
// Ensure user is authenticated.
@@ -345,7 +350,7 @@ class FolderController {
exit;
}
/**
/**
* @OA\Get(
* path="/api/folder/shareFolder.php",
* summary="Display a shared folder",
@@ -396,7 +401,8 @@ class FolderController {
*
* @return void Outputs HTML content.
*/
public function shareFolder(): void {
public function shareFolder(): void
{
// Retrieve GET parameters.
$token = filter_input(INPUT_GET, 'token', FILTER_SANITIZE_STRING);
$providedPass = filter_input(INPUT_GET, 'pass', FILTER_SANITIZE_STRING);
@@ -418,35 +424,66 @@ class FolderController {
// If a password is needed, output an HTML form.
if (isset($data['needs_password']) && $data['needs_password'] === true) {
header("Content-Type: text/html; charset=utf-8");
?>
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Enter Password</title>
<style>
body { font-family: Arial, sans-serif; padding: 20px; background-color: #f7f7f7; }
.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; }
body {
font-family: Arial, sans-serif;
padding: 20px;
background-color: #f7f7f7;
}
.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>
</head>
<body>
<div class="container">
<h2>Folder Protected</h2>
<p>This folder is protected by a password. Please enter the password to view its contents.</p>
<form method="get" action="/api/folder/shareFolder.php">
<input type="hidden" name="token" value="<?php echo htmlspecialchars($token, ENT_QUOTES, 'UTF-8'); ?>">
<label for="pass">Password:</label>
<input type="password" name="pass" id="pass" required>
<button type="submit">Submit</button>
</form>
</div>
<div class="container">
<h2>Folder Protected</h2>
<p>This folder is protected by a password. Please enter the password to view its contents.</p>
<form method="get" action="/api/folder/shareFolder.php">
<input type="hidden" name="token" value="<?php echo htmlspecialchars($token, ENT_QUOTES, 'UTF-8'); ?>">
<label for="pass">Password:</label>
<input type="password" name="pass" id="pass" required>
<button type="submit">Submit</button>
</form>
</div>
</body>
</html>
<?php
<?php
exit;
}
@@ -464,7 +501,8 @@ class FolderController {
$currentPage = $data['currentPage'];
$totalPages = $data['totalPages'];
function formatBytes($bytes) {
function formatBytes($bytes)
{
if ($bytes < 1024) {
return $bytes . " B";
} elseif ($bytes < 1024 * 1024) {
@@ -481,181 +519,291 @@ class FolderController {
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Shared Folder: <?php echo htmlspecialchars($folderName, ENT_QUOTES, 'UTF-8'); ?></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body { background: #f2f2f2; font-family: Arial, sans-serif; padding: 20px; color: #333; }
.header { 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; }
body {
background: #f2f2f2;
font-family: Arial, sans-serif;
padding: 20px;
color: #333;
}
.header {
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 */
.shared-gallery-container { display: grid; 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; }
.shared-gallery-container {
display: grid;
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 { margin-top: 30px; text-align: center; }
.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; }
.upload-container {
margin-top: 30px;
text-align: center;
}
.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>
</head>
<body>
<div class="header">
<h1>Shared Folder: <?php echo htmlspecialchars($folderName, ENT_QUOTES, 'UTF-8'); ?></h1>
</div>
<div class="container">
<!-- Toggle Button -->
<button id="toggleBtn" class="toggle-btn" onclick="toggleViewMode()">Switch to Gallery View</button>
<!-- List View Container -->
<div id="listViewContainer">
<?php if (empty($files)): ?>
<p style="text-align:center;">This folder is empty.</p>
<?php else: ?>
<table>
<thead>
<tr>
<th>Filename</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<?php
// For each file, build a download link using your downloadSharedFile endpoint.
foreach ($files as $file):
$filePath = $data['realFolderPath'] . DIRECTORY_SEPARATOR . $file;
$fileSize = file_exists($filePath) ? formatBytes(filesize($filePath)) : "Unknown";
$downloadLink = "/api/folder/downloadSharedFile.php?token=" . urlencode($token) . "&file=" . urlencode($file);
?>
<tr>
<td>
<a href="<?php echo htmlspecialchars($downloadLink, ENT_QUOTES, 'UTF-8'); ?>">
<?php echo htmlspecialchars($file, ENT_QUOTES, 'UTF-8'); ?>
<span class="download-icon">&#x21E9;</span>
</a>
</td>
<td><?php echo $fileSize; ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
<?php endif; ?>
<div class="header">
<h1>Shared Folder: <?php echo htmlspecialchars($folderName, ENT_QUOTES, 'UTF-8'); ?></h1>
</div>
<div class="container">
<!-- Toggle Button -->
<button id="toggleBtn" class="toggle-btn" onclick="toggleViewMode()">Switch to Gallery View</button>
<!-- Gallery View Container (hidden by default) -->
<div id="galleryViewContainer" style="display:none;"></div>
<!-- Pagination Controls -->
<div class="pagination">
<?php if ($currentPage > 1): ?>
<a href="/api/folder/shareFolder.php?token=<?php echo urlencode($token); ?>&page=<?php echo $currentPage - 1; ?><?php echo !empty($providedPass) ? "&pass=" . urlencode($providedPass) : ""; ?>">Prev</a>
<?php else: ?>
<span>Prev</span>
<?php endif; ?>
<?php
$startPage = max(1, $currentPage - 2);
$endPage = min($totalPages, $currentPage + 2);
for ($i = $startPage; $i <= $endPage; $i++): ?>
<?php if ($i == $currentPage): ?>
<span class="current"><?php echo $i; ?></span>
<!-- List View Container -->
<div id="listViewContainer">
<?php if (empty($files)): ?>
<p style="text-align:center;">This folder is empty.</p>
<?php else: ?>
<a href="/api/folder/shareFolder.php?token=<?php echo urlencode($token); ?>&page=<?php echo $i; ?><?php echo !empty($providedPass) ? "&pass=" . urlencode($providedPass) : ""; ?>"><?php echo $i; ?></a>
<table>
<thead>
<tr>
<th>Filename</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<?php
// For each file, build a download link using your downloadSharedFile endpoint.
foreach ($files as $file):
$filePath = $data['realFolderPath'] . DIRECTORY_SEPARATOR . $file;
$fileSize = file_exists($filePath) ? formatBytes(filesize($filePath)) : "Unknown";
$downloadLink = "/api/folder/downloadSharedFile.php?token=" . urlencode($token) . "&file=" . urlencode($file);
?>
<tr>
<td>
<a href="<?php echo htmlspecialchars($downloadLink, ENT_QUOTES, 'UTF-8'); ?>">
<?php echo htmlspecialchars($file, ENT_QUOTES, 'UTF-8'); ?>
<span class="download-icon">&#x21E9;</span>
</a>
</td>
<td><?php echo $fileSize; ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
<?php endif; ?>
<?php endfor; ?>
</div>
<?php if ($currentPage < $totalPages): ?>
<a href="/api/folder/shareFolder.php?token=<?php echo urlencode($token); ?>&page=<?php echo $currentPage + 1; ?><?php echo !empty($providedPass) ? "&pass=" . urlencode($providedPass) : ""; ?>">Next</a>
<?php else: ?>
<span>Next</span>
<!-- Gallery View Container (hidden by default) -->
<div id="galleryViewContainer" style="display:none;"></div>
<!-- Pagination Controls -->
<div class="pagination">
<?php if ($currentPage > 1): ?>
<a href="/api/folder/shareFolder.php?token=<?php echo urlencode($token); ?>&page=<?php echo $currentPage - 1; ?><?php echo !empty($providedPass) ? "&pass=" . urlencode($providedPass) : ""; ?>">Prev</a>
<?php else: ?>
<span>Prev</span>
<?php endif; ?>
<?php
$startPage = max(1, $currentPage - 2);
$endPage = min($totalPages, $currentPage + 2);
for ($i = $startPage; $i <= $endPage; $i++): ?>
<?php if ($i == $currentPage): ?>
<span class="current"><?php echo $i; ?></span>
<?php else: ?>
<a href="/api/folder/shareFolder.php?token=<?php echo urlencode($token); ?>&page=<?php echo $i; ?><?php echo !empty($providedPass) ? "&pass=" . urlencode($providedPass) : ""; ?>"><?php echo $i; ?></a>
<?php endif; ?>
<?php endfor; ?>
<?php if ($currentPage < $totalPages): ?>
<a href="/api/folder/shareFolder.php?token=<?php echo urlencode($token); ?>&page=<?php echo $currentPage + 1; ?><?php echo !empty($providedPass) ? "&pass=" . urlencode($providedPass) : ""; ?>">Next</a>
<?php else: ?>
<span>Next</span>
<?php endif; ?>
</div>
<!-- Upload Container (if uploads are allowed by the share record) -->
<?php if (isset($data['record']['allowUpload']) && $data['record']['allowUpload'] == 1): ?>
<div class="upload-container">
<h3>Upload File (50mb max size)</h3>
<form action="/api/folder/uploadToSharedFolder.php" method="post" enctype="multipart/form-data">
<!-- Pass the share token so the upload endpoint can verify -->
<input type="hidden" name="token" value="<?php echo htmlspecialchars($token, ENT_QUOTES, 'UTF-8'); ?>">
<input type="file" name="fileToUpload" required>
<br><br>
<button type="submit">Upload</button>
</form>
</div>
<?php endif; ?>
</div>
<div class="footer">
&copy; <?php echo date("Y"); ?> FileRise. All rights reserved.
</div>
<!-- Upload Container (if uploads are allowed by the share record) -->
<?php if (isset($data['record']['allowUpload']) && $data['record']['allowUpload'] == 1): ?>
<div class="upload-container">
<h3>Upload File (50mb max size)</h3>
<form action="/api/folder/uploadToSharedFolder.php" method="post" enctype="multipart/form-data">
<!-- Pass the share token so the upload endpoint can verify -->
<input type="hidden" name="token" value="<?php echo htmlspecialchars($token, ENT_QUOTES, 'UTF-8'); ?>">
<input type="file" name="fileToUpload" required>
<br><br>
<button type="submit">Upload</button>
</form>
</div>
<?php endif; ?>
</div>
<div class="footer">
&copy; <?php echo date("Y"); ?> FileRise. All rights reserved.
</div>
<script>
// (Optional) JavaScript for toggling view modes (list/gallery).
var viewMode = 'list';
window.imageCache = window.imageCache || {};
var filesData = <?php echo json_encode($files); ?>;
<script>
// (Optional) JavaScript for toggling view modes (list/gallery).
var viewMode = 'list';
window.imageCache = window.imageCache || {};
// Use the shared‑folder relative path (from your model), not realFolderPath
// $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('/');
var filesData = <?php echo json_encode($files); ?>;
function renderGalleryView() {
var galleryContainer = document.getElementById("galleryViewContainer");
var html = '<div class="shared-gallery-container">';
filesData.forEach(function(file) {
// Encode the filename too
var fileName = encodeURIComponent(file);
var fileUrl = window.location.origin +
'/uploads/' +
folderSegments +
'/' +
fileName +
'?t=' +
Date.now();
function cacheImage(imgElem, key) {
window.imageCache[key] = imgElem.src;
}
var ext = file.split('.').pop().toLowerCase();
var thumbnail;
if (['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg', 'ico'].indexOf(ext) >= 0) {
thumbnail = '<img src="' + fileUrl + '" alt="' + file + '">';
} else {
thumbnail = '<span class="material-icons">insert_drive_file</span>';
}
function renderGalleryView() {
var galleryContainer = document.getElementById("galleryViewContainer");
var html = '<div class="shared-gallery-container">';
filesData.forEach(function(file) {
var fileUrl = window.location.origin
+ "/uploads/<?php echo rawurlencode($folderName); ?>/"
+ encodeURIComponent(file);
var ext = file.split('.').pop().toLowerCase();
var thumbnail = "";
if (['jpg','jpeg','png','gif','bmp','webp','svg','ico'].indexOf(ext) >= 0) {
var cacheKey = fileUrl;
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 {
thumbnail = '<span class="material-icons">insert_drive_file</span>';
html +=
'<div class="shared-gallery-card">' +
'<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>';
galleryContainer.innerHTML = html;
}
html += '<div class="shared-gallery-card">';
html += '<div class="gallery-preview" onclick="window.location.href=\''+fileUrl+'\'" style="cursor:pointer;">'+ thumbnail +'</div>';
html += '<div class="gallery-info"><span class="gallery-file-name">'+file+'</span></div>';
html += '</div>';
});
html += '</div>';
galleryContainer.innerHTML = html;
}
function toggleViewMode() {
if (viewMode === 'list') {
viewMode = 'gallery';
document.getElementById("listViewContainer").style.display = "none";
renderGalleryView();
document.getElementById("galleryViewContainer").style.display = "block";
document.getElementById("toggleBtn").textContent = "Switch to List View";
} else {
viewMode = 'list';
document.getElementById("galleryViewContainer").style.display = "none";
document.getElementById("listViewContainer").style.display = "block";
document.getElementById("toggleBtn").textContent = "Switch to Gallery View";
}
}
</script>
function toggleViewMode() {
if (viewMode === 'list') {
viewMode = 'gallery';
document.getElementById("listViewContainer").style.display = "none";
renderGalleryView();
document.getElementById("galleryViewContainer").style.display = "block";
document.getElementById("toggleBtn").textContent = "Switch to List View";
} else {
viewMode = 'list';
document.getElementById("galleryViewContainer").style.display = "none";
document.getElementById("listViewContainer").style.display = "block";
document.getElementById("toggleBtn").textContent = "Switch to Gallery View";
}
}
</script>
</body>
</html>
<?php
<?php
exit;
}
@@ -703,7 +851,8 @@ class FolderController {
*
* @return void Outputs a JSON response.
*/
public function createShareFolderLink(): void {
public function createShareFolderLink(): void
{
header('Content-Type: application/json');
// Ensure user is authenticated.
@@ -785,7 +934,8 @@ class FolderController {
*
* @return void Outputs the file with proper headers.
*/
public function downloadSharedFile(): void {
public function downloadSharedFile(): void
{
// Retrieve and sanitize GET parameters.
$token = filter_input(INPUT_GET, 'token', FILTER_SANITIZE_STRING);
$file = filter_input(INPUT_GET, 'file', FILTER_SANITIZE_STRING);
@@ -812,7 +962,7 @@ class FolderController {
// Serve the file.
header("Content-Type: " . $mimeType);
$ext = strtolower(pathinfo($realFilePath, PATHINFO_EXTENSION));
if (in_array($ext, ['jpg','jpeg','png','gif','bmp','webp','svg','ico'])) {
if (in_array($ext, ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg', 'ico'])) {
header('Content-Disposition: inline; filename="' . basename($realFilePath) . '"');
} else {
header('Content-Disposition: attachment; filename="' . basename($realFilePath) . '"');
@@ -863,7 +1013,8 @@ class FolderController {
*
* @return void Redirects upon successful upload or outputs JSON errors.
*/
public function uploadToSharedFolder(): void {
public function uploadToSharedFolder(): void
{
// Ensure request is POST.
if ($_SERVER['REQUEST_METHOD'] !== 'POST') {
http_response_code(405);