GreasyFork: download script button

If you have a script manager and you want to download some script without installing it, this script will help

Versión del día 29/1/2021. Echa un vistazo a la versión más reciente.

Tendrás que instalar una extensión para tu navegador como Tampermonkey, Greasemonkey o Violentmonkey si quieres utilizar este script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Userscripts para instalar este script.

Necesitará instalar una extensión como Tampermonkey para instalar este script.

Necesitarás instalar una extensión para administrar scripts de usuario si quieres instalar este script.

(Ya tengo un administrador de scripts de usuario, déjame instalarlo)

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

(Ya tengo un administrador de estilos de usuario, déjame instalarlo)

// ==UserScript==
// @name         GreasyFork: download script button
// @description  If you have a script manager and you want to download some script without installing it, this script will help
// @namespace    https://greatest.deepsurf.us/users/424058
// @version      1.0.0
// @author       Konf
// @include      /^http(s|):\/\/greatest.deepsurf.us\/[a-zA-Z_-]*\/scripts\/\d.*$/
// @run-at       document-end
// @resource     iconDownload https://img.icons8.com/pastel-glyph/64/ffffff/download.png
// @compatible   Chrome
// @compatible   Opera
// @compatible   Firefox
// @grant        GM_getResourceUrl
// @grant        GM.getResourceUrl
// @noframes
// ==/UserScript==

/* jshint esversion: 6 */
/* eslint-disable no-multi-spaces */

(function() {
  'use strict';

  (GM.getResourceUrl || GM_getResourceUrl)('iconDownload')
  .then(downloadIconUrl => {
    addCSS(`
      .tm-dsb-downloadBtn {
        width: 43px;
        height: 38px;
        position: relative;
        padding: 0;
        vertical-align: bottom;
        cursor: pointer;
        border: none;
        outline: none;
        background: #0F750F;
        transition: box-shadow 0.2s;
      }

      .tm-dsb-downloadBtn:hover,
      .tm-dsb-downloadBtn:focus {
        box-shadow: 0 8px 16px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
      }


      .tm-dsb-downloadBtn__icon {
        position: absolute;
      }

      .tm-dsb-downloadBtn__icon--download {
        width: 35px;
        height: 35px;
        top: 1px;
        left: 4px;
        background: url(${downloadIconUrl});
        background-size: contain;
      }

      .tm-dsb-downloadBtn__icon--loading,
      .tm-dsb-downloadBtn__icon--loading:after {
        border-radius: 50%;
        width: 16px;
        height: 16px;
      }

      .tm-dsb-downloadBtn__icon--loading {
        top: 6px;
        left: 8px;
        text-indent: -9999em;
        border-top: 5px solid rgba(255, 255, 255, 0.2);
        border-right: 5px solid rgba(255, 255, 255, 0.2);
        border-bottom: 5px solid rgba(255, 255, 255, 0.2);
        border-left: 5px solid #ffffff;
        -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-animation: loading 1.1s infinite linear;
        animation: loading 1.1s infinite linear;
      }

      @-webkit-keyframes loading {
        0% {
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
        }
        100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }

      @keyframes loading {
        0% {
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
        }
        100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }
    `);
  });

  const userLang = location.pathname.split('/')[1];
  const langStringsList = {
    en: {
      Dl: 'Download without installing',
      unableDl: 'Unable to download the script'
    },
    ru: {
      Dl: 'Скачать не устанавливая',
      unableDl: 'Не удалось скачать скрипт'
    }
  };
  const langStrings = langStringsList[userLang] || langStringsList.en;

  const b = document.createElement('button'); // downloadBtn
  const bIcon = document.createElement('div');
  const bParent = document.body.querySelector('div#install-area');
  const bNeighbour = document.body.querySelector('a.install-help-link');
  const installBtn = document.body.querySelector('a.install-link');

  b.title = langStrings.Dl;
  b.className = 'tm-dsb-downloadBtn';
  bIcon.className = 'tm-dsb-downloadBtn__icon tm-dsb-downloadBtn__icon--download';
  bParent.insertBefore(b, bNeighbour);
  b.appendChild(bIcon);

  let fetchingDelay = false;

  b.addEventListener('click', () => {
    setTimeout(() => {
      if (b === document.activeElement) document.activeElement.blur();
    }, 750);

    if (fetchingDelay) return;
    fetchingDelay = true;
    bIcon.className = 'tm-dsb-downloadBtn__icon tm-dsb-downloadBtn__icon--loading';

    fetch(installBtn.href)
      .then(res => res.blob())
      .then(blob => {
        const url = window.URL.createObjectURL(blob);
        const a = document.createElement('a');

        a.href = url;
        a.download = `${installBtn.dataset.scriptName}.user.js`;
        document.body.appendChild(a); // needed due to firefox bug
        a.click();
        a.remove();

        setTimeout(closeFetchUX, 300);
        window.URL.revokeObjectURL(url);
      })
      .catch(e => {
        setTimeout(closeFetchUX, 300);
        alert(`${langStrings.unableDl}: \n${e}`);
     });
  });


  // utils -------------------------------------------------------------

  function closeFetchUX() {
    fetchingDelay = false;
    bIcon.className = 'tm-dsb-downloadBtn__icon tm-dsb-downloadBtn__icon--download';
  }

  function addCSS(cssCode) {
    const styleEl = document.createElement("style");
    styleEl.type = "text/css";

    if (styleEl.styleSheet) {
      styleEl.styleSheet.cssText = cssCode;
    } else {
      styleEl.appendChild(document.createTextNode(cssCode));
    }

    document.getElementsByTagName("head")[0].appendChild(styleEl);

    return styleEl;
  }

  // --------------------------------------------------------------------

})();