Greasy Fork Enhance

Enhance your experience at Greasyfork.

Versão de: 06/08/2023. Veja: a última versão.

Você precisará instalar uma extensão como Tampermonkey, Greasemonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Userscripts para instalar este script.

Você precisará instalar uma extensão como o Tampermonkey para instalar este script.

Você precisará instalar um gerenciador de scripts de usuário para instalar este script.

(Eu já tenho um gerenciador de scripts de usuário, me deixe instalá-lo!)

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

(Eu já possuo um gerenciador de estilos de usuário, me deixar fazer a instalação!)

// ==UserScript==
// @name         Greasy Fork Enhance
// @name:zh-CN   Greasy Fork 增强
// @namespace    http://tampermonkey.net/
// @version      0.5.4
// @description  Enhance your experience at Greasyfork.
// @description:zh-CN 增进 Greasyfork 浏览体验。
// @author       PRO
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_deleteValue
// @grant        GM_registerMenuCommand
// @grant        GM_unregisterMenuCommand
// @match        https://greatest.deepsurf.us/*
// @require      https://greatest.deepsurf.us/scripts/470224-tampermonkey-config/code/Tampermonkey%20Config.js?version=1230660
// @icon         https://greatest.deepsurf.us/vite/assets/blacklogo16-bc64b9f7.png
// @license      gpl-3.0
// ==/UserScript==

