From b31bca91ad557301691092377194c689b28e0e1a Mon Sep 17 00:00:00 2001
From: calboo <cal@rabooboo.de>
Date: Wed, 11 Feb 2026 13:32:32 +0100
Subject: [PATCH] create subcategories from creation form

---
 templates/dashboard.html | 54 +++++++++++++++++++++++++++++++++++++---
 1 file changed, 51 insertions(+), 3 deletions(-)

diff --git a/templates/dashboard.html b/templates/dashboard.html
index 7406094..3599f6b 100644
--- a/templates/dashboard.html
+++ b/templates/dashboard.html
@@ -127,13 +127,24 @@
         <!-- Create Activity Form -->
         <div id="newActivityForm" class="card" style="display:none; margin-top: 2rem; text-align: left;">
             <h3>Create New Activity Category</h3>
-            <form action="{{ url_for('add_activity') }}" method="POST" onsubmit="prepareTasksList()">
+            <form action="{{ url_for('add_activity') }}" method="POST" onsubmit="prepareTasksList(); prepareSubcatsList();">
                 <label>Name</label>
                 <input type="text" name="name" required placeholder="e.g. Household">
                 
                 <label>Color</label>
                 <input type="color" name="color" value="#3498db" style="width:100%; height:40px; border:none;">
                 
+                <label>Subcategories / Contexts</label>
+                <p style="font-size: 0.8rem; color: var(--text-secondary); margin-top: -10px;">
+                    Define specific contexts (e.g. Client A, Project X). You can pick one when starting the activity.
+                </p>
+                <div style="display: flex; gap: 5px; margin-bottom: 10px;">
+                    <input type="text" id="newSubcatInput" placeholder="Add subcategory..." style="margin-bottom: 0;">
+                    <button type="button" class="btn" style="background: #27ae60;" onclick="addNewSubcat()">Add</button>
+                </div>
+                <ul id="newSubcatsListDisplay" style="list-style: none; padding: 0; margin-bottom: 1rem;"></ul>
+                <input type="hidden" name="subcategories_data" id="subcatsListData">
+
                 <label>Default Tasks (Template)</label>
                 <p style="font-size: 0.8rem; color: var(--text-secondary); margin-top: -10px;">
                     These tasks will be created automatically every time you start this activity.
@@ -224,6 +235,8 @@
     // Global vars - MUST be declared before any functions that use them
     let currentActivityId = "{{ current_entry.activity_id if current_entry else '' }}";
     let currentSubcategory = "{{ current_entry.subcategory if current_entry else '' }}";
+    let newActivitySubcats = [];
+    let newActivityTasks = [];
 
     // Timer Logic
     let startTime = {% if current_entry %}{{ current_entry.start_time.timestamp() * 1000 }}{% else %}null{% endif %};
@@ -438,8 +451,43 @@
         });
     }
 
-    // New Task List Logic for Activity Creation form (Reusing existing script)
-    let newActivityTasks = [];
+    // Subcategory List Logic for Activity Creation form
+    function addNewSubcat() {
+        const input = document.getElementById('newSubcatInput');
+        const val = input.value.trim();
+        if (val) {
+            newActivitySubcats.push(val);
+            input.value = '';
+            renderNewActivitySubcats();
+        }
+    }
+    function removeNewSubcat(index) {
+        newActivitySubcats.splice(index, 1);
+        renderNewActivitySubcats();
+    }
+    function renderNewActivitySubcats() {
+        const list = document.getElementById('newSubcatsListDisplay');
+        list.innerHTML = '';
+        newActivitySubcats.forEach((item, index) => {
+            const li = document.createElement('li');
+            li.style.background = '#f7f7f5';
+            li.style.border = '1px solid var(--border-dim)';
+            li.style.margin = '5px 0';
+            li.style.padding = '8px';
+            li.style.borderRadius = '4px';
+            li.style.display = 'flex';
+            li.style.justifyContent = 'space-between';
+            li.style.alignItems = 'center';
+            li.style.fontSize = '0.9rem';
+            li.innerHTML = `<span>${item}</span><span onclick="removeNewSubcat(${index})" style="cursor: pointer; color: var(--danger-color); font-weight: bold; padding: 0 5px;">&times;</span>`;
+            list.appendChild(li);
+        });
+    }
+    function prepareSubcatsList() {
+        document.getElementById('subcatsListData').value = newActivitySubcats.join(',');
+    }
+
+    // New Task List Logic for Activity Creation form
     function addNewTask() {
         const input = document.getElementById('newTaskInput');
         const val = input.value.trim();