{"repo": "aiziyou918/cute-markdown", "files": {"js/app-logic.js": {"60f36a2709eb7779d52e5791fcdbd3baa48d1053": {"t": 1785768938.0793848, "n": 31724, "h": "f4eb07794d2bb1f8", "c": "/**\n * CuteMD - Markdown 编辑器\n * 主应用脚本\n */\n\ndocument.addEventListener('DOMContentLoaded', () => {\n    // 初始内容\n    const initialValue = `# CuteMD - 一款简洁优雅的 Markdown 编辑器\n\n## 欢迎使用！\n\n这是一个基于 Vditor 实现的在线 Markdown 编辑器，旨在提供一个专注、高效且美观的写作环境。\n\n### 主要特性\n\n- **亮/暗**双主题切换\n- 动态文档**大纲**\n- 支持丰富的 Markdown 语法\n- 代码块高亮\n- 数学公式 $E=mc^2$\n- ✨ **AI 智能续写**和**智能摘要**\n- ... 以及更多！\n\n### 如何使用\n\n1.  使用顶部的工具栏进行格式化操作。\n2.  点击 **新建**、**打开** 或 **保存** 来管理您的文件。\n3.  试试点击 **✨ 智能续写** 和 **✨ 智能摘要** 按钮来体验 AI 的魔力！\n\n---\n\n> \"代码和文字一样，都是思想的表达。\"\n\n祝您使用愉快！\n`;\n    \n    // 初始化 Vditor 编辑器\n    const vditor = new Vditor('vditor', {\n        height: '100%',\n        mode: 'ir',\n        theme: 'classic',\n        value: initialValue,\n        toolbar: [\n            'emoji', 'headings', 'bold', 'italic', 'strike', 'link', '|',\n            'list', 'ordered-list', 'check', 'outdent', 'indent', '|',\n            'quote', 'line', 'code', 'inline-code', 'insert-before', 'insert-after', '|',\n            'table', 'undo', 'redo', '|',\n            'edit-mode', 'content-theme', 'code-theme', 'export',\n            {\n                name: 'more',\n                toolbar: [\n                    'fullscreen',\n                    'both',\n                    'preview',\n                    'info',\n                    'help',\n                ],\n            },\n        ],\n        after: () => {\n            updateOutline();\n            // 根据系统偏好设置初始主题\n            const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;\n            applyTheme(prefersDark ? 'dark' : 'light');\n            \n            // 监听全屏事件\n            setupFullscreenHandler();\n        },\n        input: () => {\n            updateOutline();\n        },\n        blur: () => {\n            updateOutline();\n        }\n    });\n    \n    // DOM 元素引用\n    const fileNameEl = document.getElementById('fileName');\n    const outlineContent = document.getElementById('outlineContent');\n    const themeToggleBtn = document.getElementById('themeToggleBtn');\n    const sunIcon = themeToggleBtn.querySelector('.sun-icon');\n    const moonIcon = themeToggleBtn.querySelector('.moon-icon');\n    const outlineSidebar = document.getElementById('outlineSidebar');\n    const outlineToggleBtn = document.getElementById('outlineToggleBtn');\n    const outlineCloseBtn = document.getElementById('outlineCloseBtn');\n    \n    const newFileBtn = document.getElementById('newFileBtn');\n    const openFileBtn = document.getElementById('openFileBtn');\n    const saveFileBtn = document.getElementById('saveFileBtn');\n    const fileInput = document.getElementById('fileInput');\n    \n    const continueBtn = document.getElementById('continueBtn');\n    const summarizeBtn = document.getElementById('summarizeBtn');\n    \n    const aiModal = document.getElementById('aiModal');\n    const aiModalTitle = document.getElementById('aiModalTitle');\n    const aiModalContent = document.getElementById('aiModalContent');\n    const aiModalCloseBtn = document.getElementById('aiModalCloseBtn');\n    \n    const aiSettingsBtn = document.getElementById('aiSettingsBtn');\n    const aiSettingsModal = document.getElementById('aiSettingsModal');\n    const aiSettingsCloseBtn = document.getElementById('aiSettingsCloseBtn');\n    const saveAISettings = document.getElementById('saveAISettings');\n    const clearAISettings = document.getElementById('clearAISettings');\n\n    // 当前文件名（用于标题更新）\n    let currentFileName = '未命名.md';\n\n    /**\n     * 更新浏览器标签页标题\n     */\n    function updateDocumentTitle(fileName) {\n        document.title = `${fileName} - CuteMD`;\n    }\n\n    /**\n     * 设置文件名\n     */\n    function setFileName(name) {\n        currentFileName = name;\n        fileNameEl.textContent = name;\n        updateDocumentTitle(name);\n    }\n\n    /**\n     * 文件名点击编辑功能\n     */\n    fileNameEl.addEventListener('click', () => {\n        const input = document.createElement('input');\n        input.type = 'text';\n        input.className = 'file-name-input';\n        input.value = currentFileName;\n        \n        // 替换元素\n        fileNameEl.parentNode.replaceChild(input, fileNameEl);\n        input.focus();\n        input.select();\n        \n        // 处理输入完成\n        const finishEditing = () => {\n            let newName = input.value.trim();\n            if (!newName) {\n                newName = '未命名.md';\n            } else if (!newName.endsWith('.md') && !newName.endsWith('.markdown')) {\n                newName += '.md';\n            }\n            \n            setFileName(newName);\n            input.parentNode.replaceChild(fileNameEl, input);\n        };\n        \n        input.addEventListener('blur', finishEditing);\n        input.addEventListener('keydown', (e) => {\n            if (e.key === 'Enter') {\n                finishEditing();\n            } else if (e.key === 'Escape') {\n                input.value = currentFileName;\n                finishEditing();\n            }\n        });\n    });\n\n    /**\n     * 更新文档大纲\n     */\n    function updateOutline() {\n        // 获取编辑器的 Markdown 内容\n        const content = vditor.getValue();\n        if (!content) {\n            outlineContent.innerHTML = '<div class=\"outline-empty\">暂无大纲</div>';\n            return;\n        }\n\n        // 解析 Markdown 中的标题\n        const lines = content.split('\\n');\n        const headings = [];\n        \n        lines.forEach((line, index) => {\n            // 匹配标题（# 开头）\n            const match = line.match(/^(#{1,6})\\s+(.+)$/);\n            if (match) {\n                const level = match[1].length;\n                const text = match[2].trim();\n                headings.push({\n                    level: level,\n                    text: text,\n                    lineIndex: index\n                });\n            }\n        });\n\n        // 如果没有标题，显示空状态\n        if (headings.length === 0) {\n            outlineContent.innerHTML = '<div class=\"outline-empty\">暂无大纲</div>';\n            return;\n        }\n\n        // 生成大纲 HTML\n        outlineContent.innerHTML = '';\n        headings.forEach((heading, index) => {\n            const item = document.createElement('div');\n            item.className = 'outline-item';\n            item.setAttribute('data-level', heading.level);\n            item.textContent = heading.text;\n            item.setAttribute('data-line', heading.lineIndex);\n            \n            // 添加点击事件\n            item.addEventListener('click', () => {\n                // 移除所有 active 类\n                outlineContent.querySelectorAll('.outline-item').forEach(el => {\n                    el.classList.remove('active');\n                });\n                // 添加 active 类到当前项\n                item.classList.add('active');\n                \n                // 滚动到对应位置\n                const editor = vditor.vditor.ir.element;\n                const allHeadings = editor.querySelectorAll('h1, h2, h3, h4, h5, h6');\n                if (allHeadings[index]) {\n                    allHeadings[index].scrollIntoView({\n                        behavior: 'smooth',\n                        block: 'start'\n                    });\n                }\n            });\n            \n            outlineContent.appendChild(item);\n        });\n    }\n\n    /**\n     * 应用主题\n     * @param {string} theme - 'light' 或 'dark'\n     */\n    function applyTheme(theme) {\n        if (theme === 'dark') {\n            document.body.classList.add('dark-theme');\n            vditor.setTheme('dark');\n            sunIcon.style.display = 'none';\n            moonIcon.style.display = 'inline-block';\n        } else {\n            document.body.classList.remove('dark-theme');\n            vditor.setTheme('classic');\n            sunIcon.style.display = 'inline-block';\n            moonIcon.style.display = 'none';\n        }\n    }\n    \n    /**\n     * 设置全屏处理程序 - 修复全屏退出问题\n     */\n    function setupFullscreenHandler() {\n        // 监听全屏变化事件\n        document.addEventListener('fullscreenchange', handleFullscreenChange);\n        document.addEventListener('webkitfullscreenchange', handleFullscreenChange);\n        document.addEventListener('mozfullscreenchange', handleFullscreenChange);\n        document.addEventListener('MSFullscreenChange', handleFullscreenChange);\n    }\n\n    function handleFullscreenChange() {\n        const isFullscreen = !!(document.fullscreenElement || \n                               document.webkitFullscreenElement || \n                               document.mozFullScreenElement || \n                               document.msFullscreenElement);\n        \n        // Vditor 会自动处理全屏状态，我们只需要确保 ESC 键可以退出\n        if (!isFullscreen) {\n            // 确保编辑器从全屏模式正确退出\n            const vditorElement = document.getElementById('vditor');\n            if (vditorElement) {\n                vditorElement.classList.remove('vditor--fullscreen');\n            }\n        }\n    }\n    \n    /**\n     * 主题切换按钮\n     */\n    themeToggleBtn.addEventListener('click', () => {\n        const isDark = document.body.classList.contains('dark-theme');\n        applyTheme(isDark ? 'light' : 'dark');\n    });\n    \n    /**\n     * 大纲位置切换（左/右）或重新打开\n     */\n    outlineToggleBtn.addEventListener('click', () => {\n        // 如果大纲被隐藏，则重新打开\n        if (outlineSidebar.classList.contains('hidden')) {\n            outlineSidebar.classList.remove('hidden');\n        } else {\n            // 否则切换左右位置\n            outlineSidebar.classList.toggle('right');\n        }\n    });\n    \n    /**\n     * 隐藏大纲\n     */\n    outlineCloseBtn.addEventListener('click', () => {\n        outlineSidebar.classList.add('hidden');\n    });\n\n    /**\n     * 文件操作 - 新建\n     */\n    newFileBtn.addEventListener('click', () => {\n        if (confirm('创建新文件将清空当前内容，是否继续？')) {\n            vditor.setValue('');\n            setFileName('未命名.md');\n            updateOutline();\n        }\n    });\n\n    /**\n     * 文件操作 - 打开\n     */\n    openFileBtn.addEventListener('click', () => {\n        fileInput.click();\n    });\n    \n    fileInput.addEventListener('change', (event) => {\n        const file = event.target.files[0];\n        if (file) {\n            const reader = new FileReader();\n            reader.onload = (e) => {\n                vditor.setValue(e.target.result);\n                setFileName(file.name);\n                updateOutline();\n            };\n            reader.readAsText(file);\n        }\n        // 重置文件输入以允许再次打开同一文件\n        event.target.value = '';\n    });\n\n    /**\n     * 文件操作 - 保存\n     */\n    saveFileBtn.addEventListener('click', () => {\n        const content = vditor.getValue();\n        const blob = new Blob([content], { type: 'text/markdown;charset=utf-8' });\n        const a = document.createElement('a');\n        a.href = URL.createObjectURL(blob);\n        a.download = currentFileName;\n        document.body.appendChild(a);\n        a.click();\n        document.body.removeChild(a);\n    });\n\n    // --- AI Configuration & Integration ---\n    \n    /**\n     * AI 配置管理\n     */\n    const AIConfig = {\n        storageKey: 'cutemd_ai_config',\n        \n        // 获取配置\n        get() {\n            const config = localStorage.getItem(this.storageKey);\n            return config ? JSON.parse(config) : {\n                provider: 'gemini',\n                openai: { key: '', model: 'gpt-3.5-turbo', endpoint: '' },\n                anthropic: { key: '', model: 'claude-3-5-sonnet-20241022' },\n                gemini: { key: '', model: 'gemini-2.0-flash-exp' },\n                deepseek: { key: '', model: 'deepseek-chat' },\n                custom: { endpoint: '', key: '', model: '' }\n            };\n        },\n        \n        // 保存配置\n        save(config) {\n            localStorage.setItem(this.storageKey, JSON.stringify(config));\n        },\n        \n        // 清除配置\n        clear() {\n            localStorage.removeItem(this.storageKey);\n        }\n    };\n    \n    /**\n     * 加载设置到 UI\n     */\n    function loadAISettingsToUI() {\n        const config = AIConfig.get();\n        \n        // 设置提供商\n        document.querySelector(`input[name=\"aiProvider\"][value=\"${config.provider}\"]`).checked = true;\n        showProviderSettings(config.provider);\n        \n        // 加载各个提供商的设置\n        document.getElementById('openaiKey').value = config.openai.key || '';\n        document.getElementById('openaiModel').value = config.openai.model || 'gpt-3.5-turbo';\n        document.getElementById('openaiEndpoint').value = config.openai.endpoint || '';\n        \n        document.getElementById('anthropicKey').value = config.anthropic.key || '';\n        document.getElementById('anthropicModel').value = config.anthropic.model || 'claude-3-5-sonnet-20241022';\n        \n        document.getElementById('geminiKey').value = config.gemini.key || '';\n        document.getElementById('geminiModel').value = config.gemini.model || 'gemini-2.0-flash-exp';\n        \n        document.getElementById('deepseekKey').value = config.deepseek.key || '';\n        document.getElementById('deepseekModel').value = config.deepseek.model || 'deepseek-chat';\n        \n        document.getElementById('customEndpoint').value = config.custom.endpoint || '';\n        document.getElementById('customKey').value = config.custom.key || '';\n        document.getElementById('customModel').value = config.custom.model || '';\n    }\n    \n    /**\n     * 显示/隐藏提供商设置\n     */\n    function showProviderSettings(provider) {\n        document.getElementById('openaiSettings').style.display = provider === 'openai' ? 'block' : 'none';\n        document.getElementById('anthropicSettings').style.display = provider === 'anthropic' ? 'block' : 'none';\n        document.getElementById('geminiSettings').style.display = provider === 'gemini' ? 'block' : 'none';\n        document.getElementById('deepseekSettings').style.display = provider === 'deepseek' ? 'block' : 'none';\n        document.getElementById('customSettings').style.display = provider === 'custom' ? 'block' : 'none';\n    }\n    \n    /**\n     * 打开 AI 设置\n     */\n    aiSettingsBtn.addEventListener('click', () => {\n        loadAISettingsToUI();\n        aiSettingsModal.style.display = 'flex';\n    });\n    \n    /**\n     * 关闭 AI 设置\n     */\n    const closeAISettingsModal = () => {\n        aiSettingsModal.style.display = 'none';\n    };\n    \n    aiSettingsCloseBtn.addEventListener('click', closeAISettingsModal);\n    aiSettingsModal.addEventListener('click', (e) => {\n        if (e.target === aiSettingsModal) {\n            closeAISettingsModal();\n        }\n    });\n    \n    /**\n     * 提供商切换\n     */\n    document.querySelectorAll('input[name=\"aiProvider\"]').forEach(radio => {\n        radio.addEventListener('change', (e) => {\n            showProviderSettings(e.target.value);\n        });\n    });\n    \n    /**\n     * 保存 AI 设置\n     */\n    saveAISettings.addEventListener('click', () => {\n        const provider = document.querySelector('input[name=\"aiProvider\"]:checked').value;\n        \n        const config = {\n            provider,\n            openai: {\n                key: document.getElementById('openaiKey').value.trim(),\n                model: document.getElementById('openaiModel').value,\n                endpoint: document.getElementById('openaiEndpoint').value.trim()\n            },\n            anthropic: {\n                key: document.getElementById('anthropicKey').value.trim(),\n                model: document.getElementById('anthropicModel').value\n            },\n            gemini: {\n                key: document.getElementById('geminiKey').value.trim(),\n                model: document.getElementById('geminiModel').value\n            },\n            deepseek: {\n                key: document.getElementById('deepseekKey').value.trim(),\n                model: document.getElementById('deepseekModel').value\n            },\n            custom: {\n                endpoint: document.getElementById('customEndpoint').value.trim(),\n                key: document.getElementById('customKey').value.trim(),\n                model: document.getElementById('customModel').value.trim()\n            }\n        };\n        \n        // 验证当前提供商是否配置了必要信息\n        let valid = true;\n        switch(provider) {\n            case 'openai':\n                if (!config.openai.key) {\n                    alert('请输入 OpenAI API Key');\n                    valid = false;\n                }\n                break;\n            case 'anthropic':\n                if (!config.anthropic.key) {\n                    alert('请输入 Anthropic API Key');\n                    valid = false;\n                }\n                break;\n            case 'gemini':\n                if (!config.gemini.key) {\n                    alert('请输入 Gemini API Key');\n                    valid = false;\n                }\n                break;\n            case 'deepseek':\n                if (!config.deepseek.key) {\n                    alert('请输入 DeepSeek API Key');\n                    valid = false;\n                }\n                break;\n            case 'custom':\n                if (!config.custom.endpoint || !config.custom.key || !config.custom.model) {\n                    alert('请完整填写自定义 API 配置');\n                    valid = false;\n                }\n                break;\n        }\n        \n        if (valid) {\n            AIConfig.save(config);\n            alert('✅ AI 设置已保存！');\n            closeAISettingsModal();\n        }\n    });\n    \n    /**\n     * 清除 AI 设置\n     */\n    clearAISettings.addEventListener('click', () => {\n        if (confirm('确定要清除所有 AI 配置吗？')) {\n            AIConfig.clear();\n            loadAISettingsToUI();\n            alert('✅ AI 设置已清除！');\n        }\n    });\n    \n    /**\n     * 统一的 AI API 调用函数\n     */\n    async function callAI(prompt, button) {\n        const config = AIConfig.get();\n        const providerConfig = config[config.provider];\n        \n        // 检查配置\n        if (!providerConfig || !providerConfig.key) {\n            alert(`❌ 请先配置 AI 服务\\n\\n当前选择的提供商: ${config.provider}\\n\\n点击顶部的设置按钮 (⚙️) 进行配置。`);\n            return null;\n        }\n        \n        const originalText = button.innerHTML;\n        button.innerHTML = '<span class=\"loader\"></span>';\n        button.disabled = true;\n\n        try {\n            let result;\n            \n            switch(config.provider) {\n                case 'openai':\n                    result = await callOpenAI(prompt, providerConfig);\n                    break;\n                case 'anthropic':\n                    result = await callAnthropic(prompt, providerConfig);\n                    break;\n                case 'gemini':\n                    result = await callGemini(prompt, providerConfig);\n                    break;\n                case 'deepseek':\n                    result = await callDeepSeek(prompt, providerConfig);\n                    break;\n                case 'custom':\n                    result = await callCustomAPI(prompt, providerConfig);\n                    break;\n                default:\n                    throw new Error('未知的 AI 提供商');\n            }\n            \n            return result;\n        } catch (error) {\n            console.error('AI API 调用失败:', error);\n            alert(`❌ AI 功能调用失败：${error.message}\\n\\n请检查:\\n1. API Key 是否正确\\n2. 网络连接是否正常\\n3. 所选服务在您的地区是否可用`);\n            return null;\n        } finally {\n            button.innerHTML = originalText;\n            button.disabled = false;\n        }\n    }\n    \n    /**\n     * OpenAI API 调用\n     */\n    async function callOpenAI(prompt, config) {\n        const endpoint = config.endpoint || 'https://api.openai.com/v1';\n        const url = `${endpoint}/chat/completions`;\n        \n        const response = await fetch(url, {\n            method: 'POST',\n            headers: {\n                'Content-Type': 'application/json',\n                'Authorization': `Bearer ${config.key}`\n            },\n            body: JSON.stringify({\n                model: config.model,\n                messages: [{ role: 'user', content: prompt }],\n                temperature: 0.7\n            })\n        });\n        \n        if (!response.ok) {\n            const error = await response.json().catch(() => ({}));\n            throw new Error(error.error?.message || `HTTP ${response.status}`);\n        }\n        \n        const data = await response.json();\n        return data.choices?.[0]?.message?.content || '';\n    }\n    \n    /**\n     * Anthropic Claude API 调用\n     */\n    async function callAnthropic(prompt, config) {\n        const url = 'https://api.anthropic.com/v1/messages';\n        \n        const response = await fetch(url, {\n            method: 'POST',\n            headers: {\n                'Content-Type': 'application/json',\n                'x-api-key': config.key,\n                'anthropic-version': '2023-06-01'\n            },\n            body: JSON.stringify({\n                model: config.model,\n                max_tokens: 4096,\n                messages: [{ role: 'user', content: prompt }]\n            })\n        });\n        \n        if (!response.ok) {\n            const error = await response.json().catch(() => ({}));\n            throw new Error(error.error?.message || `HTTP ${response.status}`);\n        }\n        \n        const data = await response.json();\n        return data.content?.[0]?.text || '';\n    }\n    \n    /**\n     * Google Gemini API 调用\n     */\n    async function callGemini(prompt, config) {\n        const url = `https://generativelanguage.googleapis.com/v1beta/models/${config.model}:generateContent?key=${config.key}`;\n        \n        const response = await fetch(url, {\n            method: 'POST',\n            headers: { 'Content-Type': 'application/json' },\n            body: JSON.stringify({\n                contents: [{ parts: [{ text: prompt }] }]\n            })\n        });\n        \n        if (!response.ok) {\n            if (response.status === 400 || response.status === 403) {\n                throw new Error('Gemini API 在您所在的地区不可用');\n            }\n            throw new Error(`HTTP ${response.status}`);\n        }\n        \n        const data = await response.json();\n        return data.candidates?.[0]?.content?.parts?.[0]?.text || '';\n    }\n    \n    /**\n     * DeepSeek API 调用\n     */\n    async function callDeepSeek(prompt, config) {\n        const url = 'https://api.deepseek.com/v1/chat/completions';\n        \n        const response = await fetch(url, {\n            method: 'POST',\n            headers: {\n                'Content-Type': 'application/json',\n                'Authorization': `Bearer ${config.key}`\n            },\n            body: JSON.stringify({\n                model: config.model,\n                messages: [{ role: 'user', content: prompt }],\n                temperature: 0.7\n            })\n        });\n        \n        if (!response.ok) {\n            const error = await response.json().catch(() => ({}));\n            throw new Error(error.error?.message || `HTTP ${response.status}`);\n        }\n        \n        const data = await response.json();\n        return data.choices?.[0]?.message?.content || '';\n    }\n    \n    /**\n     * 自定义 API 调用 (OpenAI 格式)\n     */\n    async function callCustomAPI(prompt, config) {\n        const url = `${config.endpoint}/chat/completions`;\n        \n        const response = await fetch(url, {\n            method: 'POST',\n            headers: {\n                'Content-Type': 'application/json',\n                'Authorization': `Bearer ${config.key}`\n            },\n            body: JSON.stringify({\n                model: config.model,\n                messages: [{ role: 'user', content: prompt }],\n                temperature: 0.7\n            })\n        });\n        \n        if (!response.ok) {\n            const error = await response.json().catch(() => ({}));\n            throw new Error(error.error?.message || `HTTP ${response.status}`);\n        }\n        \n        const data = await response.json();\n        return data.choices?.[0]?.message?.content || '';\n    }\n\n    /**\n     * 智能续写功能\n     */\n    continueBtn.addEventListener('click', async () => {\n        if (!vditor) return;\n        const currentText = vditor.getValue();\n        if (currentText.trim().length < 10) {\n            alert(\"请输入至少 10 个字符的内容以便 AI 更好地理解上下文。\");\n            return;\n        }\n        \n        const prompt = `You are a helpful writing assistant. Please continue writing the following text in a natural and coherent way, in the same language. Do not repeat the original text in your response. Here is the text:\\n\\n---\\n\\n${currentText}`;\n        \n        const generatedText = await callAI(prompt, continueBtn);\n        \n        if (generatedText) {\n            vditor.insertValue(`\\n\\n${generatedText}`);\n        }\n    });\n\n    /**\n     * 智能摘要功能\n     */\n    summarizeBtn.addEventListener('click', async () => {\n        if (!vditor) return;\n        const currentText = vditor.getValue();\n        if (currentText.trim().length < 50) {\n            alert(\"请输入至少 50 个字符的内容以便 AI 生成有意义的摘要。\");\n            return;\n        }\n        \n        const prompt = `You are an expert summarizer. Please provide a concise summary of the following text in a few bullet points. The summary must be in the same language as the original text. Here is the text:\\n\\n---\\n\\n${currentText}`;\n        \n        const summary = await callAI(prompt, summarizeBtn);\n        \n        if (summary) {\n            // 使用 Vditor 的 markdown 解析器渲染摘要在 modal 中\n            aiModalTitle.textContent = '✨ 智能摘要';\n            Vditor.preview(aiModalContent, summary, {\n                cdn: 'https://unpkg.com/vditor@3.10.4',\n            });\n            aiModal.style.display = 'flex';\n        }\n    });\n    \n    /**\n     * 关闭 AI Modal\n     */\n    const closeAiModal = () => {\n        aiModal.style.display = 'none';\n        aiModalContent.innerHTML = '';\n    };\n    \n    aiModalCloseBtn.addEventListener('click', closeAiModal);\n    aiModal.addEventListener('click', (e) => {\n        if (e.target === aiModal) {\n            closeAiModal();\n        }\n    });\n\n    // 键盘快捷键系统\n    document.addEventListener('keydown', (e) => {\n        const mod = e.ctrlKey || e.metaKey; // Ctrl on Windows/Linux, Cmd on Mac\n        const shift = e.shiftKey;\n        const alt = e.altKey;\n        const key = e.key.toLowerCase();\n        \n        // ========== 文件操作 ==========\n        \n        // Ctrl/Cmd + N: 新建\n        if (mod && !shift && !alt && key === 'n') {\n            e.preventDefault();\n            newFileBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + O: 打开\n        if (mod && !shift && !alt && key === 'o') {\n            e.preventDefault();\n            openFileBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + S: 保存\n        if (mod && !shift && !alt && key === 's') {\n            e.preventDefault();\n            saveFileBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + W: 关闭（新建空白文档）\n        if (mod && !shift && !alt && key === 'w') {\n            e.preventDefault();\n            newFileBtn.click();\n            return;\n        }\n        \n        // ========== 视图操作 ==========\n        \n        // Ctrl/Cmd + Shift + L: 切换侧边栏/大纲\n        if (mod && shift && !alt && key === 'l') {\n            e.preventDefault();\n            outlineToggleBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + Shift + 1: 大纲（与切换侧边栏相同）\n        if (mod && shift && !alt && key === '1') {\n            e.preventDefault();\n            outlineToggleBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + /: 源代码模式（Vditor 自带，不需要处理）\n        // F8: 对焦模式（需要通过 Vditor API）\n        if (!mod && !shift && !alt && e.key === 'F8') {\n            e.preventDefault();\n            // 切换对焦模式 - 通过 Vditor 内置功能\n            const focusBtn = document.querySelector('[data-type=\"focus\"]');\n            if (focusBtn) focusBtn.click();\n            return;\n        }\n        \n        // F9: 打字机模式\n        if (!mod && !shift && !alt && e.key === 'F9') {\n            e.preventDefault();\n            // 切换打字机模式\n            const typewriterBtn = document.querySelector('[data-type=\"typewriter\"]');\n            if (typewriterBtn) typewriterBtn.click();\n            return;\n        }\n        \n        // F11: 全屏模式\n        if (!mod && !shift && !alt && e.key === 'F11') {\n            e.preventDefault();\n            const fullscreenBtn = document.querySelector('[data-type=\"fullscreen\"]');\n            if (fullscreenBtn) fullscreenBtn.click();\n            return;\n        }\n        \n        // ========== 编辑操作 ==========\n        // 注意：大部分编辑操作（如 Ctrl+B, Ctrl+I 等）由 Vditor 内置处理\n        // 这里只处理一些特殊的或者需要自定义的快捷键\n        \n        // Ctrl/Cmd + F: 查找（Vditor 自带）\n        // Ctrl/Cmd + H: 替换（Vditor 自带）\n        \n        // ========== 段落操作 ==========\n        \n        // Ctrl/Cmd + 0: 段落\n        if (mod && !shift && !alt && key === '0') {\n            e.preventDefault();\n            const paragraphBtn = document.querySelector('[data-type=\"paragraph\"]');\n            if (paragraphBtn) paragraphBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + 1-6: 标题 1-6\n        if (mod && !shift && !alt && ['1', '2', '3', '4', '5', '6'].includes(key)) {\n            e.preventDefault();\n            const headingBtn = document.querySelector(`[data-type=\"heading\"][data-level=\"${key}\"]`);\n            if (headingBtn) {\n                headingBtn.click();\n            } else {\n                // 如果找不到按钮，尝试插入标题\n                const level = parseInt(key);\n                const hashes = '#'.repeat(level);\n                vditor.insertValue(`\\n${hashes} `);\n            }\n            return;\n        }\n        \n        // Ctrl/Cmd + Shift + K: 代码块\n        if (mod && shift && !alt && key === 'k') {\n            e.preventDefault();\n            const codeBtn = document.querySelector('[data-type=\"code\"]');\n            if (codeBtn) codeBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + Shift + Q: 引用\n        if (mod && shift && !alt && key === 'q') {\n            e.preventDefault();\n            const quoteBtn = document.querySelector('[data-type=\"quote\"]');\n            if (quoteBtn) quoteBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + Shift + [: 有序列表\n        if (mod && shift && !alt && key === '[') {\n            e.preventDefault();\n            const orderedListBtn = document.querySelector('[data-type=\"ordered-list\"]');\n            if (orderedListBtn) orderedListBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + Shift + ]: 无序列表\n        if (mod && shift && !alt && key === ']') {\n            e.preventDefault();\n            const listBtn = document.querySelector('[data-type=\"list\"]');\n            if (listBtn) listBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + T: 表格\n        if (mod && !shift && !alt && key === 't') {\n            e.preventDefault();\n            const tableBtn = document.querySelector('[data-type=\"table\"]');\n            if (tableBtn) tableBtn.click();\n            return;\n        }\n        \n        // ========== 格式化操作 ==========\n        // Vditor 内置支持的快捷键：\n        // Ctrl+B: 粗体\n        // Ctrl+I: 斜体\n        // Ctrl+U: 下划线\n        // Ctrl+K: 链接\n        // 等等...\n        \n        // Ctrl/Cmd + Shift + `: 行内代码\n        if (mod && shift && !alt && key === '`') {\n            e.preventDefault();\n            const inlineCodeBtn = document.querySelector('[data-type=\"inline-code\"]');\n            if (inlineCodeBtn) inlineCodeBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + Shift + I: 图片\n        if (mod && shift && !alt && key === 'i') {\n            e.preventDefault();\n            const uploadBtn = document.querySelector('[data-type=\"upload\"]');\n            if (uploadBtn) uploadBtn.click();\n            return;\n        }\n        \n        // Ctrl/Cmd + \\: 清除格式\n        if (mod && !shift && !alt && key === '\\\\') {\n            e.preventDefault();\n            const clearBtn = document.querySelector('[data-type=\"clearCache\"]');\n            if (clearBtn) clearBtn.click();\n            return;\n        }\n    });\n\n    // 初始化文件名和标题\n    setFileName(currentFileName);\n});\n"}}}}