Add debugging logs to trace scroll save behavior

static/js/tasks.js

@@ -10,7 +10,6 @@ let isInitializing = false;
 async function loadGoals() {
     try {
         goals = await get("/api/goals");
-        console.log("loadGoals: goals =", goals.map(g => ({id: g.id, selected_task_id: g.selected_task_id})));
         currentUser = await get("/api/auth/me");
         const selector = document.getElementById("goal-selector");
         const activatedGoals = goals.filter(g => g.activated);
@@ -42,27 +41,21 @@ async function loadTasks() {
     isInitializing = true;
     try {
         tasks = await get(`/api/tasks?goal_id=${selectedGoalId}`);
-        console.log("loadTasks: got", tasks.length, "tasks");
-        console.log("Task order:", tasks.map(t => ({id: t.id, title: t.title, status: t.status})));
 
         renderTasks();
         initSortable();
 
         const currentGoal = goals.find(g => g.id === selectedGoalId);
         const savedTaskId = currentGoal ? currentGoal.selected_task_id : null;
-        console.log("loadTasks: savedTaskId from goal =", savedTaskId);
         const savedTaskExists = savedTaskId && tasks.some(t => t.id === savedTaskId);
-        console.log("loadTasks: savedTaskExists =", savedTaskExists);
 
         if (savedTaskExists) {
-            console.log("loadTasks: using savedTaskId path");
             scrollToTask(savedTaskId);
             selectedTaskId = savedTaskId;
             if (isLandscapeMode()) {
                 selectTask(savedTaskId);
             }
         } else {
-            console.log("loadTasks: using fallback path");
             const doingTask = tasks.find(t => t.status === "doing");
             if (doingTask) {
                 scrollToTask(doingTask.id);
@@ -75,14 +68,6 @@ async function loadTasks() {
         }
 
         initScrollFocus();
-        const scrollView = document.getElementById("scroll-view");
-        const finalScrollTop = scrollView.scrollTop;
-        console.log("loadTasks end: scrollTop =", finalScrollTop);
-
-        // Delayed checks to catch any post-load scroll changes
-        setTimeout(() => console.log("100ms after load: scrollTop =", scrollView.scrollTop), 100);
-        setTimeout(() => console.log("500ms after load: scrollTop =", scrollView.scrollTop), 500);
-        setTimeout(() => console.log("1000ms after load: scrollTop =", scrollView.scrollTop), 1000);
     } catch (error) {
         console.error("Failed to load tasks:", error);
     } finally {
@@ -91,13 +76,19 @@ async function loadTasks() {
 }
 
 async function persistSelectedTask(taskId) {
-    if (!selectedGoalId || isInitializing) return;
+    console.log("persistSelectedTask called:", taskId, "selectedGoalId=", selectedGoalId, "isInitializing=", isInitializing);
+    if (!selectedGoalId || isInitializing) {
+        console.log("persistSelectedTask: SKIPPED due to", !selectedGoalId ? "no goal" : "initializing");
+        return;
+    }
     try {
+        console.log("persistSelectedTask: PATCH /api/goals/", selectedGoalId, "/selected-task with", taskId);
         await patch(`/api/goals/${selectedGoalId}/selected-task`, { task_id: taskId });
         const goal = goals.find(g => g.id === selectedGoalId);
         if (goal) {
             goal.selected_task_id = taskId;
         }
+        console.log("persistSelectedTask: SUCCESS, saved task", taskId);
     } catch (error) {
         console.error("Failed to persist selected task:", error);
     }
@@ -177,9 +168,11 @@ function initScrollFocus() {
     const scrollView = document.getElementById("scroll-view");
 
     scrollView.removeEventListener("scroll", handleScrollFocus);
+    scrollView.removeEventListener("scroll", handleScrollSave);
     scrollView.addEventListener("scroll", handleScrollFocus);
+    scrollView.addEventListener("scroll", handleScrollSave);
 
-    // Initial call to set in-focus class without saving
+    // Initial call to set in-focus class
     handleScrollFocus();
 }
 
@@ -211,12 +204,6 @@ function handleScrollFocus() {
 
         const taskId = parseInt(closestItem.dataset.taskId);
 
-        // Only save during initialization if it matches the saved task
-        if (!isInitializing || taskId === selectedTaskId) {
-            clearTimeout(persistTimer);
-            persistTimer = setTimeout(() => persistSelectedTask(taskId), 400);
-        }
-
         if (isLandscapeMode()) {
             if (taskId !== selectedTaskId) {
                 selectTask(taskId);
@@ -225,6 +212,37 @@ function handleScrollFocus() {
     }
 }
 
+function handleScrollSave() {
+    const scrollView = document.getElementById("scroll-view");
+    const taskItems = document.querySelectorAll(".task-item");
+    const scrollViewRect = scrollView.getBoundingClientRect();
+
+    console.log("handleScrollSave: isInitializing=", isInitializing, "task count=", taskItems.length);
+
+    // Find the task closest to the top of the scroll view
+    let topTask = null;
+    let minTopDistance = Infinity;
+
+    taskItems.forEach(item => {
+        const itemRect = item.getBoundingClientRect();
+        const distanceFromTop = Math.abs(itemRect.top - scrollViewRect.top);
+        console.log(`Task ${item.dataset.taskId}: rect.top=${itemRect.top}, distance=${distanceFromTop}`);
+
+        if (distanceFromTop < minTopDistance) {
+            minTopDistance = distanceFromTop;
+            topTask = item;
+        }
+    });
+
+    console.log("handleScrollSave: selected topTask=", topTask?.dataset.taskId, "saving=", topTask && !isInitializing);
+
+    if (topTask && !isInitializing) {
+        const taskId = parseInt(topTask.dataset.taskId);
+        clearTimeout(persistTimer);
+        persistTimer = setTimeout(() => persistSelectedTask(taskId), 400);
+    }
+}
+
 function isLandscapeMode() {
     return window.innerWidth > window.innerHeight && window.innerWidth >= 1024;
 }