git.scottworley.com Git - vopamoi/blob - vopamoi.ts

   1 // Typescript doesn't know about MAX_SAFE_INTEGER??  This was supposed to be
   2 // fixed in typescript 2.0.1 in 2016, but is not working for me in typescript
   3 // 4.2.4 in 2022.  :( https://github.com/microsoft/TypeScript/issues/9937
   4 //const MAX_SAFE_INTEGER = Number.MAX_SAFE_INTEGER;
   5 const MAX_SAFE_INTEGER = 9007199254740991;
   6
   7 // A sane split that splits N *times*, leaving the last chunk unsplit.
   8 function splitN(str: string, delimiter: string, limit: number = MAX_SAFE_INTEGER): string[] {
   9   if (limit < 1) {
  10     return [str];
  11   }
  12   const at = str.indexOf(delimiter);
  13   return at === -1 ? [str] : [str.substring(0, at)].concat(splitN(str.substring(at + delimiter.length), delimiter, limit - 1));
  14 }
  15
  16 const Model = {
  17   createTask: function (timestamp: string, description: string) {
  18     const task = document.createElement("div");
  19     task.appendChild(document.createTextNode(description));
  20     task.setAttribute("class", "task");
  21     task.setAttribute("tabindex", "0");
  22     task.setAttribute("data-created", timestamp);
  23     return task;
  24   },
  25
  26   addTask: function (timestamp: string, description: string) {
  27     document.body.appendChild(this.createTask(timestamp, description)).focus();
  28   },
  29
  30   getTask: function (createTimestamp: string) {
  31     for (const task of document.getElementsByClassName("task")) {
  32       if (task.getAttribute("data-created") === createTimestamp) {
  33         return task;
  34       }
  35     }
  36   },
  37
  38   destroyTask: function (createTimestamp: string) {
  39     const task = this.getTask(createTimestamp);
  40     task!.parentElement!.removeChild(task!);
  41   },
  42
  43   moveCursor: function (offset: number): boolean {
  44     var active = document.activeElement;
  45     if (offset === 1 && active) {
  46       active = active.nextElementSibling;
  47     }
  48     if (offset === -1 && active) {
  49       active = active.previousElementSibling;
  50     }
  51     if (active && active instanceof HTMLElement) {
  52       active.focus();
  53       return true;
  54     }
  55     return false;
  56   },
  57 };
  58
  59 const Log = (function () {
  60   var next_log_index = 0;
  61   return {
  62     apply: function (entry: string) {
  63       const [timestamp, command, data] = splitN(entry, " ", 2);
  64       if (command == "Create") {
  65         Model.addTask(timestamp, data);
  66       }
  67       if (command == "Destroy") {
  68         Model.destroyTask(data.split(" ", 1)[0]);
  69       }
  70     },
  71
  72     record: function (entry: string) {
  73       window.localStorage.setItem(`${next_log_index++}`, entry);
  74     },
  75
  76     recordAndApply: function (entry: string) {
  77       this.record(entry);
  78       this.apply(entry);
  79     },
  80
  81     replay: function () {
  82       while (true) {
  83         const entry = window.localStorage.getItem(`${next_log_index}`);
  84         if (entry === null) {
  85           break;
  86         }
  87         this.apply(entry);
  88         next_log_index++;
  89       }
  90     },
  91   };
  92 })();
  93
  94 const UI = {
  95   addTask: function (description: string) {
  96     Log.recordAndApply(`${Date.now()} Create ${description}`);
  97   },
  98   destroyTask: function (createTimestamp: string) {
  99     Log.recordAndApply(`${Date.now()} Destroy ${createTimestamp} ${Model.getTask(createTimestamp)?.textContent}`);
 100   },
 101 };
 102
 103 const BrowserUI = {
 104   addTask: function (form: any) {
 105     if (form.taskName.value) {
 106       UI.addTask(form.taskName.value);
 107       form.taskName.value = "";
 108     }
 109     return false;
 110   },
 111   destroyTask: function () {
 112     const createTimestamp = document.activeElement?.getAttribute("data-created");
 113     return createTimestamp && UI.destroyTask(createTimestamp);
 114   },
 115 };
 116
 117 function focusTaskNameInput(event: any) {
 118   document.getElementById("taskName")!.focus();
 119   event.preventDefault();
 120 }
 121
 122 function handleKey(event: any) {
 123   if (event.target.tagName !== "INPUT") {
 124     if (event.key == "j") return Model.moveCursor(1);
 125     if (event.key == "k") return Model.moveCursor(-1);
 126     if (event.key == "c") return focusTaskNameInput(event);
 127     if (event.key == "X") return BrowserUI.destroyTask();
 128   }
 129 }
 130
 131 function browserInit() {
 132   document.body.addEventListener("keydown", handleKey, { capture: false });
 133   Log.replay();
 134 }