Skip to content

Instantly share code, notes, and snippets.

@baptistelabat

baptistelabat/mouseLog10Hz.html

Last active April 17, 2017 18:48
Show Gist options
  • Save baptistelabat/40cd9ba45221917b0f978f6f7a63a278 to your computer and use it in GitHub Desktop.
Save baptistelabat/40cd9ba45221917b0f978f6f7a63a278 to your computer and use it in GitHub Desktop.
Download ZIP
Small example of a log generated at 10Hz from mouse position that you can then save to your computer;
Raw
mouseLog10Hz.html
<html>
<body>
<button onclick="saveTextAsFile()">Save Text to File</button>
<script type="text/javascript">
// Inspiration from https://thiscouldbebetter.wordpress.com/2012/12/18/loading-editing-and-saving-a-text-file-in-html5-using-javascrip/
var textToSave = "Date, clientX, clientY" + String.fromCharCode(13); // Header of log file
var clientX = 0;
var clientY = 0;
var d = new Date();
var filename = d.toISOString().slice(0, 19) + ".csv"; // Date without milliseconds
setInterval(saveToLog, 100);
document.addEventListener("mousemove", function(event) {
// Save the last known mouse position
clientX = event.clientX;
clientY = event.clientY;
})
function saveToLog() {
var d = new Date()
textToSave = textToSave +d.toISOString() + ", "+ clientX + ", " + clientY + String.fromCharCode(13);
}
function saveTextAsFile()
{
var textToSaveAsBlob = new Blob([textToSave], {type:"text/plain"});
var textToSaveAsURL = window.URL.createObjectURL(textToSaveAsBlob);
var downloadLink = document.createElement("a");
downloadLink.download = filename;
downloadLink.innerHTML = "Download File";
downloadLink.href = textToSaveAsURL;
downloadLink.onclick = destroyClickedElement;
downloadLink.style.display = "none";
document.body.appendChild(downloadLink);
downloadLink.click();
}
function destroyClickedElement(event)
{
document.body.removeChild(event.target);
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment