Komica: F5

Scroll to top while you press F5.
换行
// ==UserScript==
// @name         Komica: F5
// @version      1.0.6
// @description  Scroll to top while you press F5.
// @author       Hayao-Gai
// @namespace	 https://github.com/HayaoGai
// @icon         https://i.imgur.com/ltLDPGc.jpg
// @include      http://*.komica.org/*/*
// @include      https://*.komica.org/*/*
// @grant        none
// ==/UserScript==

/* jshint esversion: 6 */

(function() {
    'use strict';

    const red = `<svg width="45" height="45" viewBox="0 0 128 128"><g transform="translate(0,128) scale(0.1,-0.1)" fill="#800000" stroke="none"><path d="M482 1260 c-113 -30 -206 -84 -293 -170 -336 -335 -203 -899 251 -1060 89 -31 248 -38 345 -16 121 29 209 79 305 176 129 129 190 269 190 441 0 113 -16 184 -67 289 -131 271 -441 416 -731 340z m261 -155 c91 -19 160 -58 234 -131 277 -273 124 -740 -265 -806 -310 -53 -595 232 -543 544 34 204 181 356 386 398 61 12 114 11 188 -5z"/><path d="M463 817 c-125 -125 -143 -147 -143 -175 0 -43 38 -82 80 -82 25 0 45 13 96 62 l64 61 0 -157 c0 -153 1 -157 25 -181 15 -16 36 -25 55 -25 19 0 40 9 55 25 24 23 25 28 25 175 0 82 3 150 7 150 3 0 32 -25 64 -55 45 -43 65 -55 89 -55 42 0 80 39 80 82 0 28 -18 50 -143 175 -128 128 -146 143 -177 143 -31 0 -49 -15 -177 -143z"/></g></svg>`;
    const white = `<svg width="45" height="45" viewBox="0 0 128 128"><g transform="translate(0,128) scale(0.1,-0.1)" fill="white" stroke="none"><path d="M482 1260 c-113 -30 -206 -84 -293 -170 -336 -335 -203 -899 251 -1060 89 -31 248 -38 345 -16 121 29 209 79 305 176 129 129 190 269 190 441 0 113 -16 184 -67 289 -131 271 -441 416 -731 340z m261 -155 c91 -19 160 -58 234 -131 277 -273 124 -740 -265 -806 -310 -53 -595 232 -543 544 34 204 181 356 386 398 61 12 114 11 188 -5z"/><path d="M463 817 c-125 -125 -143 -147 -143 -175 0 -43 38 -82 80 -82 25 0 45 13 96 62 l64 61 0 -157 c0 -153 1 -157 25 -181 15 -16 36 -25 55 -25 19 0 40 9 55 25 24 23 25 28 25 175 0 82 3 150 7 150 3 0 32 -25 64 -55 45 -43 65 -55 89 -55 42 0 80 39 80 82 0 28 -18 50 -143 175 -128 128 -146 143 -177 143 -31 0 -49 -15 -177 -143z"/></g></svg>`;
    let ctrl, r;

    defineCSS();

    window.addEventListener("load", () => {
        arrowButton();
        detectTheme();
        keyListener();
    });

    function arrowButton() {
        const div = document.createElement("div");
        div.classList.add("arrow");
        div.innerHTML = isDark() ? white : red;
        div.addEventListener("click", () => {
            goTop();
            location.reload();
        });
        document.body.appendChild(div);
    }

    function detectTheme() {
        const select = document.querySelector("select#theme-selector");
        select.addEventListener("change", () => {
            const color1 = window.getComputedStyle(document.querySelector("html")).getPropertyValue("background-color");
            for (let i = 0; i < 10; i++) {
                setTimeout(() => {
                    const color2 = window.getComputedStyle(document.querySelector("html")).getPropertyValue("background-color");
                    if (color1 !== color2) {
                        i = 6;
                        const div = document.querySelector("div.arrow");
                        div.innerHTML = isDark() ? white : red;
                    }
                }, 100 * i);
            }
        });
    }

    function isDark() {
        return !!document.querySelector("select#theme-selector").value;
    }

    function keyListener() {
        document.addEventListener("keydown", e => {
            if (e.keyCode === 116) goTop();
            if (e.keyCode === 17) ctrl = true;
            else if (e.keyCode === 82) r = true;
            if (ctrl && r) goTop();
        });
        document.addEventListener("keyup", e => {
            if (e.keyCode === 17) ctrl = false;
            else if (e.keyCode === 82) r = false;
        });
    }

    function goTop() {
        window.scrollTo(0, 0);
    }

    function defineCSS() {
        const style = document.createElement("style");
        style.type = "text/css";
        style.innerHTML =
            `.arrow {
                 position: fixed;
                 right: 50px;
                 bottom: 30px;
                 cursor: pointer;
             }`;
        document.head.appendChild(style);
    }

})();
欢迎访问Greasy Fork镜像
