code golf - save a screenshot from youtube

code-golf_save-youtube-screenshot.js

// starting point
// when run, should save a jpeg screencap of current video,
// named 'youtube_$ID_$TITLE_$TIME.jpg'
function screenshot() {
  const video = document.querySelector('video.html5-main-video');
  const { clientWidth: width, clientHeight: height } = video;

  const canvas = document.createElement('canvas');
  document.body.appendChild(canvas);
  canvas.width = width;
  canvas.height = height;
  const ctx = canvas.getContext('2d');
  ctx.drawImage(video, 0, 0, canvas.width, canvas.height);


  const data = canvas.toDataURL('image/jpeg');
  const dataWithMIME = 'data:application/octet-stream' + data.substr('data:image/jpeg'.length - 1);
  document.body.removeChild(canvas);

  const link = document.createElement('a');
  const videoID = window.location.search.match(/[\?&]v=([^&]+)/)[1];
  const videoTitle = document.querySelector('h1.title').innerText;
  const videoTime = document.querySelector('.ytp-time-current').innerText;
  const filename = `youtube_${videoID}_${videoTitle}_${videoTime}`;
  link.download = `${filename}.jpg`;
  link.href = dataWithMIME;
  document.body.appendChild(link);
  link.click();
  return link;
}

// 572 - first minification attempt
(()=>{var d=document,t=['querySelector','appendChild','removeChild','createElement','innerText','width','height'],v=d[t[0]]('.html5-main-video'),z=d[t[3]]('canvas');d.body[t[1]](z);z[t[5]]=v.clientWidth,z[t[6]]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[t[5]],z[t[6]]);var l=d[t[3]]('a');l.download=`youtube_${location.search.match(/[?&]v=([^&]+)/)[1]}_${d[t[0]]('h1.title')[t[4]]}_${d[t[0]]('.ytp-time-current')[t[4]]}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg').substr(14);d.body[t[1]](l);l.click();d.body[t[2]](z);d.body[t[2]](l)})();

// 569 - tokens array to string
(()=>{var d=document,t='querySelector,appendChild,removeChild,createElement,innerText,width,height'.split(','),v=d[t[0]]('.html5-main-video'),z=d[t[3]]('canvas');d.body[t[1]](z);z[t[5]]=v.clientWidth,z[t[6]]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[t[5]],z[t[6]]);var l=d[t[3]]('a');l.download=`youtube_${location.search.match(/[?&]v=([^&]+)/)[1]}_${d[t[0]]('h1.title')[t[4]]}_${d[t[0]]('.ytp-time-current')[t[4]]}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg').substr(14);d.body[t[1]](l);l.click();d.body[t[2]](z);d.body[t[2]](l)})();

// 559 - get video ID from elem instead of URL
(()=>{var d=document,t='querySelector,appendChild,removeChild,createElement,innerText,width,height,video-id'.split(','),v=d[t[0]]('video'),z=d[t[3]]('canvas');d.body[t[1]](z);z[t[5]]=v.clientWidth,z[t[6]]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[t[5]],z[t[6]]);var l=d[t[3]]('a');l.download=`youtube_${d[t[0]](`[${t[7]}]`).getAttribute(t[7])}_${d[t[0]]('h1')[t[4]]}_${d[t[0]]('.ytp-time-current')[t[4]]}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg').substr(14);d.body[t[1]](l);l.click();d.body[t[2]](z);d.body[t[2]](l)})();

// 549 - unwrap IIFE
{let d=document,t='querySelector,appendChild,removeChild,createElement,innerText,width,height,video-id'.split(','),v=d[t[0]]('video'),z=d[t[3]]('canvas');d.body[t[1]](z);z[t[5]]=v.clientWidth,z[t[6]]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[t[5]],z[t[6]]);let l=d[t[3]]('a');l.download=`youtube_${d[t[0]](`[${t[7]}]`).getAttribute(t[7])}_${d[t[0]]('h1')[t[4]]}_${d[t[0]]('.ytp-time-current')[t[4]]}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg').substr(14);d.body[t[1]](l);l.click();d.body[t[2]](z);d.body[t[2]](l)}

// 461 - remove body operations
{let d=document,t='querySelector,createElement,innerText,width,height,video-id'.split(','),v=d[t[0]]('video'),z=d[t[1]]('canvas');z[t[3]]=v.clientWidth,z[t[4]]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[t[3]],z[t[4]]);let l=d[t[1]]('a');l.download=`youtube_${d[t[0]](`[${t[5]}]`).getAttribute(t[5])}_${d[t[0]]('h1')[t[2]]}_${d[t[0]]('.ytp-time-current')[t[2]]}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg').substr(14);l.click()}

// 457 - inline second let
{let d=document,t='querySelector,createElement,innerText,width,height,video-id'.split(','),v=d[t[0]]('video'),z=d[t[1]]('canvas'),l=d[t[1]]('a');z[t[3]]=v.clientWidth,z[t[4]]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[t[3]],z[t[4]]);l.download=`youtube_${d[t[0]](`[${t[5]}]`).getAttribute(t[5])}_${d[t[0]]('h1')[t[2]]}_${d[t[0]]('.ytp-time-current')[t[2]]}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg').substr(14);l.click()}

// 427 - unwrap tokens
{let d=document,[q,c,i,w,h,m]='querySelector,createElement,innerText,width,height,video-id'.split(','),v=d[q]('video'),z=d[c]('canvas'),l=d[c]('a');z[w]=v.clientWidth,z[h]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[w],z[h]);l.download=`youtube_${d[q](`[${m}]`).getAttribute(m)}_${d[q]('h1')[i]}_${d[q]('.ytp-time-current')[i]}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg').substr(14);l.click()}

// 426 - substr -> slice
{let d=document,[q,c,i,w,h,m]='querySelector,createElement,innerText,width,height,video-id'.split(','),v=d[q]('video'),z=d[c]('canvas'),l=d[c]('a');z[w]=v.clientWidth,z[h]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[w],z[h]);l.download=`youtube_${d[q](`[${m}]`).getAttribute(m)}_${d[q]('h1')[i]}_${d[q]('.ytp-time-current')[i]}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg').slice(14);l.click()}

// 425 - innerText getter function
{let d=document,[q,c,w,h,m]='querySelector,createElement,width,height,video-id'.split(','),r=t=>d[q](t).innerText,v=d[q]('video'),z=d[c]('canvas'),l=d[c]('a');z[w]=v.clientWidth,z[h]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[w],z[h]);l.download=`youtube_${d[q](`[${m}]`).getAttribute(m)}_${r('h1')}_${r('.ytp-time-current')}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg').slice(14);l.click()}

// 410 - get yt video id from url again (is this bad?)
{let d=document,[q,c,w,h,s]='querySelector,createElement,width,height,slice'.split(','),r=t=>d[q](t).innerText,v=d[q]('video'),z=d[c]('canvas'),l=d[c]('a');z[w]=v.clientWidth,z[h]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[w],z[h]);l.download=`youtube_${location.search[s](3)}_${r('h1')}_${r('.ytp-time-current')}.jpg`;l.href='data:application/octet-stream'+z.toDataURL('image/jpeg')[s](14);l.click()}

// 366 - works without changing mime type (WORKS ON MY MACHINE :troll:)
{let d=document,[q,c,w,h]='querySelector,createElement,width,height'.split(','),r=t=>d[q](t).innerText,v=d[q]('video'),z=d[c]('canvas'),l=d[c]('a');z[w]=v.clientWidth,z[h]=v.clientHeight;z.getContext('2d').drawImage(v,0,0,z[w],z[h]);l.download=`youtube_${location.search.slice(3)}_${r('h1')}_${r('.ytp-time-current')}.jpg`;l.href=z.toDataURL('image/jpeg');l.click()}

// 344 - drawImage with less args, use native video width and height (actually a bug fix!)
{let d=document,[q,c]='querySelector,createElement'.split(','),r=t=>d[q](t).innerText,v=d[q]('video'),z=d[c]('canvas'),l=d[c]('a');z.width=v.videoWidth,z.height=v.videoHeight;z.getContext('2d').drawImage(v,0,0);l.download=`youtube_${location.search.slice(3)}_${r('h1')}_${r('.ytp-time-current')}.jpg`;l.href=z.toDataURL('image/jpeg');l.click()}

// 333 - get rid of tokens array
{let d=document,q='querySelector',c='createElement',r=t=>d[q](t).innerText,v=d[q]('video'),z=d[c]('canvas'),l=d[c]('a');z.width=v.videoWidth,z.height=v.videoHeight;z.getContext('2d').drawImage(v,0,0);l.download=`youtube_${location.search.slice(3)}_${r('h1')}_${r('.ytp-time-current')}.jpg`;l.href=z.toDataURL('image/jpeg');l.click()}

// 333 - how is this the same
{let d=document,c=t=>d.createElement(t),q=t=>d.querySelector(t),r=t=>q(t).innerText,v=q('video'),z=c('canvas'),l=c('a');z.width=v.videoWidth,z.height=v.videoHeight;z.getContext('2d').drawImage(v,0,0);l.download=`youtube_${location.search.slice(3)}_${r('h1')}_${r('.ytp-time-current')}.jpg`;l.href=z.toDataURL('image/jpeg');l.click()}

// 333 - hmmmmmmm
{let d=document,c=t=>d.createElement(t),q=t=>d.querySelector(t),r='innerText',v=q('video'),z=c('canvas'),l=c('a');z.width=v.videoWidth,z.height=v.videoHeight;z.getContext('2d').drawImage(v,0,0);l.download=`youtube_${location.search.slice(3)}_${q('h1')[r]}_${q('.ytp-time-current')[r]}.jpg`;l.href=z.toDataURL('image/jpeg');l.click()}