Highlight VSBattles Stats based on Key

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

目前為 2025-04-02 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         Highlight VSBattles Stats based on Key
// @description  Highlights stat sections separated by '|' with different colours in a cyclical pattern on VSBattles wiki.
// @namespace    https://github.com/kaubu
// @match        *://vsbattles.fandom.com/*
// @version      1.0.1
// @author       kaubu (https://github.com/kaubu)
// @grant        none
// @license      0BSD
// ==/UserScript==

(function() {
    'use strict';

    // Optimised colors for both dark (#19182f) and light (#d4e6f7) backgrounds
    const colors = ["#E74C3C", "#E67E22", "#2ECC71", "#9B59B6", "#D81B60", "#1ABC9C"];

    function highlightElements(paragraph) {
        // Ensure the paragraph contains a "|" before proceeding
        if (!paragraph.textContent.includes("|")) return;

        let boldElements = Array.from(paragraph.querySelectorAll("b"));
        if (boldElements.length === 0) return;

        let colorIndex = 0; // Reset color cycle for each paragraph
        let nodes = Array.from(paragraph.childNodes); // Get all nodes in the paragraph

        nodes.forEach(node => {
            if (node.nodeType === Node.TEXT_NODE && node.textContent.includes("|")) {
                // When encountering a '|', move to the next color
                colorIndex = (colorIndex + 1) % colors.length;
            } else if (
                node.nodeType === Node.ELEMENT_NODE &&
                node.tagName === "B" &&
                !node.textContent.includes("Key:") && // Ignore "Key:" bold text
                !node.querySelector("a") // Ignore bold elements that contain links
            ) {
                // Apply color to valid bold text only
                node.style.color = colors[colorIndex];
                node.style.fontWeight = "bold";
            }
        });
    }

    function processParagraphs() {
        let paragraphs = document.querySelectorAll(".mw-content-ltr > p");
        paragraphs.forEach(highlightElements);
    }

    // Run the script on the target paragraphs
    processParagraphs();
})();