TagBangumiUserPro 班固米用户备注

Based on AttachHowOldtoUserinPosts, to tag users in Bangumi. Now with clickable badges to edit notes.

目前为 2025-02-19 提交的版本。查看 最新版本

// ==UserScript==
// @name         TagBangumiUserPro 班固米用户备注
// @version      3.3
// @description  Based on AttachHowOldtoUserinPosts, to tag users in Bangumi. Now with clickable badges to edit notes.
// @author       age_anime
// @match        https://bgm.tv/*
// @match        https://chii.in/*
// @match        https://bangumi.tv/*
// @grant        none
// @license      MIT
// @namespace https://gf.qytechs.cn/users/1426310
// ==/UserScript==

(function () {
    'use strict';
    // 3.3版本说明:将胶囊框改成圆角矩形;CSS样式background-color改为background,以适配渐变色;未备注用户不再显示框,而是显示“…”,点击修改备注,以最大程度上减小对页面浏览的影响。
    // 组件函数功能说明:(数据保存在本地,显示和修改在前端,可直接修改和清除)
    // displayUserNote(userId, note):在指定用户的用户名旁边显示备注标签
    // markUserNotes():显示对应的备注标签
    // openUserNoteManager():用户备注管理界面
    // openColorManager():颜色管理界面
    // addButtonFunctions():添加功能按钮
    const defaultNoteColors = {
        "预设0": "#40E0D0",
        "预设1": "#BB44BB",
        "预设2": "#000000",
        "预设3": "#DD6D22",
        "预设4": "#CC3333",
        "预设5": "#DD6D22",
        "设置6": "#3C3CC4"
    };
    let noteColors = JSON.parse(localStorage.getItem('userNoteColors_')) || defaultNoteColors;

    // 用户备注配置(默认为空白)
    let userNoteTable_AGE = JSON.parse(localStorage.getItem('userNoteTable_AGE')) || {};
    // 旧版本兼容:迁移原先零散的数据,集中在userNoteTable_AGE(AGE是作者的用户名,避免和其他组件冲突,求求审核别和之前的混为一谈)
    Object.keys(localStorage).forEach(key => {
        if (key.startsWith('userNote_')) {
            const userId = key.substring('userNote_'.length); // 兼容3.0之前的版本
            const noteValue = localStorage.getItem(key);
            if (noteValue === "bgmer") { // 兼容2.7以及之前的版本
                localStorage.removeItem(key);
            } else {
                userNoteTable_AGE[userId] = noteValue;
                localStorage.removeItem(key);
            }
        }
    });
    localStorage.setItem('userNoteTable_AGE', JSON.stringify(userNoteTable_AGE));

    const defaultNote = "…"; 
    const defaultColor = "rgba(255, 255, 255, 0)";
    const defaultNoteColor = "rgba(102, 170, 85, 0.2)";

    function displayUserNote(userId, note) {
        const userAnchor = $("strong a.l[href='/user/" + userId + "']");
        if (userAnchor.length > 0 && userAnchor.next(".note-badge").length === 0) {
            const badgeColor = (note === defaultNote) ? defaultColor : (noteColors[note] || defaultNoteColor);
            const noteColorSet = badgeColor === defaultColor ? "#9F9F9F" : "#FFF";
            const badge = $(`
            <span class="note-badge" style="
                background: ${badgeColor};
                font-size: 10px;
                padding: 1px 4px;
                color: ${noteColorSet};
                border-radius: 6px;
                line-height: 150%;
                display: inline-block;
                cursor: pointer;
            " title="点击编辑备注">${note}</span>`);

            badge.click(function () {
                const newNote = prompt("请输入新的备注:", note);
                if (newNote !== null) {
                    const trimmedNote = newNote.trim();
                    if (trimmedNote === "" || trimmedNote === defaultNote) {
                        delete userNoteTable_AGE[userId];
                        localStorage.setItem('userNoteTable_AGE', JSON.stringify(userNoteTable_AGE));
                        badge.remove();
                    } else if (trimmedNote !== note) {
                        userNoteTable_AGE[userId] = trimmedNote;
                        localStorage.setItem('userNoteTable_AGE', JSON.stringify(userNoteTable_AGE));
                        badge.text(trimmedNote);
                        const newBadgeColor = noteColors[trimmedNote] || defaultColor;
                        badge.css("background-color", newBadgeColor);
                    }
                }
            });
            userAnchor.after(badge);
        }
    }

    function markUserNotes() {
        $(".note-badge").remove();
        $("strong a.l:not(.avatar)").each(function () {
            const userLink = $(this).attr("href");
            const userId = userLink.split("/").pop();
            const note = userNoteTable_AGE[userId] || defaultNote;
            displayUserNote(userId, note);
        });
    }
    // 按钮颜色管理区
    function openColorManager() {
        const modal = document.createElement('div');
        Object.assign(modal.style, {
            position: 'fixed',
            left: '50%',
            top: '50%',
            transform: 'translate(-50%, -50%)',
            backgroundColor: 'white',
            padding: '20px',
            borderRadius: '5px',
            boxShadow: '0 0 10px rgba(0,0,0,0.5)',
            zIndex: '9999',
            width: '300px'
        });

        // 添加颜色
        const form = document.createElement('div');
        form.style.marginBottom = '5px';

        const nameLabel = document.createElement('label');
        nameLabel.textContent = '名称:';
        nameLabel.style.color = '#333333';
        nameLabel.style.marginRight = '5px';

        const nameInput = document.createElement('input');
        nameInput.type = 'text';
        nameInput.style.minWidth = '240px';
        nameInput.style.width = 'auto';
        nameInput.style.height = '22px';
        nameInput.style.marginRight = '5px';
        nameInput.style.position = 'relative';
        nameInput.style.top = '-5px';

        const colorLabel = document.createElement('label');
        colorLabel.textContent = '颜色:';
        colorLabel.style.color = '#333333';
        colorLabel.style.marginRight = '5px';

        const colorInput = document.createElement('input');
        colorInput.type = 'color';
        colorInput.style.marginRight = '5px';

        const addButton = document.createElement('button');
        addButton.textContent = '添加';
        addButton.onclick = () => {
            const name = nameInput.value.trim();
            const color = colorInput.value;
            if (name && color) {
                noteColors[name] = color;
                textarea.value = JSON.stringify(noteColors, null, 4);
                nameInput.value = '';
                colorInput.value = '#000000';
            } else {
                alert('名称和颜色不能为空!');
            }
        };

        form.append(nameLabel, nameInput, colorLabel, colorInput, addButton);

        const textarea = document.createElement('textarea');
        textarea.style.cssText = 'width: 100%; height: 200px; margin-bottom: 10px;';
        textarea.value = JSON.stringify(noteColors, null, 4);

        const buttonContainer = document.createElement('div');
        buttonContainer.style.cssText = 'text-align: right;';

        const cancelBtn = document.createElement('button');
        cancelBtn.textContent = '取消';
        cancelBtn.onclick = () => modal.remove();

        const saveBtn = document.createElement('button');
        saveBtn.textContent = '保存';
        saveBtn.style.marginLeft = '8px';
        saveBtn.onclick = () => {
            try {
                const newColors = JSON.parse(textarea.value);
                if (typeof newColors !== 'object' || newColors === null) {
                    throw new Error('请输入有效的JSON对象');
                }
                localStorage.setItem('userNoteColors_', JSON.stringify(newColors));
                noteColors = newColors;
                document.querySelectorAll('.note-badge').forEach(badge => {
                    const note = badge.textContent;
                    badge.style.backgroundColor = noteColors[note] || defaultColor;
                });
                modal.remove();
            } catch (error) {
                alert('错误: 请检查JSON格式(其他行的末尾是有英文逗号的,最后一行的末尾是没有逗号的!),还不会就把错误代码和JSON内容放在AI里面问问: ' + error.message);
            }
        };

        buttonContainer.append(cancelBtn, saveBtn);
        modal.append(form, textarea, buttonContainer);
        document.body.appendChild(modal);
    }
    // 用户备注管理区
    function openUserNoteManager() {
        const modal = document.createElement('div');
        Object.assign(modal.style, {
            position: 'fixed',
            left: '50%',
            top: '50%',
            transform: 'translate(-50%, -50%)',
            backgroundColor: 'white',
            padding: '20px',
            borderRadius: '5px',
            boxShadow: '0 0 10px rgba(0,0,0,0.5)',
            zIndex: '9999',
            width: '300px'
        });

        // 添加上方输入框
        const form = document.createElement('div');
        form.style.marginBottom = '10px';

        const idInput = document.createElement('input');
        idInput.placeholder = '用户ID';
        idInput.style.marginRight = '5px';

        const noteInput = document.createElement('input');
        noteInput.placeholder = '备注';
        noteInput.style.marginRight = '5px';

        const addButton = document.createElement('button');
        addButton.textContent = '添加';
        addButton.onclick = () => {
            const userId = idInput.value.trim();
            const note = noteInput.value.trim();
            if (userId && note) {
                userNoteTable_AGE[userId] = note;
                textarea.value = JSON.stringify(userNoteTable_AGE, null, 4);
                idInput.value = '';
                noteInput.value = '';
            }
        };

        form.append(idInput, noteInput, addButton);

        // JSON编辑区
        const textarea = document.createElement('textarea');
        textarea.style.cssText = 'width: 100%; height: 200px; margin: 10px 0;';
        textarea.value = JSON.stringify(userNoteTable_AGE, null, 4);

        const buttonContainer = document.createElement('div');
        buttonContainer.style.cssText = 'text-align: right;';

        const importBtn = document.createElement('button');
        importBtn.textContent = '导入';
        importBtn.onclick = () => {
            const input = document.createElement("input");
            input.type = "file";
            input.accept = "application/json";
            input.onchange = function (event) {
                const file = event.target.files[0];
                if (file) {
                    const reader = new FileReader();
                    reader.onload = function (e) {
                        try {
                            const imported = JSON.parse(e.target.result);
                            userNoteTable_AGE = imported; // 直接替换当前内容
                            textarea.value = JSON.stringify(userNoteTable_AGE, null, 4);
                            localStorage.setItem('userNoteTable_AGE', JSON.stringify(userNoteTable_AGE));
                            markUserNotes(); // 刷新页面显示
                            alert("导入成功!");
                        } catch (error) {
                            alert("错误: 请检查JSON格式(其他行的末尾是有英文逗号的,最后一行的末尾是没有逗号的!),还不会就把错误代码和JSON内容放在AI里面问问:" + error);
                        }
                    };
                    reader.readAsText(file);
                }
            };
            input.click();
        };

        const exportBtn = document.createElement('button');
        exportBtn.textContent = '导出';
        exportBtn.style.marginLeft = '5px';
        exportBtn.onclick = () => {
            const blob = new Blob([textarea.value], { type: 'application/json' });
            const url = URL.createObjectURL(blob);
            const a = document.createElement('a');
            a.href = url;
            a.download = `user_notes_${Date.now()}.json`;
            a.click();
            URL.revokeObjectURL(url);
        };

        const cancelBtn = document.createElement('button');
        cancelBtn.textContent = '取消';
        cancelBtn.style.marginLeft = '5px';
        cancelBtn.onclick = () => modal.remove();

        const saveBtn = document.createElement('button');
        saveBtn.textContent = '保存';
        saveBtn.style.marginLeft = '5px';
        saveBtn.onclick = () => {
            try {
                const newNotes = JSON.parse(textarea.value);
                localStorage.setItem('userNoteTable_AGE', JSON.stringify(newNotes));
                userNoteTable_AGE = newNotes;
                markUserNotes();
                modal.remove();
            } catch (error) {
                alert('JSON格式错误:' + error.message);
            }
        };

        buttonContainer.append(importBtn, exportBtn, cancelBtn, saveBtn);
        modal.append(form, textarea, buttonContainer);
        document.body.appendChild(modal);
    }

    function addButtonFunctions() {
        const badgeUserPanel = document.querySelector("ul#badgeUserPanel");
        if (badgeUserPanel) {
            // 用户备注管理按钮
            const userNoteLi = document.createElement('li');
            const userNoteBtn = document.createElement('a');
            userNoteBtn.href = '#';
            userNoteBtn.textContent = '管理用户备注';
            userNoteBtn.onclick = (e) => { e.preventDefault(); openUserNoteManager(); };
            userNoteLi.appendChild(userNoteBtn);

            // 颜色管理按钮
            const colorLi = document.createElement('li');
            const colorBtn = document.createElement('a');
            colorBtn.href = '#';
            colorBtn.textContent = '管理颜色配置';
            colorBtn.onclick = (e) => { e.preventDefault(); openColorManager(); };
            colorLi.appendChild(colorBtn);

            badgeUserPanel.append(userNoteLi, colorLi);
        }
    }

    if (document.body) {
        markUserNotes();
    } else {
        window.onload = markUserNotes;
    }

    setTimeout(addButtonFunctions, 1000);
})();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址