Put tasks in a div

[vopamoi] / vopamoi.ts

diff --git a/vopamoi.ts b/vopamoi.ts
index 59c287504c5ab604411bd1a757b98d37db38cea7..725f3a0209c2b41a51d8b18afe2834fa545b6a72 100644 (file)
--- a/vopamoi.ts
+++ b/vopamoi.ts
@@ -14,6 +14,10 @@ function splitN(str: string, delimiter: string, limit: number = MAX_SAFE_INTEGER
 }
 
 const Model = {
+  addTask: function (timestamp: string, description: string) {
+    document.getElementById("tasks")!.appendChild(this.createTask(timestamp, description)).focus();
+  },
+
   createTask: function (timestamp: string, description: string) {
     const task = document.createElement("div");
     task.appendChild(document.createTextNode(description));
@@ -23,8 +27,11 @@ const Model = {
     return task;
   },
 
-  addTask: function (timestamp: string, description: string) {
-    document.body.appendChild(this.createTask(timestamp, description)).focus();
+  destroyTask: function (createTimestamp: string) {
+    const task = this.getTask(createTimestamp);
+    if (task) {
+      task.parentElement!.removeChild(task);
+    }
   },
 
   getTask: function (createTimestamp: string) {
@@ -35,13 +42,6 @@ const Model = {
     }
   },
 
-  destroyTask: function (createTimestamp: string) {
-    const task = this.getTask(createTimestamp);
-    if (task) {
-      task.parentElement!.removeChild(task);
-    }
-  },
-
   setState: function (stateTimestamp: string, createTimestamp: string, state: string) {
     const task = this.getTask(createTimestamp);
     if (task) {
@@ -125,16 +125,28 @@ const BrowserUI = {
     event.preventDefault();
   },
 
-  moveCursor: function (offset: number): boolean {
-    var active = document.activeElement;
-    if (offset === 1 && active) {
-      active = active.nextElementSibling;
-    }
-    if (offset === -1 && active) {
-      active = active.previousElementSibling;
+  visibleTaskAtOffset(task: Element, offset: number): Element {
+    var cursor: Element | null = task;
+    var valid_cursor = cursor;
+    const increment = offset / Math.abs(offset);
+    while (true) {
+      cursor = increment > 0 ? cursor.nextElementSibling : cursor.previousElementSibling;
+      if (!cursor || !(cursor instanceof HTMLElement)) break;
+      if (cursor.style.display !== "none") {
+        offset -= increment;
+        valid_cursor = cursor;
+      }
+      if (Math.abs(offset) < 0.5) break;
     }
-    if (active && active instanceof HTMLElement) {
-      active.focus();
+    return valid_cursor;
+  },
+
+  moveCursor: function (offset: number): boolean {
+    const active = document.activeElement;
+    if (!active) return false;
+    const dest = this.visibleTaskAtOffset(active, offset);
+    if (dest !== active && dest instanceof HTMLElement) {
+      dest.focus();
       return true;
     }
     return false;