X-Git-Url: http://git.scottworley.com/vopamoi/blobdiff_plain/5fa4704c5a919a16c0d41fe1f92eaa83d236a66b..6d01c40696f0612a6352f21320f417ccf528ab40:/vopamoi.ts diff --git a/vopamoi.ts b/vopamoi.ts index b90b895..ba5ae85 100644 --- a/vopamoi.ts +++ b/vopamoi.ts @@ -14,17 +14,29 @@ function splitN(str: string, delimiter: string, limit: number = MAX_SAFE_INTEGER } const Model = { - createTask: function (timestamp: string, description: string) { + addTask: function (timestamp: string, description: string): Element { const task = document.createElement("div"); task.appendChild(document.createTextNode(description)); task.setAttribute("class", "task"); task.setAttribute("tabindex", "0"); task.setAttribute("data-created", timestamp); + document.getElementById("tasks")!.appendChild(task); + task.focus(); 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); + } + }, + + getPriority: function (task: Element): number { + if (task.hasAttribute("data-priority")) { + return parseFloat(task.getAttribute("data-priority")!); + } + return parseFloat(task.getAttribute("data-created")!); }, getTask: function (createTimestamp: string) { @@ -35,11 +47,19 @@ const Model = { } }, - destroyTask: function (createTimestamp: string) { - const task = this.getTask(createTimestamp); - if (task) { - task.parentElement!.removeChild(task); + setPriority: function (createTimestamp: string, priority: number) { + const target = this.getTask(createTimestamp); + if (!target) return; + target.setAttribute("data-priority", `${priority}`); + for (const task of document.getElementsByClassName("task")) { + if (task !== target && this.getPriority(task) > priority) { + task.parentElement!.insertBefore(target, task); + target instanceof HTMLElement && target.focus(); + return; + } } + document.getElementById("tasks")!.appendChild(target); + target instanceof HTMLElement && target.focus(); }, setState: function (stateTimestamp: string, createTimestamp: string, state: string) { @@ -59,14 +79,18 @@ function Log(prefix: string = "vp-") { apply: function (entry: string) { const [timestamp, command, data] = splitN(entry, " ", 2); if (command == "Create") { - Model.addTask(timestamp, data); + return Model.addTask(timestamp, data); } if (command == "Destroy") { - Model.destroyTask(data.split(" ", 1)[0]); + return Model.destroyTask(data.split(" ", 1)[0]); } if (command == "State") { const [createTimestamp, state] = splitN(data, " ", 1); - Model.setState(timestamp, createTimestamp, state); + return Model.setState(timestamp, createTimestamp, state); + } + if (command == "Priority") { + const [createTimestamp, newPriority] = splitN(data, " ", 1); + return Model.setPriority(createTimestamp, parseFloat(newPriority)); } }, @@ -76,7 +100,7 @@ function Log(prefix: string = "vp-") { recordAndApply: function (entry: string) { this.record(entry); - this.apply(entry); + return this.apply(entry); }, replay: function () { @@ -94,24 +118,27 @@ function Log(prefix: string = "vp-") { const log = Log(); const UI = { - addTask: function (description: string) { - log.recordAndApply(`${Date.now()} Create ${description}`); + addTask: function (description: string): Element { + return log.recordAndApply(`${Date.now()} Create ${description}`); }, destroyTask: function (createTimestamp: string) { - log.recordAndApply(`${Date.now()} Destroy ${createTimestamp} ${Model.getTask(createTimestamp)?.textContent}`); + return log.recordAndApply(`${Date.now()} Destroy ${createTimestamp} ${Model.getTask(createTimestamp)?.textContent}`); + }, + setPriority: function (createTimestamp: string, priority: number) { + return log.recordAndApply(`${Date.now()} Priority ${createTimestamp} ${priority}`); }, setState: function (createTimestamp: string, state: string) { - log.recordAndApply(`${Date.now()} State ${createTimestamp} ${state}`); + return log.recordAndApply(`${Date.now()} State ${createTimestamp} ${state}`); }, }; const BrowserUI = { - addTask: function (form: any) { - if (form.taskName.value) { - UI.addTask(form.taskName.value); - form.taskName.value = ""; + addTask: function () { + const input = document.getElementById("taskName"); + if (input.value) { + const task = UI.addTask(input.value); + input.value = ""; } - return false; }, destroyTask: function () { @@ -125,10 +152,8 @@ const BrowserUI = { event.preventDefault(); }, - moveCursor: function (offset: number): boolean { - var initial_cursor = document.activeElement; - if (!initial_cursor) return false; - var cursor: Element | null = initial_cursor; + visibleTaskAtOffset(task: Element, offset: number): Element { + var cursor: Element | null = task; var valid_cursor = cursor; const increment = offset / Math.abs(offset); while (true) { @@ -140,13 +165,47 @@ const BrowserUI = { } if (Math.abs(offset) < 0.5) break; } - if (valid_cursor !== initial_cursor && valid_cursor instanceof HTMLElement) { - valid_cursor.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; }, + moveTask: function (offset: number) { + const active = document.activeElement; + if (!active) return; + const dest = this.visibleTaskAtOffset(active, offset); + if (dest === active) return; // Already extremal + var onePastDest: Element | null = this.visibleTaskAtOffset(dest, offset / Math.abs(offset)); + if (onePastDest == dest) onePastDest = null; // Will become extremal + if (offset > 0) { + this.setPriority(active, dest, onePastDest); + } else { + this.setPriority(active, onePastDest, dest); + } + }, + + // Change task's priority to be between other tasks a and b. + setPriority: function (task: Element, a: Element | null, b: Element | null) { + const aPriority = a === null ? 0 : Model.getPriority(a); + const bPriority = b === null ? Date.now() : Model.getPriority(b); + console.assert(aPriority < bPriority, aPriority, "<", bPriority); + const span = bPriority - aPriority; + const newPriority = aPriority + 0.1 * span + 0.8 * span * Math.random(); + console.assert(aPriority < newPriority && newPriority < bPriority, aPriority, "<", newPriority, "<", bPriority); + const newPriorityRounded = Math.round(newPriority); + const okToRound = aPriority < newPriorityRounded && newPriorityRounded < bPriority; + UI.setPriority(task.getAttribute("data-created")!, okToRound ? newPriorityRounded : newPriority); + }, + setState: function (state: string) { const createTimestamp = document.activeElement?.getAttribute("data-created"); this.moveCursor(1) || this.moveCursor(-1); @@ -155,9 +214,13 @@ const BrowserUI = { }; function handleKey(event: any) { - if (event.target.tagName !== "INPUT") { + if (event.target.tagName === "INPUT") { + if (event.key == "Enter") return BrowserUI.addTask(); + } else { if (event.key == "j") return BrowserUI.moveCursor(1); if (event.key == "k") return BrowserUI.moveCursor(-1); + if (event.key == "J") return BrowserUI.moveTask(1); + if (event.key == "K") return BrowserUI.moveTask(-1); if (event.key == "n") return BrowserUI.focusTaskNameInput(event); if (event.key == "s") return BrowserUI.setState("someday-maybe"); if (event.key == "w") return BrowserUI.setState("waiting");