Create New Item
Item Type
File
Folder
Item Name
Search file in folder and subfolders...
Are you sure want to rename?
File Manager
/
MDPH
/
explorer
:
explorateur012.php
Advanced Search
Upload
New Item
Settings
Back
Back Up
Advanced Editor
Save
<?php // Connexion à la base de données $servername = "localhost"; $username = "root"; $password = ""; $dbname = "your_database_name"; $servername = "analogdepat.mysql.db"; $username = "analogdepat"; $password = "Un92pac007"; $dbname = "analogdepat"; $conn = new mysqli($servername, $username, $password, $dbname); if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); } // Récupérer les données de la table $sql = "SELECT name, element FROM lists_fichiers"; $result = $conn->query($sql); $data = []; if ($result->num_rows > 0) { while($row = $result->fetch_assoc()) { $name = $row['name']; $element = $row['element']; if (!isset($data[$name])) { $data[$name] = []; } $data[$name][] = $element; } } $conn->close(); // Convertir le tableau en JSON $jsonData = json_encode($data); function scanDirectory($directory) { $result = []; $files = scandir($directory); foreach ($files as $file) { if ($file !== '.' && $file !== '..') { $path = $directory . DIRECTORY_SEPARATOR . $file; if (is_dir($path)) { $result[] = [ 'name' => $file, 'type' => 'directory', 'children' => scanDirectory($path) ]; } else { $result[] = [ 'name' => $file, 'type' => 'file' ]; } } } return $result; } function displayTree($tree, $fileData, $level = 0) { foreach ($tree as $item) { if (isset($fileData[$item['name']])) { echo '<ul class="tree-item" style="margin-left: ' . ($level * 20) . 'px; list-style-type: none;">'; echo '<li>'; echo '<span class="toggle" onclick="toggleTree(this)">+</span>'; echo '<span class="name"><i class="fas fa-folder directory-icon"></i>' . htmlspecialchars($item['name']) . '</span>'; echo '<ul class="sub-list" style="display: none;">'; foreach ($fileData[$item['name']] as $subElement) { echo '<li class="sub-element"><i class="fas fa-file sub-element-icon"></i><span class="context-menu-trigger">' . htmlspecialchars($subElement) . '</span></li>'; } echo '</ul>'; echo '</li>'; echo '</ul>'; } else { echo '<div class="tree-item" style="margin-left: ' . ($level * 20) . 'px;">'; echo '<span class="toggle" onclick="toggleTree(this)">' . ($item['type'] === 'directory' ? '+' : '') . '</span>'; echo '<span class="name"><i class="fas fa-folder directory-icon"></i>' . htmlspecialchars($item['name']) . '</span>'; if (isset($item['children'])) { echo '<div class="tree-children" style="display: none;">'; displayTree($item['children'], $fileData, $level + 1); echo '</div>'; } echo '</div>'; } // Ajouter les lignes en pointillés if ($level > 0) { echo '<div class="vertical-line" style="margin-left: ' . (($level - 1) * 20) . 'px;"></div>'; } echo '<div class="horizontal-line" style="margin-left: ' . ($level * 20) . 'px;"></div>'; } } $directory = 'path/to/your/directory'; // Remplacez par le chemin de votre répertoire $directory = "/home/analogde/www/2024_PHP/2024_PHP_26_10_2024"; $tree = scanDirectory($directory); ?> <!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <title>Tree View</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"> <style> .tree-item { cursor: pointer; } .toggle { display: inline-block; width: 20px; text-align: center; } .name { display: inline-block; } .tree-children { margin-left: 20px; } .sub-list { margin-left: 20px; } .sub-element { margin-left: 20px; } .tree-item ul { list-style-type: none; padding: 0; } .context-menu { display: none; position: absolute; background-color: white; border: 1px solid #ccc; box-shadow: 0 2px 10px rgba(0,0,0,0.1); z-index: 1000; } .context-menu ul { list-style-type: none; padding: 0; margin: 0; } .context-menu ul li { padding: 10px; cursor: pointer; } .context-menu ul li:hover { background-color: #f0f0f0; } .directory-icon { margin-right: 5px; } .sub-element-icon { margin-right: 5px; } .vertical-line { border-left: 1px dashed #ccc; height: 20px; position: absolute; top: 0; } .horizontal-line { border-top: 1px dashed #ccc; width: 20px; position: absolute; left: 0; } </style> <script> const fileData = <?php echo $jsonData; ?>; function toggleTree(element) { const children = element.nextElementSibling.nextElementSibling; if (children && children.classList.contains('tree-children')) { if (children.style.display === 'none') { children.style.display = 'block'; element.textContent = '-'; } else { children.style.display = 'none'; element.textContent = '+'; } } else if (children && children.classList.contains('sub-list')) { if (children.style.display === 'none') { children.style.display = 'block'; element.textContent = '-'; } else { children.style.display = 'none'; element.textContent = '+'; } } } document.addEventListener('contextmenu', function(event) { if (event.target.classList.contains('context-menu-trigger')) { event.preventDefault(); const menu = document.getElementById('context-menu'); menu.style.display = 'block'; menu.style.left = event.pageX + 'px'; menu.style.top = event.pageY + 'px'; menu.dataset.item = event.target.textContent; menu.dataset.parent = event.target.parentElement.parentElement.previousElementSibling.textContent; } }); document.addEventListener('click', function(event) { const menu = document.getElementById('context-menu'); if (menu.style.display === 'block' && !event.target.classList.contains('context-menu-trigger')) { menu.style.display = 'none'; } }); document.addEventListener('keydown', function(event) { if (event.key === 'Escape') { const menu = document.getElementById('context-menu'); menu.style.display = 'none'; } }); function handleContextMenuClick(option) { const menu = document.getElementById('context-menu'); menu.style.display = 'none'; alert('Option sélectionnée: ' + option); if (option === 'Lien') { window.location.href = 'redirect.php?parent=' + encodeURIComponent(menu.dataset.parent) + '&item=' + encodeURIComponent(menu.dataset.item); } } </script> </head> <body> <div class="tree-view"> <?php displayTree($tree, json_decode($jsonData, true)); ?> </div> <div id="context-menu" class="context-menu"> <ul> <li onclick="handleContextMenuClick('Option 1')">Option 1</li> <li onclick="handleContextMenuClick('Option 2')">Option 2</li> <li onclick="handleContextMenuClick('Option 3')">Option 3</li> <li onclick="handleContextMenuClick('Option 4')">Option 4</li> <li onclick="handleContextMenuClick('Option 5')">Option 5</li> <li onclick="handleContextMenuClick('Lien')">Lien</li> </ul> </div> </body> </html>