Handle video loading

video-ready.js

function onVideoReady() {
  video.play();
}

/*  Solution #1 
    First check for the videos readyState, if not ready add an event
    listener to 'canplaythrough' event
*/
if(video.readyState < 4) {
    video.addEventListener('canplaythrough', function() {
      onVideoReady();
    });
} else {
    onVideoReady();
}

/*  Solution #2 
    Checking the video's `buffered.end` property periodically until the buffer is
    long enough to play the video without interruption 
*/
interval = setInterval(function(){
    if(video.buffered && 
      video.buffered.length &&
      video.buffered.end &&
      video.duration) {
  
      var duration = Math.floor(video.duration);
      var buffered = Math.floor(video.buffered.end(0));
  
      if(duration > 0 && buffered > 0) {
        var minimumBuffer = duration * 0.75;

        if(buffered >= minimumBuffer) {
          clearInterval(interval);
          interval = undefined;
          onVideoReady();
        }
      }
    }
  }, 250);