美卡论坛显示楼主标识 (OP Badge)

在美卡论坛帖子中为楼主添加OP标识，方便识别原帖作者
当前为 2025-08-16 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         美卡论坛显示楼主标识 (OP Badge)
// @version      1.1.0
// @description  在美卡论坛帖子中为楼主添加OP标识，方便识别原帖作者
// @author       Pizza
// @namespace    https://gf.qytechs.cn/users/uscardforum-tools
// @license      MIT
// @match        https://www.uscardforum.com/t/*
// @match        https://uscardforum.com/t/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=uscardforum.com
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Add styles
    const style = document.createElement('style');
    style.textContent = `.op-badge {
        background: #39c5bb;
        color: white;
        padding: 2px 4px;
        border-radius: 5px;
        font-size: 11px;
        font-weight: bold;
        margin-left: 2px;
        cursor: pointer;
        transition: background 0.2s;
    }
    .op-badge:hover {
        background: #2ca89f;
    }`;
    document.head.appendChild(style);

    let opUsername = null;

    function getTopicId() {
        return window.location.pathname.split('/')[3] || window.location.pathname.split('/')[2];
    }

    function addOPBadges() {
        if (!opUsername) return;

        document.querySelectorAll('.topic-post').forEach(post => {
            if (post.querySelector('.op-badge')) return;

            // Look for the user link with data-user-card (most reliable)
            const userLink = post.querySelector('.names a[data-user-card]');
            if (!userLink) return;

            const username = userLink.getAttribute('data-user-card');

            if (username === opUsername) {
                const badge = document.createElement('span');
                badge.className = 'op-badge';
                badge.textContent = 'OP';
                badge.title = '点击只看楼主';

                // Make badge clickable to filter posts
                badge.onclick = function() {
                    // Get the current URL and add filter parameter
                    const url = new URL(window.location);
                    if (url.searchParams.get('username_filters') === opUsername) {
                        // Already filtered, remove filter
                        url.searchParams.delete('username_filters');
                        badge.title = '点击只看楼主';
                    } else {
                        // Add filter
                        url.searchParams.set('username_filters', opUsername);
                        badge.title = '点击显示全部';
                    }
                    window.location.href = url.toString();
                };

                // Find the span that contains the username link
                const usernameSpan = userLink.closest('span.username, span.full-name, span.first');
                if (usernameSpan) {
                    // Insert right after the username span, before trust-level
                    usernameSpan.insertAdjacentElement('afterend', badge);
                } else {
                    // Fallback: insert after the link itself
                    userLink.insertAdjacentElement('afterend', badge);
                }
            }
        });
    }

    function loadOP() {
        const topicId = getTopicId();

        // Always fetch via API
        fetch(`${window.location.origin}/t/${topicId}.json`)
            .then(response => response.json())
            .then(data => {
                if (data?.post_stream?.posts?.[0]) {
                    opUsername = data.post_stream.posts[0].username;
                } else if (data?.details?.created_by) {
                    opUsername = data.details.created_by.username;
                }

                if (opUsername) {
                    addOPBadges();
                    setTimeout(addOPBadges, 500);
                }
            })
            .catch(() => {});
    }

    // Initialize
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', loadOP);
    } else {
        loadOP();
    }

    // Watch for URL changes
    let lastUrl = location.href;
    new MutationObserver(() => {
        if (location.href !== lastUrl) {
            lastUrl = location.href;
            opUsername = null; // Clear old OP
            loadOP();
        }
    }).observe(document, {subtree: true, childList: true});

    // Watch for new posts
    new MutationObserver(() => {
        if (opUsername) {
            clearTimeout(window.opTimeout);
            window.opTimeout = setTimeout(addOPBadges, 100);
        }
    }).observe(document.body, {childList: true, subtree: true});
})();
欢迎访问Greasy Fork镜像
