]> git.scottworley.com Git - vopamoi/blob - vopamoi.ts
b899c7144d6acb5d6c8594b49c80805f1362e9ca
[vopamoi] / 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 addTask: function (timestamp: string, description: string) {
18 document.getElementById("tasks")!.appendChild(this.createTask(timestamp, description)).focus();
19 },
20
21 createTask: function (timestamp: string, description: string) {
22 const task = document.createElement("div");
23 task.appendChild(document.createTextNode(description));
24 task.setAttribute("class", "task");
25 task.setAttribute("tabindex", "0");
26 task.setAttribute("data-created", timestamp);
27 return task;
28 },
29
30 destroyTask: function (createTimestamp: string) {
31 const task = this.getTask(createTimestamp);
32 if (task) {
33 task.parentElement!.removeChild(task);
34 }
35 },
36
37 getPriority: function (task: Element): number {
38 if (task.hasAttribute("data-priority")) {
39 return parseFloat(task.getAttribute("data-priority")!);
40 }
41 return parseFloat(task.getAttribute("data-created")!);
42 },
43
44 getTask: function (createTimestamp: string) {
45 for (const task of document.getElementsByClassName("task")) {
46 if (task.getAttribute("data-created") === createTimestamp) {
47 return task;
48 }
49 }
50 },
51
52 setPriority: function (createTimestamp: string, priority: number) {
53 const target = this.getTask(createTimestamp);
54 if (!target) return;
55 target.setAttribute("data-priority", `${priority}`);
56 for (const task of document.getElementsByClassName("task")) {
57 if (task !== target && this.getPriority(task) > priority) {
58 task.parentElement!.insertBefore(target, task);
59 target instanceof HTMLElement && target.focus();
60 return;
61 }
62 }
63 document.getElementById("tasks")!.appendChild(target);
64 target instanceof HTMLElement && target.focus();
65 },
66
67 setState: function (stateTimestamp: string, createTimestamp: string, state: string) {
68 const task = this.getTask(createTimestamp);
69 if (task) {
70 task.setAttribute(`data-${state}`, stateTimestamp);
71 if (task instanceof HTMLElement) {
72 task.style.display = "none"; // Until view filtering
73 }
74 }
75 },
76 };
77
78 function Log(prefix: string = "vp-") {
79 var next_log_index = 0;
80 return {
81 apply: function (entry: string) {
82 const [timestamp, command, data] = splitN(entry, " ", 2);
83 if (command == "Create") {
84 Model.addTask(timestamp, data);
85 }
86 if (command == "Destroy") {
87 Model.destroyTask(data.split(" ", 1)[0]);
88 }
89 if (command == "State") {
90 const [createTimestamp, state] = splitN(data, " ", 1);
91 Model.setState(timestamp, createTimestamp, state);
92 }
93 if (command == "Priority") {
94 const [createTimestamp, newPriority] = splitN(data, " ", 1);
95 Model.setPriority(createTimestamp, parseFloat(newPriority));
96 }
97 },
98
99 record: function (entry: string) {
100 window.localStorage.setItem(`${prefix}${next_log_index++}`, entry);
101 },
102
103 recordAndApply: function (entry: string) {
104 this.record(entry);
105 this.apply(entry);
106 },
107
108 replay: function () {
109 while (true) {
110 const entry = window.localStorage.getItem(`${prefix}${next_log_index}`);
111 if (entry === null) {
112 break;
113 }
114 this.apply(entry);
115 next_log_index++;
116 }
117 },
118 };
119 }
120 const log = Log();
121
122 const UI = {
123 addTask: function (description: string) {
124 log.recordAndApply(`${Date.now()} Create ${description}`);
125 },
126 destroyTask: function (createTimestamp: string) {
127 log.recordAndApply(`${Date.now()} Destroy ${createTimestamp} ${Model.getTask(createTimestamp)?.textContent}`);
128 },
129 setPriority: function (createTimestamp: string, priority: number) {
130 log.recordAndApply(`${Date.now()} Priority ${createTimestamp} ${priority}`);
131 },
132 setState: function (createTimestamp: string, state: string) {
133 log.recordAndApply(`${Date.now()} State ${createTimestamp} ${state}`);
134 },
135 };
136
137 const BrowserUI = {
138 addTask: function (form: any) {
139 if (form.taskName.value) {
140 UI.addTask(form.taskName.value);
141 form.taskName.value = "";
142 }
143 return false;
144 },
145
146 destroyTask: function () {
147 const createTimestamp = document.activeElement?.getAttribute("data-created");
148 this.moveCursor(1) || this.moveCursor(-1);
149 return UI.destroyTask(createTimestamp!);
150 },
151
152 focusTaskNameInput: function (event: any) {
153 document.getElementById("taskName")!.focus();
154 event.preventDefault();
155 },
156
157 visibleTaskAtOffset(task: Element, offset: number): Element {
158 var cursor: Element | null = task;
159 var valid_cursor = cursor;
160 const increment = offset / Math.abs(offset);
161 while (true) {
162 cursor = increment > 0 ? cursor.nextElementSibling : cursor.previousElementSibling;
163 if (!cursor || !(cursor instanceof HTMLElement)) break;
164 if (cursor.style.display !== "none") {
165 offset -= increment;
166 valid_cursor = cursor;
167 }
168 if (Math.abs(offset) < 0.5) break;
169 }
170 return valid_cursor;
171 },
172
173 moveCursor: function (offset: number): boolean {
174 const active = document.activeElement;
175 if (!active) return false;
176 const dest = this.visibleTaskAtOffset(active, offset);
177 if (dest !== active && dest instanceof HTMLElement) {
178 dest.focus();
179 return true;
180 }
181 return false;
182 },
183
184 moveTask: function (offset: number) {
185 const active = document.activeElement;
186 if (!active) return;
187 const dest = this.visibleTaskAtOffset(active, offset);
188 if (dest === active) return; // Already extremal
189 var onePastDest: Element | null = this.visibleTaskAtOffset(dest, offset / Math.abs(offset));
190 if (onePastDest == dest) onePastDest = null; // Will become extremal
191 if (offset > 0) {
192 this.setPriority(active, dest, onePastDest);
193 } else {
194 this.setPriority(active, onePastDest, dest);
195 }
196 },
197
198 // Change task's priority to be between other tasks a and b.
199 setPriority: function (task: Element, a: Element | null, b: Element | null) {
200 const aPriority = a === null ? 0 : Model.getPriority(a);
201 const bPriority = b === null ? Date.now() : Model.getPriority(b);
202 console.assert(aPriority < bPriority, aPriority, "<", bPriority);
203 const span = bPriority - aPriority;
204 const newPriority = aPriority + 0.1 * span + 0.8 * span * Math.random();
205 console.assert(aPriority < newPriority && newPriority < bPriority, aPriority, "<", newPriority, "<", bPriority);
206 const newPriorityRounded = Math.round(newPriority);
207 const okToRound = aPriority < newPriorityRounded && newPriorityRounded < bPriority;
208 UI.setPriority(task.getAttribute("data-created")!, okToRound ? newPriorityRounded : newPriority);
209 },
210
211 setState: function (state: string) {
212 const createTimestamp = document.activeElement?.getAttribute("data-created");
213 this.moveCursor(1) || this.moveCursor(-1);
214 return UI.setState(createTimestamp!, state);
215 },
216 };
217
218 function handleKey(event: any) {
219 if (event.target.tagName !== "INPUT") {
220 if (event.key == "j") return BrowserUI.moveCursor(1);
221 if (event.key == "k") return BrowserUI.moveCursor(-1);
222 if (event.key == "J") return BrowserUI.moveTask(1);
223 if (event.key == "K") return BrowserUI.moveTask(-1);
224 if (event.key == "n") return BrowserUI.focusTaskNameInput(event);
225 if (event.key == "s") return BrowserUI.setState("someday-maybe");
226 if (event.key == "w") return BrowserUI.setState("waiting");
227 if (event.key == "d") return BrowserUI.setState("done");
228 if (event.key == "c") return BrowserUI.setState("cancelled");
229 if (event.key == "X") return BrowserUI.destroyTask();
230 }
231 }
232
233 function browserInit() {
234 document.body.addEventListener("keydown", handleKey, { capture: false });
235 log.replay();
236 }