ajout d'un bouton pour déplacer les images d'un dossier à un autre

arbre-img.php

@@ -111,6 +111,49 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
                     $_SESSION['success_message'] = "$deleteCount image(s) supprimée(s).";
                 }
                 break;
+
+                case 'move':
+                    $images = $_POST['images'] ?? [];
+                    $destinationPath = $_POST['destination_path'] ?? '';
+                    $moveCount = 0;
+                    $errors = [];
+    
+                    // Vérifier que le dossier de destination existe et est valide
+                    if (!empty($destinationPath) && is_dir($destinationPath) && isSecurePath($destinationPath)) {
+                        foreach ($images as $image) {
+                            $sourcePath = $currentPath . '/' . basename($image);
+                            $destPath = $destinationPath . '/' . basename($image);
+                            
+                            // Vérifier que le fichier source existe et est dans un chemin sécurisé
+                            if (file_exists($sourcePath) && isSecurePath($sourcePath)) {
+                                // Vérifier si un fichier du même nom existe déjà dans la destination
+                                if (file_exists($destPath)) {
+                                    $info = pathinfo($destPath);
+                                    $i = 1;
+                                    while (file_exists($destPath)) {
+                                        $destPath = $destinationPath . '/' . $info['filename'] . '_' . $i . '.' . $info['extension'];
+                                        $i++;
+                                    }
+                                }
+                                
+                                if (rename($sourcePath, $destPath)) {
+                                    $moveCount++;
+                                } else {
+                                    $errors[] = "Erreur lors du déplacement de " . basename($image);
+                                }
+                            }
+                        }
+    
+                        if ($moveCount > 0) {
+                            $_SESSION['success_message'] = "$moveCount image(s) déplacée(s) avec succès.";
+                        }
+                        if (!empty($errors)) {
+                            $_SESSION['error_message'] = implode("\n", $errors);
+                        }
+                    } else {
+                        $_SESSION['error_message'] = "Dossier de destination invalide.";
+                    }
+                    break;
         }
     }
     header('Location: arbre-img.php?path=' . urlencode($currentPath));
