User:SparrowHe/templateTip.js

注意：保存之后，你必须清除浏览器缓存才能看到做出的更改。Google Chrome、Firefox、Microsoft Edge及Safari：按住⇧ Shift键并单击工具栏的“刷新”按钮。参阅Help:绕过浏览器缓存以获取更多帮助。
(function() {
    const textBox = document.getElementById('wpTextbox1');

    // 浮窗
    let displayDiv = document.createElement('div');
    displayDiv.style.position = 'fixed';
    displayDiv.style.bottom = '10px';
    displayDiv.style.right = '10px';
    displayDiv.style.backgroundColor = 'rgba(0, 0, 0, 0.85)'; // 背景稍微透明
    displayDiv.style.color = 'white'; // 文字颜色为白色
    displayDiv.style.padding = '10px 15px'; // 增加右侧空间
    displayDiv.style.borderRadius = '5px';
    displayDiv.style.zIndex = '9999';
    displayDiv.style.display = 'none'; // 初始状态下隐藏
    displayDiv.style.maxWidth = '300px'; // 限制浮窗宽度
    displayDiv.style.wordWrap = 'break-word'; // 自动换行
    document.body.appendChild(displayDiv);

    // 关闭按钮
    let closeButton = document.createElement('span');
    closeButton.innerHTML = '&times;'; // 叉号
    closeButton.style.float = 'right';
    closeButton.style.cursor = 'pointer';
    closeButton.style.marginLeft = '10px';
    closeButton.style.fontSize = '18px';
    closeButton.style.color = '#ff6666'; // 叉号颜色为浅红色
    closeButton.addEventListener('click', function() {
        displayDiv.style.display = 'none'; // 点击叉号隐藏浮窗
    });
    displayDiv.appendChild(closeButton);

    textBox.addEventListener('select', handleSelection);
    textBox.addEventListener('input', handleSelection);

    const api = new mw.Api();

    // 处理选中的内容并检查页面是否存在
    function handleSelection() {
        let selectedText = textBox.value.substring(textBox.selectionStart, textBox.selectionEnd).trim();

        // 如果有选中文字，检查模板页面是否存在
        if (selectedText) {
            const templatePage = 'Template:' + selectedText;

            api.get({
                action: 'query',
                titles: templatePage,
                format: 'json'
            }).done(function(data) {
                const pages = data.query.pages;
                const pageId = Object.keys(pages)[0];
                
                if (pageId === '-1') {
                    // 页面不存在，显示不存在提示
                    displayDiv.innerHTML = `模板 <strong>${templatePage}</strong> 不存在`;
                    displayDiv.appendChild(closeButton);
                    displayDiv.style.display = 'block';
                } else {
                    // 页面存在，生成链接
                    const pageUrl = mw.util.getUrl(templatePage);
                    displayDiv.innerHTML = `跳转到模板: <a href="${pageUrl}" target="_blank" style="color: #00ccff; text-decoration: underline;">${templatePage}</a>`;
                    displayDiv.appendChild(closeButton);
                    displayDiv.style.display = 'block';
                }
            });
        } else {
            // 隐藏浮窗
            displayDiv.style.display = 'none';
        }
    }

    // Esc 隐藏浮窗
    document.addEventListener('keydown', function(event) {
        if (event.key === 'Escape') {
            displayDiv.style.display = 'none';
        }
    });
})();