ter

src/templates/nutrition.html

@@ -7,6 +7,8 @@
     <link rel="shortcut icon" href="../static/images/favicon.ico">
     
     <script>
+        let isEditing = false;
+
         function updateSubmitButtonState() {
             const inputs = document.querySelectorAll('#nutrition-form input');
             const allFilled = Array.from(inputs).every(input => input.value.trim() !== '');
@@ -58,23 +60,40 @@
 
 
         function showPasswordPrompt(action) {
+        // Setze isEditing je nach Aktion
+        isEditing = (action === 'edit');
+        if (isEditing) {
+            // Deaktiviere Zeilenauswahl
+            document.getElementById('database-nutrition-table').removeEventListener('click', handleRowClick);
+        } else {
+            // Aktiviere Zeilenauswahl
+            document.getElementById('database-nutrition-table').addEventListener('click', handleRowClick);
+        }
         document.getElementById('delete-row-button').style.display = action === 'edit' ? 'none' : 'block';
         document.getElementById('edit-row-button').style.display = action === 'delete' ? 'none' : 'block';
         document.getElementById('password-prompt').style.display = 'block';
-            // Speichere die Aktion, um sie später zu verwenden
         document.getElementById('password-prompt').setAttribute('data-action', action);
+        // Deselektiere alle Zeilen
+        deselectAllRows();
+    }
+
+    function deselectAllRows() {
+        document.querySelectorAll('#database-nutrition-table .selected').forEach(row => {
+            row.classList.remove('selected');
+        });
+        updateDeleteButtonState();
+        updateEditButtonState();
     }
 
     function hidePasswordPrompt() {
         document.getElementById('delete-row-button').style.display = 'block';
         document.getElementById('edit-row-button').style.display = 'block';
         document.getElementById('password-prompt').style.display = 'none';
-            // Entferne die Auswahl von Zeilen
+        // Setze isEditing zurück
-            document.querySelectorAll('#database-nutrition-table .selected').forEach(row => {
+        isEditing = false;
-                row.classList.remove('selected');
+        // Deaktiviere Editierbarkeit aller Zellen und aktiviere Zeilenauswahl
-            });
+        setCellsEditable(false);
-            updateDeleteButtonState();
+        document.getElementById('database-nutrition-table').addEventListener('click', handleRowClick);
-            updateEditButtonState(); // Diese Funktion muss noch implementiert werden
     }
 
     function performActionIfPasswordCorrect() {
@@ -84,15 +103,29 @@
             if (action === 'delete') {
                 deleteSelectedRows();
             } else if (action === 'edit') {
-                    // Implementiere die Bearbeitungsfunktion hier
+                // Mache Zellen editierbar
-                    alert('Bearbeitungsmodus aktiviert - Implementiere die Logik entsprechend');
+                setCellsEditable(true);
-                }
                 hidePasswordPrompt();
+            }
         } else {
             alert('Falsches Passwort!');
         }
     }
 
+    function setCellsEditable(editable) {
+        document.querySelectorAll('#database-nutrition-table td').forEach(cell => {
+            cell.contentEditable = editable;
+        });
+    }
+
+    function handleRowClick(event) {
+        if (event.target.tagName === 'TD' && !isEditing) {
+            event.target.parentNode.classList.toggle('selected');
+            updateDeleteButtonState(); 
+            updateEditButtonState();
+        }
+    }
+
         function updateEditButtonState() {
             // Diese Funktion soll ähnlich wie updateDeleteButtonState() implementiert werden,
             // um den "Bearbeiten"-Button zu aktivieren/deaktivieren
@@ -101,8 +134,10 @@
             editButton.disabled = selectedRows === 0;
         }
 
+
         // Ergänze Event-Listener, um den Zustand des Bearbeiten-Buttons zu aktualisieren
         document.addEventListener('DOMContentLoaded', function() {
+            document.getElementById('database-nutrition-table').addEventListener('click', handleRowClick);
             const table = document.getElementById('database-nutrition-table');
             table.addEventListener('click', function(e) {
                 if (e.target.tagName === 'TD') {