Fixar inloggningen. Menyn fortfarande ett problem

public/app.js

@@ -15,6 +15,20 @@ document.addEventListener('DOMContentLoaded', function() {
     const loginContainer = document.getElementById('loginContainer');
     const appContainer = document.getElementById('appContainer');
     const loginMessage = document.getElementById('loginMessage');
+    const logoutButton = document.getElementById('logoutButton');
+    const taskForm = document.getElementById('taskForm');
+    const hamburgerButton = document.getElementById('hamburgerButton');
+    const menuContent = document.getElementById('menuContent');
+
+    if (!loginForm || !loginContainer || !appContainer || !loginMessage || !logoutButton || !taskForm || !hamburgerButton || !menuContent) {
+        console.error('One or more elements are missing in the DOM');
+        return;
+    }
+
+    // Toggle the hamburger menu
+    hamburgerButton.addEventListener('click', function() {
+        menuContent.classList.toggle('show');
+    });
 
     // Check if user is already logged in
     fetch('/check-session')
@@ -56,7 +70,23 @@ document.addEventListener('DOMContentLoaded', function() {
         });
     });
 
-    document.getElementById('taskForm').addEventListener('submit', function(e) {
+    logoutButton.addEventListener('click', function() {
+        fetch('/logout', {
+            method: 'POST'
+        })
+        .then(response => {
+            if (response.ok) {
+                sessionStorage.removeItem('loggedIn');
+                loginContainer.style.display = 'block';
+                appContainer.style.display = 'none';
+            }
+        })
+        .catch(error => {
+            console.error('Error logging out:', error);
+        });
+    });
+
+    taskForm.addEventListener('submit', async function(e) {
         e.preventDefault();
 
         // Get form values
@@ -88,21 +118,42 @@ document.addEventListener('DOMContentLoaded', function() {
             loadTags(); // Force refresh tags after saving
         });
 
-        // Send data to backend using fetch
-        fetch('/add-task', {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
-            body: JSON.stringify(taskData)
-        })
-        .then(response => response.json())
-        .then(data => {
-            document.getElementById('responseMessage').textContent = data.message;
-        })
-        .catch(error => {
-            document.getElementById('responseMessage').textContent = "Error saving task!";
-        });
+        // Save task to server or IndexedDB if offline
+        if (navigator.onLine) {
+            try {
+                const response = await fetch('/add-task', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json',
+                    },
+                    body: JSON.stringify(taskData)
+                });
+                const data = await response.json();
+                document.getElementById('responseMessage').textContent = data.message;
+            } catch (error) {
+                if (error.status === 401) {
+                    sessionStorage.removeItem('loggedIn');
+                    loginContainer.style.display = 'block';
+                    appContainer.style.display = 'none';
+                } else {
+                    document.getElementById('responseMessage').textContent = "Error saving task!";
+                }
+            }
+        } else {
+            try {
+                // Save task to IndexedDB
+                const db = await idb.openDB('org-todo-pwa', 1, {
+                    upgrade(db) {
+                        db.createObjectStore('tasks', { keyPath: 'id', autoIncrement: true });
+                    }
+                });
+                await db.add('tasks', taskData);
+                document.getElementById('responseMessage').textContent = "Task saved offline!";
+            } catch (error) {
+                document.getElementById('responseMessage').textContent = "Error saving task offline!";
+                console.error('Error saving task offline:', error);
+            }
+        }
     });
 
     // Set tomorrow's date as the default for the date input