BetterTriangulet with Solid Overlay

Adds a BetterTriangulet panel and solid green plugin modal overlay
当前为 2025-07-05 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         BetterTriangulet with Solid Overlay
// @version      1.11
// @description  Adds a BetterTriangulet panel and solid green plugin modal overlay
// @match        https://tri.pengpowers.xyz/*
// @grant        none
// @namespace https://gf.qytechs.cn/users/1479014
// ==/UserScript==

(function () {
    'use strict';

    function createOverlayBox() {
        const profileBody = document.querySelector('.arts__profileBody___eNPbH-camelCase');
        if (!profileBody) return;

        const existingOverlay = document.getElementById('profileBodyOverlayBox');
        if (existingOverlay) existingOverlay.remove();

        const rect = profileBody.getBoundingClientRect();

        const overlay = document.createElement('div');
        overlay.id = 'profileBodyOverlayBox';

        overlay.style.position = 'absolute';
        overlay.style.top = `${rect.top + window.scrollY}px`;
        overlay.style.left = `${rect.left + window.scrollX}px`;
        overlay.style.width = `${rect.width}px`;
        overlay.style.height = `${rect.height}px`;
        overlay.style.zIndex = '9998';

        // Solid green background
        overlay.style.backgroundColor = '#265b09';

        document.body.appendChild(overlay);
    }

    function removeOverlayBox() {
        const existingOverlay = document.getElementById('profileBodyOverlayBox');
        if (existingOverlay) existingOverlay.remove();
    }

    function createModal() {
        const profileBody = document.querySelector(".arts__profileBody___eNPbH-camelCase");
        if (!profileBody) return;

        const existingModal = document.getElementById("betterTrianguletModalOverlay");
        if (existingModal) existingModal.remove();

        createOverlayBox();

        const modalOverlay = document.createElement("div");
        modalOverlay.id = "betterTrianguletModalOverlay";

        Object.assign(modalOverlay.style, {
            position: "absolute",
            top: profileBody.offsetTop + "px",
            left: profileBody.offsetLeft + "px",
            width: profileBody.offsetWidth + "px",
            height: profileBody.offsetHeight + "px",
            zIndex: "9999",
            backgroundColor: "var(--container)",
            color: "inherit",
            borderRadius: "0.5vw",
            overflowY: "auto",
            padding: "1.5vw",
            fontFamily: "Nunito, sans-serif",
            display: "flex",
            flexDirection: "column",
            boxSizing: "border-box",
        });

        const title = document.createElement("div");
        title.textContent = "Plugin Manager";
        Object.assign(title.style, {
            fontSize: "2vw",
            fontWeight: "800",
            marginBottom: "1vw",
            color: "var(--accent)",
            userSelect: "none",
        });

        const content = document.createElement("div");
        content.textContent = "This is where plugin options will go!";
        Object.assign(content.style, {
            fontSize: "1.2vw",
            flexGrow: "1",
            marginBottom: "2vw",
            whiteSpace: "pre-wrap",
        });

        const closeBtn = document.createElement("button");
        closeBtn.textContent = "Close";
        Object.assign(closeBtn.style, {
            padding: "0.8vw 1.5vw",
            fontSize: "1.1vw",
            border: "none",
            borderRadius: "0.5vw",
            backgroundColor: "var(--accent)",
            color: "var(--container)",
            cursor: "pointer",
            alignSelf: "flex-end",
            userSelect: "none",
        });
        closeBtn.onclick = () => {
            modalOverlay.remove();
            removeOverlayBox();
        };

        modalOverlay.appendChild(closeBtn);
        modalOverlay.appendChild(title);
        modalOverlay.appendChild(content);

        profileBody.parentElement.appendChild(modalOverlay);
    }

    function injectPanel() {
        const mainContainer = document.querySelector(".styles__mainContainer___4TLvi-camelCase");
        if (!mainContainer || document.getElementById("betterTrianguletBox")) return;

        const container = document.createElement("div");
        container.className = "styles__infoContainer___2uI-S-camelCase";
        container.id = "betterTrianguletBox";

        const headerRow = document.createElement("div");
        headerRow.className = "styles__headerRow___1tdPa-camelCase";

        const icon = document.createElement("i");
        icon.className = "fas fa-code styles__headerIcon___1ykdN-camelCase";
        icon.setAttribute("aria-hidden", "true");

        const headerText = document.createElement("div");
        headerText.className = "styles__infoHeader___1lsZY-camelCase";
        headerText.textContent = "BetterTriangulet";

        headerRow.appendChild(icon);
        headerRow.appendChild(headerText);

        const pluginDiv = document.createElement("div");
        const pluginText = document.createElement("text");
        pluginText.className = "styles__link___5UR6_-camelCase";
        pluginText.id = "managePlugins";
        pluginText.textContent = "Manage Plugins";
        pluginText.style.cursor = "pointer";
        pluginText.style.textDecoration = "underline";

        pluginText.onclick = () => {
            if (!document.getElementById("betterTrianguletModalOverlay")) {
                createModal();
            }
        };

        pluginDiv.appendChild(pluginText);
        container.appendChild(headerRow);
        container.appendChild(pluginDiv);
        mainContainer.appendChild(container);
    }

    function waitForSettings() {
        const settingsHeader = [...document.querySelectorAll("div")].find(el =>
            el.textContent.trim() === "Settings" &&
            el.className.includes("styles__header___")
        );
        if (settingsHeader) {
            injectPanel();
        } else {
            setTimeout(waitForSettings, 250);
        }
    }

    waitForSettings();
})();
欢迎访问Greasy Fork镜像
