Dig into a user's textarea or Ace typing sessions.
A simple library that can dig (hook) into typeable textareas and record keystrokes to playback later.
Create a new Spade.js object and track() any DOM element. Works with jQuery, or even the ACE object itself!
<html>
<head>
<script src="./spade.js"></script>
<script>
window.onload = function() {
var textarea = document.getElementById("aTextArea");
var button = document.getElementById("processSpade");
var spade = new Spade();
// Tell Spade which element to keep track of.
spade.track(textarea);
button.onclick = function() {
// Turn semi-raw events into a list of diffs.
spade.compile();
// Turn an array of objects in an array of arrays.
spade.condense();
// Turn our array of arrays into a nice string.
var spadeString = JSON.stringify(spade.condensed);
// Compress spadeString using your favorite compression library!
// Upload it to a server to save to playback for another day.
}
}
</script>
</head>
<body>
<textarea id="aTextArea"></textarea>
<button id="processSpade">Compile & Condense</button>
</body>
</html>Spade.js does not play back recorded sessions. Check the examples folder for an example on how to playback an existing, condensed array.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent