Get YouTube Thumbnail

Adds button to view largest thumbnail image for any video

目前為 2018-03-07 提交的版本,檢視 最新版本

  1. // ==UserScript==
  2. // @name Get YouTube Thumbnail
  3. // @version 0.4
  4. // @description Adds button to view largest thumbnail image for any video
  5. // @author Drazen Bjelovuk
  6. // @match *://www.youtube.com/*
  7. // @grant none
  8. // @run-at document-end
  9. // @namespace https://greasyfork.org/users/11679
  10. // @contributionURL https://goo.gl/dYIygm
  11. // ==/UserScript==
  12.  
  13. document.addEventListener('spfdone', addThumbnailButton);
  14. document.addEventListener('yt-navigate-start', addThumbnailButton);
  15.  
  16. addThumbnailButton();
  17.  
  18. const sizes = ['/maxresdefault.jpg', '/hqdefault.jpg', '/mqdefault.jpg', '/sddefault.jpg'];
  19. var vidId;
  20.  
  21. function tryLoad(index) {
  22. var image = new Image();
  23. image.onload = function(img) {
  24. if (img.path[0].naturalWidth > 120) {
  25. window.open(img.path[0].src);
  26. }
  27. else if (index < sizes.length - 1) {
  28. tryLoad(index + 1);
  29. }
  30. };
  31. image.src = 'https://img.youtube.com/vi/'+ vidId + sizes[index];
  32. }
  33.  
  34. function addThumbnailButton() {
  35. var button = document.getElementById('viewThumbnailBtn');
  36. if (button) button.remove();
  37.  
  38. var subscribeButton = document.querySelector('#subscribe-button');
  39. if (subscribeButton) {
  40. button = document.createElement('paper-button');
  41. button.id = 'viewThumbnailBtn';
  42. button.className = 'style-scope ytd-subscribe-button-renderer';
  43. button.style.cssText = 'margin-left: auto';
  44. button.textContent = 'View Thumbnail';
  45. button.onclick = function() {
  46. vidId = document.querySelector('ytd-watch').getAttribute('video-id');
  47. tryLoad(0);
  48. };
  49. subscribeButton.parentNode.insertBefore(button, subscribeButton);
  50. }
  51. else if (window.location.href.indexOf('v=') > -1) {
  52. setTimeout(addThumbnailButton, 500);
  53. }
  54. }