☰

theworldwatch downloader

Video downloader for theworldwatch.com

  1. // ==UserScript==
  2. // @name        theworldwatch downloader
  3. // @namespace   Violentmonkey Scripts
  4. // @match       *://theworldwatch.com/*
  5. // @match       *://*.theworldwatch.com/*
  6. // @grant       GM.xmlHttpRequest
  7. // @grant       GM_addElement
  8. // @grant       GM_addStyle
  9. // @grant       GM_download
  10. // @grant       GM_openInTab
  11. // @grant       GM_log
  12. // @version     2.6
  13. // @author      https://greasyfork.org/en/users/1409235-paywalldespiser
  14. // @description Video downloader for theworldwatch.com
  15. // @license     MIT
  16. // @require     https://update.greasyfork.org/scripts/523012/1516081/WaitForKeyElement.js
  17. // @require     https://update.greasyfork.org/scripts/523457/1518908/GM_DL.js
  18. // @require     https://cdn.jsdelivr.net/npm/file-saver@2.0.5/dist/FileSaver.min.js
  19. // @connect     theworldwatch.com
  20. // @connect     cdn.theworldwatch.com
  21. // ==/UserScript==
  22.  
  23. /**
  24.  * Gets filename from theworldwatch.com video URL
  25.  *
  26.  * @param {string} url
  27.  * @returns {string}
  28.  */
  29. function getFilenameFromURL(url) {
  30.     const title = document.title;
  31.     for (const [, videoURL] of url.matchAll(/\/get_file\/.*\/(.*?)\.mp4/gm)) {
  32.         if (videoURL) {
  33.             return `${title} [${videoURL}].mp4`;
  34.         }
  35.     }
  36.  
  37.     return `${title}.mp4`;
  38. }
  39.  
  40. (function () {
  41.     GM_addStyle(`
  42.     .loader {
  43.         border: 0.25em solid #f3f3f3;
  44.         border-top: 0.25em solid rgba(0, 0, 0, 0);
  45.         border-radius: 50%;
  46.         width: 1em;
  47.         height: 1em;
  48.         animation: spin 2s linear infinite;
  49.     }
  50.     
  51.     @keyframes spin {
  52.         0% {
  53.             transform: rotate(0deg);
  54.         }
  55.     
  56.         100% {
  57.             transform: rotate(360deg);
  58.         }
  59.     }
  60.     
  61.     .kt-player .fp-controls .fp-download {
  62.         display: inline-flex;
  63.         float: right;
  64.         height: 100%;
  65.         justify-content: center;
  66.         align-items: center;
  67.         margin: 2px 4px 4px 10px;
  68.     }
  69.     `);
  70.     waitForKeyElement('.player video').then((video) => {
  71.         const fullScreenButton = video.nextElementSibling.querySelector(
  72.             '.fp-controls > .fp-screen'
  73.         );
  74.         const downloadButtonContainer = GM_addElement('div');
  75.         downloadButtonContainer.classList.add('fp-download');
  76.  
  77.         const downloadButton = GM_addElement('a');
  78.         downloadButton.style.fontSize = '1.4em';
  79.         downloadButton.textContent = '⬇';
  80.  
  81.         downloadButtonContainer.appendChild(downloadButton);
  82.  
  83.         const loadingElement = GM_addElement('div');
  84.         loadingElement.classList.add('loader');
  85.  
  86.         downloadButton.addEventListener('click', () => {
  87.             downloadButtonContainer.removeChild(downloadButton);
  88.             downloadButtonContainer.appendChild(loadingElement);
  89.             GM_DL({url: video.src, filename: getFilenameFromURL(video.src)}).then(
  90.                 () => {
  91.                     downloadButtonContainer.appendChild(downloadButton);
  92.  
  93.                     downloadButtonContainer.removeChild(loadingElement);
  94.  
  95.                     downloadButton.textContent = '✓';
  96.                 },
  97.                 (e) => {
  98.                     GM_log(`error: ${e}`);
  99.                     console.error(e);
  100.                     downloadButtonContainer.appendChild(downloadButton);
  101.  
  102.                     downloadButtonContainer.removeChild(loadingElement);
  103.  
  104.                     downloadButton.textContent = '⮿';
  105.                 }
  106.             );
  107.         });
  108.         fullScreenButton.parentNode?.insertBefore(
  109.             downloadButtonContainer,
  110.             fullScreenButton.nextSibling
  111.         );
  112.     });
  113. })();