Skip to content

Instantly share code, notes, and snippets.

@fxfactorial

fxfactorial/canvasrecord.js

Forked from PaulKinlan/canvasrecord.js
Created November 6, 2016 17:59
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save fxfactorial/ea37127ad67ded31f81d910fba1ae4a7 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save fxfactorial/ea37127ad67ded31f81d910fba1ae4a7 to your computer and use it in GitHub Desktop.
Download ZIP
Screen recorder in JS
Raw
canvasrecord.js
let canvas = document.querySelector('canvas');
// Optional frames per second argument.
let stream = canvas.captureStream(25);
let recorder = new MediaRecorder(stream, options);
let blobs = [];
function download(blob) {
var url = window.URL.createObjectURL(blob);
var a = document.createElement('a');
a.style.display = 'none';
a.href = url;
a.download = 'test.webm';
document.body.appendChild(a);
a.click();
setTimeout(function() {
document.body.removeChild(a);
window.URL.revokeObjectURL(url);
}, 100);
}
recorder.ondataavailable = e => { console.log(e.data); if (e.data && e.data.size > 0) blobs.push(e.data)};
recorder.onstop = (e) => download(new Blob(blobs, , {type: 'video/webm'}));
recorder.start(10); // collect 10ms of data
setTimeout(()=> recorder.stop(), 10000);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment