index.php

<?php
// Media File Browser
// Displays images, PDFs, and videos from a specified folder

session_start();

$folderPath = '';
$files = [];
$error = '';
$success = '';
$itemsPerPage = 500;
$currentPage = isset($_GET['page']) ? max(1, intval($_GET['page'])) : 1;

// Get folder path from GET or POST
if (isset($_GET['folder'])) {
    $folderPath = base64_decode($_GET['folder']);
} elseif (isset($_POST['current_folder'])) {
    $folderPath = $_POST['current_folder'];
} elseif (isset($_POST['folder_path'])) {
    $folderPath = trim($_POST['folder_path']);
}

// Handle delete request
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['delete_file'])) {
    $fileToDelete = base64_decode($_POST['delete_file']);
    
    if (file_exists($fileToDelete) && is_file($fileToDelete)) {
        if (unlink($fileToDelete)) {
            $success = 'File deleted successfully!';
        } else {
            $error = 'Failed to delete the file. Please check permissions.';
        }
    } else {
        $error = 'File not found or already deleted.';
    }
}

// Handle multiple delete request
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['delete_multiple'])) {
    if (isset($_POST['selected_files']) && is_array($_POST['selected_files'])) {
        $deletedCount = 0;
        $failedCount = 0;
        
        foreach ($_POST['selected_files'] as $encodedPath) {
            $filePath = base64_decode($encodedPath);
            
            if (file_exists($filePath) && is_file($filePath)) {
                if (unlink($filePath)) {
                    $deletedCount++;
                } else {
                    $failedCount++;
                }
            } else {
                $failedCount++;
            }
        }
        
        if ($deletedCount > 0) {
            $success = "Successfully deleted $deletedCount file" . ($deletedCount > 1 ? 's' : '') . '!';
            if ($failedCount > 0) {
                $success .= " ($failedCount failed)";
            }
        } else {
            $error = 'Failed to delete selected files.';
        }
    } else {
        $error = 'No files selected for deletion.';
    }
}

// Handle folder browsing
if (!empty($folderPath)) {
    // Validate folder path
    if (!is_dir($folderPath)) {
        $error = 'The specified folder does not exist';
        $folderPath = '';
    } elseif (!is_readable($folderPath)) {
        $error = 'The folder is not readable. Please check permissions.';
        $folderPath = '';
    } else {
        // Get all files from the folder
        $allFiles = scandir($folderPath);
        
        // Filter for supported media types
        $supportedExtensions = ['jpg', 'jpeg', 'png', 'gif', 'webp', 'svg', 'pdf', 'mp4', 'webm', 'ogg', 'mov', 'avi'];
        
        foreach ($allFiles as $file) {
            if ($file === '.' || $file === '..') continue;
            
            $filePath = $folderPath . DIRECTORY_SEPARATOR . $file;
            
            if (is_file($filePath)) {
                $extension = strtolower(pathinfo($file, PATHINFO_EXTENSION));
                
                if (in_array($extension, $supportedExtensions)) {
                    $fileType = '';
                    
                    if (in_array($extension, ['jpg', 'jpeg', 'png', 'gif', 'webp', 'svg'])) {
                        $fileType = 'image';
                    } elseif ($extension === 'pdf') {
                        $fileType = 'pdf';
                    } elseif (in_array($extension, ['mp4', 'webm', 'ogg', 'mov', 'avi'])) {
                        $fileType = 'video';
                    }
                    
                    $files[] = [
                        'name' => $file,
                        'path' => $filePath,
                        'type' => $fileType,
                        'extension' => $extension,
                        'size' => filesize($filePath),
                        'modified' => filemtime($filePath)
                    ];
                }
            }
        }
        
        // Sort files by name
        usort($files, function($a, $b) {
            return strcmp($a['name'], $b['name']);
        });
    }
}

// Calculate pagination
$totalFiles = count($files);
$totalPages = ceil($totalFiles / $itemsPerPage);
$currentPage = min($currentPage, max(1, $totalPages)); // Ensure valid page
$offset = ($currentPage - 1) * $itemsPerPage;
$paginatedFiles = array_slice($files, $offset, $itemsPerPage);

// Helper function to format file size
function formatFileSize($bytes) {
    if ($bytes >= 1073741824) {
        return number_format($bytes / 1073741824, 2) . ' GB';
    } elseif ($bytes >= 1048576) {
        return number_format($bytes / 1048576, 2) . ' MB';
    } elseif ($bytes >= 1024) {
        return number_format($bytes / 1024, 2) . ' KB';
    } else {
        return $bytes . ' bytes';
    }
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Media File Browser - View Images, PDFs & Videos</title>
    <link rel="stylesheet" href="styles.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
</head>
<body>
    <div class="container">
        <header class="header">
            <div class="header-content">
                <h1 class="title">
                    <svg class="title-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <path d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"></path>
                    </svg>
                    Media File Browser
                </h1>
                <p class="subtitle">Browse and preview images, PDFs, and videos from any folder</p>
            </div>
        </header>

        <div class="search-section">
            <form method="POST" action="" class="search-form">
                <div class="input-group">
                    <svg class="input-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <path d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"></path>
                    </svg>
                    <input 
                        type="text" 
                        name="folder_path" 
                        id="folder_path" 
                        placeholder="Enter folder path (e.g., C:\Users\YourName\Pictures)" 
                        value="<?php echo htmlspecialchars($folderPath); ?>"
                        class="folder-input"
                        required
                    >
                    <button type="submit" class="browse-btn">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <circle cx="11" cy="11" r="8"></circle>
                            <path d="m21 21-4.35-4.35"></path>
                        </svg>
                        Browse
                    </button>
                </div>
            </form>
        </div>

        <?php if ($error): ?>
            <div class="error-message">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <circle cx="12" cy="12" r="10"></circle>
                    <line x1="12" y1="8" x2="12" y2="12"></line>
                    <line x1="12" y1="16" x2="12.01" y2="16"></line>
                </svg>
                <?php echo htmlspecialchars($error); ?>
            </div>
        <?php endif; ?>

        <?php if ($success): ?>
            <div class="success-message">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <circle cx="12" cy="12" r="10"></circle>
                    <path d="M9 12l2 2 4-4"></path>
                </svg>
                <?php echo htmlspecialchars($success); ?>
            </div>
        <?php endif; ?>

        <?php if (!empty($files)): ?>
            <div class="results-header">
                <div class="results-left">
                    <h2 class="results-title">
                        Found <?php echo $totalFiles; ?> media file<?php echo $totalFiles !== 1 ? 's' : ''; ?>
                        <?php if ($totalPages > 1): ?>
                            <span class="page-info">(Page <?php echo $currentPage; ?> of <?php echo $totalPages; ?>)</span>
                        <?php endif; ?>
                    </h2>
                    <div class="bulk-actions">
                        <label class="checkbox-label">
                            <input type="checkbox" id="selectAll" onclick="toggleSelectAll(this)">
                            <span>Select All</span>
                        </label>
                        <button id="deleteSelectedBtn" class="delete-selected-btn" onclick="deleteSelected()" disabled>
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <polyline points="3 6 5 6 21 6"></polyline>
                                <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                            </svg>
                            Delete Selected (<span id="selectedCount">0</span>)
                        </button>
                    </div>
                </div>
                <div class="filter-tabs">
                    <button class="filter-tab active" data-filter="all">All</button>
                    <button class="filter-tab" data-filter="image">Images</button>
                    <button class="filter-tab" data-filter="pdf">PDFs</button>
                    <button class="filter-tab" data-filter="video">Videos</button>
                </div>
            </div>

            <form id="bulkDeleteForm" method="POST" action="">
                <input type="hidden" name="delete_multiple" value="1">
                <input type="hidden" name="current_folder" value="<?php echo htmlspecialchars($folderPath); ?>">

            <div class="media-grid">
                <?php foreach ($paginatedFiles as $file): 
                    $encodedFilePath = base64_encode($file['path']);
                ?>
                    <div class="media-card" data-type="<?php echo $file['type']; ?>">
                        <div class="card-checkbox">
                            <input type="checkbox" name="selected_files[]" value="<?php echo htmlspecialchars($encodedFilePath); ?>" class="file-checkbox" onchange="updateSelectedCount()">
                        </div>
                        <div class="media-preview">
                            <?php if ($file['type'] === 'image'): ?>
                                <img src="view.php?file=<?php echo urlencode($encodedFilePath); ?>&encoded=1" alt="<?php echo htmlspecialchars($file['name']); ?>" class="preview-image">
                            <?php elseif ($file['type'] === 'pdf'): ?>
                                <div class="pdf-preview">
                                    <iframe src="view.php?file=<?php echo urlencode($encodedFilePath); ?>&encoded=1" class="pdf-iframe" frameborder="0" loading="lazy"></iframe>
                                </div>
                            <?php elseif ($file['type'] === 'video'): ?>
                                <div class="video-preview">
                                    <video controls preload="metadata">
                                        <source src="view.php?file=<?php echo urlencode($encodedFilePath); ?>&encoded=1" type="video/<?php echo $file['extension']; ?>">
                                        Your browser does not support the video tag.
                                    </video>
                                </div>
                            <?php endif; ?>
                        </div>
                        
                        <div class="media-info">
                            <h3 class="media-name" title="<?php echo htmlspecialchars($file['name']); ?>">
                                <?php echo htmlspecialchars($file['name']); ?>
                            </h3>
                            <div class="media-meta">
                                <span class="meta-item">
                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                        <path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path>
                                        <polyline points="13 2 13 9 20 9"></polyline>
                                    </svg>
                                    <?php echo formatFileSize($file['size']); ?>
                                </span>
                                <span class="meta-item">
                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                        <circle cx="12" cy="12" r="10"></circle>
                                        <polyline points="12 6 12 12 16 14"></polyline>
                                    </svg>
                                    <?php echo date('M d, Y', $file['modified']); ?>
                                </span>
                            </div>
                            <div class="action-buttons">
                                <a href="view.php?file=<?php echo urlencode($encodedFilePath); ?>&encoded=1&download=1" class="download-btn" download>
                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                        <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
                                        <polyline points="7 10 12 15 17 10"></polyline>
                                        <line x1="12" y1="15" x2="12" y2="3"></line>
                                    </svg>
                                    Download
                                </a>
                                <button class="delete-btn" onclick="confirmDelete('<?php echo /* htmlspecialchars($file['path'], ENT_QUOTES) */$encodedFilePath; ?>', '<?php echo htmlspecialchars($file['name'], ENT_QUOTES); ?>')">
                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                        <polyline points="3 6 5 6 21 6"></polyline>
                                        <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                                        <line x1="10" y1="11" x2="10" y2="17"></line>
                                        <line x1="14" y1="11" x2="14" y2="17"></line>
                                    </svg>
                                    Delete
                                </button>
                            </div>
                        </div>
                    </div>
                <?php endforeach; ?>
            </div>
            </form>

            <?php if ($totalPages > 1): ?>
                <div class="pagination">
                    <?php 
                    $encodedFolder = base64_encode($folderPath);
                    if ($currentPage > 1): ?>
                        <a href="?folder=<?php echo urlencode($encodedFolder); ?>&page=<?php echo $currentPage - 1; ?>" class="pagination-btn">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <polyline points="15 18 9 12 15 6"></polyline>
                            </svg>
                            Previous
                        </a>
                    <?php else: ?>
                        <span class="pagination-btn disabled">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <polyline points="15 18 9 12 15 6"></polyline>
                            </svg>
                            Previous
                        </span>
                    <?php endif; ?>

                    <div class="pagination-numbers">
                        <?php
                        $startPage = max(1, $currentPage - 2);
                        $endPage = min($totalPages, $currentPage + 2);
                        
                        if ($startPage > 1): ?>
                            <a href="?folder=<?php echo urlencode($encodedFolder); ?>&page=1" class="pagination-number">1</a>
                            <?php if ($startPage > 2): ?>
                                <span class="pagination-ellipsis">...</span>
                            <?php endif; ?>
                        <?php endif; ?>

                        <?php for ($i = $startPage; $i <= $endPage; $i++): ?>
                            <?php if ($i == $currentPage): ?>
                                <span class="pagination-number active"><?php echo $i; ?></span>
                            <?php else: ?>
                                <a href="?folder=<?php echo urlencode($encodedFolder); ?>&page=<?php echo $i; ?>" class="pagination-number"><?php echo $i; ?></a>
                            <?php endif; ?>
                        <?php endfor; ?>

                        <?php if ($endPage < $totalPages): ?>
                            <?php if ($endPage < $totalPages - 1): ?>
                                <span class="pagination-ellipsis">...</span>
                            <?php endif; ?>
                            <a href="?folder=<?php echo urlencode($encodedFolder); ?>&page=<?php echo $totalPages; ?>" class="pagination-number"><?php echo $totalPages; ?></a>
                        <?php endif; ?>
                    </div>

                    <?php if ($currentPage < $totalPages): ?>
                        <a href="?folder=<?php echo urlencode($encodedFolder); ?>&page=<?php echo $currentPage + 1; ?>" class="pagination-btn">
                            Next
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <polyline points="9 18 15 12 9 6"></polyline>
                            </svg>
                        </a>
                    <?php else: ?>
                        <span class="pagination-btn disabled">
                            Next
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <polyline points="9 18 15 12 9 6"></polyline>
                            </svg>
                        </span>
                    <?php endif; ?>
                </div>
            <?php endif; ?>
        <?php elseif ($_SERVER['REQUEST_METHOD'] === 'POST' && empty($error)): ?>
            <div class="empty-state">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"></path>
                </svg>
                <h3>No media files found</h3>
                <p>The folder doesn't contain any images, PDFs, or videos.</p>
            </div>
        <?php endif; ?>
    </div>

    <!-- Hidden form for delete operations -->
    <form id="deleteForm" method="POST" action="" style="display: none;">
        <input type="hidden" name="delete_file" id="deleteFilePath">
        <input type="hidden" name="current_folder" value="<?php echo htmlspecialchars($folderPath); ?>">
    </form>

    <script>
        // Bulk delete functions
        function toggleSelectAll(checkbox) {
            const fileCheckboxes = document.querySelectorAll('.file-checkbox');
            fileCheckboxes.forEach(cb => {
                cb.checked = checkbox.checked;
            });
            updateSelectedCount();
        }

        function updateSelectedCount() {
            const checkboxes = document.querySelectorAll('.file-checkbox:checked');
            const count = checkboxes.length;
            const countSpan = document.getElementById('selectedCount');
            const deleteBtn = document.getElementById('deleteSelectedBtn');
            const selectAllCheckbox = document.getElementById('selectAll');
            
            if (countSpan) countSpan.textContent = count;
            if (deleteBtn) deleteBtn.disabled = count === 0;
            
            // Update select all checkbox state
            const allCheckboxes = document.querySelectorAll('.file-checkbox');
            if (selectAllCheckbox && allCheckboxes.length > 0) {
                selectAllCheckbox.checked = count === allCheckboxes.length;
                selectAllCheckbox.indeterminate = count > 0 && count < allCheckboxes.length;
            }
        }

        function deleteSelected() {
            const checkboxes = document.querySelectorAll('.file-checkbox:checked');
            const count = checkboxes.length;
            
            if (count === 0) {
                alert('Please select files to delete.');
                return false;
            }
            
            if (confirm(`Are you sure you want to delete ${count} file${count > 1 ? 's' : ''}?\n\nThis action cannot be undone.`)) {
                document.getElementById('bulkDeleteForm').submit();
            }
            
            return false;
        }

        // Single file delete function
        function confirmDelete(filePath, fileName) {
            console.log(filePath, fileName);
            if (confirm('Are you sure you want to delete "' + fileName + '"?\n\nThis action cannot be undone.')) {
                document.getElementById('deleteFilePath').value = filePath;
                document.getElementById('deleteForm').submit();
            }
        }
    </script>
    <script src="script.js"></script>
</body>
</html>