@@ -164,21 +207,147 @@ $images = array_map(function($img) {
                 $currentAlbumInfo = getAlbumInfo($currentPath);
                 echo 'Images de : ' . htmlspecialchars($currentAlbumInfo['title']);
             }
-            ?></h1>
+            ?>
+        </h1>
         <div class="admin-actions">
             <button onclick="document.getElementById('imageUploadForm').click()" class="action-button action-button-success">
                 Ajouter des images
             </button>
-            <button onclick="deleteSelected()" id="deleteSelectedBtn" style="display: none;" class="action-button action-button-danger">
+            <button onclick="deleteSelected()" id="deleteSelectedBtn" class="action-button action-button-danger">
                 Supprimer la sélection
             </button>
+            <button onclick="moveSelected()" id="moveSelectedBtn" class="action-button action-button-warning">
+                Déplacer la sélection
+            </button>
             <a href="arbre.php?path=<?php echo urlencode($currentPath); ?>" class="action-button action-button-secondary">
                 Retour
             </a>
         </div>
     </div>
 
+            <!-- Scripts -->
+        <script>
+            // Fonctions de gestion des sélections
+            function updateActionButtons() {
+                const checkboxes = document.querySelectorAll('.image-checkbox:checked');
+                const count = checkboxes.length;
+                
+                const deleteBtn = document.getElementById('deleteSelectedBtn');
+                const moveBtn = document.getElementById('moveSelectedBtn');
+                
+                if (count > 0) {
+                    deleteBtn.style.display = 'inline-flex';
+                    moveBtn.style.display = 'inline-flex';
+                } else {
+                    deleteBtn.style.display = 'none';
+                    moveBtn.style.display = 'none';
+                }
+            }
+
+            // Fonction de suppression multiple
+            function deleteSelected() {
+                const checkboxes = document.querySelectorAll('.image-checkbox:checked');
+                if (checkboxes.length > 0 && confirm('Êtes-vous sûr de vouloir supprimer les images sélectionnées ?')) {
+                    document.getElementById('formAction').value = 'delete';
+                    document.getElementById('imagesForm').submit();
+                }
+            }
+
+            // Fonction de déplacement
+            function moveSelected() {
+                const checkboxes = document.querySelectorAll('.image-checkbox:checked');
+                if (checkboxes.length === 0) return;
+                
+                const container = document.getElementById('selected-images-container');
+                container.innerHTML = '';
+                
+                checkboxes.forEach(checkbox => {
+                    const input = document.createElement('input');
+                    input.type = 'hidden';
+                    input.name = 'images[]';
+                    input.value = checkbox.value;
+                    container.appendChild(input);
+                });
+                
+                document.getElementById('moveFolderModal').style.display = 'block';
+            }
+
+            // Fonction de suppression d'une seule image
+            function deleteImage(imageName) {
+                if (confirm('Êtes-vous sûr de vouloir supprimer cette image ?')) {
+                    const form = document.getElementById('imagesForm');
+                    form.innerHTML = `
+                        <input type="hidden" name="action" value="delete">
+                        <input type="hidden" name="images[]" value="${imageName}">
+                    `;
+                    form.submit();
+                }
+            }
+
+            // Fonction de mise en top
+            function toggleTop(imageName) {
+                const form = document.createElement('form');
+                form.method = 'post';
+                form.innerHTML = `
+                    <input type="hidden" name="action" value="toggle_top">
+                    <input type="hidden" name="image" value="${imageName}">
+                `;
+                document.body.appendChild(form);
+                form.submit();
+            }
+
+            // Gestion des modales
+            function closeModal(modalId) {
+                document.getElementById(modalId).style.display = 'none';
+            }
+
+            // Gestion des clics sur les modales
+            window.onclick = function(event) {
+                if (event.target.classList.contains('modal')) {
+                    event.target.style.display = 'none';
+                }
+            }
+
+            // Initialisation
+            document.addEventListener('DOMContentLoaded', function() {
+                // Masquer les boutons au démarrage
+                updateActionButtons();
+
+                // Gestion du drag & drop
+                const dropZone = document.getElementById('dropZone');
+                const uploadForm = document.getElementById('uploadForm');
+                const imageUploadForm = document.getElementById('imageUploadForm');
+
+                if (dropZone) {
+                    dropZone.addEventListener('dragover', (e) => {
+                        e.preventDefault();
+                        dropZone.classList.add('drag-over');
+                    });
+
+                    dropZone.addEventListener('dragleave', () => {
+                        dropZone.classList.remove('drag-over');
+                    });
+
+                    dropZone.addEventListener('drop', (e) => {
+                        e.preventDefault();
+                        dropZone.classList.remove('drag-over');
+                        
+                        const files = e.dataTransfer.files;
+                        if (files.length > 0) {
+                            const dataTransfer = new DataTransfer();
+                            for (let file of files) {
+                                dataTransfer.items.add(file);
+                            }
+                            imageUploadForm.files = dataTransfer.files;
+                            uploadForm.submit();
+                        }
+                    });
+                }
+            });
+        </script>
+
         <div class="admin-content">
+
         <?php if (isset($_SESSION['success_message'])): ?>
             <div class="message success-message"><?php echo nl2br(htmlspecialchars($_SESSION['success_message'])); ?></div>
             <?php unset($_SESSION['success_message']); ?>
@@ -197,8 +366,8 @@ $images = array_map(function($img) {
             </form>
         </div>
 
-        <form method="post" id="deleteForm">
+        <form method="post" id="imagesForm">
-            <input type="hidden" name="action" value="delete">
+            <input type="hidden" name="action" id="formAction" value="">
             <div class="images-grid">
                 <?php foreach($images as $image):
                     $isCarousel = strpos($currentPath, 'img_carrousel') !== false;
@@ -211,7 +380,7 @@ $images = array_map(function($img) {
                 ?>
                     <div class="image-item">
                         <input type="checkbox" name="images[]" value="<?php echo htmlspecialchars($image); ?>" 
-                            class="image-checkbox" onchange="updateDeleteButton()">
+                               class="image-checkbox" onchange="updateActionButtons()">
                         <div class="image-wrapper">
                             <img src="<?php echo htmlspecialchars($imageUrl); ?>" 
                                  alt="<?php echo htmlspecialchars($image); ?>" loading="lazy">
@@ -234,7 +403,108 @@ $images = array_map(function($img) {
         </form>
     </div>
 
+    <!-- Modal de déplacement -->
+    <div id="moveFolderModal" class="modal">
+        <div class="modal-content">
+            <h2>Déplacer les images</h2>
+            <form method="post" id="moveForm">
+                <input type="hidden" name="action" value="move">
+                <div class="form-group">
+                    <label for="destination_path">Choisir le dossier de destination :</label>
+                    <select name="destination_path" id="destination_path" class="form-select" required>
+                        <option value="">Sélectionner un dossier...</option>
+                        <?php echo generateFolderList('./liste_albums', $currentPath); ?>
+                    </select>
+                </div>
+                <div id="selected-images-container"></div>
+                <div class="form-actions">
+                    <button type="button" onclick="closeModal('moveFolderModal')" 
+                            class="action-button action-button-secondary">Annuler</button>
+                    <button type="submit" class="action-button action-button-warning">Déplacer</button>
+                </div>
+            </form>
+        </div>
+    </div>
+
     <script>
+        // Gestion des boutons d'action
+        console.log("Définition de updateActionButtons");
+        function updateActionButtons() {
+            console.log("updateActionButtons appelé");
+            const checkboxes = document.querySelectorAll('.image-checkbox:checked');
+            const count = checkboxes.length;
+            console.log("Nombre d'images sélectionnées:", count);
+            
+            const deleteBtn = document.getElementById('deleteSelectedBtn');
+            const moveBtn = document.getElementById('moveSelectedBtn');
+            
+            if (!deleteBtn || !moveBtn) {
+                console.log("Boutons non trouvés");
+                return;
+            }
+
+            if (count > 0) {
+                deleteBtn.style.display = 'inline-flex';
+                moveBtn.style.display = 'inline-flex';
+                console.log("Affichage des boutons");
+            } else {
+                deleteBtn.style.display = 'none';
+                moveBtn.style.display = 'none';
+                console.log("Masquage des boutons");
+            }
+        }
+
+        // Fonction de suppression d'une seule image
+        function deleteImage(imageName) {
+            if (confirm('Êtes-vous sûr de vouloir supprimer cette image ?')) {
+                const form = document.getElementById('imagesForm');
+                form.innerHTML = `
+                    <input type="hidden" name="action" value="delete">
+                    <input type="hidden" name="images[]" value="${imageName}">
+                `;
+                form.submit();
+            }
+        }
+
+        // Fonction de suppression multiple
+        function deleteSelected() {
+            const checkboxes = document.querySelectorAll('.image-checkbox:checked');
+            if (checkboxes.length > 0 && confirm('Êtes-vous sûr de vouloir supprimer les images sélectionnées ?')) {
+                document.getElementById('formAction').value = 'delete';
+                document.getElementById('imagesForm').submit();
+            }
+        }
+
+        // Fonction de déplacement
+        function moveSelected() {
+            const checkboxes = document.querySelectorAll('.image-checkbox:checked');
+            if (checkboxes.length === 0) return;
+            
+            const container = document.getElementById('selected-images-container');
+            container.innerHTML = '';
+            
+            checkboxes.forEach(checkbox => {
+                const input = document.createElement('input');
+                input.type = 'hidden';
+                input.name = 'images[]';
+                input.value = checkbox.value;
+                container.appendChild(input);
+            });
+            
+            document.getElementById('moveFolderModal').style.display = 'block';
+        }
+
+        // Gestion des modales
+        function closeModal(modalId) {
+            document.getElementById(modalId).style.display = 'none';
+        }
+
+        window.onclick = function(event) {
+            if (event.target.classList.contains('modal')) {
+                event.target.style.display = 'none';
+            }
+        }
+
         // Gestion du drag & drop
         const dropZone = document.getElementById('dropZone');
         const uploadForm = document.getElementById('uploadForm');
@@ -255,18 +525,15 @@ $images = array_map(function($img) {
             
             const files = e.dataTransfer.files;
             if (files.length > 0) {
-        // Créer un objet DataTransfer
                 const dataTransfer = new DataTransfer();
-        // Ajouter les fichiers
                 for (let file of files) {
                     dataTransfer.items.add(file);
                 }
-        // Mettre à jour l'input
                 imageUploadForm.files = dataTransfer.files;
-        // Soumettre le formulaire
                 uploadForm.submit();
             }
         });
+
         // Fonction de mise en top
         function toggleTop(imageName) {
             const form = document.createElement('form');
@@ -279,30 +546,59 @@ $images = array_map(function($img) {
             form.submit();
         }
 
-        // Gestion de la suppression
+        // Initialisation : masquer les boutons au chargement
-        function deleteImage(imageName) {
+        document.addEventListener('DOMContentLoaded', updateActionButtons);
-            if (confirm('Êtes-vous sûr de vouloir supprimer cette image ?')) {
-                const form = document.getElementById('deleteForm');
-                form.innerHTML = `
-                    <input type="hidden" name="action" value="delete">
-                    <input type="hidden" name="images[]" value="${imageName}">
-                `;
-                form.submit();
-            }
-        }
-
-        function updateDeleteButton() {
-            const checkboxes = document.querySelectorAll('.image-checkbox:checked');
-            const deleteBtn = document.getElementById('deleteSelectedBtn');
-            deleteBtn.style.display = checkboxes.length > 0 ? 'inline-flex' : 'none';
-        }
-
-        function deleteSelected() {
-            const checkboxes = document.querySelectorAll('.image-checkbox:checked');
-            if (checkboxes.length > 0 && confirm('Êtes-vous sûr de vouloir supprimer les images sélectionnées ?')) {
-                document.getElementById('deleteForm').submit();
-            }
-        }
     </script>
+    <!-- Modal de déplacement -->
+    <div id="moveFolderModal" class="modal">
+        <div class="modal-content">
+            <h2>Déplacer les images</h2>
+            <form method="post" id="moveForm">
+                <input type="hidden" name="action" value="move">
+                <div class="form-group">
+                    <label for="destination_path">Choisir le dossier de destination :</label>
+                    <select name="destination_path" id="destination_path" class="form-select" required>
+                        <option value="">Sélectionner un dossier...</option>
+                        <?php 
+                        function generateFolderList($path, $currentPath, $level = 0) {
+                            if (!is_dir($path)) return '';
+                            
+                            $output = '';
+                            $indent = str_repeat('&nbsp;&nbsp;&nbsp;&nbsp;', $level);
+                            
+                            foreach (new DirectoryIterator($path) as $item) {
+                                if ($item->isDot()) continue;
+                                if ($item->isDir()) {
+                                    $fullPath = $item->getPathname();
+                                    // Ne pas afficher le dossier courant ni ses sous-dossiers
+                                    if (strpos($fullPath, $currentPath) === 0) continue;
+                                    // Ne pas afficher le dossier du carrousel
+                                    if (strpos($fullPath, './img_carrousel') === 0) continue;
+                                    
+                                    if (!hasSubfolders($fullPath)) {
+                                        $info = getAlbumInfo($fullPath);
+                                        $output .= '<option value="' . htmlspecialchars($fullPath) . '">' 
+                                            . $indent . htmlspecialchars($info['title']) 
+                                            . '</option>';
+                                    }
+                                    $output .= generateFolderList($fullPath, $currentPath, $level + 1);
+                                }
+                            }
+                            
+                            return $output;
+                        }
+                        echo generateFolderList('./liste_albums', $currentPath); 
+                        ?>
+                    </select>
+                </div>
+                <div id="selected-images-container"></div>
+                <div class="form-actions">
+                    <button type="button" onclick="closeModal('moveFolderModal')" 
+                            class="action-button action-button-secondary">Annuler</button>
+                    <button type="submit" class="action-button">Déplacer</button>
+                </div>
+            </form>
+        </div>
+    </div>
 </body>
 </html>

styles-admin.css

@@ -118,6 +118,37 @@ body {
     background-color: #5a6268;
 }
 
+.action-button-warning {
+    background-color: #ffc107;
+    color: #000;
+}
+
+.action-button-warning:hover {
+    background-color: #e0a800;
+}
+
+.form-select {
+    width: 100%;
+    padding: 0.8rem;
+    border: none;
+    border-radius: 0.5rem;
+    background-color: #2a2a2a;
+    color: white;
+    font-size: 1rem;
+    cursor: pointer;
+}
+
+.form-select:focus {
+    outline: 2px solid #2196f3;
+    background-color: #333;
+}
+
+.form-select option {
+    background-color: #2a2a2a;
+    color: white;
+    padding: 0.5rem;
+}
+
 /* Menu administration */
 .admin-menu {
     display: grid;