Keyboard input support for webplayer

[ikks]

Screencast from 2024-10-09 19-59-16.webm
This Pull Request adds support for keyboard presses. Related to https://github.com/orgs/asciinema/discussions/154

• Includes a new option to not show the key presses
• Tries to be unintrusive
• can be toggled
• I will open a PR for the documentation to add the new option for the player.
  Is pleasant to read your code. Cheers.

[ikks]

Doc is here asciinema/asciinema.github.io#11

[azat]

It would be very useful to have an ability to configure how much last keys should be shown, in number of keys or/and time (i.e. show pressed keys for the last 3 seconds). That way you can show sequence of keys, i.e. shortcuts, which can be important.

And maybe it worth to make the timeout (how long should the keys be shown) configurable, or maybe it is synced with the screencast, i.e. it will be automatically replaced with a new key stroke, and until then, it will be visible. In this case I guess first two things will be enough.

What do you think?

[ikks]

@azat I understand that for emacs users and other more complex scenarios it would be needed more keypressed for the explanations. I will skip this request.

There is now a fade effect that can be tested at https://igor.tamarapatino.org/samples/asciinema/ .

[ku1ik]

Hey @ikks 👋

I'm glad it was easy to follow the code 😊 Thanks for this PR, I finally got to it. Just skimmed it for now but it looks pretty good. I'll review it properly in the coming days.

[ku1ik]

@azat good ideas. I also think those would definitely be nice to have 👍

I think we'll release the first version without too much configurability and see how it performs on real life recordings. Then we could introduce improvements/tweaks in a follow up release.

[ludolpif]

As a asciinema user/enthousiast it looks very promising ! May I suggest to let a form of "recently typed character history on screen" ? It is hard to keep eyes on each keystroke in the case of demonstrating shorcut-intensive CLI tool like vim or compound-shortcuts like emacs. May ": w q" could stay for 1 second or 2 on screen.

[thisago]

To give ideas, what I do currently is cat (tac) the input characters on a dedicated tmux's status bar.

An recording: https://asciinema.org/a/nMmBtiUolL6PblVUcwE1NUoF8

[ikks]

Due to a skill issue I dropped this PR when syncing with the latest version. Thanks everyone for the suggestions. The work can continue in pr #294 . The UX for multiple keys is something that needs some thought, to be shown to users. If there are any implementation ideas, please do send your images, "less" , js or feel free to enhance that PR :) .

Known problems are:

• there is no handling of multiple key modifiers, like ctrl-shift-e...