Bring Save Button Back

Возвращает кнопку сохранения поста на pikabu.ru на её законное место.

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         Bring Save Button Back
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Возвращает кнопку сохранения поста на pikabu.ru на её законное место.
// @author       NosefU
// @match        https://pikabu.ru/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=pikabu.ru
// @grant        none
// @license MIT
// ==/UserScript==

const saveButtonIcon = '<svg class="svg-icon" style="fill: currentColor;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M730.584615 78.769231v267.815384c0 19.692308-15.753846 37.415385-37.415384 37.415385H273.723077c-19.692308 0-37.415385-15.753846-37.415385-37.415385V78.769231H157.538462C114.215385 78.769231 78.769231 114.215385 78.769231 157.538462v708.923076c0 43.323077 35.446154 78.769231 78.769231 78.769231h708.923076c43.323077 0 78.769231-35.446154 78.769231-78.769231V220.553846L803.446154 78.769231h-72.861539z m137.846154 750.276923c0 19.692308-15.753846 37.415385-37.415384 37.415384H194.953846c-19.692308 0-37.415385-15.753846-37.415384-37.415384V500.184615c0-19.692308 15.753846-37.415385 37.415384-37.415384h636.061539c19.692308 0 37.415385 15.753846 37.415384 37.415384v328.861539zM488.369231 267.815385c0 19.692308 15.753846 37.415385 37.415384 37.415384h90.584616c19.692308 0 37.415385-15.753846 37.415384-37.415384V78.769231h-163.446153l-1.969231 189.046154z"  /></svg>';


function GM_addStyle(css) {
    const style = document.getElementById("GM_addStyleBy8626") || (function() {
        const style = document.createElement('style');
        style.type = 'text/css';
        style.id = "GM_addStyleBy8626";
        document.head.appendChild(style);
        return style;
    })();
    const sheet = style.sheet;
    sheet.insertRule(css, (sheet.rules || sheet.cssRules || []).length);
}


function addSaveButtons(footerNodes) {
    for (let storyFooter of footerNodes) {
        let storyCard = storyFooter.closest(".story");
        let storyId = storyCard.dataset.storyId;
        let saveButton = document.createElement("div");
        saveButton.innerHTML = saveButtonIcon;
        saveButton.classList.add("story__save");
        if (storyCard.dataset.saved) saveButton.classList.add("story__save_active");
        saveButton.dataset.storyId = storyId;
        storyFooter.prepend(saveButton);
    }
}


// Коллбэк при срабатывании мутации
const observerCallback = function(mutationsList, observer) {
    for (let mutation of mutationsList) {
        if (mutation.type !== 'childList')	continue; // проверяем, что это изменение структуры страницы
        for (let node of mutation.addedNodes) { // сначала проходим по добавленным нодам
            if (node.nodeName === "#text" || node.nodeName === "#comment") continue; // отсекаем текст
            let storyFooters = node.getElementsByClassName('story__footer');
            addSaveButtons(storyFooters);
        }
    }
};


GM_addStyle('.story__save > svg {color: var(--color-black-700); height: 20px; width: 20px;}');
GM_addStyle('.story__save_active {background-color: var(--color-primary-700) !important;}');
GM_addStyle('.story__save_active > svg {color: var(--color-bright-900);}');

let storyFooters = document.getElementsByClassName('story__footer');
addSaveButtons(storyFooters);

// и вешаем обсервер для тех, у кого бесконечная лента
const config = {childList: true, subtree: true};
const observer = new MutationObserver(observerCallback);
observer.observe(document.body, config);