Blur on inactivity Extended

https://gf.qytechs.cn/en/scripts/466065-blur-on-inactivity with additional features
目前为 2023-10-14 提交的版本。查看最新版本。
Wrap lines
// ==UserScript==
// @name        Blur on inactivity Extended
// @description https://gf.qytechs.cn/en/scripts/466065-blur-on-inactivity with additional features
// @author      Sadulisten @ Greasyfork
// @author      Schimon Jehudah, Adv.
// @namespace   Sadulisten
// @copyright   2023, Schimon Jehudah (http://schimon.i2p)
// @license     MIT; https://opensource.org/licenses/MIT
// @exclude     devtools://*
// @match       *://*/*
// @version     24.0
// @run-at      document-end
// @grant       GM_addStyle
// @icon        data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48dGV4dCB5PSIuOWVtIiBmb250LXNpemU9IjkwIj7wn5al77iPPC90ZXh0Pjwvc3ZnPgo=
// ==/UserScript==

const originalFilter = document.body.style.filter;
const blurIntensity = 75;
const inactivityThresholdSeconds = 30;
const inactivityThresholMiliseconds = inactivityThresholdSeconds * 1000;

function clamp(num, min, max) {
  return num <= min
    ? min
    : num >= max
      ? max
      : num
}
function addUnblurButton() {
    const btn = document.createElement("button");
    btn.id = blurButtonId;
    btn.innerHTML = "<span>👀</span>";
    btn.onclick = function() {
        clickThroughElement.style.pointerEvents = "auto";
        document.body.style.filter = originalFilter;
        blurButton.style.display = "none";
        blurCss.remove();
        blurCss = null;
    }

    clickThroughElement = wrapAll(document.querySelector("body"), "width:100%;height:100%;background-color:red;pointer-events:none;");

    GM_addStyle(
       `#${blurButtonId}
        {
            z-index:9999;
            position:fixed;

            /*
            bottom:10px;
            right:10px;
            */
            top:50%;
            left:47%;

            display: none;
            box-shadow:inset 0px 1px 0px 0px #cf866c;
	        background:linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);
	        background-color:#d0451b;
            color:#ffffff;
	        border-radius:3px;
	        border:1px solid #942911;
	        cursor:pointer;
	        font-family:Arial;
	        font-size:13px;
	        padding:6px 24px;
	        text-decoration:none;
	        text-shadow:0px 1px 0px #854629;
        }
        #${blurButtonId}:hover
        {
            background:linear-gradient(to bottom, #bc3315 5%, #d0451b 100%);
	        background-color:#bc3315;
        }
        #${blurButtonId}:hover:after
        {
            content: " Unblur Page";
        }
      `
    );
    document.body.appendChild(btn);
    return btn;
}

let wrapperNextId = -1;
function wrapAll(elementToWrap , optionalWrapperElementCssText = "") {
    if (!elementToWrap) return null;
    const wrapperId = `wrapperElement_${++wrapperNextId}`;
    let org_html = elementToWrap.innerHTML;
    let new_html = `<div id='${wrapperId}'>` + org_html + "</div>";
    elementToWrap.innerHTML = new_html;
    let wrapperElement = document.getElementById(wrapperId);
    if (optionalWrapperElementCssText) {
        wrapperElement.style.cssText = optionalWrapperElementCssText;
    }
    return wrapperElement;
}

var clickThroughElement = null;
const blurButtonId = "unblurButton";
const blurButton = addUnblurButton();
var blurCss = null;

onInactive(inactivityThresholMiliseconds, function () {
    if (blurCss == null) {
        blurCss = GM_addStyle(
            `body > *:not(#${blurButtonId}) { filter: blur(${clamp(blurIntensity, 1, 100)}px) !important; }`
        );
    }
    clickThroughElement.style.pointerEvents = "none";
    blurButton.style.display = "block";
});

function onInactive(ms, cb) {
  var wait = setInterval(cb, ms);
  window.ontouchstart = 
  window.ontouchmove = 
  window.onmousemove = 
  window.onmousedown = 
  window.onmouseup = 
  window.onwheel = 
  window.onscroll = 
  window.onkeydown = 
  window.onkeyup = 
  window.onfocus = 
  function () {
    clearInterval(wait);
    wait = setInterval(cb, ms);
  };
}
欢迎访问Greasy Fork镜像
