"va" to view all tasks

[vopamoi] / vopamoi.ts

diff --git a/vopamoi.ts b/vopamoi.ts
index 5b1ce6be2639af395b3daa7ac61a2dd2059cc413..24b8774a4225036243e3fac4aaf81e9e5c791bc0 100644 (file)
--- a/vopamoi.ts
+++ b/vopamoi.ts
@@ -144,9 +144,20 @@ const Model = {
 
   setState: function (stateTimestamp: string, createTimestamp: string, state: string) {
     const task = this.getTask(createTimestamp);
-    if (task) {
-      task.setAttribute("data-state", state);
+    if (!task) return;
+    task.setAttribute("data-state", state);
+    var date = task.getElementsByClassName("statedate")[0];
+    if (state === "todo") {
+      task.removeChild(date);
+      return;
     }
+    if (!date) {
+      date = document.createElement("span");
+      date.classList.add("statedate");
+      task.insertBefore(date, task.firstChild);
+    }
+    const d = new Date(parseInt(stateTimestamp));
+    date.textContent = `${d.getFullYear()}-${`${d.getMonth() + 1}`.padStart(2, "0")}-${`${d.getDate()}`.padStart(2, "0")}`;
   },
 };
 
@@ -254,7 +265,7 @@ function BrowserUI() {
       const input = <HTMLInputElement>document.getElementById("taskName");
       if (input.value.match(/^ *$/)) return;
       const task = ui.addTask(input.value);
-      if (currentViewState === "todo") {
+      if (currentViewState === "todo" || currentViewState === "all") {
         task instanceof HTMLElement && task.focus();
       } else if (this.returnFocusAfterInput()) {
       } else {
@@ -326,7 +337,8 @@ function BrowserUI() {
 
     firstVisibleTask: function () {
       for (const task of document.getElementsByClassName("task")) {
-        if (task instanceof HTMLElement && task.getAttribute("data-state") === currentViewState) {
+        const state = task.getAttribute("data-state");
+        if (task instanceof HTMLElement && (state === currentViewState || (currentViewState === "all" && state !== "deleted"))) {
           return task;
         }
       }
@@ -347,7 +359,8 @@ function BrowserUI() {
       while (true) {
         cursor = increment > 0 ? cursor.nextElementSibling : cursor.previousElementSibling;
         if (!cursor || !(cursor instanceof HTMLElement)) break;
-        if (cursor.getAttribute("data-state")! === currentViewState) {
+        const state = cursor.getAttribute("data-state")!;
+        if (state === currentViewState || (currentViewState === "all" && state !== "deleted")) {
           offset -= increment;
           valid_cursor = cursor;
         }
@@ -426,13 +439,19 @@ function BrowserUI() {
       const oldState = task.getAttribute("data-state")!;
       if (newState === oldState) return;
       const createTimestamp = task.getAttribute("data-created")!;
-      this.moveCursor(1) || this.moveCursor(-1);
+      if (currentViewState !== "all" || newState == "deleted") {
+        this.moveCursor(1) || this.moveCursor(-1);
+      }
       return ui.setState(createTimestamp, newState, oldState);
     },
 
     setView: function (state: string, color: string) {
       const sheet = (document.getElementById("viewStyle") as HTMLStyleElement).sheet!;
-      sheet.insertRule(`.task:not([data-state=${state}]) { display: none }`);
+      if (state === "all") {
+        sheet.insertRule(`.task[data-state=deleted] { display: none }`);
+      } else {
+        sheet.insertRule(`.task:not([data-state=${state}]) { display: none }`);
+      }
       sheet.insertRule(`:root { --view-state-indicator-color: ${color}; }`);
       sheet.removeRule(2);
       sheet.removeRule(2);
@@ -494,6 +513,7 @@ function handleKey(event: any) {
       if (event.key == "m") return browserUI.setState("someday-maybe");
     } else if (inputState === InputState.V) {
       inputState = InputState.Root;
+      if (event.key == "a") return browserUI.setView("all", "Gold");
       if (event.key == "c") return browserUI.setView("cancelled", "Red");
       if (event.key == "d") return browserUI.setView("done", "LawnGreen");
       if (event.key == "q") return browserUI.setView("todo", "White");