From 2ea513173911fe3a7de11d0732ac442f1211d994 Mon Sep 17 00:00:00 2001
From: Tanishq Dubey <dubey@dws.rip>
Date: Sat, 1 Feb 2025 11:23:58 -0500
Subject: [PATCH] Fix multiple buttons

---
 templates/admin.html | 68 +++++++++++++++++++++++++-------------------
 1 file changed, 38 insertions(+), 30 deletions(-)

diff --git a/templates/admin.html b/templates/admin.html
index afdfe1d..5d63cac 100644
--- a/templates/admin.html
+++ b/templates/admin.html
@@ -203,8 +203,8 @@
                     <td class="editable" data-field="iso">{{ photo.iso }}</td>
                     <td>{{ photo.width }}x{{ photo.height }}</td>
                     <td>
-                        <button id="save-btn">Save</button>
-                        <button class="delete-btn" id="delete-btn">Delete</button>
+                        <button class="save-btn">Save</button>
+                        <button class="delete-btn">Delete</button>
                     </td>
                 </tr>
                 {% endfor %}
@@ -244,7 +244,7 @@
                             <label for="about.profile_image">Profile Image:</label>
                             <div style="display: flex; align-items: center; gap: 1rem;">
                                 <img id="profile-preview" src="/static/profile.jpeg" alt="Profile" style="width: 100px; height: 100px; object-fit: cover; border-radius: 50%;">
-                                <input type="file" id="profile_image_upload" accept="image/jpeg,image/png" style="flex: 1;">
+                                <input type="file" class="profile-image-upload" accept="image/jpeg,image/png" style="flex: 1;">
                             </div>
                         </div>
                         <div class="form-group">
@@ -314,6 +314,7 @@
                 alert('An error occurred while saving changes.');
             });
         }
+
         function deletePhoto(event) {
             if (confirm('Are you sure you want to delete this photo?')) {
                 const button = event.target;
@@ -338,44 +339,51 @@
                 });
             }
         }
-        
-        document.getElementById('delete-btn').addEventListener('click', (event) => deletePhoto(event));
-        document.getElementById('save-btn').addEventListener('click', (event) => saveChanges(event));
 
-        document.getElementById('profile_image_upload').addEventListener('change', async (e) => {
-            const file = e.target.files[0];
-            if (!file) return;
+        document.querySelectorAll('.delete-btn').forEach(button => {
+            button.addEventListener('click', (event) => deletePhoto(event));
+        });
 
-            const formData = new FormData();
-            formData.append('profile_image', file);
+        document.querySelectorAll('.save-btn').forEach(button => {
+            button.addEventListener('click', (event) => saveChanges(event));
+        });
 
-            try {
-                const response = await fetch('/admin/upload_profile', {
-                    method: 'POST',
-                    body: formData
-                });
-                
-                const result = await response.json();
-                if (result.success) {
-                    document.getElementById('profile-preview').src = '/static/profile.jpeg?' + new Date().getTime();
-                } else {
-                    alert('Error uploading profile image: ' + result.error);
+        document.querySelectorAll('.profile-image-upload').forEach(input => {
+            input.addEventListener('change', async (e) => {
+                const file = e.target.files[0];
+                if (!file) return;
+
+                const formData = new FormData();
+                formData.append('profile_image', file);
+
+                try {
+                    const response = await fetch('/admin/upload_profile', {
+                        method: 'POST',
+                        body: formData
+                    });
+
+                    const result = await response.json();
+                    if (result.success) {
+                        document.getElementById('profile-preview').src = '/static/profile.jpeg?' + new Date().getTime();
+                    } else {
+                        alert('Error uploading profile image: ' + result.error);
+                    }
+                } catch (error) {
+                    alert('Error uploading profile image: ' + error);
                 }
-            } catch (error) {
-                alert('Error uploading profile image: ' + error);
-            }
+            });
         });
 
         document.getElementById('configForm').addEventListener('submit', async (e) => {
             e.preventDefault();
-            
+
             const formData = {};
             const inputs = e.target.querySelectorAll('input:not([type="file"]), textarea');
-            
+
             inputs.forEach(input => {
                 formData[input.name] = input.value;
             });
-            
+
             try {
                 const response = await fetch('/admin/update_config', {
                     method: 'POST',
@@ -384,9 +392,9 @@
                     },
                     body: JSON.stringify(formData)
                 });
-                
+
                 const result = await response.json();
-                
+
                 if (result.success) {
                     alert('Configuration saved successfully');
                     location.reload();