From 8d93dbfc112f130b4c71a518b384fc3e72ceebe9 Mon Sep 17 00:00:00 2001
From: Stephan Richter <s.richter@srsoftware.de>
Date: Sun, 19 Jul 2026 23:47:53 +0200
Subject: [PATCH] implemented timetracking as kanban drag target

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>
---
 frontend/src/Components/TimeRecorder.svelte | 40 ++++++++++++++++++---
 frontend/src/routes/project/Kanban.svelte   |  7 +++-
 2 files changed, 42 insertions(+), 5 deletions(-)

diff --git a/frontend/src/Components/TimeRecorder.svelte b/frontend/src/Components/TimeRecorder.svelte
index b39bfd35..fc049d0b 100644
--- a/frontend/src/Components/TimeRecorder.svelte
+++ b/frontend/src/Components/TimeRecorder.svelte
@@ -4,12 +4,47 @@
 
     import { api }           from '../urls.svelte';
     import { t }             from '../translations.svelte';
+    import { error, yikes }  from '../warn.svelte';
     import { msToTime, now } from '../time.svelte';
     import { timetrack }     from '../user.svelte';
 
     let interval = null;
     const router  = useTinyRouter();
 
+    async function addTime(task_id){
+        const url  = api(`time/track_task/${task_id}`);
+        const resp = await fetch(url,{
+            credentials : 'include',
+            method      : 'POST',
+            body        : now()
+        }); // create new time or return time with assigned tasks
+        if (resp.ok) {
+            const track = await resp.json();
+            timetrack.running = track;
+            yikes();
+        } else {
+            error(resp);
+        }
+    }
+
+
+    function go(){
+        router.navigate('/time');
+    }
+
+    function ondragover(ev){
+        ev.preventDefault();
+    }
+
+    function ondragleave(ev){
+        ev.preventDefault();
+    }
+
+    function ondrop(ev){
+        let task_id = ev.dataTransfer.getData('task');
+        if (task_id) addTime(task_id);
+    }
+
     async function stopTrack(){
         if (timetrack.running.id){
             const url = api(`time/${timetrack.running.id}/stop`);
@@ -28,9 +63,6 @@
         }
     }
 
-    function go(){
-        router.navigate('/time');
-    }
 
     function updateElapsed(){
         timetrack.elapsed = msToTime(Date.now() - timetrack.start);
@@ -54,7 +86,7 @@
 
 
 {#if timetrack.running}
-<span class="timetracking">
+<span class="timetracking" {ondrop} {ondragover} {ondragleave} >
     <span onclick={go} >{timetrack.running.subject} {#if timetrack.elapsed}({timetrack.elapsed}){/if}</span>
     <button onclick={stopTrack} title={t('stop')} class="symbol"></button>
 </span>
diff --git a/frontend/src/routes/project/Kanban.svelte b/frontend/src/routes/project/Kanban.svelte
index 07341024..9b37d048 100644
--- a/frontend/src/routes/project/Kanban.svelte
+++ b/frontend/src/routes/project/Kanban.svelte
@@ -207,6 +207,11 @@
         return false;
     }
 
+    function ondragstart(ev, task){
+        dragged = task;
+        ev.dataTransfer.setData("task",task.id);
+    }
+
     function openTask(task_id){
         window.open(`/task/${task_id}/view`, '_blank').focus();
     }
@@ -306,7 +311,7 @@
             <div class={['state_'+state, is_custom(state) ? '':'state_custom' ,highlight.user == u.id && highlight.state == state ? 'highlight':'']} ondragover={ev => hover(ev,u.id,state)} ondragleave={e => delete highlight.user} ondrop={ev => drop(u.id,state)} >
                 {#each Object.values(tasks[u.id][state]).sort(byName) as task}
                     {#if !filter || task.name.toLowerCase().includes(filter) || (task.tags && task.tags.filter(tag => tag.toLowerCase().includes(filter)).length)}
-                    <Card onclick={e => openTask(task.id)} ondragstart={ev => dragged=task} {task} tag_colors={project.tag_colors} />
+                    <Card onclick={e => openTask(task.id)} ondragstart={ev => ondragstart(ev,task)} {task} tag_colors={project.tag_colors} />
                     {/if}
                 {/each}
                 <div class="add_task" onclick={ev => show_task_form(project.id,u.id,+state)}>