Add Support for asciinima input display #1
Description
https://ii.nz/tmux.org generates https://ii.nz/tmux.html
Adding asciinema :prologue and :epilogue to tmux blocks like this:
#+name: emacs
#+begin_src tmux :session ii:emacs :prologue "asciinema rec emacs.cast --stdin --overwrite -c '" :epilogue "'"
emacs -nw .
#+end_src
Will produce a emacs.cast file, this can be displayed by putting behind html.
Use https://ii.nz/emacs.cast, but follow the instructions here to help me figure out the right way to display the characters we type:
#+name: emacs.cast
#+begin_export html
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="asciinema-player.css" />
<!-- Place favicon.ico in the root directory -->
</head>
<div id="emacs"></div>
<script src="asciinema-player.min.js"></script>
<script>
AsciinemaPlayer.create('emacs.cast', document.getElementById('emacs'),
{
autoPlay: true,
preload: true,
loop: true,
theme: 'solarized-dark',
poster: "data:text/plain,I'm regular \x1b[1;32mI'm bold green\x1b[3BI'm 3 lines down"
}
);
</script>
#+end_export
From https://github.com/asciinema/asciinema-player#addeventlistenereventname-handler
input event is dispatched for every keyboard input that was recorded.
Callback's 1st argument is an object with data field, which contains registered input value. Usually this is ASCII character representing a key, but may be a control character, like "\r" (enter), "\u0001" (ctrl-a), "\u0003" (ctrl-c), etc. See input events in asciicast file format for more information.
This event can be used to play keyboard typing sound or display key presses on the screen amongst other use cases.
player.addEventListener('input', ({data}) => {
console.log('input!', JSON.stringify(data));
})