function makeVideoThumb(url) {
    // make a data uri from a <video> element using canvas
    // thank you stackoverflow people
    function getImage(videoElement) {
        var canvas = document.createElement('canvas');
        canvas.width = 360;
        canvas.height = 240;
        var context = canvas.getContext('2d');
        context.drawImage(videoElement, 0, 0, canvas.width, canvas.height);
        var dataURI = canvas.toDataURL('image/jpeg');
        canvas = null;
        return dataURI;
    }

    // will be async as we need some frame of the video to be downloaded
    return new Promise(function(resolve) {
        var video = document.createElement('video');
        video.width = 360;
        video.height = 240;
        video.attributes['preload'] = 'none';
        // first setup the listener
        video.addEventListener("loadeddata", function() {
            var dataURI = getImage(video);
            // cleanup so loading ends
            video.src = '';
            video = null;
            // we're done, here's your thumb:
            resolve(dataURI);
        });
        // then set url so load begin
        video.src = url;
    });
}

// usage:
makeVideoThumb('/videos/1234.mp4').then(function(thumb) {
   someImage.src = thumb;
  // or
  someElement.style['background-image'] = thumb;
});