豆包回答隐藏-半成品

// ==UserScript==
// @name         豆包-元素隐藏/恢复按钮
// @namespace    https://tinyant.me
// @version      1.1
// @description 隐藏和恢复：豆包的回答（class为auto-hide-last-sibling-br的元素）
// @author       脚本作者
// @match        *://www.doubao.com/*
// @grant        none
// @license      MIT
// ==/UserScript==
(function() {
    'use strict';
    // 目标元素类名
    const TARGET_CLASS = 'auto-hide-last-sibling-br';
    // 按钮状态
    let isHidden = false;

    // 创建控制按钮（含左侧拖动图标）
    function createControlButton() {
        const button = document.createElement('button');
        button.id = 'draggable-toggle-btn';
        button.style.cssText = `
            position: fixed;
            top: 320px;
            right: 20px;
            width: 130px; /* 固定按钮宽度，解决拖动变大小问题 */
            height: 42px; /* 固定按钮高度，解决拖动变大小问题 */
            padding: 0; /* 取消整体内边距，改为内部元素单独控制 */
            background-color: #4CAF50;
            color: white;
            border: none;
            border-radius: 8px;
            font-size: 14px;
            font-weight: bold;
            box-shadow: 0 2px 10px rgba(0,0,0,0.2);
            z-index: 999999;
            transition: background-color 0.3s;
            display: flex; /* 弹性布局，让图标和文本横向排列 */
            align-items: center; /* 垂直居中 */
            cursor: default; /* 默认光标，避免整体触发拖动光标 */
        `;

        // 1. 创建左侧可拖动图标（核心修改：单独分离拖动区域）
        const dragIcon = document.createElement('span');
        dragIcon.id = 'btn-drag-icon';
        dragIcon.style.cssText = `
            width: 36px; /* 图标宽度 */
            height: 100%; /* 图标高度占满按钮 */
            background-color: rgba(0,0,0,0.15); /* 图标区域背景色（区分功能区） */
            border-radius: 8px 0 0 8px; /* 左半圆角，与按钮匹配 */
            margin-right: 8px; /* 与文本区间距 */
            cursor: move; /* 拖动光标提示 */
            display: flex;
            align-items: center;
            justify-content: center;
        `;
        // 图标内容（用简单符号模拟，也可替换为SVG图标）
        dragIcon.textContent = '☰';

        // 2. 创建右侧功能文本区
        const btnText = document.createElement('span');
        btnText.id = 'btn-function-text';
        btnText.textContent = '隐藏元素';
        btnText.style.cssText = `
            padding: 10px 0; /* 垂直内边距，保证点击区域 */
            cursor: pointer; /* 点击光标提示 */
        `;

        // 组装按钮：图标 + 文本
        button.appendChild(dragIcon);
        button.appendChild(btnText);
        document.body.appendChild(button);

        // 3. 仅给拖动图标绑定拖动功能（核心修改：拖动事件不绑定整个按钮）
        makeDraggable(dragIcon, button);
        // 4. 给按钮绑定点击功能（仅触发文本区点击，图标区不触发）
        button.addEventListener('click', toggleElements);

        return button;
    }

    // 使元素可拖动（修改：接收「拖动触发源」和「要移动的目标（按钮）」）
    function makeDraggable(dragTrigger, targetBtn) {
        let pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;

        // 仅在拖动图标上按下时触发（避免按钮其他区域触发拖动）
        dragTrigger.onmousedown = dragMouseDown;

        function dragMouseDown(e) {
            e = e || window.event;
            e.preventDefault();
            e.stopPropagation(); // 阻止事件冒泡到按钮，避免触发点击功能

            // 获取鼠标初始位置
            pos3 = e.clientX;
            pos4 = e.clientY;

            // 鼠标释放时停止拖动
            document.onmouseup = closeDragElement;
            // 鼠标移动时拖动按钮（目标是整个按钮，不是图标）
            document.onmousemove = elementDrag;
        }

        function elementDrag(e) {
            e = e || window.event;
            e.preventDefault();

            // 计算新位置（基于按钮当前位置）
            pos1 = pos3 - e.clientX;
            pos2 = pos4 - e.clientY;
            pos3 = e.clientX;
            pos4 = e.clientY;

            // 设置按钮新位置（固定宽高，不会变大小）
            targetBtn.style.top = (targetBtn.offsetTop - pos2) + "px";
            targetBtn.style.left = (targetBtn.offsetLeft - pos1) + "px";
        }

        function closeDragElement() {
            // 停止拖动事件监听
            document.onmouseup = null;
            document.onmousemove = null;
        }
    }

    // 切换元素显示/隐藏状态（微调：更新文本区内容，而非整个按钮）
    function toggleElements() {
        const button = document.getElementById('draggable-toggle-btn');
        const btnText = document.getElementById('btn-function-text');
        const targetElements = document.getElementsByClassName(TARGET_CLASS);

        if (targetElements.length === 0) {
            alert(`未找到class为"${TARGET_CLASS}"的元素`);
            return;
        }

        // 切换状态
        isHidden = !isHidden;

        // 更新目标元素显示状态
        Array.from(targetElements).forEach(el => {
            el.style.display = isHidden ? 'none' : '';
        });

        // 更新按钮样式和文本（仅修改文本区和按钮背景）
        if (isHidden) {
            btnText.textContent = '恢复元素';
            button.style.backgroundColor = '#f44336';
        } else {
            btnText.textContent = '隐藏元素';
            button.style.backgroundColor = '#4CAF50';
        }
    }

    // 初始化脚本（逻辑不变）
    function init() {
        if (!document.getElementById('draggable-toggle-btn')) {
            createControlButton();
        }
    }

    // 页面加载完成后初始化（逻辑不变）
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }
})();