☰

Highlight VSBattles Stats based on Key

Highlights stat sections separated by '|' with different colours in a cyclical pattern on VSBattles wiki.

当前为 2025-04-02 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         Highlight VSBattles Stats based on Key
  3. // @description  Highlights stat sections separated by '|' with different colours in a cyclical pattern on VSBattles wiki.
  4. // @namespace    https://github.com/kaubu
  5. // @match        *://vsbattles.fandom.com/*
  6. // @version      1.0
  7. // @author       kaubu (https://github.com/kaubu)
  8. // @grant        none
  9. // @license      BSD-0
  10. // ==/UserScript==
  11.  
  12. (function() {
  13.     'use strict';
  14.  
  15.     // Optimised colors for both dark (#19182f) and light (#d4e6f7) backgrounds
  16.     const colors = ["#E74C3C", "#E67E22", "#2ECC71", "#9B59B6", "#D81B60", "#1ABC9C"];
  17.  
  18.     function highlightElements(paragraph) {
  19.         // Ensure the paragraph contains a "|" before proceeding
  20.         if (!paragraph.textContent.includes("|")) return;
  21.  
  22.         let boldElements = Array.from(paragraph.querySelectorAll("b"));
  23.         if (boldElements.length === 0) return;
  24.  
  25.         let colorIndex = 0; // Reset color cycle for each paragraph
  26.         let nodes = Array.from(paragraph.childNodes); // Get all nodes in the paragraph
  27.  
  28.         nodes.forEach(node => {
  29.             if (node.nodeType === Node.TEXT_NODE && node.textContent.includes("|")) {
  30.                 // When encountering a '|', move to the next color
  31.                 colorIndex = (colorIndex + 1) % colors.length;
  32.             } else if (
  33.                 node.nodeType === Node.ELEMENT_NODE &&
  34.                 node.tagName === "B" &&
  35.                 !node.textContent.includes("Key:") && // Ignore "Key:" bold text
  36.                 !node.querySelector("a") // Ignore bold elements that contain links
  37.             ) {
  38.                 // Apply color to valid bold text only
  39.                 node.style.color = colors[colorIndex];
  40.                 node.style.fontWeight = "bold";
  41.             }
  42.         });
  43.     }
  44.  
  45.     function processParagraphs() {
  46.         let paragraphs = document.querySelectorAll(".mw-content-ltr > p");
  47.         paragraphs.forEach(highlightElements);
  48.     }
  49.  
  50.     // Run the script on the target paragraphs
  51.     processParagraphs();
  52. })();