CORS test

by Marcos vini

HTML

<div id='thumbs'>Carregando o video...</div>
<video id='cunegro' src='https://r3---sn-p5qs7n7s.googlevideo.com/videoplayback?id=f76dbbfcd7357b94&itag=22&source=blogger&mm=31&mn=sn-p5qs7n7s&ms=au&mv=m&pl=49&ei=qjbgXNDEKIKcqwWk6I-wBA&susc=bl&mime=video/mp4&dur=1330.201&lmt=1558109934331069&mt=1558197834&ip=2607:5300:60:7317::&ipbits=0&expire=1558226730&sparams=ip,ipbits,expire,id,itag,source,mm,mn,ms,mv,pl,ei,susc,mime,dur,lmt&signature=C2ACF9B2104D531BAFEC62611273B505D760C27304C065BA23CA671F921BDE3B.D2914F79C75874FC483422CCA115732935E8D58F2DB2BCAA1B5C62CBE29C21F5&key=us0'></video>

CSS

#video{width:320px}

JavaScript

var time = 10;
var video = document.getElementById("cunegro");
var thumbs = document.getElementById("thumbs");

video.addEventListener('loadeddata', function() {
	thumbs.innerHTML = "";
    video.currentTime = time;
}, false);

video.addEventListener('seeked', function() {
    generateThumbnail(time); 
    
}, false);

video.preload = "auto";
 
function generateThumbnail() {
  var c = document.createElement("canvas");
  var ctx = c.getContext("2d");
  c.width = 500;
  c.height = 300;
  ctx.drawImage(video, 0, 0, 500, 300);
  thumbs.appendChild(c);
video.remove();
}