GitHub Scroll To Top

Adds a scroll to top button to github

Verze ze dne 11. 04. 2025. Zobrazit nejnovější verzi.

K instalaci tototo skriptu si budete muset nainstalovat rozšíření jako Tampermonkey, Greasemonkey nebo Violentmonkey.

You will need to install an extension such as Tampermonkey to install this script.

K instalaci tohoto skriptu si budete muset nainstalovat rozšíření jako Tampermonkey nebo Violentmonkey.

K instalaci tohoto skriptu si budete muset nainstalovat rozšíření jako Tampermonkey nebo Userscripts.

You will need to install an extension such as Tampermonkey to install this script.

K instalaci tohoto skriptu si budete muset nainstalovat manažer uživatelských skriptů.

(Už mám manažer uživatelských skriptů, nechte mě ho nainstalovat!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(Už mám manažer uživatelských stylů, nechte mě ho nainstalovat!)

// ==UserScript==
// @name         GitHub Scroll To Top
// @namespace    http://tampermonkey.net/
// @version      2025-04-11
// @description  Adds a scroll to top button to github
// @author       Charles Pritchard
// @match        https://github.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=github.com
// @grant        none
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';
    const targetElementSelector = ".application-main";
    const buttonClassName = "simple-scroll-top-button";
    const scrollThreshold = 200; // Pixels to scroll before showing button

    let scrollButton = null; // Keep a reference to the button

    // Function to handle showing/hiding the button based on scroll
    function handleScroll() {
        if (!scrollButton) return; // Exit if button doesn't exist

        if (window.scrollY > scrollThreshold) {
            // Show button
            scrollButton.style.opacity = "1";
            scrollButton.style.transform = "translateY(0)";
        } else {
            // Hide button
            scrollButton.style.opacity = "0";
            scrollButton.style.transform = "translateY(50px)"; // Move down
        }
    }

    function addButton() {
        if (document.querySelector(`.${buttonClassName}`)) {
            scrollButton = document.querySelector(`.${buttonClassName}`); // Ensure reference is set if already exists
            return; // Button already exists
        }

        const button = document.createElement("button");
        button.textContent = "↑ Top";
        button.className = buttonClassName;
        button.onclick = () => {
            window.scrollTo({ top: 0, behavior: "smooth" });
        };

        // Base styles
        button.style.position = "fixed";
        button.style.bottom = "20px";
        button.style.right = "20px";
        button.style.zIndex = "9999";
        button.style.padding = "8px 12px";
        button.style.cursor = "pointer";
        button.style.backgroundColor = "#222"; // Darker background
        button.style.color = "#eee"; // Lighter text
        button.style.border = "1px solid #555"; // Adjusted border
        button.style.borderRadius = "4px";

        // Animation styles
        button.style.opacity = "0"; // Start hidden
        button.style.transform = "translateY(50px)"; // Start shifted down
        button.style.transition =
            "opacity 0.3s ease-out, transform 0.3s ease-out"; // Smooth transition

        document.body.appendChild(button);
        scrollButton = button; // Store reference
        console.log("Scroll Top button added (initially hidden).");

        // Add scroll listener only once
        window.removeEventListener("scroll", handleScroll); // Remove previous just in case
        window.addEventListener("scroll", handleScroll, { passive: true });

        // Check initial scroll position immediately
        handleScroll();
    }

    const observer = new MutationObserver((mutationsList, observer) => {
        if (document.querySelector(targetElementSelector)) {
            addButton();
            // Keep observer running? If GitHub SPA navigation removes/re-adds
            // .application-main, you might need the button added again.
            // If you only want it added once per full page load, disconnect.
            // observer.disconnect();
        }
    });

    const checkBodyInterval = setInterval(() => {
        if (document.body) {
            clearInterval(checkBodyInterval);
            // Initial check
            if (document.querySelector(targetElementSelector)) {
                addButton();
            } else {
                // Start observing if target not found initially
                observer.observe(document.body, {
                    childList: true,
                    subtree: true,
                });
            }
        }
    }, 100);
})();