// ==UserScript== // @name gemini-helper // @namespace http://tampermonkey.net/ // @version 1.8.2 // @description Gemini 助手：支持对话大纲、提示词管理、模型锁定、标签页增强（状态显示/隐私模式/生成完成通知）、阅读历史恢复、双向锚点、自动加宽页面、中文输入修复，智能适配 Gemini 标准版/企业版/Genspark // @description:en Gemini Helper: Supports outline navigation, prompt management, model locking, tab enhancements (status display/privacy mode/completion notification), reading history, bidirectional anchor, auto page width, Chinese input fix, smart adaptation for Gemini Standard/Enterprise/Genspark // @author urzeye // @homepage https://github.com/urzeye // @note 参考 https://linux.do/t/topic/925110 的代码与UI布局拓展实现 // @match https://gemini.google.com/* // @match https://business.gemini.google/* // @match https://www.genspark.ai/agents* // @match https://genspark.ai/agents* // @icon https://raw.githubusercontent.com/gist/urzeye/8d1d3afbbcd0193dbc8a2019b1ba54d3/raw/f7113d329a259963ed1b1ab8cb981e8f635d4cea/gemini.svg // @grant GM_setValue // @grant GM_getValue // @grant GM_deleteValue // @grant window.focus // @run-at document-idle // @supportURL https://github.com/urzeye/tampermonkey-scripts/issues // @homepageURL https://github.com/urzeye/tampermonkey-scripts // @require https://update.greasyfork.icu/scripts/559089/1714656/background-keep-alive.js // @require https://update.greasyfork.icu/scripts/559176/1715343/domToolkit.js // @license MIT // @downloadURL https://update.greasyfork.icu/scripts/558318/gemini-helper.user.js // @updateURL https://update.greasyfork.icu/scripts/558318/gemini-helper.meta.js // ==/UserScript== (function () { 'use strict'; // 防止重复初始化 if (window.geminiHelperInitialized) { return; } window.geminiHelperInitialized = true; // ==================== 设置项与多语言 ==================== const SETTING_KEYS = { CLEAR_TEXTAREA_ON_SEND: 'gemini_business_clear_on_send', LANGUAGE: 'gemini_language', PAGE_WIDTH: 'gemini_page_width', OUTLINE: 'gemini_outline_settings', TAB_ORDER: 'gemini_tab_order', MODEL_LOCK: 'gemini_model_lock', PROMPTS_SETTINGS: 'gemini_prompts_settings', READING_HISTORY: 'gemini_reading_history_settings', TAB_SETTINGS: 'gemini_tab_settings', }; // 默认 Tab 顺序 const DEFAULT_TAB_ORDER = ['prompts', 'outline', 'settings']; const DEFAULT_PROMPTS_SETTINGS = {enabled: true}; const DEFAULT_READING_HISTORY_SETTINGS = { persistence: true, autoRestore: false, cleanupDays: 30 }; const DEFAULT_TAB_SETTINGS = { openInNewTab: true, // 新标签页打开新对话 autoRenameTab: true, // 自动重命名标签页 renameInterval: 3, // 检测频率(秒) showStatus: true, // 显示生成状态图标 (⏳/✅) showNotification: false, // 发送桌面通知 autoFocus: false, // 生成完成后自动将窗口置顶 privacyMode: false, // 隐私模式 privacyTitle: 'Google', // 隐私模式下的伪装标题 titleFormat: '{status}{title}-{model}' // 自定义标题格式，支持 {status}、{title}、{model} }; // Tab 定义（用于渲染和显示） const TAB_DEFINITIONS = { 'prompts': {id: 'prompts', labelKey: 'tabPrompts', icon: '📝'}, 'outline': {id: 'outline', labelKey: 'tabOutline', icon: '📑'}, 'settings': {id: 'settings', labelKey: 'tabSettings', icon: '⚙️'} }; const I18N = { 'zh-CN': { panelTitle: 'Gemini 助手', tabPrompts: '提示词', tabSettings: '设置', searchPlaceholder: '搜索提示词...', addPrompt: '添加新提示词', allCategory: '全部', manageCategory: '⚙ 管理', currentPrompt: '当前提示词：', scrollTop: '顶部', scrollBottom: '底部', refresh: '刷新', collapse: '收起', edit: '编辑', delete: '删除', copy: '复制', drag: '拖动', save: '保存', cancel: '取消', add: '添加', anchorPoint: '锚点', updateAnchor: '更新锚点', title: '标题', category: '分类', categoryPlaceholder: '例如：编程、翻译', content: '提示词内容', editPrompt: '编辑提示词', addNewPrompt: '添加新提示词', fillTitleContent: '请填写标题和内容', promptUpdated: '提示词已更新', promptAdded: '提示词已添加', deleted: '已删除', copied: '已复制到剪贴板', cleared: '已清除内容', refreshed: '已刷新', orderUpdated: '已更新排序', inserted: '已插入提示词', scrolling: '页面正在滚动，请稍后...', noTextarea: '未找到输入框，请点击输入框后重试', confirmDelete: '确定删除?', // 设置面板 settingsTitle: '通用设置', clearOnSendLabel: '发送后自动修复中文输入', clearOnSendDesc: '发送消息后插入零宽字符，修复下次输入首字母问题（仅 Gemini Business）', settingOn: '开', settingOff: '关', // 模型锁定 modelLockTitle: '模型锁定', modelLockLabel: '自动锁定模型', modelLockDesc: '进入页面后自动切换到指定模型', modelKeywordLabel: '模型关键字', modelKeywordPlaceholder: '例如：3 Pro', modelKeywordDesc: '用于匹配目标模型名称', // 分类管理 categoryManage: '分类管理', categoryEmpty: '暂无分类，添加提示词时会自动创建分类', rename: '重命名', newCategoryName: '请输入新的分类名称：', categoryRenamed: '分类已重命名', confirmDeleteCategory: '确定删除该分类吗？关联的提示词将移至"未分类"', categoryDeleted: '分类已删除', // 语言设置 languageLabel: '界面语言', languageDesc: '设置面板显示语言，即时生效', languageAuto: '跟随系统', languageZhCN: '简体中文', languageZhTW: '繁體中文', languageEn: 'English', // 页面宽度设置 pageWidthLabel: '页面宽度', pageWidthDesc: '调整聊天页面的宽度，即时生效', enablePageWidth: '启用页面加宽', widthValue: '宽度值', widthUnit: '单位', unitPx: '像素 (px)', unitPercent: '百分比 (%)', // 标签页设置 tabSettingsTitle: '标签页设置', openNewTabLabel: '新标签页打开新对话', openNewTabDesc: '在面板顶部添加按钮，点击后在新标签页打开新对话', newTabTooltip: '新标签页开启对话', autoRenameTabLabel: '自动重命名标签页', autoRenameTabDesc: '将浏览器标签页名称改为当前对话名称', renameIntervalLabel: '检测频率', renameIntervalDesc: '检测对话名称变化的间隔时间', secondsSuffix: '秒', showStatusLabel: '显示生成状态', showStatusDesc: '在标签页标题中显示生成状态图标（⏳/✅）', showNotificationLabel: '发送桌面通知', showNotificationDesc: '生成完成时发送系统通知（目前仅 Gemini Business 有效）', autoFocusLabel: '自动窗口置顶', autoFocusDesc: '生成完成时自动将窗口带回前台（目前仅 Gemini Business 有效）', privacyModeLabel: '隐私模式', privacyModeDesc: '隐藏真实对话标题，显示伪装标题（双击面板标题可快速切换）', privacyTitleLabel: '伪装标题', privacyTitlePlaceholder: '如：Google、工作文档', titleFormatLabel: '标题格式', titleFormatDesc: '自定义标题格式，支持占位符：{status}、{title}、{model}', notificationTitle: '✅ {site} 生成完成', notificationBody: '点击查看结果', // 大纲功能 tabOutline: '大纲', outlineEmpty: '暂无大纲内容', outlineRefresh: '刷新', outlineSettings: '大纲设置', enableOutline: '启用大纲', outlineMaxLevel: '显示标题级别', outlineLevelAll: '全部 (1-6级)', outlineLevel1: '仅 1 级', outlineLevel2: '至 2 级', outlineLevel3: '至 3 级', // 刷新按钮提示 refreshPrompts: '刷新提示词', refreshOutline: '刷新大纲', refreshSettings: '刷新设置', jumpToAnchor: '返回跳转前位置', anchorUpdated: '锚点已更新', // 大纲高级工具栏 outlineScrollBottom: '滚动到底部', outlineScrollTop: '滚动到顶部', outlineExpandAll: '展开全部', outlineCollapseAll: '折叠全部', outlineSearch: '搜索大纲...', outlineSearchResult: '个结果', outlineLevelHint: '级标题', // Tab 顺序设置 tabOrderSettings: '界面排版', tabOrderDesc: '调整面板 Tab 的显示顺序', moveUp: '上移', moveDown: '下移', // 阅读导航设置 readingNavigationSettings: '阅读导航', readingHistorySettings: '阅读历史', readingHistoryPersistence: '启用阅读历史', readingHistoryPersistenceDesc: '自动记录阅读位置，下次打开时恢复', autoRestore: '自动跳转', autoRestoreDesc: '打开页面时自动跳转到上次位置', readingHistoryCleanup: '历史保留时间', readingHistoryCleanupDesc: '只保留最近几天的阅读进度 (-1 为永久)', daysSuffix: '天', cleanupInfinite: '永久', restoredPosition: '已恢复上次阅读位置', cleanupDone: '已清理过期数据', // 大纲高级设置 outlineAutoUpdateLabel: '对话期间自动更新大纲', outlineAutoUpdateDesc: 'AI 生成内容时自动刷新目录结构', outlineUpdateIntervalLabel: '更新检测间隔 (秒)', outlineIntervalUpdated: '间隔已设为 {val} 秒', // 页面显示设置 pageDisplaySettings: '页面显示', // 其他设置 otherSettingsTitle: '其他设置', showCollapsedAnchorLabel: '折叠面板显示锚点', showCollapsedAnchorDesc: '当面板收起时，在侧边浮动条中显示锚点按钮', preventAutoScrollLabel: '防止自动滚动', preventAutoScrollDesc: '当 AI 生成长内容时，阻止页面自动滚动到底部，方便阅读上文', // 界面排版开关 disableOutline: '禁用大纲', togglePrompts: '启用/禁用提示词' }, 'zh-TW': { panelTitle: 'Gemini 助手', tabPrompts: '提示詞', tabSettings: '設置', searchPlaceholder: '搜尋提示詞...', addPrompt: '新增提示詞', allCategory: '全部', manageCategory: '⚙ 管理', currentPrompt: '當前提示詞：', scrollTop: '頂部', scrollBottom: '底部', refresh: '刷新', collapse: '收起', edit: '編輯', delete: '刪除', copy: '複製', drag: '拖動', save: '保存', cancel: '取消', add: '新增', title: '標題', category: '分類', categoryPlaceholder: '例如：程式設計、翻譯', content: '提示詞內容', editPrompt: '編輯提示詞', addNewPrompt: '新增提示詞', fillTitleContent: '請填寫標題和內容', promptUpdated: '提示詞已更新', promptAdded: '提示詞已新增', deleted: '已刪除', copied: '已複製到剪貼簿', cleared: '已清除內容', refreshed: '已刷新', orderUpdated: '已更新排序', inserted: '已插入提示詞', scrolling: '頁面正在捲動，請稍後...', noTextarea: '未找到輸入框，請點擊輸入框後重試', confirmDelete: '確定刪除?', // 設置面板 settingsTitle: '通用設置', clearOnSendLabel: '發送後自動修復中文輸入', clearOnSendDesc: '發送訊息後插入零寬字元，修復下次輸入首字母問題（僅 Gemini Business）', settingOn: '開', settingOff: '關', // 模型鎖定 modelLockTitle: '模型鎖定', modelLockLabel: '自動鎖定模型', modelLockDesc: '進入頁面後自動切換到指定模型', modelKeywordLabel: '模型關鍵字', modelKeywordPlaceholder: '例如：3 Pro', modelKeywordDesc: '用於匹配目標模型名稱', // 分類管理 categoryManage: '分類管理', categoryEmpty: '暫無分類，新增提示詞時會自動建立分類', rename: '重新命名', newCategoryName: '請輸入新的分類名稱：', categoryRenamed: '分類已重新命名', confirmDeleteCategory: '確定刪除該分類嗎？關聯的提示詞將移至「未分類」', categoryDeleted: '分類已刪除', // 語言設置 languageLabel: '介面語言', languageDesc: '設定面板顯示語言，即時生效', languageAuto: '跟隨系統', languageZhCN: '简体中文', languageZhTW: '繁體中文', languageEn: 'English', // 頁面寬度設置 pageWidthLabel: '頁面寬度', pageWidthDesc: '調整聊天頁面的寬度，即時生效', enablePageWidth: '啟用頁面加寬', widthValue: '寬度值', widthUnit: '單位', unitPx: '像素 (px)', unitPercent: '百分比 (%)', // 標籤頁設置 tabSettingsTitle: '標籤頁設置', openNewTabLabel: '新分頁開啟新對話', openNewTabDesc: '在面板頂部新增按鈕，點擊後在新分頁開啟新對話', newTabTooltip: '新分頁開啟對話', autoRenameTabLabel: '自動重新命名標籤頁', autoRenameTabDesc: '將瀏覽器標籤頁名稱改為當前對話名稱', renameIntervalLabel: '檢測頻率', renameIntervalDesc: '檢測對話名稱變化的間隔時間', secondsSuffix: '秒', showStatusLabel: '顯示生成狀態', showStatusDesc: '在標籤頁標題中顯示生成狀態圖示（⏳/✅）', showNotificationLabel: '傳送桌面通知', showNotificationDesc: '生成完成時傳送系统通知（僅 Gemini Business 有效）', autoFocusLabel: '自動視窗置頂', autoFocusDesc: '生成完成時自動將視窗帶回前台（僅 Gemini Business 有效）', privacyModeLabel: '隱私模式', privacyModeDesc: '隱藏真實對話標題，顯示偽裝標題（雙擊面板標題可快速切換）', privacyTitleLabel: '偽裝標題', privacyTitlePlaceholder: '如：Google、工作文件', titleFormatLabel: '標題格式', titleFormatDesc: '自訂標題格式，支援佔位符：{status}、{title}、{model}', notificationTitle: '✅ {site} 生成完成', notificationBody: '點擊查看結果', // 大綱功能 tabOutline: '大綱', outlineEmpty: '暫無大綱內容', outlineRefresh: '刷新', outlineSettings: '大綱設置', enableOutline: '啟用大綱', outlineMaxLevel: '顯示標題級別', outlineLevelAll: '全部 (1-6級)', outlineLevel1: '僅 1 級', outlineLevel2: '至 2 級', outlineLevel3: '至 3 級', // 刷新按鈕提示 refreshPrompts: '刷新提示詞', refreshOutline: '刷新大綱', refreshSettings: '刷新設置', // 大綱高級工具欄 outlineScrollBottom: '滾動到底部', outlineScrollTop: '滾動到頂部', outlineExpandAll: '展開全部', outlineCollapseAll: '折疊全部', outlineSearch: '搜尋大綱...', outlineSearchResult: '個結果', outlineLevelHint: '級標題', // Tab 顺序设置 tabOrderSettings: '介面排版', tabOrderDesc: '調整面板 Tab 的顯示順序', moveUp: '上移', moveDown: '下移', // 阅读导航設置 readingNavigationSettings: '閱讀導航', readingHistorySettings: '閱讀歷史', readingHistoryPersistence: '啟用閱讀歷史', readingHistoryPersistenceDesc: '自動記錄閱讀位置，下次開啟時恢復', autoRestore: '自動跳轉', autoRestoreDesc: '開啟頁面時自動跳轉到上次位置', readingHistoryCleanup: '歷史保留時間', readingHistoryCleanupDesc: '只保留最近幾天的閱讀進度 (-1 為永久)', daysSuffix: '天', cleanupInfinite: '永久', restoredPosition: '已恢復上次閱讀位置', cleanupDone: '已清理過期數據', // 大綱高級設置 outlineAutoUpdateLabel: '對話期間自動更新大綱', outlineAutoUpdateDesc: 'AI 生成內容時自動刷新目錄結構', outlineUpdateIntervalLabel: '更新檢測間隔 (秒)', outlineIntervalUpdated: '間隔已設為 {val} 秒', // 頁面顯示設置 pageDisplaySettings: '頁面顯示', // 其他設置 otherSettingsTitle: '其他設置', showCollapsedAnchorLabel: '折疊面板顯示錨點', showCollapsedAnchorDesc: '當面板收起時，在側邊浮動條中顯示錨點按鈕', preventAutoScrollLabel: '防止自動滾動', preventAutoScrollDesc: '當 AI 生成長內容時，阻止頁面自動滾動到底部，方便閱讀上文', // 介面排版開關 disableOutline: '禁用大綱', togglePrompts: '啟用/禁用提示詞' }, 'en': { panelTitle: 'Gemini Helper', tabPrompts: 'Prompts', tabSettings: 'Settings', searchPlaceholder: 'Search prompts...', addPrompt: 'Add New Prompt', allCategory: 'All', manageCategory: '⚙ Manage', currentPrompt: 'Current: ', scrollTop: 'Top', scrollBottom: 'Bottom', refresh: 'Refresh', collapse: 'Collapse', edit: 'Edit', delete: 'Delete', copy: 'Copy', drag: 'Drag', save: 'Save', cancel: 'Cancel', add: 'Add', title: 'Title', category: 'Category', categoryPlaceholder: 'e.g., Coding, Translation', content: 'Prompt Content', editPrompt: 'Edit Prompt', addNewPrompt: 'Add New Prompt', fillTitleContent: 'Please fill in title and content', promptUpdated: 'Prompt updated', promptAdded: 'Prompt added', deleted: 'Deleted', copied: 'Copied to clipboard', cleared: 'Content cleared', refreshed: 'Refreshed', orderUpdated: 'Order updated', inserted: 'Prompt inserted', scrolling: 'Page is scrolling, please wait...', noTextarea: 'Input not found, please click the input area first', confirmDelete: 'Delete this prompt?', // Settings panel settingsTitle: 'General Settings', clearOnSendLabel: 'Auto-fix Chinese input after send', clearOnSendDesc: 'Insert zero-width char after send to fix first letter issue (Gemini Business only)', settingOn: 'ON', settingOff: 'OFF', // Model Lock modelLockTitle: 'Model Lock', modelLockLabel: 'Auto Lock Model', modelLockDesc: 'Automatically switch to specified model upon entry', modelKeywordLabel: 'Model Keyword', modelKeywordPlaceholder: 'e.g., 3 Pro', modelKeywordDesc: 'Used to match target model name', // Category management categoryManage: 'Category Management', categoryEmpty: 'No categories yet. Categories are created when you add prompts.', rename: 'Rename', newCategoryName: 'Enter new category name:', categoryRenamed: 'Category renamed', confirmDeleteCategory: 'Delete this category? Associated prompts will be moved to "Uncategorized"', categoryDeleted: 'Category deleted', // Language settings languageLabel: 'Language', languageDesc: 'Set panel display language, takes effect immediately', languageAuto: 'Auto', languageZhCN: '简体中文', languageZhTW: '繁體中文', languageEn: 'English', // Page width settings pageWidthLabel: 'Page Width', pageWidthDesc: 'Adjust chat page width, takes effect immediately', enablePageWidth: 'Enable Page Widening', widthValue: 'Width Value', widthUnit: 'Unit', unitPx: 'Pixels (px)', unitPercent: 'Percentage (%)', // Tab Settings tabSettingsTitle: 'Tab Settings', openNewTabLabel: 'Open New Chat in New Tab', openNewTabDesc: 'Add a button to the panel header to open a new chat in a new tab', newTabTooltip: 'New Chat in New Tab', autoRenameTabLabel: 'Auto Rename Tab', autoRenameTabDesc: 'Change browser tab title to current conversation name', renameIntervalLabel: 'Detection Interval', renameIntervalDesc: 'Interval for detecting conversation name changes', secondsSuffix: 's', showStatusLabel: 'Show Status', showStatusDesc: 'Display generation status icon in tab title (⏳/✅)', showNotificationLabel: 'Desktop Notification', showNotificationDesc: 'Send system notification when generation completes (Gemini Business only)', autoFocusLabel: 'Auto Focus Window', autoFocusDesc: 'Bring window to front when generation completes (Gemini Business only)', privacyModeLabel: 'Privacy Mode', privacyModeDesc: 'Hide real conversation title, show decoy title (double-click panel header to toggle)', privacyTitleLabel: 'Decoy Title', privacyTitlePlaceholder: 'e.g., Google, Work Document', titleFormatLabel: 'Title Format', titleFormatDesc: 'Custom title format, supports placeholders: {status}, {title}, {model}', notificationTitle: '✅ {site} Generation Complete', notificationBody: 'Click to view results', tabOutline: 'Outline', outlineEmpty: 'No outline content', outlineRefresh: 'Refresh', outlineSettings: 'Outline Settings', enableOutline: 'Enable Outline', outlineMaxLevel: 'Heading Levels', outlineLevelAll: 'All (1-6)', outlineLevel1: 'Level 1 only', outlineLevel2: 'Up to Level 2', outlineLevel3: 'Up to Level 3', // Refresh button hints refreshPrompts: 'Refresh Prompts', refreshOutline: 'Refresh Outline', refreshSettings: 'Refresh Settings', // Outline advanced toolbar outlineScrollBottom: 'Scroll to bottom', outlineScrollTop: 'Scroll to top', outlineExpandAll: 'Expand all', outlineCollapseAll: 'Collapse all', outlineSearch: 'Search outline...', outlineSearchResult: 'result(s)', outlineLevelHint: 'headings', // Tab Order Settings tabOrderSettings: 'Interface Layout', tabOrderDesc: 'Adjust the display order of panel tabs', moveUp: 'Move Up', moveDown: 'Move Down', // Reading Navigation Settings readingNavigationSettings: 'Reading Navigation', anchorSettings: 'Reading History', anchorPersistence: 'Enable Reading History', anchorPersistenceDesc: 'Automatically remember reading position', anchorAutoRestore: 'Auto-Resume', anchorAutoRestoreDesc: 'Jump to last position on load', anchorCleanup: 'Retention Period', anchorCleanupDesc: 'Keep reading progress for days (-1 for infinite)', daysSuffix: 'Days', cleanupInfinite: 'Infinite', restoredPosition: 'Resumed last position', cleanupDone: 'Expired data cleaned', // Outline Advanced Settings outlineAutoUpdateLabel: 'Auto-update outline during conversation', outlineAutoUpdateDesc: 'Automatically refresh outline when AI generates content', outlineUpdateIntervalLabel: 'Update interval (seconds)', outlineIntervalUpdated: 'Interval set to {val} seconds', // Page Display Settings pageDisplaySettings: 'Page Display', // Other Settings otherSettingsTitle: 'Other Settings', showCollapsedAnchorLabel: 'Show anchor when collapsed', showCollapsedAnchorDesc: 'Display anchor button in sidebar when panel is collapsed', preventAutoScrollLabel: 'Prevent auto-scroll', preventAutoScrollDesc: 'Stop page from auto-scrolling to bottom during AI generation', // Interface Toggle disableOutline: 'Disable Outline', togglePrompts: 'Toggle Prompts' } }; // ============= 默认提示词库 ============= const DEFAULT_PROMPTS = [ { id: 'default_1', title: '代码优化', content: '请帮我优化以下代码，提高性能和可读性：\n\n', category: '编程' }, { id: 'default_2', title: '翻译助手', content: '请将以下内容翻译成中文，保持专业术语的准确性：\n\n', category: '翻译' }, ]; // ============= 页面宽度默认配置 ============= const DEFAULT_WIDTH_SETTINGS = { 'gemini': {enabled: false, value: '70', unit: '%'}, 'gemini-business': {enabled: false, value: '1600', unit: 'px'}, 'genspark': {enabled: false, value: '70', unit: '%'} }; // ============= 大纲功能默认配置 ============= const DEFAULT_OUTLINE_SETTINGS = { enabled: true, maxLevel: 6, // 显示到几级标题 (1-6) autoUpdate: true, updateInterval: 3 }; // 语言检测函数（支持手动设置） function detectLanguage() { // 优先使用用户手动设置的语言 const savedLang = GM_getValue(SETTING_KEYS.LANGUAGE, 'auto'); if (savedLang !== 'auto' && I18N[savedLang]) { return savedLang; } // 自动检测 const lang = navigator.language || navigator.userLanguage || 'en'; if (lang.startsWith('zh-TW') || lang.startsWith('zh-HK') || lang.startsWith('zh-Hant')) { return 'zh-TW'; } if (lang.startsWith('zh')) { return 'zh-CN'; } return 'en'; } // ==================== 站点适配器模式 (Site Adapter Pattern) ==================== /** * 站点适配器基类 * 添加新站点时，继承此类并实现所有抽象方法 */ class SiteAdapter { constructor() { this.textarea = null; } /** * 检测当前页面是否匹配该站点 * @returns {boolean} */ match() { throw new Error('必须实现 match()'); } /** * 返回站点标识符(用于配置存储) * @returns {string} */ getSiteId() { throw new Error('必须实现 getSiteId()'); } /** * 返回站点显示名称 * @returns {string} */ getName() { throw new Error('必须实现 getName()'); } /** * 获取当前会话ID (用于锚点持久化) * @returns {string} Session ID */ getSessionId() { // 优化实现：先去除 URL 中的查询参数 (?及后面内容)，再获取最后一段 const urlWithoutQuery = window.location.href.split('?')[0]; const parts = urlWithoutQuery.split('/').filter(p => p); return parts.length > 0 ? parts[parts.length - 1] : 'default'; } /** * 是否支持在新标签页打开新对话 * @returns {boolean} */ supportsNewTab() { return true; } /** * 获取新标签页打开的 URL * @returns {string} */ getNewTabUrl() { return window.location.origin; } /** * 是否支持标签页重命名 * @returns {boolean} */ supportsTabRename() { return true; } /** * 获取当前会话/对话名称（用于标签页重命名） * @returns {string|null} */ getSessionName() { // 默认实现：尝试从 document.title 中提取 const title = document.title; if (title) { // 去除站点名称后缀，如 "对话标题 - Gemini" const parts = title.split(' - '); if (parts.length > 1) { return parts.slice(0, -1).join(' - ').trim(); } return title.trim(); } return null; } /** * 判断当前是否处于新对话页面（未发起任何对话） * 新对话页面不应使用旧会话标题更新标签页、不应记录阅读历史 * @returns {boolean} */ isNewConversation() { return false; } /** * 检测 AI 是否正在生成响应 * @returns {boolean} */ isGenerating() { // 默认实现：子类应覆盖此方法 return false; } /** * 获取当前使用的模型名称 * @returns {string|null} */ getModelName() { // 默认实现：子类应覆盖此方法 return null; } /** * 获取网络监控配置（用于后台任务完成检测） * 子类可覆盖此方法提供站点特定的配置 * @returns {{ * urlPatterns: string[], // 要监控的 URL 模式（包含匹配） * silenceThreshold: number // 静默判定时间（毫秒） * }|null} 返回 null 表示不启用网络监控 */ getNetworkMonitorConfig() { return null; } /** * 返回站点主题色 * @returns {{primary: string, secondary: string}} */ getThemeColors() { throw new Error('必须实现 getThemeColors()'); } /** * 返回需要加宽的CSS选择器列表 * @returns {Array<{selector: string, property: string}>} */ getWidthSelectors() { return []; } /** * 返回输入框选择器列表 * @returns {string[]} */ getTextareaSelectors() { return []; } /** * 获取提交按钮选择器，可以匹配ID、类名、属性等选择器 * * @returns 提交按钮选择器 */ getSubmitButtonSelectors() { return []; } /** * 查找输入框元素 * 默认实现：遍历选择器查找 * @returns {HTMLElement|null} */ findTextarea() { for (const selector of this.getTextareaSelectors()) { const elements = document.querySelectorAll(selector); for (const element of elements) { if (this.isValidTextarea(element)) { this.textarea = element; return element; } } } return null; } /** * 验证输入框是否有效 * @param {HTMLElement} element * @returns {boolean} */ isValidTextarea(element) { return element.offsetParent !== null; } /** * 向输入框插入内容 * @param {string} content * @returns {Promise|boolean} */ insertPrompt(content) { throw new Error('必须实现 insertPrompt()'); } /** * 清空输入框内容 */ clearTextarea() { if (this.textarea) { this.textarea.value = ''; this.textarea.dispatchEvent(new Event('input', {bubbles: true})); } } /** * 获取滚动容器 * @returns {HTMLElement} */ getScrollContainer() { // 使用 DOMToolkit 查找滚动容器，传入站点特定选择器 return DOMToolkit.findScrollContainer({ selectors: [ '.chat-mode-scroller', 'main', '[role="main"]', '.conversation-container', '.chat-container' ] }); } /** * 获取当前视口中可见的锚点元素信息 (用于精准定位) * @returns {Object|null} { selector, offset, index } */ getVisibleAnchorElement() { const container = this.getScrollContainer(); if (!container) return null; const scrollTop = container.scrollTop; const selectors = this.getChatContentSelectors(); if (!selectors.length) return null; // 查找所有候选元素 const candidates = Array.from(container.querySelectorAll(selectors.join(', '))); if (!candidates.length) return null; let bestElement = null; for (let i = 0; i < candidates.length; i++) { const el = candidates[i]; const top = el.offsetTop; // 策略：找到最后一个"顶部"位于视口上方(或刚露出)的元素 = 用户当前正在阅读的起始元素 if (top <= scrollTop + 100) { bestElement = el; } else { // 后续元素都在视口下方，停止 break; } } if (!bestElement && candidates.length > 0) bestElement = candidates[0]; if (bestElement) { const offset = scrollTop - bestElement.offsetTop; let selector = ''; let id = bestElement.getAttribute('data-message-id') || bestElement.id; if (id) { selector = `[data-message-id="${id}"]`; if (!bestElement.matches(selector)) selector = `#${id}`; return {type: 'selector', selector: selector, offset: offset}; } else { const globalIndex = candidates.indexOf(bestElement); if (globalIndex !== -1) { // 增强：记录文本指纹，防止历史加载导致索引偏移 const textSignature = (bestElement.textContent || '').trim().substring(0, 50); return {type: 'index', index: globalIndex, offset: offset, textSignature: textSignature}; } } } return null; } /** * 根据保存的锚点信息恢复滚动 * @param {Object} anchorData * @returns {boolean} 是否成功恢复 */ restoreScroll(anchorData) { const container = this.getScrollContainer(); if (!container || !anchorData) return false; let targetElement = null; if (anchorData.type === 'selector' && anchorData.selector) { targetElement = container.querySelector(anchorData.selector); } else if (anchorData.type === 'index' && typeof anchorData.index === 'number') { const selectors = this.getChatContentSelectors(); const candidates = Array.from(container.querySelectorAll(selectors.join(', '))); // 优先尝试使用索引 if (candidates[anchorData.index]) { targetElement = candidates[anchorData.index]; // 如果有文本指纹，进行校验 if (anchorData.textSignature) { const currentText = (targetElement.textContent || '').trim().substring(0, 50); // 如果文本不匹配，说明索引可能偏移了（例如加载了历史消息） // 此时尝试全列表搜索 if (currentText !== anchorData.textSignature) { // console.log('Anchor index mismatch, searching by text signature...'); const found = candidates.find(c => (c.textContent || '').trim().substring(0, 50) === anchorData.textSignature); if (found) targetElement = found; } } } else { // 索引越界（可能消息被删了？），尝试文本搜索 if (anchorData.textSignature) { const found = candidates.find(c => (c.textContent || '').trim().substring(0, 50) === anchorData.textSignature); if (found) targetElement = found; } } } if (targetElement) { const targetTop = targetElement.offsetTop + (anchorData.offset || 0); container.scrollTo({top: targetTop, behavior: 'instant'}); return true; } return false; } /** * 页面加载完成后执行 * @param {Object} options - 配置项 { clearOnInit: boolean, lockModel: boolean } */ afterPropertiesSet(options = {}) { const {modelLockConfig} = options; // 默认初始化逻辑：如果有模型锁定配置且启用，尝试锁定模型 if (modelLockConfig && modelLockConfig.enabled) { console.log(`[${this.getName()}] Triggering auto model lock:`, modelLockConfig.keyword); this.lockModel(modelLockConfig.keyword); } } /** * 判断是否应该将样式注入到指定的 Shadow Host 中 * 用于解决 Shadow DOM 样式污染问题 */ shouldInjectIntoShadow(host) { return true; } /** * 获取对话历史容器的选择器 * @returns {string} CSS 选择器 */ getResponseContainerSelector() { return ''; } /** * 获取聊天内容元素的选择器列表 * 用于 MutationObserver 检测新消息，配合滚动锁定功能 * @returns {string[]} CSS 选择器列表 */ getChatContentSelectors() { return []; } /** * 从页面提取大纲（标题列表） * @param {number} maxLevel 最大标题级别 (1-6) * @returns {Array<{level: number, text: string, element: Element|null}>} */ extractOutline(maxLevel = 6) { return []; } /** * 是否支持滚动锁定功能 * @returns {boolean} */ supportsScrollLock() { return false; // 默认不支持，除非子类明确声明 } // ============= 新对话监听 ============= /** * 获取“新对话”按钮的选择器列表 * @returns {string[]} */ getNewChatButtonSelectors() { return []; } /** * 绑定新对话触发事件（点击按钮或快捷键） * @param {Function} callback - 触发时的回调函数 */ bindNewChatListeners(callback) { // 1. 快捷键监听 (Ctrl + Shift + O) document.addEventListener('keydown', (e) => { if (e.ctrlKey && e.shiftKey && (e.key === 'o' || e.key === 'O')) { console.log(`[${this.getName()}] New chat shortcut detected.`); // 给予一点延迟等待页面响应 setTimeout(callback, 500); } }); // 2. 按钮点击监听 document.addEventListener('click', (e) => { const selectors = this.getNewChatButtonSelectors(); if (selectors.length === 0) return; // 使用 composedPath() 以支持 Shadow DOM 中的元素匹配 const path = e.composedPath(); for (const target of path) { if (target === document || target === window) break; for (const selector of selectors) { if (target.matches && target.matches(selector)) { console.log(`[${this.getName()}] New chat button clicked.`); setTimeout(callback, 500); return; } } } }, true); // 使用捕获阶段确保捕获 } // ============= 模型锁定功能（抽象接口） ============= /** * 获取默认的模型锁定设置（每个站点可覆盖） * @returns {{ enabled: boolean, keyword: string }} */ getDefaultLockSettings() { return {enabled: false, keyword: ''}; } /** * 获取模型锁定配置 * 子类需要覆盖此方法提供具体配置 * @param {string} keyword - 目标模型关键字（由设置传入） * @returns {{ * targetModelKeyword: string, // 目标模型名称关键字（用于匹配） * selectorButtonSelectors: string[], // 模型选择器按钮的 CSS 选择器列表 * menuItemSelector: string, // 菜单项的 CSS 选择器 * checkInterval: number, // 检查间隔（毫秒） * maxAttempts: number, // 最大尝试次数 * menuRenderDelay: number // 菜单渲染等待时间（毫秒） * }|null} */ getModelSwitcherConfig(keyword) { return null; } /** /** * 通用模型锁定实现 * 基于 getModelSwitcherConfig() 返回的配置执行锁定逻辑 * @param {string} keyword - 目标模型关键字 * @param {Function} onSuccess 成功后的回调（可选） */ lockModel(keyword, onSuccess = null) { const config = this.getModelSwitcherConfig(keyword); if (!config) return; const { targetModelKeyword, selectorButtonSelectors, menuItemSelector, checkInterval = 1500, maxAttempts = 20, menuRenderDelay = 500 } = config; let attempts = 0; let isSelecting = false; // 辅助函数：标准化文本（小写 + 去空） const normalize = str => (str || '').toLowerCase().trim(); const target = normalize(targetModelKeyword); const timer = setInterval(() => { attempts++; if (attempts > maxAttempts) { console.warn(`Gemini Helper: Model lock timed out for "${targetModelKeyword}"`); clearInterval(timer); return; } if (isSelecting) return; // 1. 查找模型选择器按钮 const selectorBtn = this.findElementBySelectors(selectorButtonSelectors); if (!selectorBtn) return; // 2. 检查当前是否已经是目标模型（不区分大小写） const currentText = selectorBtn.textContent || selectorBtn.innerText || ''; if (normalize(currentText).includes(target)) { console.log(`Gemini Helper: Model is already locked to "${targetModelKeyword}"`); clearInterval(timer); if (onSuccess) onSuccess(); return; } // 3. 标记正在选择 isSelecting = true; // 4. 点击展开菜单 selectorBtn.click(); // 5. 等待菜单渲染后查找并点击目标项 setTimeout(() => { const menuItems = this.findAllElementsBySelector(menuItemSelector); // 如果找到了菜单项，说明菜单已渲染 if (menuItems.length > 0) { let found = false; for (const item of menuItems) { const itemText = item.textContent || item.innerText || ''; // 不区分大小写匹配 if (normalize(itemText).includes(target)) { item.click(); found = true; clearInterval(timer); console.log(`Gemini Helper: Switched to model "${targetModelKeyword}"`); // 延迟关闭菜单面板 setTimeout(() => { document.body.click(); if (onSuccess) onSuccess(); }, 100); break; } } if (!found) { // 菜单已打开但没有找到目标模型，停止重试以避免死循环闪烁 console.warn(`Gemini Helper: Target model "${targetModelKeyword}" not found in menu. Aborting.`); clearInterval(timer); // 关键：停止定时器 document.body.click(); // 关闭菜单 isSelecting = false; } } else { // 菜单可能未渲染或选择器不匹配，允许重试（直到超时） isSelecting = false; document.body.click(); // 尝试关闭以重置状态 } }, menuRenderDelay); }, checkInterval); } /** * 通过选择器列表查找单个元素（支持 Shadow DOM） * @param {string[]} selectors * @returns {Element|null} */ findElementBySelectors(selectors) { // 使用 DOMToolkit 进行 Shadow DOM 穿透查找 return DOMToolkit.query(selectors, {shadow: true}); } /** * 通过选择器查找所有元素（支持 Shadow DOM） * @param {string} selector * @returns {Element[]} */ findAllElementsBySelector(selector) { // 使用 DOMToolkit 进行 Shadow DOM 穿透查找（返回所有匹配） return DOMToolkit.query(selector, {all: true, shadow: true}); } } /** * Gemini 适配器（gemini.google.com） */ class GeminiAdapter extends SiteAdapter { match() { return window.location.hostname.includes('gemini.google') && !window.location.hostname.includes('business.gemini.google'); } getSiteId() { return 'gemini'; } getName() { return 'Gemini'; } getThemeColors() { return {primary: '#4285f4', secondary: '#34a853'}; } getNewTabUrl() { return 'https://gemini.google.com/app'; } isNewConversation() { const path = window.location.pathname; return path === '/app' || path === '/app/'; } getSessionName() { // 从侧边栏活动对话标题获取 const titleEl = document.querySelector('.conversation-title'); if (titleEl) { const name = titleEl.textContent?.trim(); if (name) return name; } // 回退到基类默认实现（从 document.title 提取） return super.getSessionName(); } getNewChatButtonSelectors() { return [ '.new-chat-button', '.chat-history-new-chat-button', '[aria-label="New chat"]', '[aria-label="新对话"]', '[aria-label="发起新对话"]', '[data-testid="new-chat-button"]', '[data-test-id="new-chat-button"]', '[data-test-id="expanded-button"]', // 临时对话按钮 '[data-test-id="temp-chat-button"]', 'button[aria-label="临时对话"]' ]; } getWidthSelectors() { return [ {selector: '.conversation-container', property: 'max-width'}, {selector: '.input-area-container', property: 'max-width'}, // 用户消息右对齐 { selector: 'user-query', property: 'max-width', value: '100%', noCenter: true, extraCss: 'display: flex !important; justify-content: flex-end !important;' }, { selector: '.user-query-container', property: 'max-width', value: '100%', noCenter: true, extraCss: 'justify-content: flex-end !important;' } ]; } getTextareaSelectors() { return [ 'div[contenteditable="true"].ql-editor', 'div[contenteditable="true"]', '[role="textbox"]', '[aria-label*="Enter a prompt"]' ]; } getSubmitButtonSelectors() { return [ 'button[aria-label*="Send"]', 'button[aria-label*="发送"]', '.send-button', '[data-testid*="send"]' ]; } isValidTextarea(element) { // 必须是可见的 contenteditable 元素 if (element.offsetParent === null) return false; const isContentEditable = element.getAttribute('contenteditable') === 'true'; const isTextbox = element.getAttribute('role') === 'textbox'; // 排除脚本自身的 UI if (element.closest('#gemini-helper-panel')) return false; return (isContentEditable || isTextbox) || element.classList.contains('ql-editor'); } insertPrompt(content) { const editor = this.textarea; if (!editor) return false; editor.focus(); try { // 先全选 document.execCommand('selectAll', false, null); // 然后插入新内容 const success = document.execCommand('insertText', false, content); if (!success) { throw new Error('execCommand returned false'); } } catch (e) { // 降级方案：直接替换内容，不叠加 editor.textContent = content; editor.dispatchEvent(new Event('input', {bubbles: true})); editor.dispatchEvent(new Event('change', {bubbles: true})); } return true; } clearTextarea() { if (this.textarea) { this.textarea.focus(); document.execCommand('selectAll', false, null); document.execCommand('delete', false, null); } } getResponseContainerSelector() { return 'infinite-scroller.chat-history'; } getChatContentSelectors() { return [ '.model-response-container', 'model-response', '.response-container', '[data-message-id]', 'message-content' ]; } extractOutline(maxLevel = 6) { const outline = []; const container = document.querySelector(this.getResponseContainerSelector()); if (!container) return outline; // Gemini 使用标准的 h1-h6 标签，带有 data-path-to-node 属性 const headingSelectors = []; for (let i = 1; i <= maxLevel; i++) { headingSelectors.push(`h${i}`); } const headings = container.querySelectorAll(headingSelectors.join(', ')); headings.forEach(heading => { const level = parseInt(heading.tagName.charAt(1), 10); if (level <= maxLevel) { outline.push({ level, text: heading.textContent.trim(), element: heading }); } }); return outline; } /** * 检测 AI 是否正在生成响应 * Gemini 标准版：检查输入框右下角是否显示停止图标 * @returns {boolean} */ isGenerating() { // 检查是否存在 fonticon="stop" 的 mat-icon（停止按钮） const stopIcon = document.querySelector('mat-icon[fonticon="stop"]'); if (stopIcon && stopIcon.offsetParent !== null) { return true; } return false; } /** * 获取当前使用的模型名称 * Gemini 标准版：从页面 UI 中提取模型名称 * @returns {string|null} */ getModelName() { // 从 .input-area-switch-label 的第一个 span 获取模型名称 const switchLabel = document.querySelector('.input-area-switch-label'); if (switchLabel) { const firstSpan = switchLabel.querySelector('span'); if (firstSpan && firstSpan.textContent) { const text = firstSpan.textContent.trim(); if (text.length > 0 && text.length <= 20) { return text; } } } return null; } // ============= 网络监控配置（用于后台任务完成检测） ============= /** * Gemini 普通版的网络监控配置 * 由于浏览器对后台标签页的 DOM 渲染节流，需要通过 Hook Fetch 从网络层检测任务完成 */ getNetworkMonitorConfig() { return { // 注意：不要使用 batchexecute，它是通用 RPC 方法，会在后台频繁调用 urlPatterns: ['BardFrontendService', 'StreamGenerate'], silenceThreshold: 3000 }; } // ============= 模型锁定配置 ============= getDefaultLockSettings() { return {enabled: false, keyword: ''}; } getModelSwitcherConfig(keyword) { return { targetModelKeyword: keyword, // 尝试匹配 Gemini 普通版的模型选择器 selectorButtonSelectors: [ '.input-area-switch-label', '.model-selector', '[data-test-id="model-selector"]', '[aria-label*="model"]', 'button[aria-haspopup="menu"]' ], menuItemSelector: '.mode-title, [role="menuitem"], [role="option"]', checkInterval: 1000, maxAttempts: 15, menuRenderDelay: 300 }; } } /** * Gemini Business 适配器（business.gemini.google） */ class GeminiBusinessAdapter extends SiteAdapter { match() { return window.location.hostname.includes('business.gemini.google'); } getSiteId() { return 'gemini-business'; } getName() { return 'Enterprise'; } getThemeColors() { return {primary: '#4285f4', secondary: '#34a853'}; } getNewTabUrl() { return 'https://business.gemini.google'; } supportsTabRename() { return true; } isNewConversation() { return !window.location.pathname.includes('/session/'); } // 排除侧边栏 (mat-sidenav, mat-drawer) 中的 Shadow DOM shouldInjectIntoShadow(host) { if (host.closest('mat-sidenav') || host.closest('mat-drawer') || host.closest('[class*="bg-sidebar"]')) return false; return true; } getNewChatButtonSelectors() { return ['.chat-button.list-item', 'button[aria-label="New chat"]', 'button[aria-label="新对话"]']; } getWidthSelectors() { // 辅助函数：生成带 scoped globalSelector 的配置 // noCenter: 不添加 margin-left/right: auto（用于容器类元素） const config = (selector, value, extraCss, noCenter = false) => ({ selector, globalSelector: `mat-sidenav-content ${selector}`, // 全局样式只针对主内容区 property: 'max-width', value, extraCss, noCenter }); return [ // 容器强制 100%，不需要居中（它们应该填充可用空间） config('mat-sidenav-content', '100%', undefined, true), config('.main.chat-mode', '100%', undefined, true), // 内容区域跟随配置（需要居中） config('ucs-summary'), config('ucs-conversation'), config('ucs-search-bar'), config('.summary-container.expanded'), config('.conversation-container'), // 输入框容器：不居中，使用 left/right 定位 config('.input-area-container', undefined, 'left: 0 !important; right: 0 !important;', true) ]; } getTextareaSelectors() { return [ 'div.ProseMirror', '.ProseMirror', '[contenteditable="true"]:not([type="search"])', '[role="textbox"]', 'textarea:not([type="search"])' ]; } getSubmitButtonSelectors() { return [ 'button[aria-label*="Submit"]', 'button[aria-label*="提交"]', '.send-button', '[data-testid*="send"]' ]; } isValidTextarea(element) { // 排除搜索框 if (element.type === 'search') return false; if (element.classList.contains('main-input')) return false; if (element.getAttribute('aria-label')?.includes('搜索')) return false; if (element.placeholder?.includes('搜索')) return false; // 排除脚本自己的 UI if (element.classList.contains('prompt-search-input')) return false; if (element.id === 'prompt-search') return false; if (element.closest('#gemini-helper-panel')) return false; // 必须是 contenteditable 或者 ProseMirror const isVisible = element.offsetParent !== null; const isContentEditable = element.getAttribute('contenteditable') === 'true'; const isProseMirror = element.classList.contains('ProseMirror'); return isVisible && (isContentEditable || isProseMirror || element.tagName === 'TEXTAREA'); } findTextarea() { // 使用 DOMToolkit.query + filter 在 Shadow DOM 中查找 // filter 参数实现了 isValidTextarea 的验证逻辑 const element = DOMToolkit.query(this.getTextareaSelectors(), { shadow: true, filter: (el) => this.isValidTextarea(el) }); if (element) { this.textarea = element; return element; } return super.findTextarea(); } insertPrompt(content) { return new Promise((resolve) => { const tryInsert = () => { // 重新获取一下，以防切页面后元素失效 const editor = this.textarea || this.findTextarea(); if (!editor) { console.warn('GeminiBusinessAdapter: Editor not found during insert.'); resolve(false); return; } this.textarea = editor; // 更新引用 editor.click(); editor.focus(); // 等待一小段时间后尝试插入 setTimeout(() => { try { // 先全选 document.execCommand('selectAll', false, null); // 插入新内容 const success = document.execCommand('insertText', false, content); if (!success) throw new Error('execCommand returned false'); resolve(true); } catch (e) { // 方法2: 直接操作 DOM (降级方案) let p = editor.querySelector('p'); if (!p) { p = document.createElement('p'); editor.appendChild(p); } p.textContent = content; // 触发各种事件以通知 ProseMirror 更新 const inputEvent = new InputEvent('input', { bubbles: true, cancelable: true, inputType: 'insertText', data: content }); editor.dispatchEvent(inputEvent); editor.dispatchEvent(new Event('change', {bubbles: true})); // 尝试触发 keyup 事件 editor.dispatchEvent(new KeyboardEvent('keyup', {bubbles: true})); resolve(true); } }, 100); }; if (this.textarea && document.body.contains(this.textarea)) { tryInsert(); } else { // 轮询等待元素出现 let attempts = 0; const maxAttempts = 15; const checkInterval = setInterval(() => { attempts++; if (this.findTextarea()) { clearInterval(checkInterval); tryInsert(); } else if (attempts >= maxAttempts) { clearInterval(checkInterval); resolve(false); } }, 500); } }); } clearTextarea() { if (this.textarea) { this.textarea.focus(); document.execCommand('selectAll', false, null); // 插入零宽空格替换旧内容（修复中文输入首字母问题） document.execCommand('insertText', false, '\u200B'); } } // 普通清空（不插入零宽字符） clearTextareaNormal() { if (this.textarea) { this.textarea.focus(); document.execCommand('selectAll', false, null); document.execCommand('delete', false, null); } } afterPropertiesSet(options = {}) { // 保存配置状态供其他方法使用 this.clearOnInit = options.clearOnInit; // 1. 调用基类通用逻辑（处理模型锁定） super.afterPropertiesSet(options); // 2. 处理企业版特有的初始化清除（如果未启用模型锁定或模型已锁定，这里先执行一次以防万一） // 注意：如果 trigger 了 lockModel，lockModel 回调里会再次执行。 if (this.clearOnInit) { this.clearTextarea(); } } // 覆盖 lockModel 以处理锁定后的清理 lockModel(keyword, onSuccess = null) { super.lockModel(keyword, () => { // 执行传入的回调 if (onSuccess) onSuccess(); // 执行企业版特定的清理：锁定模型后，重新插入零宽字符修复中文输入 // 这里的延迟是为了等待 UI 刷新（切换模型会导致输入框重建或重置） if (this.clearOnInit) { setTimeout(() => this.clearTextarea(), 300); } }); } /** * 检测 AI 是否正在生成响应 * Gemini Business：检查 Shadow DOM 中的 "Stop" 按钮或 loading 指示器 * @returns {boolean} */ isGenerating() { // 递归在 Shadow DOM 中搜索 const findInShadow = (root, depth = 0) => { if (depth > 10) return false; // 检查当前层级 const stopButton = root.querySelector( 'button[aria-label*="Stop"], button[aria-label*="停止"], ' + '[data-test-id="stop-button"], .stop-button, md-icon-button[aria-label*="Stop"]' ); if (stopButton && stopButton.offsetParent !== null) { return true; } const spinner = root.querySelector( 'mat-spinner, md-spinner, .loading-spinner, [role="progressbar"], ' + '.generating-indicator, .response-loading' ); if (spinner && spinner.offsetParent !== null) { return true; } // 递归搜索 Shadow DOM const elements = root.querySelectorAll('*'); for (const el of elements) { if (el.shadowRoot) { if (findInShadow(el.shadowRoot, depth + 1)) { return true; } } } return false; }; return findInShadow(document); } /** * 获取当前使用的模型名称 * Gemini Business：从 Shadow DOM 中提取模型名称 * @returns {string|null} */ getModelName() { // 递归在 Shadow DOM 中搜索模型选择器 const findInShadow = (root, depth = 0) => { if (depth > 10) return null; // 检查模型选择器 const modelSelectors = [ '#model-selector-menu-anchor', '.action-model-selector', '.model-selector', '[data-test-id="model-selector"]', '.current-model' ]; for (const selector of modelSelectors) { const el = root.querySelector(selector); if (el && el.textContent) { const text = el.textContent.trim(); // 提取模型关键字（支持带版本号的如"2.5 Pro"，也支持不带版本号的如"自动"） const modelMatch = text.match(/(\d+\.?\d*\s*)?(Pro|Flash|Ultra|Nano|Gemini|auto|自动)/i); if (modelMatch) { return modelMatch[0].trim(); } if (text.length <= 20 && text.length > 0) { return text; } } } // 递归搜索 Shadow DOM const elements = root.querySelectorAll('*'); for (const el of elements) { if (el.shadowRoot) { const result = findInShadow(el.shadowRoot, depth + 1); if (result) return result; } } return null; }; return findInShadow(document); } // ============= 模型锁定配置 ============= getDefaultLockSettings() { return {enabled: true, keyword: '3 Pro'}; } getModelSwitcherConfig(keyword) { return { targetModelKeyword: keyword || '3 Pro', selectorButtonSelectors: ['#model-selector-menu-anchor', '.action-model-selector'], menuItemSelector: 'md-menu-item', checkInterval: 1500, maxAttempts: 20, menuRenderDelay: 500 }; } getResponseContainerSelector() { // Gemini Business 使用 Shadow DOM，返回空字符串表示需要特殊处理 return ''; } getChatContentSelectors() { return [ '.model-response-container', '.message-content', '[data-message-id]', // 常见消息标识 'ucs-conversation-message', // 企业版特定 '.conversation-message' ]; } extractOutline(maxLevel = 6) { const outline = []; // 在 Shadow DOM 中递归查找所有标题 this.findHeadingsInShadowDOM(document, outline, maxLevel, 0); return outline; } // 在 Shadow DOM 中递归查找标题 findHeadingsInShadowDOM(root, outline, maxLevel, depth) { if (depth > 15) return; // 在当前层级查找标题（h1-h6） if (root !== document) { const headingSelector = Array.from({length: maxLevel}, (_, i) => `h${i + 1}`).join(', '); try { const headings = root.querySelectorAll(headingSelector); headings.forEach(heading => { // 只匹配包含 data-markdown-start-index 的标题（排除 logo 等非 AI 回复内容） // 标题内可能包含多个 span，需要遍历所有 span 并拼接文本 const spans = heading.querySelectorAll('span[data-markdown-start-index]'); if (spans.length > 0) { const level = parseInt(heading.tagName[1], 10); const text = Array.from(spans).map(s => s.textContent.trim()).join(''); if (text) { outline.push({level, text, element: heading}); } } }); } catch (e) { // 忽略选择器错误 } } // 递归查找 Shadow DOM const allElements = root.querySelectorAll('*'); for (const el of allElements) { if (el.shadowRoot) { this.findHeadingsInShadowDOM(el.shadowRoot, outline, maxLevel, depth + 1); } } } } /** * Genspark 适配器（genspark.ai） */ class GensparkAdapter extends SiteAdapter { match() { return window.location.hostname.includes('genspark.ai'); } getSiteId() { return 'genspark'; } getName() { return 'Genspark'; } getThemeColors() { return {primary: '#667eea', secondary: '#764ba2'}; } getNewTabUrl() { return 'https://www.genspark.ai'; } isNewConversation() { const path = window.location.pathname; return path === '/' || path === '/agents' || path === '/agents/'; } getWidthSelectors() { // Genspark 暂时不实现加宽，预留接口 return []; } getTextareaSelectors() { return [ 'textarea[name="query"]', 'textarea.search-input', '.textarea-wrapper textarea', 'textarea[placeholder*="Message"]' ]; } getSubmitButtonSelectors() { return [ 'button[aria-label*="Send"]', 'button[aria-label*="发送"]', '.send-button', '[data-testid*="send"]' ]; } getChatContentSelectors() { return [ '.message-content', '.markdown-body', '[data-testid="chat-message"]' ]; } insertPrompt(content) { if (!this.textarea) return false; const currentContent = this.textarea.value.trim(); this.textarea.value = currentContent ? (content + '\n\n' + currentContent) : (content + '\n\n'); this.adjustTextareaHeight(); this.textarea.dispatchEvent(new Event('input', {bubbles: true})); this.textarea.focus(); return true; } adjustTextareaHeight() { if (this.textarea) { this.textarea.style.height = 'auto'; this.textarea.style.height = Math.min(this.textarea.scrollHeight, 200) + 'px'; } } clearTextarea() { if (this.textarea) { this.textarea.value = ''; this.textarea.dispatchEvent(new Event('input', {bubbles: true})); this.adjustTextareaHeight(); } } supportsScrollLock() { return false; } } /** * 标签页重命名管理器 * 根据当前对话名称自动更新浏览器标签页标题 */ class TabRenameManager { constructor(adapter, settings, i18nFunc = null) { this.adapter = adapter; this.settings = settings; this.t = i18nFunc || ((key) => key); this.lastSessionName = null; this.intervalId = null; this.networkMonitor = null; this.isRunning = false; // AI 生成状态（简化的状态机） // 'idle' | 'generating' | 'completed' this._aiState = 'idle'; this._lastAiState = 'idle'; } /** * 启动自动重命名 */ start() { if (this.isRunning) return; if (!this.adapter.supportsTabRename()) return; this.isRunning = true; this.updateTabName(); // 启动网络监控（用于后台检测） this._networkConfig = this.adapter.getNetworkMonitorConfig?.(); if (typeof NetworkMonitor !== 'undefined' && this._networkConfig) { this._initNetworkMonitor(); } // 定时更新标签页标题 const intervalMs = (this.settings.tabSettings?.renameInterval || 5) * 1000; this.intervalId = setInterval(() => this.updateTabName(), intervalMs); } /** * 初始化网络监控 */ _initNetworkMonitor() { if (this.networkMonitor || !this._networkConfig) return; this.networkMonitor = new NetworkMonitor({ urlPatterns: this._networkConfig.urlPatterns, silenceThreshold: this._networkConfig.silenceThreshold || 3000, onStart: () => this._setAiState('generating'), onComplete: () => this._onAiComplete() }); this.networkMonitor.start(); } /** * 设置 AI 状态 */ _setAiState(state) { this._lastAiState = this._aiState; this._aiState = state; } /** * AI 任务完成处理（由 NetworkMonitor 触发） */ _onAiComplete() { const wasGenerating = this._aiState === 'generating'; this._setAiState('completed'); // 只在后台且之前正在生成时触发通知 if (wasGenerating && document.hidden) { this._sendCompletionNotification(); } // 强制更新标签页标题 this.updateTabName(true); } /** * 发送完成通知 */ _sendCompletionNotification() { const tabSettings = this.settings.tabSettings || {}; if (tabSettings.showNotification && typeof GM_notification !== 'undefined') { GM_notification({ title: this.t('notificationTitle').replace('{site}', this.adapter.getName()), text: this.lastSessionName || this.t('notificationBody'), timeout: 5000, onclick: () => window.focus() }); } if (tabSettings.autoFocus) { window.focus(); } } /** * 获取当前是否正在生成 */ _isGenerating() { // 如果已确认完成，返回 false if (this._aiState === 'completed') return false; // 否则结合网络状态和 DOM 检测 return this._aiState === 'generating' || this.adapter.isGenerating(); } /** * 停止网络监控 */ _stopNetworkMonitor() { if (this.networkMonitor) { this.networkMonitor.stop(); this.networkMonitor = null; } } /** * 停止自动重命名 */ stop() { if (!this.isRunning) return; this.isRunning = false; if (this.intervalId) { clearInterval(this.intervalId); this.intervalId = null; } this._stopNetworkMonitor(); } /** * 更新检测频率 */ setInterval(intervalSeconds) { if (!this.isRunning) return; const intervalMs = intervalSeconds * 1000; if (this.intervalId) { clearInterval(this.intervalId); } this.intervalId = setInterval(() => this.updateTabName(), intervalMs); } /** * 切换隐私模式 */ togglePrivacyMode() { const tabSettings = this.settings.tabSettings || {}; tabSettings.privacyMode = !tabSettings.privacyMode; this.settings.tabSettings = tabSettings; this.updateTabName(true); return tabSettings.privacyMode; } /** * 更新标签页名称 */ updateTabName(force = false) { if (!this.adapter.supportsTabRename()) return; const tabSettings = this.settings.tabSettings || {}; // 隐私模式 if (tabSettings.privacyMode) { document.title = tabSettings.privacyTitle || 'Google'; return; } // 获取会话名称（防止读取被污染的 title） const sessionName = this._getCleanSessionName(tabSettings); // 检查生成状态 const isGenerating = this._isGenerating(); // DOM 检测的状态变更通知（仅用于没有网络监控的站点） if (this._lastAiState === 'generating' && !isGenerating && document.hidden && this._aiState !== 'completed') { this._sendCompletionNotification(); } this._lastAiState = isGenerating ? 'generating' : 'idle'; // 构建标题 const statusPrefix = (tabSettings.showStatus !== false) ? (isGenerating ? '⏳ ' : '✅ ') : ''; const format = tabSettings.titleFormat || '{status}{title}'; const modelName = format.includes('{model}') ? (this.adapter.getModelName() || '') : ''; let finalTitle = format .replace('{status}', statusPrefix) .replace('{title}', sessionName || this.adapter.getName()) .replace('{model}', modelName ? `[${modelName}] ` : '') .replace(/\s+/g, ' ') .trim(); if (finalTitle && (force || finalTitle !== document.title)) { document.title = finalTitle; } } /** * 获取干净的会话名称（过滤被污染的标题） */ _getCleanSessionName(tabSettings) { // 新对话页面：清除旧会话标题，避免使用之前的标题 if (this.adapter.isNewConversation()) { this.lastSessionName = null; return null; } let sessionName = this.adapter.getSessionName(); // 检测污染 const isPolluted = (name) => { if (!name) return false; if (/^[⏳✅]/.test(name)) return true; if (/\[[\w\s.]+\]/.test(name)) return true; if (name === (tabSettings.privacyTitle || 'Google')) return true; return false; }; if (isPolluted(sessionName)) { sessionName = this.lastSessionName; } else if (sessionName && sessionName !== this.lastSessionName) { this.lastSessionName = sessionName; } return this.lastSessionName; } /** * 获取当前状态 */ isActive() { return this.isRunning; } } /** * 站点注册表 * 管理所有站点适配器，提供统一的访问接口 */ class SiteRegistry { constructor() { this.adapters = []; this.currentAdapter = null; } // 注册适配器 register(adapter) { this.adapters.push(adapter); } // 检测并返回匹配的适配器 detect() { for (const adapter of this.adapters) { if (adapter.match()) { this.currentAdapter = adapter; return adapter; } } return null; } // 获取当前适配器 getCurrent() { return this.currentAdapter; } } // ==================== 核心逻辑 ==================== // HTML 创建函数 (使用 DOMToolkit) function createElement(tag, properties = {}, textContent = '') { return DOMToolkit.create(tag, properties, textContent); } // 清空元素内容 (使用 DOMToolkit) function clearElement(element) { DOMToolkit.clear(element); } /** * 页面宽度样式管理器 * 负责动态注入和移除页面宽度样式 */ /** * 页面宽度样式管理器 * 负责动态注入和移除页面宽度样式，支持 Shadow DOM */ class WidthStyleManager { constructor(siteAdapter, widthConfig) { this.siteAdapter = siteAdapter; this.widthConfig = widthConfig; this.styleElement = null; this.processedShadowRoots = new WeakSet(); this.observer = null; this.shadowCheckInterval = null; } apply() { // 1. 处理主文档样式 if (this.styleElement) { this.styleElement.remove(); this.styleElement = null; } const css = this.generateCSS(); if (this.widthConfig && this.widthConfig.enabled) { this.styleElement = document.createElement('style'); this.styleElement.id = 'gemini-helper-width-styles'; this.styleElement.textContent = css; document.head.appendChild(this.styleElement); // 启动 Shadow DOM 注入逻辑 this.startShadowInjection(css); } else { // 如果禁用了，也要清理 Shadow DOM 中的样式 this.stopShadowInjection(); this.clearShadowStyles(); } } generateCSS() { const globalWidth = `${this.widthConfig.value}${this.widthConfig.unit}`; const selectors = this.siteAdapter.getWidthSelectors(); return selectors.map((config) => { const {selector, globalSelector, property, value, extraCss, noCenter} = config; const params = { finalWidth: value || globalWidth, targetSelector: globalSelector || selector, // 优先使用全局特定选择器 property, extra: extraCss || '', centerCss: noCenter ? '' : 'margin-left: auto !important; margin-right: auto !important;' }; return `${params.targetSelector} { ${params.property}: ${params.finalWidth} !important; ${params.centerCss} ${params.extra} }`; }).join('\n'); } updateConfig(widthConfig) { this.widthConfig = widthConfig; this.apply(); } // ============= Shadow DOM 支持 ============= startShadowInjection(css) { // Shadow CSS 需要重新生成，因为不能使用带 ancestor 的 globalSelector // Shadow DOM 内部必须使用原始 selector，但包含同样的样式规则 const shadowCss = this.generateShadowCSS(); // 立即执行一次全量检查 this.injectToAllShadows(shadowCss); // 使用定时器定期检查 if (this.shadowCheckInterval) clearInterval(this.shadowCheckInterval); this.shadowCheckInterval = setInterval(() => { this.injectToAllShadows(shadowCss); }, 1000); } generateShadowCSS() { const globalWidth = `${this.widthConfig.value}${this.widthConfig.unit}`; const selectors = this.siteAdapter.getWidthSelectors(); return selectors.map((config) => { const {selector, property, value, extraCss, noCenter} = config; // Shadow DOM 中只使用原始 selector (不带父级限定)，靠 JS 过滤来保证安全 const finalWidth = value || globalWidth; const extra = extraCss || ''; const centerCss = noCenter ? '' : 'margin-left: auto !important; margin-right: auto !important;'; return `${selector} { ${property}: ${finalWidth} !important; ${centerCss} ${extra} }`; }).join('\n'); } stopShadowInjection() { if (this.shadowCheckInterval) { clearInterval(this.shadowCheckInterval); this.shadowCheckInterval = null; } } injectToAllShadows(css) { if (!document.body) return; const siteAdapter = this.siteAdapter; const processedShadowRoots = this.processedShadowRoots; // 使用 DOMToolkit.walkShadowRoots 遍历所有 Shadow Root DOMToolkit.walkShadowRoots((shadowRoot, host) => { // 检查是否应该注入到该 Shadow DOM（通过 Adapter 过滤，例如排除侧边栏） if (host && !siteAdapter.shouldInjectIntoShadow(host)) { return; } // 使用 DOMToolkit.cssToShadow 注入样式 DOMToolkit.cssToShadow(shadowRoot, css, 'gemini-helper-width-shadow-style'); processedShadowRoots.add(shadowRoot); }); } clearShadowStyles() { if (!document.body) return; const processedShadowRoots = this.processedShadowRoots; // 使用 DOMToolkit.walkShadowRoots 遍历所有 Shadow Root DOMToolkit.walkShadowRoots((shadowRoot) => { const style = shadowRoot.getElementById('gemini-helper-width-shadow-style'); if (style) style.remove(); processedShadowRoots.delete(shadowRoot); }); } } // ==================== 滚动锁定管理器 ==================== /** * 滚动锁定管理器 * 通过劫持原生滚动 API 和 MutationObserver 修正来实现防自动滚动 */ class ScrollLockManager { constructor(siteAdapter) { this.siteAdapter = siteAdapter; this.enabled = false; this.originalApis = null; this.observer = null; this.cleanupInterval = null; this.lastScrollY = window.scrollY; } setEnabled(enabled) { if (this.enabled === enabled) return; this.enabled = enabled; if (enabled) { this.enable(); } else { this.disable(); } } enable() { console.log('Gemini Helper: Enabling Scroll Lock System'); this.hijackApis(); this.startObserver(); this.startScrollListener(); } disable() { console.log('Gemini Helper: Disabling Scroll Lock System'); this.restoreApis(); this.stopObserver(); this.stopScrollListener(); } hijackApis() { if (this.originalApis) return; // 已经劫持 // 保存原始 API this.originalApis = { scrollIntoView: Element.prototype.scrollIntoView, scrollTo: window.scrollTo, // 保存属性描述符以便恢复 scrollTopDescriptor: Object.getOwnPropertyDescriptor(Element.prototype, 'scrollTop') || Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'scrollTop') }; const self = this; // 1. 劫持 Element.prototype.scrollIntoView Element.prototype.scrollIntoView = function (options) { // 检查是否包含绕过锁定的标志 (即使是 boolean or object) const shouldBypass = options && typeof options === 'object' && options.__bypassLock; if (self.enabled && self.shouldBlockScroll() && !shouldBypass) { // console.log('Gemini Helper: Blocked scrollIntoView'); return; } // 移除自定义属性以防传给原生 API 报错（虽然通常不会） if (shouldBypass) { // 克隆 options 以免修改原对象，或者直接删除 key // 原生 scrollIntoView 会忽略未知属性 } return self.originalApis.scrollIntoView.call(this, options); }; // 2. 劫持 window.scrollTo window.scrollTo = function (x, y) { // 有时 y 可能是 options 对象 let targetY = y; if (typeof x === 'object' && x !== null) { targetY = x.top; } // 只有当向下大幅滚动时才拦截 (防止系统自动拉到底) // 阈值设为 50px，避免误杀微小调整 if (self.enabled && self.shouldBlockScroll() && typeof targetY === 'number' && targetY > window.scrollY + 50) { // console.log('Gemini Helper: Blocked window.scrollTo (Auto-scroll attempt)'); return; } return self.originalApis.scrollTo.apply(this, arguments); }; // 3. 劫持 scrollTop setter (许多框架通过设置 scrollTop 来滚动) if (this.originalApis.scrollTopDescriptor) { Object.defineProperty(Element.prototype, 'scrollTop', { get: function () { return self.originalApis.scrollTopDescriptor.get ? self.originalApis.scrollTopDescriptor.get.call(this) : this.files; // fallback (impossible normally) }, set: function (value) { if (self.enabled && self.shouldBlockScroll() && value > this.scrollTop + 50) { // console.log('Gemini Helper: Blocked scrollTop setter'); return; } if (self.originalApis.scrollTopDescriptor.set) { self.originalApis.scrollTopDescriptor.set.call(this, value); } }, configurable: true }); } } restoreApis() { if (!this.originalApis) return; Element.prototype.scrollIntoView = this.originalApis.scrollIntoView; window.scrollTo = this.originalApis.scrollTo; if (this.originalApis.scrollTopDescriptor) { Object.defineProperty(Element.prototype, 'scrollTop', this.originalApis.scrollTopDescriptor); } this.originalApis = null; } // 判断是否应该阻止滚动 // 核心逻辑：虽然功能开启，但如果用户已经滚到底部了，我们其实应该允许跟随（就像终端一样） // 不过根据用户需求，既然叫 "防止自动滚动"，还是激进一点：只要开启就尽量阻止非用户触发的大幅向下滚动 shouldBlockScroll() { // 只有当我们不在底部时，才强力阻止？或者一直阻止？ // 为了最好的体验：如果用户已经在底部，应该允许新内容把页面撑长，但不应该发生"跳跃" // 用户的脚本逻辑很简单：开启就阻止。我们保持一致。 return true; } startScrollListener() { // 记录用户最后滚动位置，用于自动修正 const onScroll = () => { // 如果是用户手动滚动（或者未被劫持的滚动），更新位置 // 这里很难区分，但我们主要通过 MutationObserver 来回滚异常位置 if (this.enabled) { // 只有在未被拦截的情况下，我们才认为这是"合法"的位置更新 // 在 scroll 事件中很难拦截，只能事后修正 // 这里我们只更新 lastScrollY，具体修正在 Observer 中 this.lastScrollY = window.scrollY; } }; window.addEventListener('scroll', onScroll, {passive: true}); this.onScrollHandler = onScroll; } stopScrollListener() { if (this.onScrollHandler) { window.removeEventListener('scroll', this.onScrollHandler); this.onScrollHandler = null; } } startObserver() { // 监听 DOM 变化，如果发现非用户意图的滚动跳变，强制回滚 this.observer = new MutationObserver((mutations) => { if (!this.enabled) return; let hasNewContent = false; const contentSelectors = this.siteAdapter.getChatContentSelectors(); if (contentSelectors.length === 0) return; mutations.forEach(mutation => { if (mutation.type === 'childList' && mutation.addedNodes.length > 0) { // 检查是否有新消息节点 for (const node of mutation.addedNodes) { if (node.nodeType === 1) { // Element // 使用适配器提供的选择器判断 for (const sel of contentSelectors) { if (node.matches && node.matches(sel) || (node.querySelector && node.querySelector(sel))) { hasNewContent = true; break; } } } if (hasNewContent) break; } } }); if (hasNewContent) { // 如果有新内容插入，立刻检查滚动位置是否发生了非预期的改变 // 这里的逻辑是：如果当前位置比记录的 lastScrollY 大了很多，说明发生了自动滚动 // 我们强制滚回去 const currentScroll = window.scrollY; // 阈值 100px if (currentScroll > this.lastScrollY + 100) { // console.log('Gemini Helper: Detected unblocked auto-scroll, changing back.'); window.scrollTo(this.lastScrollY, 0); // 使用原始 API 已经被劫持，这里需要 bypass 吗？ // 实际上我们的劫持逻辑里 window.scrollTo 会调用 apply(this, arguments)， // 但我们的劫持逻辑是阻止"向下"滚动。如果是"向上"回滚 (current > last, so set to last is moving up)，是被允许的。 // 稍微解释：lastScrollY 是 1000，current 是 2000。window.scrollTo(1000) 是向上，允许。 // 所以直接调用 window.scrollTo 即可。 } } }); this.observer.observe(document.body, { childList: true, subtree: true }); // 定时器保底 this.cleanupInterval = setInterval(() => { if (this.enabled) { const current = window.scrollY; if (current > this.lastScrollY + 200) { // 大幅跳变，回滚 window.scrollTo(this.lastScrollY, 0); } else { // 小幅变动，认为是合法阅读，更新基准（防止页面慢慢变长后滚不下去） this.lastScrollY = current; } } }, 500); } stopObserver() { if (this.observer) { this.observer.disconnect(); this.observer = null; } if (this.cleanupInterval) { clearInterval(this.cleanupInterval); this.cleanupInterval = null; } } } // ==================== 核心管理类 ==================== /** * 滚动管理器 * 抽象不同站点的滚动容器差异 */ class ScrollManager { constructor(siteAdapter) { this.siteAdapter = siteAdapter; } get container() { // 确保获取的是最新的容器实例 return this.siteAdapter.getScrollContainer(); } get scrollTop() { return this.container ? this.container.scrollTop : 0; } set scrollTop(val) { if (this.container) this.container.scrollTop = val; } get scrollHeight() { return this.container ? this.container.scrollHeight : 0; } get clientHeight() { return this.container ? this.container.clientHeight : 0; } scrollTo(options) { if (this.container) { try { this.container.scrollTo(options); } catch (e) { // 兼容部分旧浏览器不支持 options 对象 if (options.top !== undefined) { this.container.scrollTop = options.top; } } } } // 检查是否在底部区域 isAtBottom(threshold = 100) { const c = this.container; if (!c) return false; return c.scrollHeight - c.scrollTop - c.clientHeight <= threshold; } } /** * 阅读进度管理器 (Auto-Resume) * 负责自动保存和恢复阅读位置 */ class ReadingProgressManager { constructor(settings, scrollManager, i18nFunc) { this.settings = settings; // 引用传递，保持最新 this.scrollManager = scrollManager; this.t = i18nFunc; this.lastSaveTime = 0; this.isRecording = false; // 默认为 false，通过 startRecording 开启 } startRecording() { if (this.isRecording) return; this.isRecording = true; this.scrollHandler = () => this.handleScroll(); // 监听真正的滚动容器（各站点通过 SiteAdapter 适配） const container = this.scrollManager.container; if (container) { container.addEventListener('scroll', this.scrollHandler, {passive: true}); this.listeningContainer = container; // 保存引用以便移除 } // 同时保留 window 监听作为兜底（某些站点可能用 window 滚动） window.addEventListener('scroll', this.scrollHandler, {capture: true, passive: true}); } stopRecording() { if (!this.isRecording) return; this.isRecording = false; if (this.scrollHandler) { // 移除容器监听 if (this.listeningContainer) { this.listeningContainer.removeEventListener('scroll', this.scrollHandler); this.listeningContainer = null; } // 移除 window 监听 window.removeEventListener('scroll', this.scrollHandler, {capture: true}); this.scrollHandler = null; } } handleScroll() { if (!this.settings || !this.settings.readingHistory || !this.settings.readingHistory.persistence) return; const now = Date.now(); if (now - this.lastSaveTime > 1000) { this.saveProgress(); this.lastSaveTime = now; } } getKey() { // 使用 siteAdapter 提供的统一 Session ID，保持 Key 简洁且与其他功能逻辑一致 const sessionId = this.scrollManager.siteAdapter.getSessionId(); const siteId = this.scrollManager.siteAdapter.getSiteId(); return `${siteId}:${sessionId}`; } saveProgress() { if (!this.isRecording) return; // 新对话页面不记录阅读历史 if (this.scrollManager.siteAdapter.isNewConversation()) return; const scrollTop = this.scrollManager.scrollTop; if (scrollTop < 0) return; const key = this.getKey(); // 获取基于内容的锚点信息 (增强准确性) let anchorInfo = {}; try { if (this.scrollManager.siteAdapter.getVisibleAnchorElement) { anchorInfo = this.scrollManager.siteAdapter.getVisibleAnchorElement(); } } catch (err) { // console.error('Error getting visible anchor element:', err); } const data = { top: scrollTop, ts: Date.now(), ...((anchorInfo) ? anchorInfo : {}) }; const allData = GM_getValue('gemini_reading_progress', {}); allData[key] = data; GM_setValue('gemini_reading_progress', allData); } /** * 恢复阅读进度 (包含智能回溯逻辑) * @param {Function} showToastFunc - 用于显示进度提示的回调 * @returns {Promise} 是否恢复成功 */ async restoreProgress(showToastFunc) { if (!this.settings.readingHistory.autoRestore) return false; const key = this.getKey(); const allData = GM_getValue('gemini_reading_progress', {}); const data = allData[key]; if (!data) return false; // scrollManager.container 是 getter，每次访问自动获取最新容器 const scrollContainer = this.scrollManager.container; if (!scrollContainer) return false; // 智能回溯恢复逻辑 return new Promise((resolve) => { let historyLoadAttempts = 0; const maxHistoryLoadAttempts = 5; let lastScrollHeight = 0; // 用于检测历史是否加载成功 const tryScroll = (attempts = 0) => { if (attempts > 30) { // 超过最大尝试次数，使用像素位置作为最终降级 if (data.top !== undefined && scrollContainer.scrollHeight >= data.top) { this.scrollManager.scrollTo({top: data.top, behavior: 'instant'}); this.restoredTop = data.top; resolve(true); } else { resolve(false); } return; } // 1. 尝试基于内容的精准恢复 let contentRestored = false; try { if (data.type && this.scrollManager.siteAdapter.restoreScroll) { contentRestored = this.scrollManager.siteAdapter.restoreScroll(data); } } catch (err) { console.error('Error restoring content anchor:', err); } if (contentRestored) { // 内容恢复成功 this.restoredTop = scrollContainer.scrollTop; resolve(true); return; } // 2. 内容恢复失败，需要尝试加载更多历史 const currentScrollHeight = scrollContainer.scrollHeight; const heightChanged = currentScrollHeight !== lastScrollHeight; lastScrollHeight = currentScrollHeight; // 判断是否需要/可以继续加载历史 const hasContentAnchor = data.type && (data.textSignature || data.selector); const needsMoreHistory = hasContentAnchor || (data.top !== undefined && currentScrollHeight < data.top); const canLoadMore = historyLoadAttempts < maxHistoryLoadAttempts; if (needsMoreHistory && canLoadMore) { // 触发历史加载 if (showToastFunc) showToastFunc(`正在加载历史会话 (${historyLoadAttempts + 1}/${maxHistoryLoadAttempts})...`); // 滚动到顶部触发懒加载 this.scrollManager.scrollTo({top: 0, behavior: 'instant'}); historyLoadAttempts++; // 等待页面加载新内容 setTimeout(() => tryScroll(attempts + 1), 2000); } else if (data.top !== undefined && currentScrollHeight >= data.top) { // 没有内容锚点或已用尽回溯机会，但像素位置可用 this.scrollManager.scrollTo({top: data.top, behavior: 'instant'}); this.restoredTop = data.top; resolve(true); } else if (!canLoadMore && hasContentAnchor) { // 回溯机会用尽但仍有内容锚点，尝试最后一次快速重试 setTimeout(() => tryScroll(attempts + 1), 500); } else { // 无法恢复 resolve(false); } }; tryScroll(); }); } // 清理逻辑 cleanup() { const lastRun = GM_getValue('gemini_progress_cleanup_last_run', 0); const now = Date.now(); if (now - lastRun < 24 * 60 * 60 * 1000) return; // 每天一次 const days = this.settings.readingHistory.cleanupDays || 7; if (days === -1) return; const expireTime = days * 24 * 60 * 60 * 1000; const allData = GM_getValue('gemini_reading_progress', {}); let changed = false; Object.keys(allData).forEach(k => { if (now - allData[k].ts > expireTime) { delete allData[k]; changed = true; } }); if (changed) GM_setValue('gemini_reading_progress', allData); GM_setValue('gemini_progress_cleanup_last_run', now); } } /** * 智能锚点管理器 (Smart Session Anchor) * 负责会话内的临时跳转锚点 */ /** * 智能锚点管理器 (Smart Session Anchor) * 负责会话内的临时跳转锚点 */ class AnchorManager { constructor(scrollManager, i18nFunc) { this.scrollManager = scrollManager; this.t = i18nFunc; // 双位置交换：类似 git switch - this.previousAnchor = null; // 上一个位置（跳转前） this.currentAnchor = null; // 当前锚点（跳转目标） this.onAnchorChange = null; // UI 更新回调 } // 设置回调 bindUI(callback) { this.onAnchorChange = callback; } // 获取当前位置的完整锚点信息 _captureCurrentPosition() { let anchorInfo = {}; try { if (this.scrollManager.siteAdapter.getVisibleAnchorElement) { anchorInfo = this.scrollManager.siteAdapter.getVisibleAnchorElement(); } } catch (err) { } return { top: this.scrollManager.scrollTop, ts: Date.now(), ...anchorInfo }; } // 记录锚点 (跳转前调用，保存当前位置) setAnchor(top) { let anchorInfo = {}; try { if (this.scrollManager.siteAdapter.getVisibleAnchorElement) { anchorInfo = this.scrollManager.siteAdapter.getVisibleAnchorElement(); } } catch (err) { } // 保存当前位置为"上一个锚点" this.previousAnchor = { top: top, ts: Date.now(), ...anchorInfo }; if (this.onAnchorChange) this.onAnchorChange(true); } // 跳转到锚点（同时实现位置交换，支持来回跳转） backToAnchor() { if (!this.previousAnchor) return false; const scrollContainer = this.scrollManager.container; if (!scrollContainer) return false; // 1. 先保存当前位置（跳转后可以再跳回来） const currentPos = this._captureCurrentPosition(); // 2. 尝试跳转到 previousAnchor let jumped = false; // 2.1 尝试基于内容的精准恢复 try { if (this.previousAnchor.type && this.scrollManager.siteAdapter.restoreScroll) { jumped = this.scrollManager.siteAdapter.restoreScroll(this.previousAnchor); } } catch (err) { console.error('Error restoring anchor:', err); } // 2.2 降级：像素位置 if (!jumped && this.previousAnchor.top !== undefined) { this.scrollManager.scrollTo({top: this.previousAnchor.top, behavior: 'smooth'}); jumped = true; } if (jumped) { // 3. 交换位置：实现来回跳转 // 原来的 previousAnchor 变成 currentAnchor（备用） // 刚才的位置变成新的 previousAnchor（下次跳回去） this.currentAnchor = this.previousAnchor; this.previousAnchor = currentPos; } return jumped; } // 检查是否有锚点 hasAnchor() { return this.previousAnchor !== null; } // 重置锚点（用于会话切换） reset() { this.previousAnchor = null; this.currentAnchor = null; if (this.onAnchorChange) this.onAnchorChange(false); } } /** * 通用大纲管理器 * 负责大纲的 UI 渲染、交互和状态管理 * 数据源由外部适配器提供 */ class OutlineManager { constructor(config) { this.container = config.container; this.settings = config.settings; this.onSettingsChange = config.onSettingsChange; this.onJumpBefore = config.onJumpBefore; // 跳转前回调，用于保存锚点 this.t = config.i18n || ((k) => k); this.state = { tree: null, treeKey: '', minLevel: 1, expandLevel: this.settings.outline?.maxLevel || 6, levelCounts: {}, isAllExpanded: false, rawOutline: [], // 搜索相关状态 searchQuery: '', searchLevelManual: false, // 标记用户是否在搜索时手动调整了层级 searchResults: null, // 存储搜索匹配信息 { matchedIds: Set, relevantIds: Set } preSearchState: null, // 搜索前的状态快照 }; // 自动更新相关 this.observer = null; this.updateDebounceTimer = null; this.isActive = false; // 标记 Tab 是否激活 this.init(); } init() { this.createUI(); this.updateAutoUpdateState(); } setActive(active) { this.isActive = active; this.updateAutoUpdateState(); } updateAutoUpdateState() { // 只有当：大纲功能开启 AND 自动更新开启 AND Tab处于激活状态 时才启用 Observer const shouldEnable = this.settings.outline?.enabled && this.settings.outline?.autoUpdate && this.isActive; if (shouldEnable) { this.startObserver(); } else { this.stopObserver(); } } startObserver() { if (this.observer) return; // 找到聊天记录容器作为观察目标 // 既然我们增加了 getChatContentSelectors，也许可以用那个？ // 但对于大纲来说，只要 DOM 变了就可能产生新标题。观察 body 可能最稳妥但性能最差。 // 观察聊天容器是折中方案。 // 复用 SiteAdapter 的 getScrollContainer 得到的通常是主滚动容器， // 或者用 getResponseContainerSelector // 鉴于 Gemini Business 返回空，我们尝试观察 document.body，加上防抖，性能应该可控。 this.observer = new MutationObserver(() => { this.triggerAutoUpdate(); }); this.observer.observe(document.body, { childList: true, subtree: true, characterData: true // 标题文字变化也要检测 }); console.log('Gemini Helper: Outline Auto-Update Started'); } stopObserver() { if (this.observer) { this.observer.disconnect(); this.observer = null; console.log('Gemini Helper: Outline Auto-Update Stopped'); } if (this.updateDebounceTimer) { clearTimeout(this.updateDebounceTimer); this.updateDebounceTimer = null; } } triggerAutoUpdate() { const interval = (this.settings.outline?.updateInterval || 5) * 1000; // 如果已经在等待更新，不需要重置定时器（这是 throttle/debounce 的关键区别） // 我们希望：只要有请求，就确保在未来某个时刻执行，但不要频繁执行 // 策略：如果 timer 存在，说明已经安排了更新，什么都不做（让它在原定时间触发） // 只有 timer 不存在时，才设置一个新的 if (!this.updateDebounceTimer) { this.updateDebounceTimer = setTimeout(() => { this.executeAutoUpdate(); }, interval); } } executeAutoUpdate() { if (this.updateDebounceTimer) { clearTimeout(this.updateDebounceTimer); this.updateDebounceTimer = null; } // 触发更新回调（在 GeminiHelper 中定义，实际调用 refreshOutline） if (this.config && this.config.onAutoUpdate) { this.config.onAutoUpdate(); } // 发送自定义事件通知外部刷新 window.dispatchEvent(new CustomEvent('gemini-helper-outline-auto-refresh')); } createUI() { const container = this.container; clearElement(container); const content = createElement('div', {className: 'outline-content'}); // 固定工具栏 const toolbar = createElement('div', {className: 'outline-fixed-toolbar'}); // 第一行：按钮和搜索占位 const row1 = createElement('div', {className: 'outline-toolbar-row'}); // 滚动按钮 const scrollBtn = createElement('button', { className: 'outline-toolbar-btn', id: 'outline-scroll-btn', title: this.t('outlineScrollBottom') }, '⬇'); scrollBtn.addEventListener('click', () => this.scrollList()); row1.appendChild(scrollBtn); // 展开/折叠按钮 const expandBtn = createElement('button', { className: 'outline-toolbar-btn', id: 'outline-expand-btn', title: this.t('outlineExpandAll') }, '⊕'); expandBtn.addEventListener('click', () => this.toggleExpandAll()); row1.appendChild(expandBtn); // 搜索框区域 const searchWrapper = createElement('div', {className: 'outline-search-wrapper'}); const searchInput = createElement('input', { type: 'text', className: 'outline-search-input', placeholder: this.t('outlineSearch'), value: this.state.searchQuery }); const clearBtn = createElement('button', { className: 'outline-search-clear hidden', title: this.t('clear') }, '×'); // 搜索事件处理 let debounceTimer; searchInput.addEventListener('input', (e) => { const val = e.target.value; clearBtn.classList.toggle('hidden', !val); clearTimeout(debounceTimer); debounceTimer = setTimeout(() => { this.handleSearch(val.trim()); }, 300); }); searchInput.addEventListener('keydown', (e) => { if (e.key === 'Escape') { searchInput.value = ''; clearBtn.classList.add('hidden'); this.handleSearch(''); searchInput.blur(); } }); clearBtn.addEventListener('click', () => { searchInput.value = ''; clearBtn.classList.add('hidden'); this.handleSearch(''); searchInput.focus(); }); searchWrapper.appendChild(searchInput); searchWrapper.appendChild(clearBtn); row1.appendChild(searchWrapper); toolbar.appendChild(row1); // 第二行：层级滑块 const row2 = createElement('div', {className: 'outline-toolbar-row'}); const sliderContainer = createElement('div', {className: 'outline-level-slider-container'}); // 层级节点 const dotsContainer = createElement('div', {className: 'outline-level-dots', id: 'outline-level-dots'}); const levelLine = createElement('div', {className: 'outline-level-line'}); const levelProgress = createElement('div', { className: 'outline-level-progress', id: 'outline-level-progress' }); levelLine.appendChild(levelProgress); dotsContainer.appendChild(levelLine); // 创建 6 个层级节点（0 表示不展开，1-6 表示层级） for (let i = 0; i <= 6; i++) { const dot = createElement('div', { className: `outline-level-dot ${i <= (this.state.expandLevel) ? 'active' : ''}`, 'data-level': i }); const tooltip = createElement('div', {className: 'outline-level-dot-tooltip'}); if (i === 0) { tooltip.textContent = '⊖'; // 不展开 } else { tooltip.textContent = `H${i}: 0`; } dot.appendChild(tooltip); dot.addEventListener('click', () => this.setLevel(i)); dotsContainer.appendChild(dot); } sliderContainer.appendChild(dotsContainer); row2.appendChild(sliderContainer); toolbar.appendChild(row2); content.appendChild(toolbar); // 搜索结果统计条 (插入在工具栏和列表之间) const resultBar = createElement('div', { className: 'outline-result-bar hidden', id: 'outline-result-bar' }); content.appendChild(resultBar); // 大纲列表包装器（可滚动） const listWrapper = createElement('div', {className: 'outline-list-wrapper', id: 'outline-list-wrapper'}); const list = createElement('div', {className: 'outline-list', id: 'outline-list'}); listWrapper.appendChild(list); content.appendChild(listWrapper); container.appendChild(content); } // 刷新数据 update(outlineData) { const listContainer = document.getElementById('outline-list'); if (!listContainer) return; clearElement(listContainer); if (!outlineData || outlineData.length === 0) { listContainer.appendChild(createElement('div', {className: 'outline-empty'}, this.t('outlineEmpty'))); return; } // 保存原始大纲 this.state.rawOutline = outlineData; // 统计各层级数量 this.state.levelCounts = {}; outlineData.forEach(item => { this.state.levelCounts[item.level] = (this.state.levelCounts[item.level] || 0) + 1; }); this.updateTooltips(); // 智能缩进：检测最高层级 const minLevel = Math.min(...outlineData.map(item => item.level)); this.state.minLevel = minLevel; // 在重构树之前，捕获当前的折叠状态 const currentStateMap = {}; if (this.state.tree) { this.captureTreeState(this.state.tree, currentStateMap); } // 构建树形结构 const outlineKey = outlineData.map(i => i.text).join('|'); let isNewTree = false; // 只要 key 变了，或者是首次构建，都重新构建树 // 注意：实时更新时 key 会不断变化，所以必须每次都重建树以包含新节点 // 但我们需要保持用户的折叠状态 if (this.state.treeKey !== outlineKey || !this.state.tree) { this.state.tree = this.buildTree(outlineData, minLevel); this.state.treeKey = outlineKey; isNewTree = true; } const tree = this.state.tree; // 恢复折叠状态 if (Object.keys(currentStateMap).length > 0) { this.restoreTreeState(tree, currentStateMap); // 对于新增加的节点（在 currentStateMap 中找不到的），应用默认折叠逻辑 // 这里需要一个递归函数只处理未初始化的节点吗？ // 实际上 restoreTreeState 只恢复旧的。新节点默认在 buildTree 中可能是 collapsed: false (我们在 buildTree 里初始化为 false) // 我们需要根据 expandLevel 来初始化新节点。 // 简单的做法：先全部应用默认 expandLevel，再用 restore 覆盖旧的？ // 或者：restore 之后，对剩下的新节点做处理？ // 改进策略： // 1. 先按默认规则初始化所有节点（基于 expandLevel） const displayLevel = this.state.expandLevel ?? 6; this.initializeCollapsedState(tree, displayLevel < minLevel ? minLevel : displayLevel); // 2. 再恢复用户之前的操作（覆盖默认） this.restoreTreeState(tree, currentStateMap); } else if (isNewTree && !this.state.searchQuery) { // 首次加载，无旧状态 const displayLevel = this.state.expandLevel ?? 6; this.initializeCollapsedState(tree, displayLevel < minLevel ? minLevel : displayLevel); } // 如果在搜索模式，需要重新应用搜索标记 if (this.state.searchQuery) { this.performSearch(this.state.searchQuery, false); // false = 不触发额外刷新 } // 渲染 this.refreshCurrent(); } // 处理搜索输入 handleSearch(query) { if (!query) { // === 结束搜索 === // 1. 清理搜索状态 this.state.searchQuery = ''; this.state.searchResults = null; this.state.searchLevelManual = false; // 2. 隐藏结果条 const resultBar = document.getElementById('outline-result-bar'); if (resultBar) resultBar.classList.add('hidden'); // 3. 恢复折叠状态 if (this.state.tree) { // 3.1 先重置为全局设定的层级状态（兜底） const displayLevel = this.state.expandLevel ?? 6; this.clearForceExpandedState(this.state.tree, displayLevel); // 3.2 如果有搜索前的状态快照，则恢复它（覆盖默认状态） if (this.state.preSearchState) { this.restoreTreeState(this.state.tree, this.state.preSearchState); this.state.preSearchState = null; // 恢复后清除快照 } } this.refreshCurrent(); return; } // === 开始或更新搜索 === // 如果是从无搜索状态进入搜索状态，保存当前快照 if (!this.state.searchQuery && this.state.tree) { this.state.preSearchState = {}; this.captureTreeState(this.state.tree, this.state.preSearchState); // Fix Issue 2: 搜索前重置所有状态（折叠所有 + 清除手动展开标记） // 这样搜索结果就只展示匹配的路径，不会受之前手动展开的干扰 this.clearForceExpandedState(this.state.tree, 0); } this.state.searchQuery = query; this.state.searchLevelManual = false; // 重置手动层级标记 this.performSearch(query); this.refreshCurrent(); } // 执行搜索计算 performSearch(query, updateUI = true) { if (!this.state.tree) return; const normalize = (str) => str.toLowerCase(); const normalizedQuery = normalize(query); let matchCount = 0; // 递归标记树 // 返回值: { isMatch: boolean, hasMatchedDescendant: boolean } const traverse = (nodes) => { let hasAnyMatch = false; nodes.forEach(node => { const isMatch = normalize(node.text).includes(normalizedQuery); if (isMatch) matchCount++; node.isMatch = isMatch; if (node.children && node.children.length > 0) { const childResult = traverse(node.children); node.hasMatchedDescendant = childResult; } else { node.hasMatchedDescendant = false; } // 如果有匹配子项，自动展开 if (node.hasMatchedDescendant) { node.collapsed = false; // node.forceExpanded = true; // 可选：是否强制标记为展开? 暂时不需要，只要 collapsed=false 即可 } if (isMatch || node.hasMatchedDescendant) { hasAnyMatch = true; } }); return hasAnyMatch; }; traverse(this.state.tree); // 更新结果条 if (updateUI) { const resultBar = document.getElementById('outline-result-bar'); if (resultBar) { resultBar.textContent = `${matchCount} ${this.t('outlineSearchResult')}`; resultBar.classList.remove('hidden'); } } } // 内部刷新（用于交互更新） refreshCurrent() { const listContainer = document.getElementById('outline-list'); if (this.state.tree && listContainer) { clearElement(listContainer); // 确定当前的显示层级上限 // 如果在搜索模式且未手动调整，显示所有层级 (Infinity) // 否则使用设定的 expandLevel let displayLevel; if (this.state.searchQuery && !this.state.searchLevelManual) { displayLevel = 100; // 足够大以显示所有 } else { displayLevel = this.state.expandLevel ?? 6; } if (displayLevel < this.state.minLevel) { displayLevel = this.state.minLevel; } this.renderItems(listContainer, this.state.tree, this.state.minLevel, displayLevel); } } // 构建树形结构 buildTree(outline, minLevel) { const tree = []; const stack = []; outline.forEach((item, index) => { const relativeLevel = item.level - minLevel + 1; const node = { ...item, relativeLevel, index, children: [], collapsed: false }; // 找到父节点 while (stack.length > 0 && stack[stack.length - 1].relativeLevel >= relativeLevel) { stack.pop(); } if (stack.length === 0) { tree.push(node); } else { stack[stack.length - 1].children.push(node); } stack.push(node); }); return tree; } // 渲染大纲项 renderItems(container, items, minLevel, displayLevel, parentCollapsed = false, parentForceExpanded = false) { items.forEach(item => { const hasChildren = item.children && item.children.length > 0; const isTopLevel = item.level === minLevel; let shouldShow; // 计算可见性 const isLevelAllowed = item.level <= displayLevel || parentForceExpanded; if (isTopLevel) { // 顶层节点逻辑 if (this.state.searchQuery) { // Fix: 搜索模式下严控顶层显示，无论是否有手动层级操作 // 确保 Expand All 不会将不相关的顶层节点展示出来 shouldShow = item.isMatch || item.hasMatchedDescendant; } else { // 普通模式：只需存在即可 shouldShow = true; } } else { // 非顶层节点 const isRelevant = !this.state.searchQuery || (item.isMatch || item.hasMatchedDescendant || parentForceExpanded); // 注意：parentForceExpanded 意味着父级被手动点开了，此时应该显示子级（即使不匹配） // 综合判断 if (this.state.searchQuery && !this.state.searchLevelManual) { // 纯搜索模式：相关即显示，忽略层级 // 但如果 parentForceExpanded，也显示 shouldShow = isRelevant && !parentCollapsed; } else if (this.state.searchQuery && this.state.searchLevelManual) { // 搜索且有层级限制 // 必须相关 AND 层级允许 shouldShow = isRelevant && isLevelAllowed && !parentCollapsed; } else { // 普通模式 shouldShow = isLevelAllowed && !parentCollapsed; } } // 最终修正：如果父级折叠了，那肯定看不到 if (parentCollapsed) shouldShow = false; const itemEl = createElement('div', { className: `outline-item outline-level-${item.relativeLevel}`, 'data-index': item.index, 'data-level': item.relativeLevel }); const isExpanded = hasChildren && !item.collapsed; const toggle = createElement('span', { className: `outline-item-toggle ${hasChildren ? (isExpanded ? 'expanded' : '') : 'invisible'}` }, '▸'); if (hasChildren) { toggle.addEventListener('click', (e) => { e.stopPropagation(); item.collapsed = !item.collapsed; if (!item.collapsed) { item.forceExpanded = true; } toggle.classList.toggle('expanded', !item.collapsed); this.refreshCurrent(); }); } itemEl.appendChild(toggle); const textEl = createElement('span', {className: 'outline-item-text'}); // 高亮处理 if (this.state.searchQuery && item.isMatch) { try { const query = this.state.searchQuery; const escapedQuery = query.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); const regex = new RegExp(`(${escapedQuery})`, 'gi'); const parts = item.text.split(regex); clearElement(textEl); parts.forEach(part => { if (part.toLowerCase() === query.toLowerCase()) { const mark = document.createElement('mark'); mark.textContent = part; mark.style.backgroundColor = 'rgba(255, 235, 59, 0.5)'; mark.style.color = 'inherit'; mark.style.padding = '0'; mark.style.borderRadius = '2px'; textEl.appendChild(mark); } else { textEl.appendChild(document.createTextNode(part)); } }); } catch (e) { textEl.textContent = item.text; } } else { textEl.textContent = item.text; } itemEl.appendChild(textEl); itemEl.addEventListener('click', () => { let targetElement = item.element; // 1. 检查元素是否有效 if (!targetElement || !targetElement.isConnected) { // 尝试重新查找 // 简单的重新查找策略：在文档中根据文本内容找一个最相似的 H? 标签 // 这是一个兜底，Gemini 动态渲染可能会导致元素重建 const headings = document.querySelectorAll(`h${item.level}`); for (const h of headings) { if (h.textContent.trim() === item.text) { targetElement = h; break; } } } if (targetElement && targetElement.isConnected) { // 跳转前回调（用于保存当前位置为锚点） if (this.onJumpBefore) { this.onJumpBefore(); } // 传入 __bypassLock: true 以绕过 ScrollLockManager 的拦截 // 恢复 behavior: 'smooth'，因为我们已经处理了元素重新查找，应该可以兼容 targetElement.scrollIntoView({behavior: 'smooth', block: 'center', __bypassLock: true}); targetElement.classList.add('outline-highlight'); setTimeout(() => targetElement.classList.remove('outline-highlight'), 2000); } else { console.warn('Gemini Helper: Outline item element lost and not found:', item.text); } }); if (!shouldShow) { itemEl.classList.add('outline-hidden'); } container.appendChild(itemEl); if (hasChildren) { const childParentCollapsed = item.collapsed || parentCollapsed; this.renderItems( container, item.children, minLevel, displayLevel, childParentCollapsed, item.forceExpanded || parentForceExpanded ); } }); } // 初始化树的折叠状态 initializeCollapsedState(items, displayLevel) { items.forEach(item => { if (item.children && item.children.length > 0) { const allChildrenHidden = item.children.every(child => child.level > displayLevel); item.collapsed = allChildrenHidden; this.initializeCollapsedState(item.children, displayLevel); } else { item.collapsed = false; } }); } // 滚动列表 scrollList() { const wrapper = document.getElementById('outline-list-wrapper'); const btn = document.getElementById('outline-scroll-btn'); if (!wrapper || !btn) return; const isAtBottom = wrapper.scrollTop + wrapper.clientHeight >= wrapper.scrollHeight - 10; if (isAtBottom) { wrapper.scrollTo({top: 0, behavior: 'smooth'}); btn.textContent = '⬇'; btn.title = this.t('outlineScrollBottom'); } else { wrapper.scrollTo({top: wrapper.scrollHeight, behavior: 'smooth'}); btn.textContent = '⬆'; btn.title = this.t('outlineScrollTop'); } } // 展开/折叠全部 toggleExpandAll() { const btn = document.getElementById('outline-expand-btn'); if (!btn) return; if (this.state.isAllExpanded) { const minLevel = this.state.minLevel || 1; this.setLevel(minLevel); } else { const maxActualLevel = Math.max(...Object.keys(this.state.levelCounts).map(Number), 1); this.setLevel(maxActualLevel); } } // 设置层级 setLevel(level) { this.state.expandLevel = level; // 更新外部设置 if (this.settings.outline) { this.settings.outline.maxLevel = level; if (this.onSettingsChange) this.onSettingsChange(); } // 清除强制展开状态 if (this.state.tree) { this.clearForceExpandedState(this.state.tree, level); } // 更新 UI const dots = document.querySelectorAll('.outline-level-dot'); dots.forEach(dot => { const dotLevel = parseInt(dot.dataset.level, 10); dot.classList.toggle('active', dotLevel <= level); }); const progress = document.getElementById('outline-level-progress'); if (progress) { progress.style.width = `${(level / 6) * 100}%`; } // 如果在搜索状态下调整了 Slider，标记为手动 if (this.state.searchQuery) { this.state.searchLevelManual = true; this.refreshCurrent(); } else { // 非搜索状态，这里可能不需要 refreshCurrent，因为 updateTooltips 或其他地方可能触发？ // 原有逻辑似乎没有显式调用 refreshCurrent，可能是 toggleExpnadAll 调用的？ // 不，setLevel 是被点击调用的。所以必须刷新。 this.refreshCurrent(); } const btn = document.getElementById('outline-expand-btn'); const maxActualLevel = Math.max(...Object.keys(this.state.levelCounts).map(Number), 1); if (btn) { if (level >= maxActualLevel) { btn.textContent = '⊖'; btn.title = this.t('outlineCollapseAll'); this.state.isAllExpanded = true; } else { btn.textContent = '⊕'; btn.title = this.t('outlineExpandAll'); this.state.isAllExpanded = false; } } this.refreshCurrent(); } // 清除强制展开状态 clearForceExpandedState(items, displayLevel) { items.forEach(item => { item.forceExpanded = false; if (item.children && item.children.length > 0) { const allChildrenHidden = item.children.every(child => child.level > displayLevel); item.collapsed = allChildrenHidden; this.clearForceExpandedState(item.children, displayLevel); } else { item.collapsed = false; } }); } // 更新提示 updateTooltips() { const dots = document.querySelectorAll('.outline-level-dot'); dots.forEach(dot => { const level = parseInt(dot.dataset.level, 10); const tooltip = dot.querySelector('.outline-level-dot-tooltip'); if (tooltip && level > 0) { const count = this.state.levelCounts[level] || 0; tooltip.textContent = `H${level}: ${count}`; } }); } // 捕获树的状态（expanded/collapsed） captureTreeState(nodes, stateMap) { nodes.forEach(node => { // 使用 level + text 作为 key // 注意：如果有完全相同的标题在同一级，可能会冲突，但在当前场景下可以接受 const key = `${node.level}_${node.text}`; stateMap[key] = { collapsed: node.collapsed, forceExpanded: node.forceExpanded }; if (node.children && node.children.length > 0) { this.captureTreeState(node.children, stateMap); } }); } // 恢复树的状态 restoreTreeState(nodes, stateMap) { nodes.forEach(node => { const key = `${node.level}_${node.text}`; const state = stateMap[key]; if (state) { node.collapsed = state.collapsed; // 只有当明确标记为 forceExpanded 时才恢复它 if (state.forceExpanded !== undefined) { node.forceExpanded = state.forceExpanded; } } if (node.children && node.children.length > 0) { this.restoreTreeState(node.children, stateMap); } }); } } /** * 设置管理器 * 负责所有设置的加载、保存和默认值合并 */ class SettingsManager { /** * 加载设置 * @param {SiteRegistry} registry 站点注册表 * @param {SiteAdapter} currentAdapter 当前适配器 * @returns {Object} 完整的设置对象 */ load(registry, currentAdapter) { const widthSettings = GM_getValue(SETTING_KEYS.PAGE_WIDTH, DEFAULT_WIDTH_SETTINGS); const outlineSettings = GM_getValue(SETTING_KEYS.OUTLINE, DEFAULT_OUTLINE_SETTINGS); const promptsSettings = GM_getValue(SETTING_KEYS.PROMPTS_SETTINGS, DEFAULT_PROMPTS_SETTINGS); const tabOrder = GM_getValue(SETTING_KEYS.TAB_ORDER, DEFAULT_TAB_ORDER); // 加载模型锁定设置（按站点隔离，但一次性加载所有站点的配置） const savedModelLockSettings = GM_getValue(SETTING_KEYS.MODEL_LOCK, {}); const mergedModelLockConfig = {}; // 兼容旧的单一适配器模式（防御性代码） const currentSiteId = currentAdapter ? currentAdapter.getSiteId() : 'unknown'; // 遍历所有注册的适配器，合并默认配置和保存的配置 if (registry && registry.adapters) { registry.adapters.forEach(adapter => { const siteId = adapter.getSiteId(); const defaults = adapter.getDefaultLockSettings(); mergedModelLockConfig[siteId] = {...defaults, ...(savedModelLockSettings[siteId] || {})}; }); } else if (currentAdapter) { const defaults = currentAdapter.getDefaultLockSettings(); mergedModelLockConfig[currentSiteId] = {...defaults, ...(savedModelLockSettings[currentSiteId] || {})}; } // 确保大纲设置有默认值 (合并默认配置与保存的配置) const mergedOutlineSettings = {...DEFAULT_OUTLINE_SETTINGS, ...outlineSettings}; return { clearTextareaOnSend: GM_getValue(SETTING_KEYS.CLEAR_TEXTAREA_ON_SEND, false), // 默认关闭 modelLockConfig: mergedModelLockConfig, pageWidth: widthSettings[currentSiteId] || DEFAULT_WIDTH_SETTINGS[currentSiteId], outline: mergedOutlineSettings, prompts: promptsSettings, tabOrder: tabOrder, preventAutoScroll: GM_getValue('gemini_prevent_auto_scroll', false), showCollapsedAnchor: GM_getValue('gemini_show_collapsed_anchor', true), tabSettings: {...DEFAULT_TAB_SETTINGS, ...GM_getValue(SETTING_KEYS.TAB_SETTINGS, {})}, readingHistory: {...DEFAULT_READING_HISTORY_SETTINGS, ...GM_getValue(SETTING_KEYS.READING_HISTORY, {})} }; } /** * 保存设置 * @param {Object} settings 当前设置对象 * @param {SiteAdapter} currentAdapter 当前适配器 */ save(settings, currentAdapter) { GM_setValue(SETTING_KEYS.CLEAR_TEXTAREA_ON_SEND, settings.clearTextareaOnSend); // 保存模型锁定设置（保存整个字典） GM_setValue(SETTING_KEYS.MODEL_LOCK, settings.modelLockConfig); // 保存标签页设置 GM_setValue(SETTING_KEYS.TAB_SETTINGS, settings.tabSettings); // 保存页面宽度设置 const allWidthSettings = GM_getValue(SETTING_KEYS.PAGE_WIDTH, DEFAULT_WIDTH_SETTINGS); if (currentAdapter) { allWidthSettings[currentAdapter.getSiteId()] = settings.pageWidth; } GM_setValue(SETTING_KEYS.PAGE_WIDTH, allWidthSettings); // 保存大纲设置 GM_setValue(SETTING_KEYS.OUTLINE, settings.outline); // 保存提示词设置 GM_setValue(SETTING_KEYS.PROMPTS_SETTINGS, settings.prompts); // 保存 Tab 顺序 GM_setValue(SETTING_KEYS.TAB_ORDER, settings.tabOrder); // 保存防滚动设置 GM_setValue('gemini_prevent_auto_scroll', settings.preventAutoScroll); // 保存阅读历史设置 GM_setValue(SETTING_KEYS.READING_HISTORY, settings.readingHistory); } } /** * Gemini 助手核心类 * 管理提示词、设置和 UI 界面 */ class GeminiHelper { constructor(siteRegistry) { this.prompts = this.loadPrompts(); this.registry = siteRegistry; // 保持 siteAdapter 引用以便兼容旧代码，指向当前匹配的站点 this.siteAdapter = siteRegistry.getCurrent(); this.selectedPrompt = null; this.isCollapsed = false; this.isScrolling = false; // 滚动状态锁 this.anchorScrollTop = null; // 阅读锚点位置 this.lang = detectLanguage(); // 当前语言 this.i18n = I18N[this.lang]; // 当前语言文本 this.settingsManager = new SettingsManager(); this.settings = this.loadSettings(); // 加载设置 // 初始化当前 Tab：优先使用设置的第一个 Tab this.currentTab = this.settings.tabOrder && this.settings.tabOrder.length > 0 ? this.settings.tabOrder[0] : 'prompts'; // 兜底：如果首个 Tab 被禁用，则回退到 safe tab const isOutlineDisabled = this.currentTab === 'outline' && !this.settings.outline?.enabled; const isPromptsDisabled = this.currentTab === 'prompts' && !this.settings.prompts?.enabled; if (isOutlineDisabled || isPromptsDisabled) { // 尝试找一个可用的 tab const availableTab = this.settings.tabOrder.find(t => { if (t === 'outline') return this.settings.outline?.enabled; if (t === 'prompts') return this.settings.prompts?.enabled; return true; // settings always enabled }); this.currentTab = availableTab || 'settings'; } // 初始化核心功能管理器 this.scrollManager = new ScrollManager(this.siteAdapter); this.readingProgressManager = new ReadingProgressManager(this.settings, this.scrollManager, (k) => this.t(k)); this.anchorManager = new AnchorManager(this.scrollManager, (k) => this.t(k)); // 绑定锚点状态变化更新 UI this.anchorManager.bindUI((hasAnchor) => this.updateAnchorButtonState(hasAnchor)); // 初始化滚动锁定管理器 this.scrollLockManager = new ScrollLockManager(this.siteAdapter); // 根据设置初始化状态，前提是当前站点支持 if (this.settings.preventAutoScroll && this.siteAdapter.supportsScrollLock()) { this.scrollLockManager.setEnabled(true); } this.outlineManager = null; this.init(); } // 获取翻译文本 t(key) { return this.i18n[key] || key; } loadPrompts() { const saved = GM_getValue('universal_prompts', null); if (!saved) { GM_setValue('universal_prompts', DEFAULT_PROMPTS); return DEFAULT_PROMPTS; } return saved; } savePrompts() { GM_setValue('universal_prompts', this.prompts); } // 加载设置 loadSettings() { return this.settingsManager.load(this.registry, this.siteAdapter); } // 保存设置 saveSettings() { this.settingsManager.save(this.settings, this.siteAdapter); } addPrompt(prompt) { prompt.id = 'custom_' + Date.now(); this.prompts.push(prompt); this.savePrompts(); this.refreshPromptList(); this.refreshCategories(); } updatePrompt(id, updatedPrompt) { const index = this.prompts.findIndex(p => p.id === id); if (index !== -1) { this.prompts[index] = {...this.prompts[index], ...updatedPrompt}; this.savePrompts(); this.refreshPromptList(); this.refreshCategories(); } } deletePrompt(id) { this.prompts = this.prompts.filter(p => p.id !== id); this.savePrompts(); this.refreshPromptList(); this.refreshCategories(); } getCategories() { const categories = new Set(); this.prompts.forEach(p => { if (p.category) categories.add(p.category); }); return Array.from(categories); } init() { this.createStyles(); this.createUI(); this.bindEvents(); // 初始化锚点按钮状态（初始时没有锚点，应置灰） this.updateAnchorButtonState(false); this.siteAdapter.findTextarea(); // 对于 Gemini Business，根据设置决定是否在初始化时插入零宽字符 const currentSiteId = this.siteAdapter.getSiteId(); const adapterOptions = { clearOnInit: this.siteAdapter instanceof GeminiBusinessAdapter ? this.settings.clearTextareaOnSend : false, modelLockConfig: this.settings.modelLockConfig[currentSiteId] // 传递当前站点的配置 }; // 绑定新对话监听 (点击按钮或快捷键) this.siteAdapter.bindNewChatListeners(() => { console.log('Gemini Helper: New chat detected, re-initializing...'); // 重新加载配置并执行初始化逻辑 this.settings = this.loadSettings(); const currentSiteId = this.siteAdapter.getSiteId(); const adapterOptions = { clearOnInit: this.siteAdapter instanceof GeminiBusinessAdapter ? this.settings.clearTextareaOnSend : false, modelLockConfig: this.settings.modelLockConfig[currentSiteId] }; this.siteAdapter.afterPropertiesSet(adapterOptions); // 重新应用滚动锁定状态 if (this.scrollLockManager) { this.scrollLockManager.siteAdapter = this.siteAdapter; // 确保适配器更新 this.scrollLockManager.setEnabled(this.settings.preventAutoScroll); } // 重新应用宽度样式 (防止页面重置) if (this.widthStyleManager) { this.widthStyleManager.apply(); } }); this.siteAdapter.afterPropertiesSet(adapterOptions); // 初始化时执行锚点恢复和清理 if (this.settings.readingHistory.persistence) { // 延迟触发以确保页面加载完成 setTimeout(() => { this.restoreReadingProgress(); this.cleanupReadingHistory(); }, 2000); } // 创建并应用页面宽度样式 this.widthStyleManager = new WidthStyleManager(this.siteAdapter, this.settings.pageWidth); this.widthStyleManager.apply(); // 初始化标签页重命名管理器 this.tabRenameManager = new TabRenameManager(this.siteAdapter, this.settings, (key) => this.t(key)); if (this.settings.tabSettings?.autoRenameTab) { this.tabRenameManager.start(); } // 监听自定义大纲自动刷新事件 window.addEventListener('gemini-helper-outline-auto-refresh', () => { this.refreshOutline(); }); // 如果初始 Tab 是大纲，立即刷新内容 if (this.currentTab === 'outline') { // 稍微延迟一下，确保 DOM 已经就绪 setTimeout(() => this.refreshOutline(), 500); } } createStyles() { const existingStyle = document.getElementById('gemini-helper-styles'); if (existingStyle) existingStyle.remove(); const colors = this.siteAdapter.getThemeColors(); const gradient = `linear-gradient(135deg, ${colors.primary} 0%, ${colors.secondary} 100%)`; const style = document.createElement('style'); style.id = 'gemini-helper-styles'; style.textContent = ` /* 主面板样式 */ #gemini-helper-panel { position: fixed; top: 50%; right: 20px; transform: translateY(-50%); width: 320px; height: 80vh; min-height: 600px; background: white; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,0.15); z-index: 999999; display: flex; flex-direction: column; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; transition: all 0.3s ease; border: 1px solid #e0e0e0; } #gemini-helper-panel.collapsed { display: none; } .prompt-panel-header { padding: 16px; background: ${gradient}; color: white; border-radius: 12px 12px 0 0; display: flex; justify-content: space-between; align-items: center; cursor: move; user-select: none; } .prompt-panel-title { font-size: 15px; font-weight: 600; display: flex; align-items: center; gap: 6px; white-space: nowrap; flex-shrink: 0; } .site-indicator { font-size: 10px; padding: 2px 5px; background: rgba(255,255,255,0.2); border-radius: 4px; margin-left: 4px; white-space: nowrap; } .prompt-panel-controls { display: flex; gap: 8px; } .prompt-panel-btn { background: rgba(255,255,255,0.2); border: none; color: white; width: 28px; height: 28px; border-radius: 6px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; font-size: 14px; } .prompt-panel-btn:hover { background: rgba(255,255,255,0.3); transform: scale(1.1); } .prompt-search-bar { padding: 12px; border-bottom: 1px solid #e5e7eb; background: #f9fafb; } .prompt-search-input { width: 100%; padding: 8px 12px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px; transition: all 0.2s; box-sizing: border-box; } .prompt-search-input:focus { outline: none; border-color: ${colors.primary}; } .prompt-categories { padding: 8px 12px; display: flex; gap: 6px; flex-wrap: wrap; background: white; border-bottom: 1px solid #e5e7eb; } .category-tag { padding: 4px 10px; background: #f3f4f6; border-radius: 12px; font-size: 12px; color: #4b5563; cursor: pointer; transition: all 0.2s; border: 1px solid transparent; } .category-tag:hover { background: #e5e7eb; } .category-tag.active { background: ${colors.primary}; color: white; border-color: ${colors.primary}; } .prompt-list { flex: 1; overflow-y: auto; padding: 8px; } .prompt-item { background: white; border: 1px solid #e5e7eb; border-radius: 8px; padding: 12px; margin-bottom: 8px; cursor: pointer; transition: all 0.2s; position: relative; } .prompt-item:hover { border-color: ${colors.primary}; box-shadow: 0 4px 12px rgba(66,133,244,0.15); transform: translateY(-2px); } .prompt-item.selected { background: linear-gradient(135deg, #e8f0fe 0%, #f1f8e9 100%); border-color: ${colors.primary}; } .prompt-item-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; } .prompt-item-title { font-weight: 600; font-size: 14px; color: #1f2937; flex: 1; } .prompt-item-category { font-size: 11px; padding: 2px 6px; background: #f3f4f6; border-radius: 4px; color: #6b7280; } .prompt-item-content { font-size: 13px; color: #6b7280; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .prompt-item-actions { position: absolute; top: 8px; right: 8px; display: none; gap: 4px; } .prompt-item:hover .prompt-item-actions { display: flex; } .prompt-action-btn { width: 24px; height: 24px; border: none; background: white; border-radius: 4px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.1); font-size: 12px; } .prompt-action-btn:hover { background: #f3f4f6; transform: scale(1.1); } .prompt-item.dragging { opacity: 0.5; } .add-prompt-btn { margin: 12px; padding: 10px; background: ${gradient}; color: white; border: none; border-radius: 8px; font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.2s; display: flex; align-items: center; justify-content: center; gap: 6px; } .add-prompt-btn:hover { transform: translateY(-2px); } /* 模态框 */ .prompt-modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; z-index: 1000000; animation: fadeIn 0.2s; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes slideDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } } .prompt-modal-content { background: white; border-radius: 12px; width: 90%; max-width: 500px; padding: 24px; animation: slideUp 0.3s; } @keyframes slideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .prompt-modal-header { font-size: 18px; font-weight: 600; margin-bottom: 20px; color: #1f2937; } .prompt-form-group { margin-bottom: 16px; } .prompt-form-label { display: block; font-size: 14px; font-weight: 500; color: #374151; margin-bottom: 6px; } .prompt-form-input, .prompt-form-textarea { width: 100%; padding: 8px 12px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 14px; transition: all 0.2s; box-sizing: border-box; } .prompt-form-textarea { min-height: 100px; resize: vertical; font-family: inherit; } .prompt-form-input:focus, .prompt-form-textarea:focus { outline: none; border-color: ${colors.primary}; } .prompt-modal-actions { display: flex; gap: 12px; justify-content: flex-end; margin-top: 24px; } .prompt-modal-btn { padding: 8px 16px; border-radius: 6px; font-size: 14px; font-weight: 500; cursor: pointer; border: none; } .prompt-modal-btn.primary { background: ${gradient}; color: white; } .prompt-modal-btn.secondary { background: #f3f4f6; color: #4b5563; } /* 选中的提示词显示栏 */ .selected-prompt-bar { position: fixed; bottom: 120px; left: 50%; transform: translateX(-50%); background: ${gradient}; color: white; padding: 8px 16px; border-radius: 20px; font-size: 13px; display: none; align-items: center; gap: 8px; box-shadow: 0 4px 12px rgba(66,133,244,0.3); z-index: 999998; animation: slideInUp 0.3s; } @keyframes slideInUp { from { transform: translate(-50%, 20px); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } } .selected-prompt-bar.show { display: flex; } .selected-prompt-text { max-width: 300px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .clear-prompt-btn { background: rgba(255,255,255,0.2); border: none; color: white; width: 20px; height: 20px; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; } .quick-prompt-btn { width: 44px; height: 44px; background: ${gradient}; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; font-size: 18px; cursor: pointer; box-shadow: 0 4px 12px rgba(66,133,244,0.3); border: none; transition: transform 0.3s; } .quick-prompt-btn:hover { transform: scale(1.1); } /* 快捷按钮组（收起时显示） */ .quick-btn-group { position: fixed; bottom: 120px; right: 30px; display: flex; flex-direction: column; gap: 10px; z-index: 999997; transition: opacity 0.3s; } .quick-btn-group.hidden { display: none; } .hidden { display: none !important; } .outline-hidden { display: none !important; } .prompt-toast { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); background: #10b981; color: white; padding: 12px 20px; border-radius: 8px; font-size: 14px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); z-index: 1000001; animation: toastSlideIn 0.3s; } @keyframes toastSlideIn { from { transform: translate(-50%, -20px); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } } /* 快捷跳转按钮组（面板内） */ .scroll-nav-container { display: flex; gap: 8px; padding: 10px 16px; border-top: 1px solid #e5e7eb; background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%); border-radius: 0 0 12px 12px; justify-content: center; } .scroll-nav-btn { flex: 1; max-width: 120px; height: 32px; border-radius: 8px; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 14px; color: white; gap: 4px; background: ${gradient}; box-shadow: 0 2px 6px rgba(0,0,0,0.15); transition: transform 0.2s, box-shadow 0.2s; } .scroll-nav-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.2); } .scroll-nav-btn.icon-only { flex: 0 0 32px; width: 32px; border-radius: 50%; padding: 0; } .scroll-nav-btn.icon-only span { display: inline-block; transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1); } .scroll-nav-btn.icon-only:hover span { transform: rotate(360deg) scale(1.2); } /* 分类管理按钮 */ .category-manage-btn { padding: 4px 8px; background: transparent; border: 1px dashed #9ca3af; border-radius: 12px; font-size: 12px; color: #6b7280; cursor: pointer; transition: all 0.2s; margin-left: 4px; } .category-manage-btn:hover { background: #f3f4f6; border-color: #6b7280; color: #374151; } /* 分类管理弹窗 */ .category-modal-content { max-height: 400px; } .category-list { max-height: 280px; overflow-y: auto; margin: 16px 0; } .category-item { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: #f9fafb; border-radius: 8px; margin-bottom: 8px; transition: all 0.2s; } .category-item:hover { background: #f3f4f6; } .category-item-info { display: flex; align-items: center; gap: 12px; flex: 1; } .category-item-name { font-weight: 500; color: #1f2937; font-size: 14px; } .category-item-count { font-size: 12px; color: #6b7280; background: #e5e7eb; padding: 2px 8px; border-radius: 10px; } .category-item-actions { display: flex; gap: 8px; } .category-action-btn { padding: 4px 10px; border-radius: 4px; font-size: 12px; cursor: pointer; border: none; transition: all 0.2s; } .category-action-btn.rename { background: #dbeafe; color: #1d4ed8; } .category-action-btn.rename:hover { background: #bfdbfe; } .category-action-btn.delete { background: #fee2e2; color: #dc2626; } .category-action-btn.delete:hover { background: #fecaca; } .category-empty { text-align: center; color: #9ca3af; padding: 40px 0; font-size: 14px; } /* Tab 切换栏 */ .prompt-panel-tabs { display: flex; background: #f9fafb; border-bottom: 1px solid #e5e7eb; } .prompt-panel-tab { flex: 1; padding: 10px 16px; background: transparent; border: none; font-size: 13px; font-weight: 500; color: #6b7280; cursor: pointer; transition: all 0.2s; border-bottom: 2px solid transparent; } .prompt-panel-tab:hover { color: #374151; background: #f3f4f6; } .prompt-panel-tab.active { color: ${colors.primary}; border-bottom-color: ${colors.primary}; background: white; } /* 面板内容区 */ .prompt-panel-content { display: flex; flex-direction: column; flex: 1; overflow: hidden; min-height: 280px; } .prompt-panel-content.hidden { display: none; } /* 设置面板样式 - 合并优化 */ .settings-content { padding: 16px; overflow-y: auto; flex: 1; scrollbar-width: none; -ms-overflow-style: none; } .settings-content::-webkit-scrollbar { display: none; } .settings-section { margin-bottom: 24px; } .settings-section-title { font-size: 12px; font-weight: 600; color: #6b7280; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; padding-left: 4px; border-bottom: none; } .setting-item { display: flex; justify-content: space-between; align-items: center; padding: 12px; background: #f9fafb; border-radius: 8px; margin-bottom: 8px; border: 1px solid #f3f4f6; transition: all 0.2s; } .setting-item:hover { border-color: linear-gradient(135deg, #4285f4 0%, #34a853 100%); background: white; box-shadow: 0 2px 4px rgba(0,0,0,0.02); } .setting-item-info { flex: 1; margin-right: 12px; min-width: 0; display: flex; flex-direction: column; justify-content: center; } .setting-item-label { font-size: 14px; font-weight: 500; color: #374151; margin-bottom: 2px; white-space: nowrap; } .setting-item-desc { font-size: 12px; color: #9ca3af; line-height: 1.3; } .setting-controls { display: flex; align-items: center; gap: 8px; flex-shrink: 0; } .setting-select { padding: 6px 8px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 13px; color: #374151; background: white; outline: none; transition: all 0.2s; height: 32px; box-sizing: border-box; min-width: 100px; } .setting-select:focus { border-color: #4285f4; box-shadow: 0 0 0 2px rgba(66,133,244,0.1); } .setting-toggle { width: 44px; height: 24px; background: #d1d5db; border-radius: 12px; position: relative; cursor: pointer; transition: all 0.3s; flex-shrink: 0; } .setting-toggle::after { content: ''; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; background: white; border-radius: 50%; transition: all 0.3s; box-shadow: 0 1px 2px rgba(0,0,0,0.1); } .setting-toggle.active { background: #4285f4; } /* 默认蓝色，会被JS覆盖 */ .setting-toggle.active::after { left: 22px; } /* 大纲面板样式 */ .outline-content { display: flex; flex-direction: column; flex: 1; min-height: 200px; user-select: none; overflow: hidden; } /* 大纲固定工具栏 */ .outline-fixed-toolbar { padding: 10px 12px; background: #f9fafb; border-bottom: 1px solid #e5e7eb; flex-shrink: 0; display: flex; flex-direction: column; gap: 8px; } .outline-toolbar-row { display: flex; align-items: center; gap: 8px; } .outline-toolbar-btn { width: 28px; height: 28px; border: 1px solid #d1d5db; border-radius: 6px; background: white; color: #6b7280; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 14px; transition: all 0.2s; flex-shrink: 0; } .outline-toolbar-btn:hover { border-color: ${colors.primary}; color: ${colors.primary}; background: #f0f9ff; } .outline-toolbar-btn.active { border-color: ${colors.primary}; color: white; background: ${colors.primary}; } .outline-search-input { flex: 1; height: 28px; padding: 0 10px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 13px; color: #374151; outline: none; transition: all 0.2s; } .outline-search-input:focus { border-color: ${colors.primary}; box-shadow: 0 0 0 2px rgba(66,133,244,0.1); } .outline-search-input::placeholder { color: #9ca3af; } .outline-search-clear { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; border: none; background: #d1d5db; color: white; border-radius: 50%; cursor: pointer; font-size: 10px; line-height: 16px; text-align: center; } .outline-search-clear:hover { background: #9ca3af; } .outline-search-wrapper { position: relative; flex: 1; display: flex; align-items: center; } .outline-search-result { font-size: 12px; color: #6b7280; margin-left: 8px; white-space: nowrap; } .outline-result-bar { padding: 6px 12px; background: #eff6ff; color: #1d4ed8; font-size: 12px; border-bottom: 1px solid #dbeafe; text-align: center; flex-shrink: 0; transition: all 0.3s; } /* 层级滑块 */ .outline-level-slider-container { display: flex; align-items: center; gap: 6px; width: 100%; } .outline-level-slider { flex: 1; height: 4px; -webkit-appearance: none; appearance: none; background: #e5e7eb; border-radius: 2px; outline: none; cursor: pointer; } .outline-level-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 14px; height: 14px; border-radius: 50%; background: ${colors.primary}; cursor: pointer; border: 2px solid white; box-shadow: 0 1px 3px rgba(0,0,0,0.2); } .outline-level-slider::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: ${colors.primary}; cursor: pointer; border: 2px solid white; box-shadow: 0 1px 3px rgba(0,0,0,0.2); } .outline-level-dots { display: flex; justify-content: space-between; align-items: center; position: relative; flex: 1; height: 24px; } .outline-level-dot { width: 12px; height: 12px; border-radius: 50%; background: #d1d5db; cursor: pointer; transition: all 0.2s; position: relative; z-index: 2; border: 2px solid white; box-shadow: 0 1px 2px rgba(0,0,0,0.1); } .outline-level-dot:hover { background: ${colors.primary}; transform: scale(1.2); } .outline-level-dot.active { background: ${colors.primary}; } .outline-level-dot-tooltip { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: #374151; color: white; padding: 4px 8px; border-radius: 4px; font-size: 11px; white-space: nowrap; opacity: 0; visibility: hidden; transition: all 0.2s; pointer-events: none; margin-bottom: 4px; } .outline-level-dot:hover .outline-level-dot-tooltip { opacity: 1; visibility: visible; } .outline-level-line { position: absolute; left: 10px; right: 10px; top: 50%; height: 4px; background: #e5e7eb; transform: translateY(-50%); z-index: 1; border-radius: 2px; } .outline-level-progress { position: absolute; left: 0; top: 0; height: 100%; background: ${colors.primary}; border-radius: 2px; transition: width 0.2s; } /* 大纲列表区 */ .outline-list-wrapper { flex: 1; overflow-y: auto; padding: 8px 12px; } .outline-list { display: flex; flex-direction: column; gap: 2px; } .outline-item { padding: 6px 10px 6px 10px; border-radius: 6px; cursor: pointer; background: transparent; border: 1px solid transparent; font-size: 13px; color: #374151; transition: all 0.15s; display: flex; align-items: center; position: relative; } .outline-item:hover { background: #f3f4f6; } .outline-item.highlight { background: #dbeafe; border-color: ${colors.primary}; } .outline-item-toggle { width: 24px; min-width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; color: #9ca3af; cursor: pointer; transition: all 0.2s ease; font-size: 16px; flex-shrink: 0; margin-right: 2px; box-sizing: border-box; border-radius: 4px; } .outline-item-toggle:hover { color: ${colors.primary}; background-color: rgba(0,0,0,0.05); } .outline-item-toggle.expanded { transform: rotate(90deg); color: ${colors.primary}; } .outline-item-toggle.invisible { opacity: 0; cursor: default; pointer-events: none; visibility: visible !important; display: inline-flex !important; } .outline-item-text { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 24px; } .outline-item.collapsed-children { display: none; } /* 大纲层级缩进 - 箭头跟随缩进，文字保持左对齐 */ .outline-level-1 { padding-left: 10px; font-weight: 600; font-size: 14px; } .outline-level-2 { padding-left: 28px; font-weight: 500; } .outline-level-3 { padding-left: 46px; } .outline-level-4 { padding-left: 64px; font-size: 12px; } .outline-level-5 { padding-left: 82px; font-size: 12px; color: #6b7280; } .outline-level-6 { padding-left: 100px; font-size: 12px; color: #9ca3af; } .outline-empty { text-align: center; color: #9ca3af; padding: 40px 20px; font-size: 14px; } /* 大纲高亮效果 */ .outline-highlight { animation: outlineHighlight 2s ease-out; } @keyframes outlineHighlight { 0% { background: rgba(66, 133, 244, 0.3); } 100% { background: transparent; } } `; document.head.appendChild(style); } createUI() { const existingPanel = document.getElementById('gemini-helper-panel'); const existingBar = document.querySelector('.selected-prompt-bar'); const existingBtnGroup = document.getElementById('quick-btn-group'); if (existingPanel) existingPanel.remove(); if (existingBar) existingBar.remove(); if (existingBtnGroup) existingBtnGroup.remove(); const panel = createElement('div', {id: 'gemini-helper-panel'}); // Header const header = createElement('div', {className: 'prompt-panel-header'}); const title = createElement('div', {className: 'prompt-panel-title'}); title.appendChild(createElement('span', {}, '✨')); title.appendChild(createElement('span', {}, this.t('panelTitle'))); title.appendChild(createElement('span', {className: 'site-indicator'}, this.siteAdapter.getName())); const controls = createElement('div', {className: 'prompt-panel-controls'}); const refreshBtn = createElement('button', { className: 'prompt-panel-btn', id: 'refresh-prompts', title: this.t('refreshPrompts') }, '⟳'); refreshBtn.addEventListener('click', () => { refreshBtn.classList.add('loading'); // 根据当前 Tab 智能刷新 if (this.currentTab === 'outline') { this.refreshOutline(); this.showToast(this.t('refreshed')); } else if (this.currentTab === 'prompts') { this.refreshPromptList(); this.showToast(this.t('refreshed')); } else { this.showToast(this.t('refreshed')); } setTimeout(() => refreshBtn.classList.remove('loading'), 500); }); const toggleBtn = createElement('button', { className: 'prompt-panel-btn', id: 'toggle-panel', title: this.t('collapse') }, '−'); // 注意：toggleBtn 的事件监听在 bindEvents 中统一绑定，避免重复绑定 // 新建标签页按钮 // 新标签页按钮 (只有在设置开启且站点支持时显示) if (this.settings.tabSettings?.openInNewTab && this.siteAdapter.supportsNewTab()) { const newTabBtn = createElement('button', { className: 'prompt-panel-btn', id: 'new-tab-btn', title: this.t('newTabTooltip'), style: 'margin-right: 2px;' }, '+'); newTabBtn.addEventListener('click', () => { const url = this.siteAdapter.getNewTabUrl(); if (url) { window.open(url, '_blank'); } }); controls.appendChild(newTabBtn); } controls.appendChild(refreshBtn); controls.appendChild(toggleBtn); header.appendChild(title); header.appendChild(controls); // 双击面板标题切换隐私模式 (Boss Key) title.style.cursor = 'pointer'; title.addEventListener('dblclick', () => { if (this.tabRenameManager) { const isPrivate = this.tabRenameManager.togglePrivacyMode(); this.saveSettings(); // 同步设置面板中的隐私模式开关状态 const privacyToggle = document.getElementById('toggle-privacy-mode'); if (privacyToggle) { privacyToggle.classList.toggle('active', isPrivate); } // 同步伪装标题输入框的禁用状态 const privacyTitleItem = privacyToggle?.closest('.setting-item')?.nextElementSibling; if (privacyTitleItem && privacyTitleItem.classList.contains('setting-item')) { const privacyTitleInput = privacyTitleItem.querySelector('input'); if (privacyTitleInput) { privacyTitleInput.disabled = !isPrivate; privacyTitleItem.style.opacity = isPrivate ? '1' : '0.5'; privacyTitleItem.style.pointerEvents = isPrivate ? 'auto' : 'none'; } } this.showToast(isPrivate ? '🔒 隐私模式已开启' : '🔓 隐私模式已关闭'); } }); // Tab 栏 const tabs = createElement('div', {className: 'prompt-panel-tabs'}); // 根据设置的顺序渲染 Tab const tabOrder = this.settings.tabOrder || DEFAULT_TAB_ORDER; // 确保所有 Tab 都存在（防止新版本新增 Tab 或配置丢失） const allTabs = new Set([...tabOrder, ...DEFAULT_TAB_ORDER]); // 过滤掉未定义的 Tab ID const validTabs = Array.from(allTabs).filter(id => TAB_DEFINITIONS[id]); validTabs.forEach(tabId => { const def = TAB_DEFINITIONS[tabId]; // 特殊处理：如果大纲被禁用，添加 hidden 类，但仍然渲染（为了保持 DOM 结构一致性，或者稍后在 switchTab 处理可见性） // 这里稍微调整逻辑：创建 button，初始 class 根据状态决定 let className = 'prompt-panel-tab'; if (this.currentTab === tabId) className += ' active'; // 大纲特殊显隐逻辑 if (tabId === 'outline' && !this.settings.outline?.enabled) { className += ' hidden'; } // 提示词特殊显隐逻辑 if (tabId === 'prompts' && !this.settings.prompts?.enabled) { className += ' hidden'; } const btn = createElement('button', { className: className, 'data-tab': tabId, id: `${tabId}-tab` }); // 添加图标和文本 btn.appendChild(createElement('span', {style: 'margin-right: 6px;'}, def.icon)); btn.appendChild(document.createTextNode(this.t(def.labelKey))); btn.addEventListener('click', () => this.switchTab(tabId)); tabs.appendChild(btn); }); panel.appendChild(header); panel.appendChild(tabs); // 内容容器需按固定顺序创建（DOM 结构不受 Tab 顺序影响，只影响 Tab 按钮顺序） // 1. 提示词面板内容区 const promptsContent = createElement('div', { className: `prompt-panel-content${this.currentTab === 'prompts' ? '' : ' hidden'}`, id: 'prompts-content' }); const searchBar = createElement('div', {className: 'prompt-search-bar'}); const searchInput = createElement('input', { className: 'prompt-search-input', id: 'prompt-search', type: 'text', placeholder: this.t('searchPlaceholder') }); searchBar.appendChild(searchInput); const categories = createElement('div', {className: 'prompt-categories', id: 'prompt-categories'}); const list = createElement('div', {className: 'prompt-list', id: 'prompt-list'}); const addBtn = createElement('button', {className: 'add-prompt-btn', id: 'add-prompt'}); addBtn.appendChild(createElement('span', {}, '+')); addBtn.appendChild(createElement('span', {}, this.t('addPrompt'))); promptsContent.appendChild(searchBar); promptsContent.appendChild(categories); promptsContent.appendChild(list); promptsContent.appendChild(addBtn); // 2. 大纲面板内容区 const outlineContent = createElement('div', { className: `prompt-panel-content${this.currentTab === 'outline' ? '' : ' hidden'}`, id: 'outline-content' }); // 初始化大纲管理器 this.outlineManager = new OutlineManager({ container: outlineContent, settings: this.settings, onSettingsChange: () => this.saveSettings(), onJumpBefore: () => this.anchorManager.setAnchor(this.scrollManager.scrollTop), i18n: (k) => this.t(k) }); // 3. 设置面板内容区 const settingsContent = createElement('div', { className: `prompt-panel-content${this.currentTab === 'settings' ? '' : ' hidden'}`, id: 'settings-content' }); this.createSettingsContent(settingsContent); panel.appendChild(promptsContent); panel.appendChild(outlineContent); panel.appendChild(settingsContent); document.body.appendChild(panel); // 选中提示词悬浮条 const selectedBar = createElement('div', {className: 'selected-prompt-bar', style: 'user-select: none;'}); selectedBar.appendChild(createElement('span', {style: 'user-select: none;'}, this.t('currentPrompt'))); selectedBar.appendChild(createElement('span', { className: 'selected-prompt-text', id: 'selected-prompt-text', style: 'user-select: none;' })); const clearBtn = createElement('button', {className: 'clear-prompt-btn', id: 'clear-prompt'}, '×'); selectedBar.appendChild(clearBtn); document.body.appendChild(selectedBar); const quickBtnGroup = createElement('div', {className: 'quick-btn-group hidden', id: 'quick-btn-group'}); const quickBtn = createElement('button', {className: 'quick-prompt-btn', title: this.t('panelTitle')}, '✨'); const quickScrollTop = createElement('button', { className: 'quick-prompt-btn', title: this.t('scrollTop') }, '⬆'); const quickAnchor = createElement('button', { className: 'quick-prompt-btn', id: 'quick-anchor-btn', title: '暂无锚点', style: (this.settings.showCollapsedAnchor ? 'display: flex;' : 'display: none;') + ' opacity: 0.4; cursor: default;' }, '⚓'); const quickScrollBottom = createElement('button', { className: 'quick-prompt-btn', title: this.t('scrollBottom') }, '⬇'); quickBtn.addEventListener('click', () => { this.togglePanel(); }); quickScrollTop.addEventListener('click', () => this.scrollToTop()); quickAnchor.addEventListener('click', () => this.handleAnchorClick()); quickScrollBottom.addEventListener('click', () => this.scrollToBottom()); quickBtnGroup.appendChild(quickScrollTop); quickBtnGroup.appendChild(quickAnchor); quickBtnGroup.appendChild(quickBtn); quickBtnGroup.appendChild(quickScrollBottom); document.body.appendChild(quickBtnGroup); // 快捷跳转按钮组 - 放在面板底部 const scrollNavContainer = createElement('div', { className: 'scroll-nav-container', id: 'scroll-nav-container' }); const scrollTopBtn = createElement('button', { className: 'scroll-nav-btn', id: 'scroll-top-btn', title: this.t('scrollTop') }); scrollTopBtn.appendChild(createElement('span', {}, '⬆')); scrollTopBtn.appendChild(createElement('span', {}, this.t('scrollTop'))); const anchorBtn = createElement('button', { className: 'scroll-nav-btn icon-only', id: 'scroll-anchor-btn', title: '暂无锚点', style: 'opacity: 0.4; cursor: default;' }); anchorBtn.appendChild(createElement('span', {}, '⚓')); // anchorBtn.appendChild(createElement('span', {}, this.t('anchorPoint'))); const scrollBottomBtn = createElement('button', { className: 'scroll-nav-btn', id: 'scroll-bottom-btn', title: this.t('scrollBottom') }); scrollBottomBtn.appendChild(createElement('span', {}, '⬇')); scrollBottomBtn.appendChild(createElement('span', {}, this.t('scrollBottom'))); scrollTopBtn.addEventListener('click', () => this.scrollToTop()); anchorBtn.addEventListener('click', () => this.handleAnchorClick()); scrollBottomBtn.addEventListener('click', () => this.scrollToBottom()); scrollNavContainer.appendChild(scrollTopBtn); scrollNavContainer.appendChild(anchorBtn); scrollNavContainer.appendChild(scrollBottomBtn); panel.appendChild(scrollNavContainer); this.refreshCategories(); this.refreshPromptList(); // 初始化锚点按钮状态 setTimeout(() => this.updateAnchorButtonState(this.anchorManager.hasAnchor()), 0); } // Tab 切换 switchTab(tabName) { this.currentTab = tabName; // 更新 Tab 激活状态 document.querySelectorAll('.prompt-panel-tab').forEach(tab => { tab.classList.toggle('active', tab.dataset.tab === tabName); }); // 切换内容区 document.getElementById('prompts-content')?.classList.toggle('hidden', tabName !== 'prompts'); document.getElementById('outline-content')?.classList.toggle('hidden', tabName !== 'outline'); document.getElementById('settings-content')?.classList.toggle('hidden', tabName !== 'settings'); // 通知 OutlineManager 激活状态（用于控制自动更新显隐） if (this.outlineManager) { this.outlineManager.setActive(tabName === 'outline'); } // 更新刷新按钮的提示 const refreshBtn = document.getElementById('refresh-prompts'); if (refreshBtn) { const titleMap = { 'prompts': this.t('refreshPrompts'), 'outline': this.t('refreshOutline'), 'settings': this.t('refreshSettings') }; refreshBtn.title = titleMap[tabName] || this.t('refresh'); } // 切换到大纲时自动刷新 if (tabName === 'outline') { this.refreshOutline(); } } // 刷新大纲 refreshOutline() { if (!this.settings.outline?.enabled) return; const outline = this.siteAdapter.extractOutline(6); if (this.outlineManager) { this.outlineManager.update(outline); } } // 创建可折叠区域辅助方法 createCollapsibleSection(title, content, options = {}) { const {defaultExpanded = false} = options; const section = createElement('div', {className: 'settings-section'}); // 标题栏（可点击折叠/展开） const header = createElement('div', { className: 'settings-section-title', style: 'cursor: pointer; display: flex; justify-content: space-between; align-items: center; user-select: none;' }); const headerLeft = createElement('div', {style: 'display: flex; align-items: center; gap: 6px;'}); // 箭头 const arrow = createElement('span', { style: 'font-size: 10px; color: #9ca3af; transition: transform 0.2s; display: inline-block;', className: 'collapse-arrow' }, '▶'); const headerTitle = createElement('span', {}, title); headerLeft.appendChild(arrow); headerLeft.appendChild(headerTitle); header.appendChild(headerLeft); // 如果有右侧元素（如开关状态提示等），可以扩展 options 传入，这里暂时留空 section.appendChild(header); // 内容容器 const contentContainer = createElement('div', { className: 'settings-accordion-content', style: `display: ${defaultExpanded ? 'block' : 'none'}; padding-top: 8px; animation: slideDown 0.2s;` }); contentContainer.appendChild(content); // 切换折叠状态 let isExpanded = defaultExpanded; const updateState = () => { contentContainer.style.display = isExpanded ? 'block' : 'none'; arrow.style.transform = isExpanded ? 'rotate(90deg)' : 'rotate(0deg)'; }; // 初始化状态 if (defaultExpanded) arrow.style.transform = 'rotate(90deg)'; header.addEventListener('click', () => { isExpanded = !isExpanded; updateState(); }); section.appendChild(contentContainer); return section; } // 创建设置面板内容 createSettingsContent(container) { const content = createElement('div', {className: 'settings-content'}); // 1. 语言设置 (保持在顶部) const langSection = createElement('div', {className: 'settings-section'}); langSection.appendChild(createElement('div', {className: 'settings-section-title'}, this.t('settingsTitle'))); const langItem = createElement('div', {className: 'setting-item'}); const langInfo = createElement('div', {className: 'setting-item-info'}); langInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('languageLabel'))); langInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('languageDesc'))); const langSelect = createElement('select', {className: 'setting-select', id: 'select-language'}); const currentLang = GM_getValue(SETTING_KEYS.LANGUAGE, 'auto'); [ {value: 'auto', label: this.t('languageAuto')}, {value: 'zh-CN', label: this.t('languageZhCN')}, {value: 'zh-TW', label: this.t('languageZhTW')}, {value: 'en', label: this.t('languageEn')} ].forEach(opt => { const option = createElement('option', {value: opt.value}, opt.label); if (opt.value === currentLang) option.selected = true; langSelect.appendChild(option); }); langSelect.addEventListener('change', () => { GM_setValue(SETTING_KEYS.LANGUAGE, langSelect.value); this.lang = detectLanguage(); this.i18n = I18N[this.lang]; this.createStyles(); this.createUI(); this.bindEvents(); this.switchTab('settings'); this.showToast(langSelect.value === 'auto' ? this.t('languageAuto') : langSelect.options[langSelect.selectedIndex].text); }); langItem.appendChild(langInfo); langItem.appendChild(langSelect); langSection.appendChild(langItem); content.appendChild(langSection); // 2. 模型锁定设置 (可折叠) let lockSection = null; if (this.registry && this.registry.adapters) { const adaptersWithLock = this.registry.adapters; if (adaptersWithLock.length > 0) { const lockContainer = createElement('div', {}); // 为每个站点生成配置行 adaptersWithLock.forEach(adapter => { const siteId = adapter.getSiteId(); const siteConfig = this.settings.modelLockConfig[siteId] || adapter.getDefaultLockSettings(); const row = createElement('div', { className: 'site-lock-row', style: 'display: flex; align-items: center; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #f3f4f6;' }); const leftCol = createElement('div', {style: 'display: flex; align-items: center; flex: 1; gap: 12px;'}); const nameLabel = createElement('div', {style: 'font-size: 14px; font-weight: 500; color: #374151; min-width: 80px;'}, adapter.getName()); const toggle = createElement('div', { className: 'setting-toggle' + (siteConfig.enabled ? ' active' : ''), style: 'transform: scale(0.8);' }); leftCol.appendChild(nameLabel); leftCol.appendChild(toggle); const rightCol = createElement('div', {}); const keywordInput = createElement('input', { type: 'text', className: 'prompt-input-title', value: siteConfig.keyword || '', placeholder: this.t('modelKeywordPlaceholder'), style: 'width: 80px; padding: 4px 8px; border: 1px solid #ddd; border-radius: 4px; font-size: 12px; text-align: center;' }); const updateState = () => { keywordInput.disabled = !siteConfig.enabled; keywordInput.style.opacity = siteConfig.enabled ? '1' : '0.5'; keywordInput.style.cursor = siteConfig.enabled ? 'text' : 'not-allowed'; toggle.className = 'setting-toggle' + (siteConfig.enabled ? ' active' : ''); }; updateState(); toggle.addEventListener('click', (e) => { e.stopPropagation(); siteConfig.enabled = !siteConfig.enabled; this.settings.modelLockConfig[siteId] = siteConfig; updateState(); this.saveSettings(); if (siteId === this.siteAdapter.getSiteId() && siteConfig.enabled) { this.siteAdapter.lockModel(siteConfig.keyword); } }); keywordInput.addEventListener('change', () => { siteConfig.keyword = keywordInput.value.trim(); this.settings.modelLockConfig[siteId] = siteConfig; this.saveSettings(); }); rightCol.appendChild(keywordInput); row.appendChild(leftCol); row.appendChild(rightCol); lockContainer.appendChild(row); }); lockSection = this.createCollapsibleSection(this.t('modelLockTitle'), lockContainer); } } // 3. 页面宽度设置 (可折叠) const widthContainer = createElement('div', {}); // 启用开关 const enableWidthItem = createElement('div', {className: 'setting-item'}); const enableWidthInfo = createElement('div', {className: 'setting-item-info'}); enableWidthInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('enablePageWidth'))); enableWidthInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('pageWidthDesc'))); const enableToggle = createElement('div', { className: 'setting-toggle' + (this.settings.pageWidth && this.settings.pageWidth.enabled ? ' active' : ''), id: 'toggle-page-width' }); enableToggle.addEventListener('click', () => { this.settings.pageWidth.enabled = !this.settings.pageWidth.enabled; enableToggle.classList.toggle('active', this.settings.pageWidth.enabled); this.saveSettings(); if (this.widthStyleManager) { this.widthStyleManager.updateConfig(this.settings.pageWidth); } this.showToast(this.settings.pageWidth.enabled ? this.t('settingOn') : this.t('settingOff')); }); enableWidthItem.appendChild(enableWidthInfo); enableWidthItem.appendChild(enableToggle); widthContainer.appendChild(enableWidthItem); // 值设置 const widthValueItem = createElement('div', {className: 'setting-item'}); const widthValueInfo = createElement('div', {className: 'setting-item-info'}); widthValueInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('widthValue'))); const widthControls = createElement('div', {className: 'setting-controls'}); const widthInput = createElement('input', { type: 'number', className: 'setting-select', id: 'width-value-input', value: this.settings.pageWidth ? this.settings.pageWidth.value : '70', style: 'width: 65px !important; min-width: 65px !important; text-align: right;' }); const unitSelect = createElement('select', { className: 'setting-select', id: 'width-unit-select', style: 'width: 65px;' }); ['%', 'px'].forEach(unit => { const option = createElement('option', {value: unit}, unit); if (this.settings.pageWidth && this.settings.pageWidth.unit === unit) option.selected = true; unitSelect.appendChild(option); }); const validateAndSave = () => { let val = parseFloat(widthInput.value); const unit = unitSelect.value; if (unit === '%') { if (val > 100) val = 100; if (val < 10) val = 10; } else { if (val < 400) val = 400; } if (val !== parseFloat(widthInput.value)) widthInput.value = val; this.settings.pageWidth.value = val.toString(); this.settings.pageWidth.unit = unit; this.saveSettings(); if (this.widthStyleManager) this.widthStyleManager.updateConfig(this.settings.pageWidth); }; let timeout; widthInput.addEventListener('input', () => { if (widthInput.value.length > 5) widthInput.value = widthInput.value.slice(0, 5); if (unitSelect.value === '%' && parseFloat(widthInput.value) > 100) widthInput.value = '100'; else if (unitSelect.value === 'px' && parseFloat(widthInput.value) <= 100) widthInput.value = '1200'; clearTimeout(timeout); timeout = setTimeout(validateAndSave, 500); }); widthInput.addEventListener('change', validateAndSave); unitSelect.addEventListener('change', () => { if (unitSelect.value === '%' && parseFloat(widthInput.value) > 100) widthInput.value = '70'; else if (unitSelect.value === 'px' && parseFloat(widthInput.value) <= 100) widthInput.value = '1200'; validateAndSave(); this.showToast(`${this.t('widthValue')}: ${widthInput.value}${unitSelect.value}`); }); widthControls.appendChild(widthInput); widthControls.appendChild(unitSelect); widthValueItem.appendChild(widthValueInfo); widthValueItem.appendChild(widthControls); widthContainer.appendChild(widthValueItem); // 防止自动滚动（从其他设置移入） const scrollLockItem = createElement('div', {className: 'setting-item'}); const scrollLockInfo = createElement('div', {className: 'setting-item-info'}); scrollLockInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('preventAutoScrollLabel'))); scrollLockInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('preventAutoScrollDesc'))); const scrollLockToggle = createElement('div', { className: 'setting-toggle' + (this.settings.preventAutoScroll ? ' active' : ''), id: 'toggle-scroll-lock' }); scrollLockToggle.addEventListener('click', () => { this.settings.preventAutoScroll = !this.settings.preventAutoScroll; scrollLockToggle.classList.toggle('active', this.settings.preventAutoScroll); this.saveSettings(); if (this.scrollLockManager) { this.scrollLockManager.setEnabled(this.settings.preventAutoScroll); } this.showToast(this.settings.preventAutoScroll ? this.t('settingOn') : this.t('settingOff')); }); scrollLockItem.appendChild(scrollLockInfo); scrollLockItem.appendChild(scrollLockToggle); widthContainer.appendChild(scrollLockItem); const widthSection = this.createCollapsibleSection(this.t('pageDisplaySettings'), widthContainer); // 4. 界面排版 (可折叠) const layoutContainer = createElement('div', {}); const tabDesc = createElement('div', { className: 'setting-item-desc', style: 'padding: 0 12px 8px 12px; margin-bottom: 4px;' }, this.t('tabOrderDesc')); layoutContainer.appendChild(tabDesc); const currentOrder = this.settings.tabOrder || DEFAULT_TAB_ORDER; const validOrder = currentOrder.filter(id => TAB_DEFINITIONS[id]); validOrder.forEach((tabId, index) => { const def = TAB_DEFINITIONS[tabId]; const item = createElement('div', {className: 'setting-item'}); const info = createElement('div', {className: 'setting-item-info'}); info.appendChild(createElement('div', {className: 'setting-item-label'}, this.t(def.labelKey))); const controls = createElement('div', {className: 'setting-controls'}); // 特殊处理：如果是大纲 Tab，在排序按钮旁边添加开关 if (tabId === 'outline') { const outlineToggle = createElement('div', { className: 'setting-toggle' + (this.settings.outline?.enabled ? ' active' : ''), id: 'toggle-outline-inline', style: 'transform: scale(0.8); margin-right: 12px;', title: this.t('enableOutline') // 添加提示 }); outlineToggle.addEventListener('click', (e) => { e.stopPropagation(); this.settings.outline.enabled = !this.settings.outline.enabled; outlineToggle.title = this.settings.outline.enabled ? this.t('disableOutline') : this.t('enableOutline'); outlineToggle.classList.toggle('active', this.settings.outline.enabled); this.saveSettings(); const outlineTab = document.getElementById('outline-tab'); if (outlineTab) outlineTab.classList.toggle('hidden', !this.settings.outline.enabled); if (!this.settings.outline.enabled && this.currentTab === 'outline') this.switchTab('settings'); // 更新自动更新状态 if (this.outlineManager) { this.outlineManager.updateAutoUpdateState(); } this.showToast(this.settings.outline.enabled ? this.t('settingOn') : this.t('settingOff')); }); controls.appendChild(outlineToggle); } // 特殊处理：如果是提示词 Tab，在排序按钮旁边添加开关 if (tabId === 'prompts') { const promptsToggle = createElement('div', { className: 'setting-toggle' + (this.settings.prompts?.enabled ? ' active' : ''), id: 'toggle-prompts-inline', style: 'transform: scale(0.8); margin-right: 12px;', title: this.t('togglePrompts') }); promptsToggle.addEventListener('click', (e) => { e.stopPropagation(); this.settings.prompts.enabled = !this.settings.prompts.enabled; promptsToggle.classList.toggle('active', this.settings.prompts.enabled); this.saveSettings(); const promptsTab = document.getElementById('prompts-tab'); if (promptsTab) promptsTab.classList.toggle('hidden', !this.settings.prompts.enabled); if (!this.settings.prompts.enabled && this.currentTab === 'prompts') this.switchTab('settings'); this.showToast(this.settings.prompts.enabled ? this.t('settingOn') : this.t('settingOff')); }); controls.appendChild(promptsToggle); } // 大纲高级设置（如果是在大纲 Tab 行） if (tabId === 'outline') { // 插入大纲高级设置的可折叠区域到下面（或者作为子项） // 为保持 UI 简洁，我们可以在点击大纲 toggle 时不做额外展示，而是有一个专门的“大纲高级设置”区域 // 由于这里是排序拖拽区，不适合放太多配置。 // 决定：在排序列表下方新增一个独立的大纲设置区域 } const upBtn = createElement('button', { className: 'prompt-panel-btn', style: 'background: #f3f4f6; color: #4b5563; width: 32px; height: 32px; font-size: 16px; margin-right: 4px; border: 1px solid #e5e7eb;', title: this.t('moveUp') }); upBtn.textContent = '⬆'; upBtn.disabled = index === 0; const downBtn = createElement('button', { className: 'prompt-panel-btn', style: 'background: #f3f4f6; color: #4b5563; width: 32px; height: 32px; font-size: 16px; border: 1px solid #e5e7eb;', title: this.t('moveDown') }); downBtn.textContent = '⬇'; downBtn.disabled = index === validOrder.length - 1; [upBtn, downBtn].forEach(btn => { if (btn.disabled) { btn.style.opacity = '0.4'; btn.style.cursor = 'not-allowed'; btn.style.background = '#f3f4f6'; } else { btn.style.opacity = '1'; btn.style.cursor = 'pointer'; btn.onmouseover = () => { btn.style.background = '#e5e7eb'; btn.style.color = '#111827'; }; btn.onmouseout = () => { btn.style.background = '#f3f4f6'; btn.style.color = '#4b5563'; }; } }); upBtn.addEventListener('click', () => { if (index > 0) { const newOrder = [...validOrder]; [newOrder[index - 1], newOrder[index]] = [newOrder[index], newOrder[index - 1]]; this.settings.tabOrder = newOrder; this.saveSettings(); this.createUI(); this.bindEvents(); this.switchTab('settings'); } }); downBtn.addEventListener('click', () => { if (index < validOrder.length - 1) { const newOrder = [...validOrder]; [newOrder[index], newOrder[index + 1]] = [newOrder[index + 1], newOrder[index]]; this.settings.tabOrder = newOrder; this.saveSettings(); this.createUI(); this.bindEvents(); this.switchTab('settings'); } }); controls.appendChild(upBtn); controls.appendChild(downBtn); item.appendChild(info); item.appendChild(controls); layoutContainer.appendChild(item); }); const layoutSection = this.createCollapsibleSection(this.t('tabOrderSettings'), layoutContainer); // 4.5 阅读历史设置 (新增独立版块) const anchorContainer = createElement('div', {}); // 持久化开关 const anchorPersistenceItem = createElement('div', {className: 'setting-item'}); const anchorPersistenceInfo = createElement('div', {className: 'setting-item-info'}); anchorPersistenceInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('readingHistoryPersistence'))); anchorPersistenceInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('readingHistoryPersistenceDesc'))); const anchorPersistenceToggle = createElement('div', { className: 'setting-toggle' + (this.settings.readingHistory.persistence ? ' active' : ''), id: 'toggle-anchor-persistence' }); // 自动恢复开关 const anchorAutoRestoreItem = createElement('div', {className: 'setting-item'}); const anchorAutoRestoreInfo = createElement('div', {className: 'setting-item-info'}); anchorAutoRestoreInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('autoRestore'))); anchorAutoRestoreInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('autoRestoreDesc'))); const anchorAutoRestoreToggle = createElement('div', { className: 'setting-toggle' + (this.settings.readingHistory.autoRestore ? ' active' : ''), id: 'toggle-anchor-auto-restore' }); // 清理时间设置 const anchorCleanupItem = createElement('div', {className: 'setting-item'}); const anchorCleanupInfo = createElement('div', {className: 'setting-item-info'}); anchorCleanupInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('readingHistoryCleanup'))); anchorCleanupInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('readingHistoryCleanupDesc'))); const anchorCleanupControls = createElement('div', {className: 'setting-controls'}); const anchorCleanupInput = createElement('select', {className: 'setting-select'}); // 填充清理选项 const cleanupOptions = [ {val: 1, label: `1 ${this.t('daysSuffix')}`}, {val: 3, label: `3 ${this.t('daysSuffix')}`}, {val: 7, label: `7 ${this.t('daysSuffix')}`}, {val: 30, label: `30 ${this.t('daysSuffix')}`}, {val: 90, label: `90 ${this.t('daysSuffix')}`}, {val: -1, label: this.t('cleanupInfinite')} ]; cleanupOptions.forEach(opt => { const option = createElement('option', {value: opt.val}, opt.label); if (this.settings.readingHistory.cleanupDays == opt.val) option.selected = true; anchorCleanupInput.appendChild(option); }); // 联动逻辑函数 const updateDependency = (enabled) => { if (enabled) { anchorAutoRestoreItem.style.opacity = '1'; anchorAutoRestoreItem.style.pointerEvents = 'auto'; anchorCleanupItem.style.opacity = '1'; anchorCleanupItem.style.pointerEvents = 'auto'; } else { anchorAutoRestoreItem.style.opacity = '0.5'; anchorAutoRestoreItem.style.pointerEvents = 'none'; anchorCleanupItem.style.opacity = '0.5'; anchorCleanupItem.style.pointerEvents = 'none'; } }; // 初始化联动 updateDependency(this.settings.readingHistory.persistence); anchorPersistenceToggle.addEventListener('click', () => { this.settings.readingHistory.persistence = !this.settings.readingHistory.persistence; anchorPersistenceToggle.classList.toggle('active', this.settings.readingHistory.persistence); this.saveSettings(); updateDependency(this.settings.readingHistory.persistence); this.showToast(this.settings.readingHistory.persistence ? this.t('settingOn') : this.t('settingOff')); }); anchorAutoRestoreToggle.addEventListener('click', () => { this.settings.readingHistory.autoRestore = !this.settings.readingHistory.autoRestore; anchorAutoRestoreToggle.classList.toggle('active', this.settings.readingHistory.autoRestore); this.saveSettings(); this.showToast(this.settings.readingHistory.autoRestore ? this.t('settingOn') : this.t('settingOff')); }); anchorCleanupInput.addEventListener('change', () => { this.settings.readingHistory.cleanupDays = parseInt(anchorCleanupInput.value); this.saveSettings(); this.showToast(`${this.t('readingHistoryCleanup')}: ${anchorCleanupInput.options[anchorCleanupInput.selectedIndex].text}`); }); anchorPersistenceItem.appendChild(anchorPersistenceInfo); anchorPersistenceItem.appendChild(anchorPersistenceToggle); anchorAutoRestoreItem.appendChild(anchorAutoRestoreInfo); anchorAutoRestoreItem.appendChild(anchorAutoRestoreToggle); anchorCleanupControls.appendChild(anchorCleanupInput); anchorCleanupItem.appendChild(anchorCleanupInfo); anchorCleanupItem.appendChild(anchorCleanupControls); anchorContainer.appendChild(anchorPersistenceItem); anchorContainer.appendChild(anchorAutoRestoreItem); anchorContainer.appendChild(anchorCleanupItem); // 折叠面板显示锚点（从其他设置移入） const showAnchorItem = createElement('div', {className: 'setting-item'}); const showAnchorInfo = createElement('div', {className: 'setting-item-info'}); showAnchorInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('showCollapsedAnchorLabel'))); showAnchorInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('showCollapsedAnchorDesc'))); const showAnchorToggle = createElement('div', { className: 'setting-toggle' + (this.settings.showCollapsedAnchor ? ' active' : ''), id: 'toggle-show-collapsed-anchor' }); showAnchorToggle.addEventListener('click', () => { this.settings.showCollapsedAnchor = !this.settings.showCollapsedAnchor; showAnchorToggle.classList.toggle('active', this.settings.showCollapsedAnchor); this.saveSettings(); // 实时更新UI GM_setValue('gemini_show_collapsed_anchor', this.settings.showCollapsedAnchor); const quickAnchor = document.getElementById('quick-anchor-btn'); if (quickAnchor) { quickAnchor.style.display = this.settings.showCollapsedAnchor ? 'flex' : 'none'; } this.showToast(this.settings.showCollapsedAnchor ? this.t('settingOn') : this.t('settingOff')); }); showAnchorItem.appendChild(showAnchorInfo); showAnchorItem.appendChild(showAnchorToggle); anchorContainer.appendChild(showAnchorItem); const anchorSection = this.createCollapsibleSection(this.t('readingNavigationSettings'), anchorContainer); // 5. 大纲详细设置 (高级配置) const outlineSettingsContainer = createElement('div', {}); // 自动更新开关 const autoUpdateItem = createElement('div', {className: 'setting-item'}); const autoUpdateInfo = createElement('div', {className: 'setting-item-info'}); autoUpdateInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('outlineAutoUpdateLabel'))); autoUpdateInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('outlineAutoUpdateDesc'))); const autoUpdateToggle = createElement('div', { className: 'setting-toggle' + (this.settings.outline.autoUpdate ? ' active' : ''), id: 'toggle-outline-auto-update' }); autoUpdateToggle.addEventListener('click', () => { this.settings.outline.autoUpdate = !this.settings.outline.autoUpdate; autoUpdateToggle.classList.toggle('active', this.settings.outline.autoUpdate); this.saveSettings(); if (this.outlineManager) this.outlineManager.updateAutoUpdateState(); this.showToast(this.settings.outline.autoUpdate ? this.t('settingOn') : this.t('settingOff')); }); autoUpdateItem.appendChild(autoUpdateInfo); autoUpdateItem.appendChild(autoUpdateToggle); outlineSettingsContainer.appendChild(autoUpdateItem); // 更新间隔 const updateIntervalItem = createElement('div', {className: 'setting-item'}); const updateIntervalInfo = createElement('div', {className: 'setting-item-info'}); updateIntervalInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('outlineUpdateIntervalLabel'))); const updateIntervalControls = createElement('div', {className: 'setting-controls'}); const updateIntervalInput = createElement('input', { type: 'number', className: 'setting-select', value: this.settings.outline.updateInterval, style: 'width: 60px !important; text-align: center;', min: 1 }); updateIntervalInput.addEventListener('change', () => { let val = parseInt(updateIntervalInput.value, 10); if (val < 1) val = 1; // 最小 1 秒 updateIntervalInput.value = val; this.settings.outline.updateInterval = val; this.saveSettings(); // OutlineManager 在触发下一次更新时会自动使用新间隔 this.showToast(this.t('outlineIntervalUpdated').replace('{val}', val)); }); updateIntervalControls.appendChild(updateIntervalInput); updateIntervalItem.appendChild(updateIntervalInfo); updateIntervalItem.appendChild(updateIntervalControls); outlineSettingsContainer.appendChild(updateIntervalItem); const outlineSettingsSection = this.createCollapsibleSection(this.t('outlineSettings'), outlineSettingsContainer, {defaultExpanded: false}); // 6. 标签页设置 (折叠面板) const tabSettingsContainer = createElement('div', {}); // 6.1 新标签页打开开关 if (this.siteAdapter.supportsNewTab()) { const newTabItem = createElement('div', {className: 'setting-item'}); const newTabInfo = createElement('div', {className: 'setting-item-info'}); newTabInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('openNewTabLabel'))); newTabInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('openNewTabDesc'))); const newTabToggle = createElement('div', { className: 'setting-toggle' + (this.settings.tabSettings?.openInNewTab ? ' active' : ''), id: 'toggle-new-tab' }); newTabToggle.addEventListener('click', () => { this.settings.tabSettings.openInNewTab = !this.settings.tabSettings.openInNewTab; newTabToggle.classList.toggle('active', this.settings.tabSettings.openInNewTab); this.saveSettings(); this.createUI(); this.bindEvents(); if (this.currentTab === 'settings') { this.switchTab('settings'); } this.showToast(this.settings.tabSettings.openInNewTab ? this.t('settingOn') : this.t('settingOff')); }); newTabItem.appendChild(newTabInfo); newTabItem.appendChild(newTabToggle); tabSettingsContainer.appendChild(newTabItem); } // 6.2 自动重命名标签页开关 (仅支持的站点显示) if (this.siteAdapter.supportsTabRename()) { const renameTabItem = createElement('div', {className: 'setting-item'}); const renameTabInfo = createElement('div', {className: 'setting-item-info'}); renameTabInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('autoRenameTabLabel'))); renameTabInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('autoRenameTabDesc'))); const renameTabToggle = createElement('div', { className: 'setting-toggle' + (this.settings.tabSettings?.autoRenameTab ? ' active' : ''), id: 'toggle-auto-rename-tab' }); renameTabItem.appendChild(renameTabInfo); renameTabItem.appendChild(renameTabToggle); tabSettingsContainer.appendChild(renameTabItem); // 6.3 检测频率 const intervalItem = createElement('div', {className: 'setting-item'}); const intervalInfo = createElement('div', {className: 'setting-item-info'}); intervalInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('renameIntervalLabel'))); intervalInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('renameIntervalDesc'))); const intervalControls = createElement('div', {className: 'setting-controls'}); const intervalSelect = createElement('select', { className: 'setting-select', id: 'select-rename-interval' }); const intervalOptions = [1, 3, 5, 10, 30, 60]; intervalOptions.forEach(val => { const option = createElement('option', {value: val}, `${val} ${this.t('secondsSuffix')}`); if (this.settings.tabSettings?.renameInterval === val) option.selected = true; intervalSelect.appendChild(option); }); intervalSelect.addEventListener('change', () => { this.settings.tabSettings.renameInterval = parseInt(intervalSelect.value); this.saveSettings(); if (this.tabRenameManager && this.tabRenameManager.isActive()) { this.tabRenameManager.setInterval(this.settings.tabSettings.renameInterval); } this.showToast(`${this.t('renameIntervalLabel')}: ${intervalSelect.value}${this.t('secondsSuffix')}`); }); intervalControls.appendChild(intervalSelect); intervalItem.appendChild(intervalInfo); intervalItem.appendChild(intervalControls); tabSettingsContainer.appendChild(intervalItem); // 定义状态更新函数 const updateIntervalState = () => { const isEnabled = this.settings.tabSettings.autoRenameTab; intervalSelect.disabled = !isEnabled; intervalItem.style.opacity = isEnabled ? '1' : '0.5'; intervalItem.style.pointerEvents = isEnabled ? 'auto' : 'none'; }; // 初始化状态 updateIntervalState(); // 绑定开关点击事件 renameTabToggle.addEventListener('click', () => { this.settings.tabSettings.autoRenameTab = !this.settings.tabSettings.autoRenameTab; renameTabToggle.classList.toggle('active', this.settings.tabSettings.autoRenameTab); this.saveSettings(); // 更新检测频率项状态 updateIntervalState(); // 启动/停止 TabRenameManager if (this.tabRenameManager) { if (this.settings.tabSettings.autoRenameTab) { this.tabRenameManager.start(); } else { this.tabRenameManager.stop(); } } this.showToast(this.settings.tabSettings.autoRenameTab ? this.t('settingOn') : this.t('settingOff')); }); } // 6.4 显示生成状态 (showStatus) if (this.siteAdapter.supportsTabRename()) { const showStatusItem = createElement('div', {className: 'setting-item'}); const showStatusInfo = createElement('div', {className: 'setting-item-info'}); showStatusInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('showStatusLabel'))); showStatusInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('showStatusDesc'))); const showStatusToggle = createElement('div', { className: 'setting-toggle' + (this.settings.tabSettings?.showStatus !== false ? ' active' : ''), id: 'toggle-show-status' }); showStatusToggle.addEventListener('click', () => { this.settings.tabSettings.showStatus = !this.settings.tabSettings.showStatus; showStatusToggle.classList.toggle('active', this.settings.tabSettings.showStatus); this.saveSettings(); if (this.tabRenameManager) this.tabRenameManager.updateTabName(true); this.showToast(this.settings.tabSettings.showStatus ? this.t('settingOn') : this.t('settingOff')); }); showStatusItem.appendChild(showStatusInfo); showStatusItem.appendChild(showStatusToggle); tabSettingsContainer.appendChild(showStatusItem); } // 6.5 标题格式 (titleFormat) if (this.siteAdapter.supportsTabRename()) { const formatItem = createElement('div', {className: 'setting-item'}); const formatInfo = createElement('div', {className: 'setting-item-info'}); formatInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('titleFormatLabel'))); formatInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('titleFormatDesc'))); const formatInput = createElement('input', { type: 'text', className: 'prompt-input-title', value: this.settings.tabSettings?.titleFormat || '{status}{title}', style: 'width: 130px; padding: 4px 8px; border: 1px solid #ddd; border-radius: 4px; font-size: 12px;' }); formatInput.addEventListener('change', () => { this.settings.tabSettings.titleFormat = formatInput.value.trim() || '{status}{title}'; this.saveSettings(); if (this.tabRenameManager) this.tabRenameManager.updateTabName(true); }); formatItem.appendChild(formatInfo); formatItem.appendChild(formatInput); tabSettingsContainer.appendChild(formatItem); } // 6.6 发送桌面通知 (showNotification) if (this.siteAdapter.supportsTabRename()) { const notificationItem = createElement('div', {className: 'setting-item'}); const notificationInfo = createElement('div', {className: 'setting-item-info'}); notificationInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('showNotificationLabel'))); notificationInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('showNotificationDesc'))); const notificationToggle = createElement('div', { className: 'setting-toggle' + (this.settings.tabSettings?.showNotification ? ' active' : ''), id: 'toggle-show-notification' }); notificationToggle.addEventListener('click', () => { this.settings.tabSettings.showNotification = !this.settings.tabSettings.showNotification; notificationToggle.classList.toggle('active', this.settings.tabSettings.showNotification); this.saveSettings(); this.showToast(this.settings.tabSettings.showNotification ? this.t('settingOn') : this.t('settingOff')); }); notificationItem.appendChild(notificationInfo); notificationItem.appendChild(notificationToggle); tabSettingsContainer.appendChild(notificationItem); } // 6.7 自动窗口置顶 (autoFocus) if (this.siteAdapter.supportsTabRename()) { const autoFocusItem = createElement('div', {className: 'setting-item'}); const autoFocusInfo = createElement('div', {className: 'setting-item-info'}); autoFocusInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('autoFocusLabel'))); autoFocusInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('autoFocusDesc'))); const autoFocusToggle = createElement('div', { className: 'setting-toggle' + (this.settings.tabSettings?.autoFocus ? ' active' : ''), id: 'toggle-auto-focus' }); autoFocusToggle.addEventListener('click', () => { this.settings.tabSettings.autoFocus = !this.settings.tabSettings.autoFocus; autoFocusToggle.classList.toggle('active', this.settings.tabSettings.autoFocus); this.saveSettings(); this.showToast(this.settings.tabSettings.autoFocus ? this.t('settingOn') : this.t('settingOff')); }); autoFocusItem.appendChild(autoFocusInfo); autoFocusItem.appendChild(autoFocusToggle); tabSettingsContainer.appendChild(autoFocusItem); } // 6.8 隐私模式 (privacyMode) if (this.siteAdapter.supportsTabRename()) { const privacyItem = createElement('div', {className: 'setting-item'}); const privacyInfo = createElement('div', {className: 'setting-item-info'}); privacyInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('privacyModeLabel'))); privacyInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('privacyModeDesc'))); const privacyToggle = createElement('div', { className: 'setting-toggle' + (this.settings.tabSettings?.privacyMode ? ' active' : ''), id: 'toggle-privacy-mode' }); privacyItem.appendChild(privacyInfo); privacyItem.appendChild(privacyToggle); tabSettingsContainer.appendChild(privacyItem); // 6.9 伪装标题输入框 (privacyTitle) const privacyTitleItem = createElement('div', {className: 'setting-item'}); const privacyTitleInfo = createElement('div', {className: 'setting-item-info'}); privacyTitleInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('privacyTitleLabel'))); const privacyTitleInput = createElement('input', { type: 'text', className: 'prompt-input-title', value: this.settings.tabSettings?.privacyTitle || 'Google', placeholder: this.t('privacyTitlePlaceholder'), style: 'width: 100px; padding: 4px 8px; border: 1px solid #ddd; border-radius: 4px; font-size: 12px;' }); privacyTitleInput.addEventListener('change', () => { this.settings.tabSettings.privacyTitle = privacyTitleInput.value.trim() || 'Google'; this.saveSettings(); if (this.settings.tabSettings.privacyMode && this.tabRenameManager) { this.tabRenameManager.updateTabName(true); } }); privacyTitleItem.appendChild(privacyTitleInfo); privacyTitleItem.appendChild(privacyTitleInput); tabSettingsContainer.appendChild(privacyTitleItem); // 定义状态更新函数（类似 renameInterval 的处理方式） const updatePrivacyTitleState = () => { const isEnabled = this.settings.tabSettings.privacyMode; privacyTitleInput.disabled = !isEnabled; privacyTitleItem.style.opacity = isEnabled ? '1' : '0.5'; privacyTitleItem.style.pointerEvents = isEnabled ? 'auto' : 'none'; }; // 初始化状态 updatePrivacyTitleState(); // 绑定隐私模式开关点击事件 privacyToggle.addEventListener('click', () => { this.settings.tabSettings.privacyMode = !this.settings.tabSettings.privacyMode; privacyToggle.classList.toggle('active', this.settings.tabSettings.privacyMode); this.saveSettings(); if (this.tabRenameManager) this.tabRenameManager.updateTabName(true); // 更新伪装标题项状态 updatePrivacyTitleState(); this.showToast(this.settings.tabSettings.privacyMode ? '🔒 ' + this.t('settingOn') : '🔓 ' + this.t('settingOff')); }); } const tabSettingsSection = this.createCollapsibleSection(this.t('tabSettingsTitle'), tabSettingsContainer, {defaultExpanded: false}); // 7. 其他设置 (折叠面板) - 仅保留站点特定功能 const otherSettingsContainer = createElement('div', {}); // Gemini Business 专属设置 if (this.siteAdapter instanceof GeminiBusinessAdapter) { const clearItem = createElement('div', {className: 'setting-item'}); const clearInfo = createElement('div', {className: 'setting-item-info'}); clearInfo.appendChild(createElement('div', {className: 'setting-item-label'}, this.t('clearOnSendLabel'))); clearInfo.appendChild(createElement('div', {className: 'setting-item-desc'}, this.t('clearOnSendDesc'))); const toggle = createElement('div', { className: 'setting-toggle' + (this.settings.clearTextareaOnSend ? ' active' : ''), id: 'toggle-clear-on-send' }); toggle.addEventListener('click', () => { this.settings.clearTextareaOnSend = !this.settings.clearTextareaOnSend; toggle.classList.toggle('active', this.settings.clearTextareaOnSend); this.saveSettings(); this.showToast(this.settings.clearTextareaOnSend ? this.t('settingOn') : this.t('settingOff')); }); clearItem.appendChild(clearInfo); clearItem.appendChild(toggle); otherSettingsContainer.appendChild(clearItem); } const otherSettingsSection = this.createCollapsibleSection(this.t('otherSettingsTitle'), otherSettingsContainer, {defaultExpanded: false}); // ========== 统一管理分类顺序 ========== // 1. 通用设置（语言）- 已在上方添加 // 2. 标签页设置 if (tabSettingsSection) content.appendChild(tabSettingsSection); // 3. 阅读导航 content.appendChild(anchorSection); // 4. 大纲设置 content.appendChild(outlineSettingsSection); // 5. 页面显示 content.appendChild(widthSection); // 6. 模型锁定 if (lockSection) content.appendChild(lockSection); // 7. 界面排版 content.appendChild(layoutSection); // 8. 其他设置 content.appendChild(otherSettingsSection); container.appendChild(content); } togglePanel() { const panel = document.getElementById('gemini-helper-panel'); const quickBtnGroup = document.getElementById('quick-btn-group'); const toggleBtn = document.getElementById('toggle-panel'); this.isCollapsed = !this.isCollapsed; if (this.isCollapsed) { panel.classList.add('collapsed'); if (quickBtnGroup) quickBtnGroup.classList.remove('hidden'); if (toggleBtn) toggleBtn.textContent = '+'; } else { panel.classList.remove('collapsed'); if (quickBtnGroup) quickBtnGroup.classList.add('hidden'); if (toggleBtn) toggleBtn.textContent = '−'; } } // ==================== Auto-Resume & Anchor Logic ==================== // 恢复阅读历史 (Auto-Resume) async restoreReadingProgress() { // 将 showToast 传给 manager 以显示加载进度 const success = await this.readingProgressManager.restoreProgress((msg) => this.showToast(msg)); const onRestorationComplete = () => { // 延迟一点开启记录，避开惯性滚动等干扰，确保后续的用户滚动能被正确记录 setTimeout(() => { this.readingProgressManager.startRecording(); }, 500); }; if (success) { // 恢复成功，获取恢复的位置设为“初始锚点” const restoredTop = this.readingProgressManager.restoredTop; if (restoredTop !== undefined) { this.anchorManager.setAnchor(restoredTop); } this.showToast(this.t('restoredPosition')); } // 无论成功失败，最后都开启记录 onRestorationComplete(); } // 清理过期阅读历史 cleanupReadingHistory() { this.readingProgressManager.cleanup(); } // 锚点按钮点击 (Back functionality) handleAnchorClick() { if (this.anchorManager.hasAnchor()) { this.anchorManager.backToAnchor(); this.showToast(this.t('jumpToAnchor')); } else { this.showToast('暂无阅读锚点 (点击顶部/底部按钮可自动生成)'); } } // 更新锚点按钮状态 (UI) updateAnchorButtonState(hasAnchor) { [document.getElementById('quick-anchor-btn'), document.getElementById('scroll-anchor-btn')].forEach(btn => { if (btn) { if (hasAnchor) { btn.style.opacity = '1'; btn.style.cursor = 'pointer'; btn.title = this.t('jumpToAnchor'); } else { btn.style.opacity = '0.4'; btn.style.cursor = 'default'; btn.title = "暂无锚点"; } } }); } // 滚动到页面顶部 scrollToTop() { // 点击去顶部时，自动记录当前位置为锚点 this.anchorManager.setAnchor(this.scrollManager.scrollTop); this.scrollManager.scrollTo({top: 0, behavior: 'smooth'}); } // 滚动到页面底部 scrollToBottom() { // 点击去底部时，自动记录当前位置为锚点 this.anchorManager.setAnchor(this.scrollManager.scrollTop); this.scrollManager.scrollTo({top: this.scrollManager.scrollHeight, behavior: 'smooth'}); } refreshCategories() { const container = document.getElementById('prompt-categories'); if (!container) return; const categories = this.getCategories(); clearElement(container); container.appendChild(createElement('span', { className: 'category-tag active', 'data-category': 'all' }, this.t('allCategory'))); categories.forEach(cat => { container.appendChild(createElement('span', {className: 'category-tag', 'data-category': cat}, cat)); }); // 添加分类管理按钮 const manageBtn = createElement('button', { className: 'category-manage-btn', title: this.t('categoryManage') }, this.t('manageCategory')); manageBtn.addEventListener('click', (e) => { e.stopPropagation(); this.showCategoryModal(); }); container.appendChild(manageBtn); } // 显示分类管理弹窗 showCategoryModal() { const categories = this.getCategories(); const modal = createElement('div', {className: 'prompt-modal'}); const modalContent = createElement('div', {className: 'prompt-modal-content category-modal-content'}); const modalHeader = createElement('div', {className: 'prompt-modal-header'}, this.t('categoryManage')); modalContent.appendChild(modalHeader); const categoryList = createElement('div', {className: 'category-list'}); if (categories.length === 0) { categoryList.appendChild(createElement('div', {className: 'category-empty'}, this.t('categoryEmpty'))); } else { categories.forEach(cat => { const count = this.prompts.filter(p => p.category === cat).length; const item = createElement('div', {className: 'category-item'}); const info = createElement('div', {className: 'category-item-info'}); info.appendChild(createElement('span', {className: 'category-item-name'}, cat)); info.appendChild(createElement('span', {className: 'category-item-count'}, `${count} 个提示词`)); const actions = createElement('div', {className: 'category-item-actions'}); const renameBtn = createElement('button', {className: 'category-action-btn rename'}, this.t('rename')); const deleteBtn = createElement('button', {className: 'category-action-btn delete'}, this.t('delete')); renameBtn.addEventListener('click', () => { const newName = window.prompt(this.t('newCategoryName'), cat); if (newName && newName.trim() && newName !== cat) { this.renameCategory(cat, newName.trim()); modal.remove(); this.showCategoryModal(); } }); deleteBtn.addEventListener('click', () => { if (confirm(this.t('confirmDeleteCategory'))) { this.deleteCategory(cat); modal.remove(); this.showCategoryModal(); } }); actions.appendChild(renameBtn); actions.appendChild(deleteBtn); item.appendChild(info); item.appendChild(actions); categoryList.appendChild(item); }); } modalContent.appendChild(categoryList); const btnGroup = createElement('div', {className: 'prompt-modal-btns'}); const closeBtn = createElement('button', {className: 'prompt-modal-btn secondary'}, this.t('cancel')); closeBtn.addEventListener('click', () => modal.remove()); btnGroup.appendChild(closeBtn); modalContent.appendChild(btnGroup); modal.appendChild(modalContent); modal.addEventListener('click', (e) => { if (e.target === modal) modal.remove(); }); document.body.appendChild(modal); } // 重命名分类 renameCategory(oldName, newName) { this.prompts.forEach(p => { if (p.category === oldName) { p.category = newName; } }); this.savePrompts(); this.refreshCategories(); this.refreshPromptList(); this.showToast(`分类已重命名为"${newName}"`); } // 删除分类（将关联提示词移至"未分类"） deleteCategory(name) { this.prompts.forEach(p => { if (p.category === name) { p.category = '未分类'; } }); this.savePrompts(); this.refreshCategories(); this.refreshPromptList(); this.showToast(`分类"${name}"已删除`); } refreshPromptList(filter = '') { const container = document.getElementById('prompt-list'); if (!container) return; const activeCategory = document.querySelector('.category-tag.active')?.dataset.category || 'all'; let filteredPrompts = this.prompts; if (activeCategory !== 'all') filteredPrompts = filteredPrompts.filter(p => p.category === activeCategory); if (filter) filteredPrompts = filteredPrompts.filter(p => p.title.toLowerCase().includes(filter.toLowerCase()) || p.content.toLowerCase().includes(filter.toLowerCase())); clearElement(container); if (filteredPrompts.length === 0) { container.appendChild(createElement('div', {style: 'text-align: center; padding: 20px; color: #9ca3af;'}, '暂无提示词')); return; } filteredPrompts.forEach((prompt, index) => { const item = createElement('div', { className: 'prompt-item', draggable: 'false', style: 'user-select: none;' }); item.dataset.promptId = prompt.id; item.dataset.index = index; if (this.selectedPrompt?.id === prompt.id) item.classList.add('selected'); const itemHeader = createElement('div', {className: 'prompt-item-header'}); itemHeader.appendChild(createElement('div', {className: 'prompt-item-title'}, prompt.title)); itemHeader.appendChild(createElement('span', {className: 'prompt-item-category'}, prompt.category || '未分类')); const itemContent = createElement('div', {className: 'prompt-item-content'}, prompt.content); const itemActions = createElement('div', {className: 'prompt-item-actions'}); const dragBtn = createElement('button', { className: 'prompt-action-btn drag-prompt', 'data-id': prompt.id, title: '拖动排序' }, '☰'); dragBtn.style.cursor = 'grab'; // 仅当按下拖拽按钮时才允许拖动 dragBtn.addEventListener('mousedown', () => { item.setAttribute('draggable', 'true'); // 监听全局鼠标释放，恢复不可拖动 const upHandler = () => { item.setAttribute('draggable', 'false'); window.removeEventListener('mouseup', upHandler); }; window.addEventListener('mouseup', upHandler); }); itemActions.appendChild(dragBtn); itemActions.appendChild(createElement('button', { className: 'prompt-action-btn copy-prompt', 'data-id': prompt.id, title: '复制' }, '📋')); itemActions.appendChild(createElement('button', { className: 'prompt-action-btn edit-prompt', 'data-id': prompt.id, title: '编辑' }, '✏')); itemActions.appendChild(createElement('button', { className: 'prompt-action-btn delete-prompt', 'data-id': prompt.id, title: '删除' }, '🗑')); item.appendChild(itemHeader); item.appendChild(itemContent); item.appendChild(itemActions); item.addEventListener('click', (e) => { if (!e.target.closest('.prompt-item-actions')) this.selectPrompt(prompt, item); }); // 拖拽事件处理 item.addEventListener('dragstart', (e) => { item.classList.add('dragging'); e.dataTransfer.effectAllowed = 'move'; e.dataTransfer.setData('text/html', item.innerHTML); }); item.addEventListener('dragover', (e) => { e.preventDefault(); e.dataTransfer.dropEffect = 'move'; const draggingItem = container.querySelector('.dragging'); if (draggingItem && draggingItem !== item) { const rect = item.getBoundingClientRect(); const midpoint = rect.top + rect.height / 2; if (e.clientY < midpoint) { container.insertBefore(draggingItem, item); } else { container.insertBefore(draggingItem, item.nextSibling); } } }); item.addEventListener('dragend', () => { item.classList.remove('dragging'); item.setAttribute('draggable', 'false'); // 拖拽结束立即恢复 this.updatePromptOrder(); }); container.appendChild(item); }); } // 更新提示词顺序 updatePromptOrder() { const container = document.getElementById('prompt-list'); const items = Array.from(container.querySelectorAll('.prompt-item')); const newOrder = items.map(item => item.dataset.promptId); // 重新排列 prompts 数组 const orderedPrompts = []; newOrder.forEach(id => { const prompt = this.prompts.find(p => p.id === id); if (prompt) orderedPrompts.push(prompt); }); this.prompts = orderedPrompts; this.savePrompts(); this.showToast(this.t('orderUpdated')); } selectPrompt(prompt, itemElement) { if (this.isScrolling) { this.showToast(this.t('scrolling')); return; } this.selectedPrompt = prompt; document.querySelectorAll('.prompt-item').forEach(item => item.classList.remove('selected')); itemElement.classList.add('selected'); // 显示当前提示词悬浮条 const selectedBar = document.querySelector('.selected-prompt-bar'); const selectedText = document.getElementById('selected-prompt-text'); if (selectedBar && selectedText) { selectedText.textContent = prompt.title; selectedBar.classList.add('show'); } this.insertPromptToTextarea(prompt.content); this.showToast(`${this.t('inserted')}: ${prompt.title}`); } insertPromptToTextarea(promptContent) { if (this.isScrolling) { this.showToast('页面正在滚动，请稍后再选择提示词'); return; } const promiseOrResult = this.siteAdapter.insertPrompt(promptContent); // 处理异步返回 (Gemini Business 是异步的) if (promiseOrResult instanceof Promise) { promiseOrResult.then(success => { if (!success) { this.showToast('未找到输入框，请点击输入框后重试'); // 再次尝试查找 this.siteAdapter.findTextarea(); } }); } else if (!promiseOrResult) { this.showToast('未找到输入框，请点击输入框后重试'); this.siteAdapter.findTextarea(); } } clearSelectedPrompt() { this.selectedPrompt = null; document.querySelector('.selected-prompt-bar')?.classList.remove('show'); document.querySelectorAll('.prompt-item').forEach(item => item.classList.remove('selected')); } showEditModal(prompt = null) { const isEdit = prompt !== null; const modal = createElement('div', {className: 'prompt-modal'}); const modalContent = createElement('div', {className: 'prompt-modal-content'}); const modalHeader = createElement('div', {className: 'prompt-modal-header'}, isEdit ? this.t('editPrompt') : this.t('addNewPrompt')); const titleGroup = createElement('div', {className: 'prompt-form-group'}); titleGroup.appendChild(createElement('label', {className: 'prompt-form-label'}, this.t('title'))); const titleInput = createElement('input', { className: 'prompt-form-input', type: 'text', value: isEdit ? prompt.title : '' }); titleGroup.appendChild(titleInput); const categoryGroup = createElement('div', {className: 'prompt-form-group'}); categoryGroup.appendChild(createElement('label', {className: 'prompt-form-label'}, this.t('category'))); const categoryInput = createElement('input', { className: 'prompt-form-input', type: 'text', value: isEdit ? (prompt.category || '') : '', placeholder: this.t('categoryPlaceholder') }); categoryGroup.appendChild(categoryInput); const contentGroup = createElement('div', {className: 'prompt-form-group'}); contentGroup.appendChild(createElement('label', {className: 'prompt-form-label'}, this.t('content'))); const contentTextarea = createElement('textarea', {className: 'prompt-form-textarea'}); contentTextarea.value = isEdit ? prompt.content : ''; contentGroup.appendChild(contentTextarea); const modalActions = createElement('div', {className: 'prompt-modal-actions'}); const cancelBtn = createElement('button', {className: 'prompt-modal-btn secondary'}, this.t('cancel')); const saveBtn = createElement('button', {className: 'prompt-modal-btn primary'}, isEdit ? this.t('save') : this.t('add')); modalActions.appendChild(cancelBtn); modalActions.appendChild(saveBtn); modalContent.appendChild(modalHeader); modalContent.appendChild(titleGroup); modalContent.appendChild(categoryGroup); modalContent.appendChild(contentGroup); modalContent.appendChild(modalActions); modal.appendChild(modalContent); document.body.appendChild(modal); cancelBtn.addEventListener('click', () => modal.remove()); saveBtn.addEventListener('click', () => { const title = titleInput.value.trim(); const content = contentTextarea.value.trim(); if (!title || !content) { alert(this.t('fillTitleContent')); return; } if (isEdit) { this.updatePrompt(prompt.id, {title, category: categoryInput.value.trim(), content}); this.showToast(this.t('promptUpdated')); } else { this.addPrompt({title, category: categoryInput.value.trim(), content}); this.showToast(this.t('promptAdded')); } modal.remove(); }); modal.addEventListener('click', (e) => { if (e.target === modal) modal.remove(); }); } showToast(message) { const toast = createElement('div', {className: 'prompt-toast'}, message); document.body.appendChild(toast); setTimeout(() => { toast.style.animation = 'toastSlideIn 0.3s reverse'; setTimeout(() => toast.remove(), 300); }, 2000); } findElementByComposedPath(e) { if (!e) return null; // 获取事件的完整传播路径（兼容没有 composedPath 的浏览器） const path = typeof e.composedPath === 'function' ? e.composedPath() : (e.path || []); // 获取提交按钮选择器数组并合并成 selector 字符串 const selectors = (this.siteAdapter && typeof this.siteAdapter.getSubmitButtonSelectors === 'function') ? this.siteAdapter.getSubmitButtonSelectors() : []; const combinedSelector = selectors.length ? selectors.join(', ') : ''; if (!combinedSelector) return null; // 查找路径中第一个符合条件的元素 const foundElement = path.find(element => element && element instanceof Element && typeof element.matches === 'function' && element.matches(combinedSelector) ); return foundElement || null; } bindEvents() { const searchInput = document.getElementById('prompt-search'); if (searchInput) searchInput.addEventListener('input', (e) => this.refreshPromptList(e.target.value)); const categories = document.getElementById('prompt-categories'); if (categories) { categories.addEventListener('click', (e) => { if (e.target.classList.contains('category-tag')) { document.querySelectorAll('.category-tag').forEach(tag => tag.classList.remove('active')); e.target.classList.add('active'); this.refreshPromptList(document.getElementById('prompt-search')?.value || ''); } }); } document.getElementById('add-prompt')?.addEventListener('click', () => this.showEditModal()); document.getElementById('prompt-list')?.addEventListener('click', (e) => { if (e.target.classList.contains('edit-prompt')) { const prompt = this.prompts.find(p => p.id === e.target.dataset.id); if (prompt) this.showEditModal(prompt); } else if (e.target.classList.contains('delete-prompt')) { if (confirm(this.t('confirmDelete'))) { this.deletePrompt(e.target.dataset.id); this.showToast(this.t('deleted')); } } else if (e.target.classList.contains('copy-prompt')) { const prompt = this.prompts.find(p => p.id === e.target.dataset.id); if (prompt) { navigator.clipboard.writeText(prompt.content).then(() => { this.showToast(this.t('copied')); }).catch(() => { // 降级方案 const textarea = document.createElement('textarea'); textarea.value = prompt.content; document.body.appendChild(textarea); textarea.select(); document.execCommand('copy'); document.body.removeChild(textarea); this.showToast(this.t('copied')); }); } } }); document.getElementById('clear-prompt')?.addEventListener('click', () => { this.clearSelectedPrompt(); // 针对 Gemini Business，根据设置决定是否用零宽字符清空 if (this.siteAdapter instanceof GeminiBusinessAdapter) { if (this.settings.clearTextareaOnSend) { this.siteAdapter.clearTextarea(); // 插入零宽字符 } else { this.siteAdapter.clearTextareaNormal(); // 普通清空 } } else { // 其他适配器调用各自的 clearTextarea 方法 this.siteAdapter.clearTextarea(); } this.showToast(this.t('cleared')); }); this.makeDraggable(); // 2. 按钮点击监听 document.addEventListener('click', (e) => { // 委托适配器检查是否为输入框，自动更新引用 if (this.siteAdapter.isValidTextarea(e.target)) { this.siteAdapter.textarea = e.target; } else { const closest = e.target.closest('[contenteditable="true"], .ProseMirror, textarea'); if (closest && this.siteAdapter.isValidTextarea(closest)) { this.siteAdapter.textarea = closest; } } // 检测是否点击了发送按钮 const found = this.findElementByComposedPath(e); let matched = !!found; // 如果 composedPath 没命中，尝试使用 closest 回退（兼容 Shadow DOM 之外的情况） if (!matched && e && e.target && typeof e.target.closest === 'function') { const selectors = (this.siteAdapter && typeof this.siteAdapter.getSubmitButtonSelectors === 'function') ? this.siteAdapter.getSubmitButtonSelectors() : []; const combined = selectors.length ? selectors.join(', ') : ''; if (combined) { try { matched = !!e.target.closest(combined); } catch (err) { matched = false; } } } if (matched) { // 如果有选中的提示词，清除悬浮条 if (this.selectedPrompt) { setTimeout(() => { this.clearSelectedPrompt(); }, 100); } // 针对 Gemini Business：无论是否使用提示词，发送后都修复中文输入 if (this.siteAdapter instanceof GeminiBusinessAdapter && this.settings.clearTextareaOnSend) { setTimeout(() => { this.siteAdapter.clearTextarea(); }, 200); } } }); // 3. 回车键发送监听 document.addEventListener('keydown', (e) => { // 仅处理 Enter 键（不带 Shift 修饰符，避免干扰换行操作） if (e.key !== 'Enter' || e.shiftKey) return; // 使用 composedPath 检查事件源是否来自输入框（兼容 Shadow DOM） const path = typeof e.composedPath === 'function' ? e.composedPath() : (e.path || []); const isFromTextarea = path.some(element => element && element instanceof Element && this.siteAdapter.isValidTextarea(element) ); if (!isFromTextarea) return; // 清理逻辑 if (this.selectedPrompt) { setTimeout(() => { this.clearSelectedPrompt(); }, 100); } // 针对 Gemini Business：无论是否使用提示词，发送后都修复中文输入 if (this.siteAdapter instanceof GeminiBusinessAdapter && this.settings.clearTextareaOnSend) { setTimeout(() => { this.siteAdapter.clearTextarea(); }, 200); } }, true); // 使用捕获阶段确保在 Shadow DOM 场景下也能捕获 document.getElementById('toggle-panel')?.addEventListener('click', () => this.togglePanel()); this.makeDraggable(); // 初始化 URL 监听 (处理 SPA 页面跳转) this.initUrlChangeObserver(); } initUrlChangeObserver() { let lastUrl = window.location.href; const checkUrl = () => { const currentUrl = window.location.href; if (currentUrl !== lastUrl) { lastUrl = currentUrl; // URL 变化时，先停止录制（防止错误覆盖新会话的持久化数据） this.readingProgressManager.stopRecording(); // 重置内存中的锚点状态 this.anchorScrollTop = null; this.anchorManager.reset(); // 会话切换时立即更新标签页标题 if (this.tabRenameManager && this.settings.tabSettings?.autoRenameTab) { // 清除缓存的会话名称，强制从新会话获取 this.tabRenameManager.lastSessionName = null; // 多次尝试更新，因为 Gemini 可能需要时间来更新页面标题 [300, 800, 1500].forEach(delay => { setTimeout(() => { this.tabRenameManager.updateTabName(true); }, delay); }); } // 给予页面渲染一点时间后尝试恢复 setTimeout(() => { this.restoreReadingProgress(); // 针对 Gemini Business：切换会话后修复中文输入 if (this.siteAdapter instanceof GeminiBusinessAdapter && this.settings.clearTextareaOnSend) { // 切换会话后 textarea 引用可能失效，需要重新查找 this.siteAdapter.findTextarea(); this.siteAdapter.clearTextarea(); } }, 1500); } }; // 1. 监听 popstate (后退/前进) window.addEventListener('popstate', checkUrl); // 2. Monkey patch pushState/replaceState const originalPushState = history.pushState; const originalReplaceState = history.replaceState; history.pushState = function () { originalPushState.apply(this, arguments); checkUrl(); }; history.replaceState = function () { originalReplaceState.apply(this, arguments); checkUrl(); }; // 3. 定时器兜底 (防止某些框架绕过 history API) setInterval(checkUrl, 1000); } makeDraggable() { const panel = document.getElementById('gemini-helper-panel'); const header = panel?.querySelector('.prompt-panel-header'); if (!panel || !header) return; let isDragging = false, currentX, currentY, initialX, initialY, xOffset = 0, yOffset = 0; header.addEventListener('mousedown', (e) => { if (e.target.closest('.prompt-panel-controls')) return; e.preventDefault(); // 阻止文本选中 initialX = e.clientX - xOffset; initialY = e.clientY - yOffset; isDragging = true; // 拖动时禁止全局文本选中 document.body.style.userSelect = 'none'; }); document.addEventListener('mousemove', (e) => { if (isDragging) { e.preventDefault(); currentX = e.clientX - initialX; currentY = e.clientY - initialY; xOffset = currentX; yOffset = currentY; panel.style.transform = `translate(${currentX}px, ${currentY}px)`; } }); document.addEventListener('mouseup', () => { if (isDragging) { isDragging = false; // 恢复文本选中 document.body.style.userSelect = ''; } }); } } function init() { try { console.log('Gemini Helper: Initializing...'); // 初始化站点注册表 const siteRegistry = new SiteRegistry(); siteRegistry.register(new GeminiBusinessAdapter()); // 优先检测 siteRegistry.register(new GeminiAdapter()); siteRegistry.register(new GensparkAdapter()); const currentAdapter = siteRegistry.detect(); if (!currentAdapter) { console.log('Gemini Helper: 未匹配到当前站点，跳过初始化。'); return; } console.log(`Gemini Helper: 已匹配站点 - ${currentAdapter.getName()}`); setTimeout(() => { try { console.log('Gemini Helper: Creating instance...'); window.geminiHelper = new GeminiHelper(siteRegistry); console.log('Gemini Helper: Instance created successfully.'); } catch (error) { console.error('Gemini Helper: 启动失败 (Constructor Error)', error); } }, 2000); } catch (e) { console.error('Gemini Helper: 初始化失败 (Init Error)', e); } } if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', init); } else { init(); } })();