j/k movement keys

[vopamoi] / vopamoi.ts

diff --git a/vopamoi.ts b/vopamoi.ts
index 0d2944c0a87cf936f05a0df8403527238a242583..a0b2cfb82e5e980a769d14838c431fb1a3b89be2 100644 (file)
--- a/vopamoi.ts
+++ b/vopamoi.ts
@@ -1,18 +1,30 @@
-var tasks: string[] = [];
+function createTask(description: string) {
+  const task = document.createElement("div");
+  task.appendChild(document.createTextNode(description));
+  task.setAttribute("tabindex", "0");
+  return task;
+}
 
-function createViewTask(task: string) {
-  const viewTask = document.createElement("div");
-  viewTask.appendChild(document.createTextNode(task));
-  return viewTask;
+function addTask(description: string) {
+  document.body.appendChild(createTask(description));
 }
 
-function updateView() {
-  tasks.forEach((t) => document.getElementById(t) || document.body.appendChild(createViewTask(t)));
+function moveCursor(offset: number) {
+  var active = document.activeElement;
+  if (offset === 1 && active) {
+    active = active.nextElementSibling;
+  }
+  if (offset === -1 && active) {
+    active = active.previousElementSibling;
+  }
+  if (active && active instanceof HTMLElement) active.focus();
 }
 
-function addTask(task: string) {
-  tasks.push(task);
-  updateView();
+function handleKey(event: any) {
+  if (event.target.tagName !== "INPUT") {
+    if (event.key == "j") moveCursor(1);
+    if (event.key == "k") moveCursor(-1);
+  }
 }
 
 function browserCreateTask(form: any) {
@@ -20,3 +32,7 @@ function browserCreateTask(form: any) {
   form.taskName.value = "";
   return false;
 }
+
+function browserInit() {
+  document.body.addEventListener("keydown", handleKey, { capture: false });
+}