Tagghantering, fix #3

public/app.js

@@ -20,6 +20,7 @@ document.addEventListener('DOMContentLoaded', function() {
     if (sessionStorage.getItem('loggedIn') === 'true') {
         loginContainer.style.display = 'none';
         appContainer.style.display = 'block';
+        loadTags();
     }
 
     loginForm.addEventListener('submit', function(e) {
@@ -33,6 +34,7 @@ document.addEventListener('DOMContentLoaded', function() {
             sessionStorage.setItem('loggedIn', 'true');
             loginContainer.style.display = 'none';
             appContainer.style.display = 'block';
+            loadTags();
         } else {
             loginMessage.textContent = 'Invalid username or password';
         }
@@ -45,14 +47,31 @@ document.addEventListener('DOMContentLoaded', function() {
         const subject = document.getElementById('subject').value;
         const description = document.getElementById('description').value;
         const scheduled = document.getElementById('scheduled').value;
+        const tagsInput = document.getElementById('tags').value;
+        const tags = tagsInput.split(',').map(tag => tag.trim()).filter(tag => tag).join(':');
 
         // Structure data for Org mode
         const taskData = {
-            subject,
+            subject: `${subject} :${tags}:`,
             description,
             scheduled
         };
 
+        // Save tags to server
+        const savedTags = JSON.parse(localStorage.getItem('tags')) || [];
+        const newTags = tagsInput.split(',').map(tag => tag.trim()).filter(tag => tag && !savedTags.includes(tag));
+        const allTags = [...savedTags, ...newTags];
+        localStorage.setItem('tags', JSON.stringify(allTags));
+        fetch('/save-tags', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({ tags: allTags })
+        }).then(() => {
+            loadTags(); // Force refresh tags after saving
+        });
+
         // Send data to backend using fetch
         fetch('/add-task', {
             method: 'POST',
@@ -82,4 +101,32 @@ document.addEventListener('DOMContentLoaded', function() {
         weekNumbers: true, // Show week numbers
         firstDayOfWeek: 1 // Start weeks on Monday
     });
+
+    // Load tags from server and initialize autocomplete
+    function loadTags() {
+        fetch('/get-tags')
+            .then(response => response.json())
+            .then(tags => {
+                localStorage.setItem('tags', JSON.stringify(tags));
+                const autocompleteData = {};
+                tags.forEach(tag => {
+                    autocompleteData[tag] = null; // Materialize autocomplete requires a key-value pair
+                });
+
+                const tagsInput = document.getElementById('tags');
+                M.Autocomplete.init(tagsInput, {
+                    data: autocompleteData,
+                    onAutocomplete: function(selectedTag) {
+                        const currentTags = tagsInput.value.split(',').map(tag => tag.trim()).filter(tag => tag);
+                        if (!currentTags.includes(selectedTag)) {
+                            currentTags.push(selectedTag);
+                            tagsInput.value = currentTags.join(', ');
+                        }
+                    }
+                });
+            })
+            .catch(error => {
+                console.error('Error loading tags:', error);
+            });
+    }
 });