(function() {
    'use strict';
    // Judge if the script should run
    let no_run = [".json", ".js"];
    let is_run = true;
    let idPrefix = "greasyfork-enhance-";
    no_run.forEach((suffix) => {
        if (window.location.href.endsWith(suffix)) {
            is_run = false;
        }
    });
    if (!is_run) return;
    // Config
    let config_desc = {
        "auto-hide-code": {
            name: "Auto hide code",
            value: true,
            input: "current",
            processor: "not",
            formatter: "boolean"
        },
        "auto-hide-rows": {
            name: "Min rows to hide",
            value: 10,
            processor: "int_range-1-"
        },
        "flat-layout": {
            name: "Flat layout",
            value: false,
            input: "current",
            processor: "not",
            formatter: "boolean"
        },
    };
    let config = GM_config(config_desc);
    // Functions
    let body = document.querySelector("body");
    function sanitify(s) {
        // Remove emojis (such a headache)
        s = s.replaceAll(/([\uE000-\uF8FF]|\uD83C[\uDC00-\uDFFF]|\uD83D[\uDC00-\uDFFF]|[\u2580-\u27BF]|\uD83E[\uDD10-\uDEFF]|\uFE0F)/g, "");
        // Trim spaces and newlines
        s = s.trim();
        // Replace spaces
        s = s.replaceAll(" ", "-");
        s = s.replaceAll("%20", "-");
        // No more multiple "-"
        s = s.replaceAll(/-+/g, "-");
        return s;
    }
    function process(node) { // Add anchor and assign id to given node; Add to outline. Return true if node is actually processed.
        if (node.childElementCount > 1 || node.classList.length > 0) return false; // Ignore complex nodes
        let text = node.textContent;
        node.id = sanitify(text); // Assign id
        // Add anchors
        let node_ = document.createElement('a');
        node_.className = 'anchor';
        node_.href = '#' + node.id;
        node.appendChild(node_);
        let list_item = document.createElement("li");
        outline.appendChild(list_item);
        let link = document.createElement("a");
        link.href = "#" + node.id;
        link.text = text;
        list_item.appendChild(link);
        return true;
    }
    async function animate(node, animation) {
        return new Promise((resolve, reject) => {
            node.classList.add("animate__animated", "animate__" + animation);
            node.addEventListener('animationend', e => {
                e.stopPropagation();
                node.classList.remove("animate__animated", "animate__" + animation);
                resolve();
            }, { once: true });
        });
    }
    function copyCode() {
        let code = this.parentNode.nextElementSibling;
        let text = code.textContent;
        navigator.clipboard.writeText(text).then(() => {
            this.textContent = "Copied!";
            animate(this, "tada").then(() => {
                this.textContent = "Copy code";
            });
        });
    }
    function toggleCode() {
        let code = this.parentNode.nextElementSibling;
        if (code.style.display == "none") {
            code.style.display = "";
            // this.textContent = "Hide code";
            animate(this, "fadeOut").then(() => {
                this.textContent = "Hide code";
                animate(this, "fadeIn");
            });
        } else {
            code.style.display = "none";
            // this.textContent = "Show code";
            animate(this, "fadeOut").then(() => {
                this.textContent = "Show code";
                animate(this, "fadeIn");
            });
        }
    }
    function create_toolbar() {
        let toolbar = document.createElement("div");
        let copy = document.createElement("a");
        let toggle = document.createElement("a");
        toolbar.appendChild(copy);
        toolbar.appendChild(toggle);
        copy.textContent = "Copy code";
        copy.className = "code-operation";
        copy.title = "Copy code to clipboard";
        copy.addEventListener("click", copyCode);
        toggle.textContent = "Hide code";
        toggle.classList.add("code-operation", "animate__faster");
        toggle.title = "Toggle code display";
        toggle.addEventListener("click", toggleCode);
        // Css
        toolbar.className = "code-toolbar";
        return toolbar;
    }
    function cssHelper(id, css) {
        let current = document.getElementById(idPrefix + id);
        if (css && !current) {
            let style = document.createElement("style");
            style.id = idPrefix + id;
            style.textContent = css;
            document.head.appendChild(style);
        } else if (!css && current) {
            current.remove();
        }
    }
    // Css
    let css = document.createElement("style");
    css.textContent = `
    html {
        scroll-behavior: smooth;
    }
    a.anchor::before {
        content: "#";
    }
    a.anchor {
        opacity: 0;
        text-decoration: none;
        padding: 0px 0.5em;
        transition: all 0.25s ease-in-out;
    }
    h1:hover>a.anchor, h2:hover>a.anchor, h3:hover>a.anchor,
    h4:hover>a.anchor, h5:hover>a.anchor, h6:hover>a.anchor {
        opacity: 1;
        transition: all 0.25s ease-in-out;
    }
    a.button {
        margin: 0.5em 0 0 0;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        color: black;
        background-color: #a42121ab;
        border-radius: 50%;
        width: 2em;
        height: 2em;
        font-size: 1.8em;
        font-weight: bold;
    }
    div.code-toolbar {
        display: flex;
        gap: 1em;
    }
    a.code-operation {
        cursor: pointer;
        font-style: italic;
    }
    div.lum-lightbox {
        z-index: 2;
    }
    div#float-buttons {
        position: fixed;
        bottom: 1em;
        right: 1em;
        display: flex;
        flex-direction: column;
        user-select: none;
        z-index: 1;
    }
    aside.panel {
        display: none;
    }
    .dynamic-opacity {
        transition: opacity 0.2s ease-in-out;
        opacity: 0.2;
    }
    .dynamic-opacity:hover {
        opacity: 0.8;
    }
    input[type=file] {
        border-style: dashed;
        border-radius: 0.5em;
        padding: 0.5em;
        background: rgba(169, 169, 169, 0.4);
    }
    table {
        border: 1px solid #8d8d8d;
        border-collapse: collapse;
        width: auto;
    }
    table td, table th {
        padding: 0.5em 0.75em;
        vertical-align: middle;
        border: 1px solid #8d8d8d;
    }
    @media (any-hover: none) {
        .dynamic-opacity {
            opacity: 0.8;
        }
        .dynamic-opacity:hover {
            opacity: 0.8;
        }
    }
    @media screen and (min-width: 767px) {
        aside.panel {
            display: contents;
            line-height: 1.5;
        }
        ul.outline {
            position: sticky;
            float: right;
            padding: 0 0 0 0.5em;
            margin: 0 0.5em;
            max-height: 80vh;
            border: 1px solid #BBBBBB;
            border-left: 2px solid #F2E5E5;
            box-shadow: 0 0 5px #ddd;
            background: linear-gradient(to right, #fcf1f1, #FFF 1em);
            list-style: none;
            width: 10.5%;
            color: gray;
            border-radius: 5px;
            overflow-y: scroll;
            z-index: 1;
        }
        ul.outline > li {
            overflow: hidden;
            text-overflow: ellipsis;
        }
        ul.outline > li > a {
            color: gray;
            white-space: nowrap;
            text-decoration: none;
        }
    }
    /* Adapted from animate.css - https://animate.style/ */
    :root {
        --animate-duration: 1s;
        --animate-delay: 1s;
        --animate-repeat: 1;
    }
    .animate__animated {
        animation-duration: var(--animate-duration);
        animation-fill-mode: both;
    }
    .animate__animated.animate__faster {
        animation-duration: calc(var(--animate-duration) / 2);
    }
    @keyframes tada {
        from {
            transform: scale3d(1, 1, 1);
        }
        10%, 20% {
            transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        }
        30%, 50%, 70%, 90% {
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        }
        40%, 60%, 80% {
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        }
        to {
            transform: scale3d(1, 1, 1);
        }
    }
    .animate__tada {
        animation-name: tada;
    }
    @keyframes fadeIn {
        from {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
    }
    .animate__fadeIn {
        animation-name: fadeIn;
    }
    @keyframes fadeOut {
        from {
            opacity: 1;
        }
        to {
            opacity: 0;
        }
    }
    .animate__fadeOut {
        -webkit-animation-name: fadeOut;
        animation-name: fadeOut;
    }`;
    document.querySelector("head").appendChild(css); // Inject css
    // Aside panel & Anchors
    let outline;
    let is_script = /^\/[^\/]+\/scripts/;
    let is_specific_script = /^\/[^\/]+\/scripts\/\d+/;
    let is_disccussion = /^\/[^\/]+\/discussions/;
    let path = window.location.pathname;
    if ((!is_script.test(path) && !is_disccussion.test(path)) || is_specific_script.test(path)) {
        let panel = document.createElement("aside");
        panel.className = "panel";
        body.insertBefore(panel, document.querySelector("body > div.width-constraint"));
        let reference_node = document.querySelector("body > div.width-constraint > section");
        outline = document.createElement("ul");
        outline.classList.add("outline");
        outline.classList.add("dynamic-opacity");
        outline.style.top = reference_node ? getComputedStyle(reference_node).marginTop : "1em";
        outline.style.marginTop = outline.style.top;
        panel.appendChild(outline);
        let flag = false;
        document.querySelectorAll("body > div.width-constraint h1, h2, h3, h4, h5, h6").forEach((node) => {
            flag = process(node) || flag; // Not `flag || process(node)`!
        });
        if (!flag) {
            panel.remove();
        }
    }
    // Navigate to hash
    let hash = window.location.hash.slice(1);
    if (hash) {
        let ele = document.getElementById(decodeURIComponent(hash));
        if (ele) {
            ele.scrollIntoView();
        }
    }
    // Buttons
    let buttons = document.createElement("div");
    buttons.id = "float-buttons";
    let to_top = document.createElement("a");
    to_top.classList.add("button");
    to_top.classList.add("dynamic-opacity");
    to_top.href = "#top";
    to_top.text = "↑";
    buttons.appendChild(to_top);
    body.appendChild(buttons);
    // Double click to get to top
    body.addEventListener("dblclick", (e) => {
        if (e.target === body) {
            to_top.click();
        }
    });
    // Fix current tab link
    let tab = document.querySelector("ul#script-links > li.current");
    if (tab) {
        let link = document.createElement("a");
        link.href = window.location.pathname;
        let orig_child = tab.firstChild;
        link.appendChild(orig_child);
        tab.appendChild(link);
    }
    let parts = window.location.pathname.split("/");
    if (parts.length <= 2 || (parts.length == 3 && parts[2] === '')) {
        let banner = document.querySelector("header#main-header div#site-name");
        let img = banner.querySelector("img");
        let text = banner.querySelector("#site-name-text > h1");
        let link1 = document.createElement("a");
        link1.href = window.location.pathname;
        img.parentNode.replaceChild(link1, img);
        link1.appendChild(img);
        let link2 = document.createElement("a");
        link2.href = window.location.pathname;
        link2.textContent = text.textContent;
        text.textContent = "";
        text.appendChild(link2);
    }
    // Toolbar for code blocks
    let code_blocks = document.getElementsByTagName("pre");
    let auto_hide = config["auto-hide-code"];
    let auto_hide_rows = config["auto-hide-rows"];
    for (let code_block of code_blocks) {
        code_block.insertAdjacentElement("afterbegin", create_toolbar());
    }
    // Auto hide code blocks
    function autoHide() {
        if (!auto_hide) {
            for (let code_block of code_blocks) {
                let toggle = code_block.firstChild.lastChild;
                if (toggle.textContent === "Show code") {
                    toggle.click(); // Click the toggle button
                }
            }
        } else {
            for (let code_block of code_blocks) {
                let m = code_block.lastChild.textContent.match(/\n/g);
                let rows = m ? m.length : 0;
                let toggle = code_block.firstChild.lastChild;
                let hidden = toggle.textContent === "Show code";
                if (rows >= auto_hide_rows && !hidden || rows < auto_hide_rows && hidden) {
                    code_block.firstChild.lastChild.click(); // Click the toggle button
                }
            }
        }
    }
    autoHide();
    // Flat layout
    function flatLayout(enabled) {
        let css = `
        .script-list li:not(.ad-entry) {
            padding-right: 0;
        }
        ol.script-list > li > article {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
        }
        ol.script-list > li > article > h2 {
            width: 60%;
            overflow: hidden;
            text-overflow: ellipsis;
            margin-right: 0.5em;
            padding-right: 0.5em;
            border-right: 1px solid #DDDDDD;
        }
        .showing-all-languages .badge-js, .showing-all-languages .badge-css, .script-type {
            display: none;
        }
        ol.script-list > li > article > h2 > a.script-link {
            white-space: nowrap;
        }
        ol.script-list > li > article > h2 > span.script-description {
            display: block;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        ol.script-list > li > article > div.script-meta-block {
            width: 40%;
            column-gap: 0;
        }
        ol.script-list > li[data-script-type="library"] > article > h2 {
            width: 80%;
        }
        ol.script-list > li[data-script-type="library"] > article > div.script-meta-block {
            width: 20%;
            column-count: 1;
        }
        ol.script-list > li > article > div.script-meta-block > dl.inline-script-stats {
            margin: 0;
        }
        ol.script-list > li > article > div.script-meta-block > dl.inline-script-stats > dd {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        `;
        cssHelper("flat-layout", enabled ? css : null);
    }
    flatLayout(config["flat-layout"]);
    // Dynamically respond to config changes
    let callbacks = {
        "auto-hide-code": (after) => {
            auto_hide = after;
            autoHide();
        },
        "auto-hide-rows": (after) => {
            auto_hide_rows = after;
            autoHide();
        },
        "flat-layout": flatLayout,
    };
    window.addEventListener(GM_config_event, e => {
        if (e.detail.type === "set") {
            let callback = callbacks[e.detail.prop];
            if (callback && (e.detail.before !== e.detail.after)) {
                callback(e.detail.after);
            }
        }
    });
})();