Ultimate Toggle

Toggle 'n flash certain fields.

Per 08-11-2019. Zie de nieuwste versie.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         Ultimate Toggle
// @namespace    http://localhost/
// @version      0.1.2
// @description  Toggle 'n flash certain fields.
// @author       Mizhi Yikai
// @match        file:///*/*
// @grant        none
// ==/UserScript==

(function() {
    //Inject style for TextMarker marked texts
    var sheet = document.createElement('style')
    sheet.innerHTML = ".covered { filter: invert(50%) !important; }";
    document.body.appendChild(sheet);
    'use strict';
    var toggle = function() {
        var on = true;
        return function() {
            if (!on) {
                on = true;
                //reveal("rgb(165, 0, 33)");
                //revealElementByColor("red");
                revealAnswers(50);
                revealTextMarkerTexts(0);
                return;
            }
            reveal("transparent");
            revealElementByColor("transparent");
            revealAnswers(0);
            revealTextMarkerTexts(1);
            on = false;
        }
    }();

    toggle(); //Set OFF as default

    var keyTimes = {};

    document.addEventListener('keydown', function(e) {
        removeFilter();
        var key = e.keyCode || e.which;
        if (!keyTimes["key" + e.which]) {
            keyTimes["key" + e.which] = new Date().getTime();
        }
        var state = "flash";
        if (key === 45) {
            toggle();
        } // else if (key === 46){
        //   reveal("transparent");
        //   revealElementByColor("transparent");
        //   revealAnswers(1);
        //   setTimeout(function() {//reveal("rgb(165, 0, 33)");//revealElementByColor("red");revealAnswers(1);}, 1000);
        else if (key === 46) {
            reveal("transparent");
            revealElementByColor("transparent");
            revealAnswers(0);
            revealTextMarkerTexts(1);
        } // else if (key === 106) {console.log(state);
        //   if (state === "flash") {
        //       state = "hold";
        //   } else if (state === "hold") {
        //       state = "flash";
        //   }
        //}
    }, false);

    document.addEventListener('keyup', function(e) {
        var key = e.keyCode || e.which;
        if (keyTimes["key" + e.which] && key === 46) {
            var x = new Date().getTime() - keyTimes["key" + e.which];
            delete keyTimes["key" + e.which];
            var time = 200;
            if (x < time) {
                setTimeout(function() {
                    //reveal("rgb(165, 0, 33)");
                    //revealElementByColor("red");
                    revealAnswers(50);
                    revealTextMarkerTexts(0);
                }, (time - x));
            } else {
                //reveal("rgb(165, 0, 33)");
                //revealElementByColor("red");
                revealAnswers(50);
                revealTextMarkerTexts(0);
            }
        }
    }, false);

    function reveal(c) {
        var underline = document.querySelectorAll("u");
        for (var i = 0; i < underline.length; i++) {
            underline[i].style = "background-color: " + c + " !important";
        }
    }

    function revealElementByColor(c) {

        // Get all elements that have a style attribute
        var elms = document.querySelectorAll("*[style]");

        // Loop through them
        Array.prototype.forEach.call(elms, function(elm) {
            // Get the color value
            var clr = elm.style.color || "";

            // Remove all whitespace, make it all lower case
            clr = clr.replace(/\s/g, "").toLowerCase();

            // Switch on the possible values we know of
            switch (clr) {
                case "red":
                    elm.style = "color: red; background-color: " + c + " !important";
                    break;
            }
        });
    }

    function revealAnswers(i32) {
        for (const a of document.querySelectorAll("p")) {
            if (a.textContent.includes("答案") || a.textContent.includes("解析")) {
                a.style = "background-color: white;filter:invert(" + i32 + "%) !important";
            }
        }
    }

    function revealTextMarkerTexts(bool) {
        for (const b of document.querySelectorAll(".textmarker-highlight")) {
            if (bool == 0) {
                //b.style.setProperty('filter','brightness('+ bool +')',"");
                b.classList.add("covered");
            } else {
                b.classList.remove("covered");
            }
        }
    }


    function removeFilter() {
        for (const c of document.querySelectorAll(".textmarker-highlight")) {
            c.addEventListener("click", remove);
            function remove() {
                c.classList.remove("covered");
                c.classList.remove("textmarker-highlight");
            }
        }
    }
})();