add download feature

video.php

@@ -224,7 +224,7 @@ if (empty($videoData) || isset($videoData['error'])) {
                                 <i class="fas fa-share"></i>
                                 <span>Partager</span>
                             </button>
-                            <button class="action-button">
+                            <button class="action-button" id="download-btn">
                                 <i class="fas fa-download"></i>
                                 <span>Télécharger</span>
                             </button>
@@ -426,7 +426,74 @@ if (empty($videoData) || isset($videoData['error'])) {
         </a>
     </div>
     
+    <!-- Modal de téléchargement -->
+    <div id="download-modal" class="modal">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h3>Télécharger la vidéo</h3>
+                <button class="modal-close"><i class="fas fa-times"></i></button>
+            </div>
+            <div class="modal-body">
+                <p>Choisissez la résolution souhaitée :</p>
+                <div class="download-options">
+                    <?php 
+                    $downloadOptions = getVideoDownloadOptions($videoData['uuid']);
+                    if (!empty($downloadOptions)):
+                        foreach ($downloadOptions as $option):
+                    ?>
+                    <a href="<?php echo $option['url']; ?>" class="download-option" download>
+                        <div class="download-resolution">
+                            <i class="fas fa-film"></i>
+                            <span><?php echo $option['resolution']; ?></span>
+                        </div>
+                        <div class="download-info">
+                            <span class="download-size"><?php echo $option['size']; ?></span>
+                            <i class="fas fa-download"></i>
+                        </div>
+                    </a>
+                    <?php 
+                        endforeach;
+                    else:
+                    ?>
+                    <p class="no-download-options">Aucune option de téléchargement disponible pour cette vidéo.</p>
+                    <?php endif; ?>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <p class="download-info-text">Le téléchargement démarrera automatiquement après avoir cliqué sur une résolution.</p>
+            </div>
+        </div>
+    </div>
+    
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
     <script src="js/main.js"></script>
+    <script>
+        // Script pour la modal de téléchargement
+        document.addEventListener('DOMContentLoaded', function() {
+            const modal = document.getElementById('download-modal');
+            const downloadBtn = document.getElementById('download-btn');
+            const closeBtn = modal.querySelector('.modal-close');
+            
+            // Ouvrir la modal
+            downloadBtn.addEventListener('click', function() {
+                modal.classList.add('show');
+                document.body.style.overflow = 'hidden'; // Empêcher le défilement
+            });
+            
+            // Fermer la modal
+            closeBtn.addEventListener('click', function() {
+                modal.classList.remove('show');
+                document.body.style.overflow = ''; // Réactiver le défilement
+            });
+            
+            // Fermer la modal si on clique en dehors
+            window.addEventListener('click', function(event) {
+                if (event.target === modal) {
+                    modal.classList.remove('show');
+                    document.body.style.overflow = '';
+                }
+            });
+        });
+    </script>
 </body>
 </html>