Adding Keystrokes overlay

[daonb]

Resolves #79 - Keystrokes overlay in subtitles style seems to be working. It's missing theme support - just white on black - and better special chars display, but it's probably good enough for a first version.

I'm used to coding without ; and with 4 spaces for tab so there could be a few places where the source is off. I tried running eslint but got nothing meaningful out of it. I would suggest changing the test script so it'll run the linter.

[daonb]

@sickill thanks for asciinema 🍻

I've coded this PR to solve an old feature request - one that allows us to share vimcasts with asciinema. Please take a look when you have the time.

I've taken this on as I want to publish vim screencasts and as I need a new emulator for my terminal. It's currently using xtermjs but it's too slow, especially after packaging it using capacitorjs as an iPad app where Safari 15.x has buggy canvas text so xtermjs fallbacks to using the much slower dom.

I've read your smaller faster post and I figured that asciinema gets its speed from core emulation in rust-wasm, leaving dom update to javascipt. This is just what I need but asciinema is a player. xtermjs has some key features that Terminal7 counts on. It needs a buffer interface to store and scroll old lines and a decoration layer to mark links, search cursors, etc and a bit more.

I guess it's another yack I have to shave. I'd love to do it here if you like the idea of this player growing to a terminal.

[ku1ik]

Hey @daonb,

First, apology for not looking into this earlier. Keystroke overlay is definitely something I'd like to include in the player, it's just my mind was mostly occupied by other aspects/features of the project, and I followed the fun rather than the mundane. Handling non-trivial PRs sometimes feels like work... :)

I'm glad the "smaller faster" post interested you in asciinema player and you started hacking on it. That's awesome.

Regarding other features you seek that would turn asciinema player in a more full featured terminal: honestly I'm not really interested in building yet another full blown terminal emulator in JS. If you look at avt README you can see that minimalism and lack of non-playback related features is on purpose (I edited that README with those goals/non-goals there just recently). We had requests for proper scrollback in the player but while I really can see a value in that I know how much it would complicate player implementation (starting with avt), so I'm hesitating.

Back to keystrokes.

In your implemetation you piggy-backed on feed to pass input events to the UI. feed is meant to tell core what to feed (print) into virtual terminal. In other words it's meant to handle "o" (output) events in asciicast. "i" (input) is not directly related, so better would be use a separate (new) callback from a driver to the core, which would be handled by core independently of feed (which tells UI to redraw by triggerring terminalUpdate).

There's also this recent asciinema/asciinema-player#220, which suggests we need proper, 1st class support for "i" events, which could also be exposed to user-level code.

And we also have a concept of recording parser now, which at the moment doesn't have a place for input events in its current data model. This will need to be extended/changed. Custom parser support is very recent addition which addresses very uncommon need so I think adjusting the data model returned from a parser to the driver to accomodate for input events could stil be made without breaking anyone's usage of the player.

[ludolpif]

I'm interested to try to update this PR with the new merged features, notably the input eventHandler (#222) if anyone is doing the same currently. I hope make a POC this week.

[ku1ik]

This one had some implementation problems and got out of date by now (both by not being compatible with current codebase on high level, and having git conflicts), so I'll close it. We have more up to date PoC/draft in another PR.