MediaWiki:Gadget-CopyTextTool.js

// 文本复制工具
(function() {
    'use strict';
    
    // ===== 自定义配置区域 =====
    const BUTTON_CONFIG = {
        '蓝色': '{{文本|蓝|',
        '绿色': '{{文本|绿|',
        '蓝色下划线': '{{文本|蓝|下划线|',
        '绿色描边': '{{描边|绿|',
        '词典': '{{词典|'
    };
    // ========================
    
    let toolElement = null;
    let isPinned = true;
    let isDragging = false;
    let currentX;
    let currentY;
    let initialX;
    let initialY;
    let xOffset = 0;
    let yOffset = 0;
    
    // 创建工具面板
    function createToolPanel() {
        const tool = document.createElement('div');
        tool.id = 'copy-text-tool';
        tool.innerHTML = `
            <div class="tool-header" id="tool-header">
                <span class="tool-title">📋 文本复制工具</span>
                <div class="tool-controls">
                    <button class="tool-btn" id="minimize-btn" title="最小化">−</button>
                    <button class="tool-btn" id="close-btn" title="关闭">×</button>
                </div>
            </div>
            <div class="tool-body">
                <div class="pin-control">
                    <input type="checkbox" id="pin-checkbox" ${isPinned ? 'checked' : ''}>
                    <label for="pin-checkbox">窗口置顶</label>
                </div>
                <div id="button-container"></div>
                <div class="tool-status" id="tool-status">准备就绪</div>
            </div>
        `;
        
        // 添加按钮
        const buttonContainer = tool.querySelector('#button-container');
        for (const [name, text] of Object.entries(BUTTON_CONFIG)) {
            const button = document.createElement('button');
            button.className = 'copy-button';
            button.textContent = name;
            button.onclick = () => copyText(text, name);
            buttonContainer.appendChild(button);
        }
        
        document.body.appendChild(tool);
        return tool;
    }
    
    // 复制文本到剪贴板
    function copyText(text, buttonName) {
        // 使用现代剪贴板API
        if (navigator.clipboard && navigator.clipboard.writeText) {
            navigator.clipboard.writeText(text).then(() => {
                showStatus(`✓ 已复制: ${buttonName}`, true);
            }).catch(() => {
                fallbackCopy(text, buttonName);
            });
        } else {
            fallbackCopy(text, buttonName);
        }
    }
    
    // 备用复制方法
    function fallbackCopy(text, buttonName) {
        const textarea = document.createElement('textarea');
        textarea.value = text;
        textarea.style.position = 'fixed';
        textarea.style.opacity = '0';
        document.body.appendChild(textarea);
        textarea.select();
        try {
            document.execCommand('copy');
            showStatus(`✓ 已复制: ${buttonName}`, true);
        } catch (err) {
            showStatus('❌ 复制失败', false);
        }
        document.body.removeChild(textarea);
    }
    
    // 显示状态
    function showStatus(message, success) {
        const status = document.getElementById('tool-status');
        status.textContent = message;
        status.className = 'tool-status' + (success ? ' success' : '');
    }
    
    // 拖拽功能
    function dragStart(e) {
        if (e.type === "touchstart") {
            initialX = e.touches[0].clientX - xOffset;
            initialY = e.touches[0].clientY - yOffset;
        } else {
            initialX = e.clientX - xOffset;
            initialY = e.clientY - yOffset;
        }
        
        if (e.target.id === "tool-header" || e.target.className === "tool-title") {
            isDragging = true;
        }
    }
    
    function drag(e) {
        if (isDragging) {
            e.preventDefault();
            
            if (e.type === "touchmove") {
                currentX = e.touches[0].clientX - initialX;
                currentY = e.touches[0].clientY - initialY;
            } else {
                currentX = e.clientX - initialX;
                currentY = e.clientY - initialY;
            }
            
            xOffset = currentX;
            yOffset = currentY;
            
            setTranslate(currentX, currentY, toolElement);
        }
    }
    
    function dragEnd(e) {
        initialX = currentX;
        initialY = currentY;
        isDragging = false;
    }
    
    function setTranslate(xPos, yPos, el) {
        el.style.transform = `translate3d(${xPos}px, ${yPos}px, 0)`;
    }
    
    // 初始化
    function init() {
        // 添加菜单项
        mw.util.addPortletLink(
            'p-tb',
            '#',
            '📋 文本复制工具',
            't-copy-text-tool',
            '打开文本复制工具',
            null,
            '#t-permalink'
        );
        
        // 点击菜单项显示工具
        document.getElementById('t-copy-text-tool').addEventListener('click', function(e) {
            e.preventDefault();
            if (!toolElement) {
                toolElement = createToolPanel();
                
                // 绑定事件
                const header = document.getElementById('tool-header');
                header.addEventListener('mousedown', dragStart);
                document.addEventListener('mousemove', drag);
                document.addEventListener('mouseup', dragEnd);
                
                // 最小化按钮
                document.getElementById('minimize-btn').onclick = () => {
                    toolElement.classList.toggle('minimized');
                };
                
                // 关闭按钮
                document.getElementById('close-btn').onclick = () => {
                    toolElement.remove();
                    toolElement = null;
                };
                
                // 置顶开关
                document.getElementById('pin-checkbox').onchange = (e) => {
                    isPinned = e.target.checked;
                    toolElement.style.position = isPinned ? 'fixed' : 'absolute';
                };
            } else {
                toolElement.style.display = toolElement.style.display === 'none' ? 'block' : 'none';
            }
        });
    }
    
    // 页面加载完成后初始化
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }
})();