☰

background-color

Change the white elements to green for protecting your eyes!

目前为 2018-10-13 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         background-color
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.7.0
  5. // @description  Change the white elements to green for protecting your eyes!
  6. // @author       developerdong
  7. // @match        http*://*/*
  8. // @grant        none
  9. // ==/UserScript==
  10. (function () {
  11.     'use strict';
  12.  
  13.     function toHex(N) {
  14.         if (N == null) return "00";
  15.         N = parseInt(N);
  16.         if (N === 0 || isNaN(N)) return "00";
  17.         N = Math.max(0, N);
  18.         N = Math.min(N, 255);
  19.         N = Math.round(N);
  20.         // return "0123456789abcdef".charAt((N - N % 16) / 16) + "0123456789abcdef".charAt(N % 16); // Lower case
  21.         return "0123456789ABCDEF".charAt((N - N % 16) / 16) + "0123456789ABCDEF".charAt(N % 16); // Upper case
  22.     }
  23.  
  24.     /**
  25.      * Transform RGB color to HEX color
  26.      * @return {string}
  27.      */
  28.     function RGBtoHEX(str) {
  29.         if (str.substring(0, 3) === 'rgb') {
  30.             const arr = str.split(",");
  31.             const r = arr[0].replace('rgb(', '').trim(),
  32.                   g = arr[1].trim(),
  33.                   b = arr[2].replace(')', '').trim();
  34.             const hex = [toHex(r), toHex(g), toHex(b)];
  35.             return "#" + hex.join('');
  36.         } else {
  37.             return str;
  38.         }
  39.     }
  40.  
  41.     /**
  42.      * Change the background color of all sub elements by level order
  43.      */
  44.     function changeBackgroundColor(node) {
  45.         const queue = [];
  46.         while (node) {
  47.             // nodeType == 1 means the node is an element
  48.             if (node.nodeType === 1) {
  49.                 const nodeStyle = window.getComputedStyle(node);
  50.                 if (RGBtoHEX(nodeStyle.backgroundColor) === "#FFFFFF" && nodeStyle.cursor === "auto") {
  51.                     node.style.setProperty("background-color", "#C1E6C6", "important");
  52.                 }
  53.                 Array.from(node.children).forEach(function (child) {
  54.                     queue.push(child);
  55.                 });
  56.             }
  57.             node = queue.shift();
  58.         }
  59.     }
  60.  
  61.     // Change the background color of newly added elements
  62.     const observer = new MutationObserver(function (records){
  63.         records.map(function(record){
  64.             if (record.type === "childList") {
  65.                 record.addedNodes.forEach(changeBackgroundColor);
  66.             }
  67.         });
  68.     });
  69.     const option = {
  70.         'childList': true,
  71.         'subtree': true
  72.     };
  73.     observer.observe(document.body, option);
  74.     
  75.     // Change the background color of initially loaded elements
  76.     changeBackgroundColor(document.body);
  77.  
  78. })();