codecast functionality like cssdeck [closed]

Question

Recently codemirror project caught my attention. Jsbin uses codemirror behind the scenes.

After spending some time on that website, I found cssdeck. Inside cssdeck they are implementing a feature known as codecasts.

Codecasts lets us record our typing and later we can playback that recorded code. Most interestingly the code is still editable when we are playing a recorded implementation.

Check out this example.

Does anyone have any idea on how to create such functionality?

Answer 1

Isn't this just recording keypresses and then playing them back?

Presumably each event is an object that records which window the keypress it was in, the time (e.g. elapsed milliseconds since the previous event) and the key pressed (including backspace).

There may also need to be special entries to cope with mouse clicks changing the cursor position.

So you can simply build up an array of these keypress objects and then play them back from the start.