Update templates/index.html

templates/index.html

@@ -125,7 +125,8 @@
                 <h3>📁 Glisser-déposer votre image ici</h3>
                 <p>ou cliquez pour sélectionner un fichier</p>
                 <input type="file" id="fileInput" accept="image/*" style="display: none;">
-                <button class="btn" onclick="document.getElementById('fileInput').click()">
+                <!-- MODIFICATION 1: Suppression du onclick et ajout d'un id -->
+                <button class="btn" id="uploadButton">
                     Choisir un fichier
                 </button>
             </div>
@@ -159,8 +160,21 @@
         // Gestion de l'upload
         const uploadBox = document.getElementById('uploadBox');
         const fileInput = document.getElementById('fileInput');
+        // MODIFICATION 2: Sélection du bouton par son nouvel id
+        const uploadButton = document.getElementById('uploadButton');
         
+        // L'utilisateur peut cliquer sur toute la zone
         uploadBox.addEventListener('click', () => fileInput.click());
+        
+        // MODIFICATION 3: Ajout d'un écouteur dédié au bouton
+        uploadButton.addEventListener('click', (e) => {
+            // Empêche le clic de "remonter" à la div parente (uploadBox),
+            // ce qui évite de déclencher l'ouverture de la fenêtre deux fois.
+            e.stopPropagation();
+            fileInput.click();
+        });
+        
+        // Gestion du glisser-déposer (Drag & Drop)
         uploadBox.addEventListener('dragover', (e) => {
             e.preventDefault();
             uploadBox.classList.add('dragover');
@@ -177,6 +191,7 @@
             }
         });
         
+        // Gestion de la sélection de fichier
         fileInput.addEventListener('change', (e) => {
             if (e.target.files.length > 0) {
                 uploadFile(e.target.files[0]);