From 304c67151cfd47868d6bbe78c2fe2d5485756d68 Mon Sep 17 00:00:00 2001 From: Nils Pukropp Date: Wed, 21 Oct 2026 14:52:29 +0200 Subject: [PATCH] help: the whole sheet, walked by key The help was a box narrower than the screen that had to be scrolled with the mouse. It is now as big as the porthole, in newspaper columns that run on to the right: h/l and j/k move a column, Ctrl-D/U and Space a screen, g/G to either end. A row is never split between columns, and says what it says before its first dash; / filters the rows by key or words, and shows the ones left whole. The prose footer became an 'in the editor' group. --- docs/wiki/Commands.md | 2 +- docs/wiki/Getting-Started.md | 2 +- web/src/App.svelte | 48 +++++- web/src/lib/Help.svelte | 297 +++++++++++++++++++++++++---------- 4 files changed, 261 insertions(+), 88 deletions(-) diff --git a/docs/wiki/Commands.md b/docs/wiki/Commands.md index 75bb9ce..d2171a8 100644 --- a/docs/wiki/Commands.md +++ b/docs/wiki/Commands.md @@ -60,7 +60,7 @@ arguments and `↑` / `↓` recall earlier lines. | `gb` | the documents that link to the open one — \[\[title]] links by title, \[\[ completes one while writing | | `:` | command line — Tab / Shift-Tab cycle the matches, then the argument; ↑ ↓ recall what ran before | | `Ctrl-S` | save, from anywhere | -| `?` | this screen — in the editor too | +| `?` | this screen, from the editor too — h/l a column, / filters it down | ### On a board diff --git a/docs/wiki/Getting-Started.md b/docs/wiki/Getting-Started.md index d90e368..0e1e031 100644 --- a/docs/wiki/Getting-Started.md +++ b/docs/wiki/Getting-Started.md @@ -74,7 +74,7 @@ The rail of buttons on the right does the same as the keys, for a mouse. inbox of this space's board. Press `b` to see the board, and `b` again to go back. 7. Press `T`. That is today's diary entry, started for you. -8. Press `?` for the list of every key and command, and `Esc` to close it. +8. Press `?` for the list of every key and command. `h` / `l` walk its columns, `/` narrows it down, and `Esc` closes it. On a phone the same things are buttons: the dock at the bottom has a new document, a new folder, the board, today's entry, an upload and a search, and diff --git a/web/src/App.svelte b/web/src/App.svelte index f2f66bb..686496d 100644 --- a/web/src/App.svelte +++ b/web/src/App.svelte @@ -9,7 +9,7 @@ import DocumentPane from './lib/DocumentPane.svelte' import FilePane from './lib/FilePane.svelte' import Headings from './lib/Headings.svelte' - import Help from './lib/Help.svelte' + import Help, { focusHelpFilter, scrollHelp } from './lib/Help.svelte' import Hints from './lib/Hints.svelte' import Verify from './lib/Verify.svelte' import Login from './lib/Login.svelte' @@ -378,6 +378,46 @@ } } + /** + * The help's keys: its columns run on to the right, so h/l and j/k move a + * column, Ctrl-D/U a screen, g/G to either end, and `/` narrows it down. + */ + function helpKey(event: KeyboardEvent): boolean { + if (event.ctrlKey) { + if (event.key !== 'd' && event.key !== 'u') return false + scrollHelp(event.key === 'd' ? 'pagedown' : 'pageup') + return true + } + switch (event.key) { + case 'l': + case 'j': + case 'ArrowRight': + case 'ArrowDown': + scrollHelp(1) + return true + case 'h': + case 'k': + case 'ArrowLeft': + case 'ArrowUp': + scrollHelp(-1) + return true + case ' ': + scrollHelp(event.shiftKey ? 'pageup' : 'pagedown') + return true + case 'g': + scrollHelp('start') + return true + case 'G': + scrollHelp('end') + return true + case '/': + focusHelpFilter() + return true + default: + return false + } + } + /** `gO`'s list: j/k down the headings, Enter to the one picked. */ function outlineKey(event: KeyboardEvent): boolean { const last = Math.max(workspace.outline.length - 1, 0) @@ -682,6 +722,12 @@ // The command line over an overlay — `D` in the agenda — keeps its keys. const listening = cmdline === null && !isTypingTarget(event.target) + if (workspace.overlay === 'help' && listening && !event.metaKey && !event.altKey) { + if (helpKey(event)) { + event.preventDefault() + return + } + } if (workspace.overlay === 'overview' && listening && !event.ctrlKey && !event.metaKey && !event.altKey) { if (overviewKey(event)) { event.preventDefault() diff --git a/web/src/lib/Help.svelte b/web/src/lib/Help.svelte index 21b449b..2a57dc1 100644 --- a/web/src/lib/Help.svelte +++ b/web/src/lib/Help.svelte @@ -1,6 +1,47 @@ + +
- help everything is a key or a `:` command + help {count} keys and commands +
-
-
-

keys

-
- {#each keys as [key, description] (key)} -
{key}
-
{description}
- {/each} -
-
- -
-

board keys

-
- {#each boardKeys as [key, description] (key)} -
{key}
-
{description}
- {/each} -
-
- -
-

agenda keys

-
- {#each agendaKeys as [key, description] (key)} -
{key}
-
{description}
- {/each} -
-
- - {#each grouped as [group, specs] (group)} -
-

{titles[group]}

+
+ {#each shown as [title, rows] (title)} +
+

{title}

- {#each specs as spec (spec.name)} -
- {signature(spec)}{#if spec.args}{spec.args}{/if} -
-
{spec.help}
- {#if spec.bang} -
:{spec.name}!
-
{spec.bang.help}
- {/if} + {#each rows as row (row.key)} + {@const short = filtering ? row.description : brief(row.description)} +
+
{row.key}{#if row.args}{row.args}{/if}
+
{short}{#if short !== row.description && !short.endsWith('…')} …{/if}
+
{/each}
+ {:else} +

nothing matches "{helpFilter.text}"

{/each}
-
- inside the editor the full vim keymap is live — hjkl, w/b, dd, ciw, visual mode, macros, and - :w to write. drop or paste an image, video or audio file into the - editor to attach it. $x^2$ and $$…$$ are set as math. a file opens in place — pdf, text and code, markdown, csv, and - certificates and keystores, which ask for their password. :12 jumps straight to entry 12. yanks and - deletes are copied to the system clipboard — - :set noclipboard keeps them in vim's registers. -
+ {#if !isTouchDevice} +
+ hl column + + ⌃d⌃u page + + gG start · end + + / filter, and read the lines whole + + ?esc close +
+ {/if}