replace_pocket_article_view_urls_with_orig.js

// ==UserScript==
// @name        Replace pocket article view links with original links
// @updateURL https://gist.github.com/akatopo/db936ca93c02ff53b3c0/raw
// @downloadURL https://gist.github.com/akatopo/db936ca93c02ff53b3c0/raw
// @version     0.19
// @description Replaces pocket article view links with original links without redirect
//              and moves the article view link next to the delete button. Removes share and copy link buttons.
// @require     https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.18.1/URI.min.js#sha384=fwI1rPfq814p7OaC91S1eASL8OGwE9c9oY5F8ho98XH1f6XB9CQpvwvyQPl+Vl5B
// @require     https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js#sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=
// @match       https://getpocket.com/saves*
// @copyright   2014+, Alex Katopodis
// @author      Alex Katopodis
// ==/UserScript==

((window, URI, $) => {
  "use strict";

  $(() => window.setInterval(restoreLinks, 500));

  const styleElem = document.head.appendChild(document.createElement("style"));
  styleElem.innerHTML = `
    [data-userscript-tampered="tampered"] [data-tooltip]:hover::after,
    [data-userscript-tampered="tampered"] [data-tooltip]:hover::before {
      animation-delay: 0.1s
    }
    [data-userscript-tampered="tampered"] [data-tooltip]:hover::after,
    [data-userscript-tampered="tampered"] [data-tooltip]:hover::before {
      animation-duration: calc(var(--dialogsDurationEnterMS) + 2.5s + var(--dialogsDurationExitMS))
    }
  `;

  ////////////////////////////////////////////////////////////////////////

  function restoreLinks() {
    $("article:not([data-userscript-tampered='tampered'])").each(
      (index, itemElement) => {
        itemElement.dataset.userscriptTampered = "tampered";
        const screenshotElement = $('a[tabindex="-1"]', itemElement);
        const articleUrl = screenshotElement.attr("href");

        $('button[aria-label="Open Menu"]', itemElement).click();
        const origUrl = $("cite a.publisher", itemElement).attr("href");
        $("footer .item-actions + div", itemElement).remove();

        const strippedOrigUrl = isRedirectHref(origUrl)
          ? URI(origUrl).search(true).url
          : URI(origUrl).removeSearch('utm_source').toString();

        $(screenshotElement)
          .attr("href", strippedOrigUrl)
          .attr("target", "blank")
          .attr("rel", "noopener noreferrer");

        $('a[tabindex="0"]', itemElement)
          .attr("href", strippedOrigUrl)
          .attr("target", "blank")
          .attr("rel", "noopener noreferrer");

        const hasArticleView = /read\//.test(articleUrl);
        if (hasArticleView) {
          const readerButton = createReaderButton(itemElement, articleUrl);
          $("footer .item-actions", itemElement).append(readerButton);
        }
        const copyButton = createCopyButton(itemElement, strippedOrigUrl);
        $("footer .item-actions", itemElement).append(copyButton);
      }
    );
  }

  function isRedirectHref(href) {
    const redirectUrl = "https://getpocket.com/redirect?url=";

    return href.substr(0, redirectUrl.length) === redirectUrl;
  }

  function createReaderButton(itemElement, articleUrl) {
    return createButton("Article View", itemElement, readerIconTemplate, () => {
      window.open(articleUrl, "_blank", "noopener,noreferrer");
    });
  }

  function createCopyButton(itemElement, itemUrl) {
    return createButton("Copy URL", itemElement, copyIconTemplate, (button) => {
      navigator.clipboard.writeText(itemUrl).then(
        () => {
          const prevTooltip = button.getAttribute("data-tooltip");
          button.setAttribute("data-tooltip", "Copied!");
          window.setTimeout(() => {
            button.setAttribute("data-tooltip", prevTooltip);
          }, 1500);
        },
        () => window.alert("Copy failed")
      );
    });
  }

  function createButton(label, itemElement, createTemplate, onClick) {
    const existingButtonSpan = $("footer .item-actions button", itemElement)[0];
    const button = document.createElement("button");
    button.className = existingButtonSpan.className;
    button.setAttribute("data-tooltip", label);
    button.setAttribute("aria-label", label);

    const iconClassName = $("footer .item-actions button .icon", itemElement)[0]
      .className;

    button.innerHTML = createTemplate(iconClassName);
    button.onclick = () => onClick(button);

    return button;
  }

  function readerIconTemplate(className) {
    return `
      <span class="${className}"
        ><svg
          aria-labelledby=" "
          fill="currentColor"
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 24 24"
          aria-hidden="true"
        >
          <path
            fill-rule="evenodd"
            d="M17 4H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V6a2 2 0 00-2-2zM7 2a4 4 0 00-4 4v12a4 4 0 004 4h10a4 4 0 004-4V6a4 4 0 00-4-4H7z"
            clip-rule="evenodd"
          ></path>
          <path
            fill-rule="evenodd"
            d="M7 8a1 1 0 011-1h8a1 1 0 110 2H8a1 1 0 01-1-1zM7 12a1 1 0 011-1h8a1 1 0 110 2H8a1 1 0 01-1-1zM7 16a1 1 0 011-1h4a1 1 0 110 2H8a1 1 0 01-1-1z"
            clip-rule="evenodd"
          ></path></svg
      ></span>
    `;
  }

  function copyIconTemplate(className) {
    return `
      <span class="${className}"
        ><svg
          aria-labelledby=" "
          xmlns="http://www.w3.org/2000/svg"
          fill="none"
          viewBox="0 0 24 24"
          aria-hidden="true"
        >
          <path
            fill="currentColor"
            fill-rule="evenodd"
            d="M12 2c-.747 0-1.75.712-2.625 2.636-.19.416-.364.873-.52 1.364h6.29c-.156-.491-.33-.948-.52-1.364C13.751 2.712 12.747 2 12 2zM7.554 3.808c-.302.664-.565 1.4-.786 2.192H4a10.034 10.034 0 014.076-3.2c-.19.322-.363.66-.52 1.008zM6.326 8H2.832A9.966 9.966 0 002 12c0 1.422.297 2.775.832 4h3.494A24.111 24.111 0 016 12c0-1.397.114-2.745.326-4zm.442 10H4a10.035 10.035 0 004.076 3.2c-.19-.322-.363-.66-.52-1.008-.303-.664-.566-1.4-.787-2.192zm2.087 0h6.29c-.156.491-.33.948-.52 1.364C13.751 21.288 12.747 22 12 22c-.747 0-1.75-.712-2.625-2.636-.19-.416-.364-.873-.52-1.364zm6.788-2H8.357A21.873 21.873 0 018 12c0-1.428.129-2.778.357-4h7.286c.228 1.222.357 2.572.357 4s-.129 2.778-.357 4zm1.589 2c-.22.792-.484 1.528-.786 2.192-.158.347-.332.686-.521 1.009A10.034 10.034 0 0020 18h-2.77zm3.936-2h-3.494A24.11 24.11 0 0018 12a24.11 24.11 0 00-.326-4h3.494A9.966 9.966 0 0122 12a9.966 9.966 0 01-.832 4zM15.925 2.8A10.034 10.034 0 0120 6h-2.77a15.076 15.076 0 00-.785-2.192 10.89 10.89 0 00-.521-1.008zM12 24c6.627 0 12-5.373 12-12S18.627 0 12 0 0 5.373 0 12s5.373 12 12 12z"
            clip-rule="evenodd"
          ></path>
        </svg>
      </span>
    `;
  }
})(window, URI, $);