☰

YouTube to Gemini 自动总结

在YouTube视频中添加按钮，点击后跳转到Gemini并自动输入提示词总结视频

// ==UserScript==
// @name         YouTube to Gemini 自动总结 
// @namespace    http://tampermonkey.net/
// @version      0.7.1
// @description  在YouTube视频中添加按钮，点击后跳转到Gemini并自动输入提示词总结视频 
// @author       hengyu (Optimized by Assistant)
// @match        *://www.youtube.com/*
// @match        *://gemini.google.com/*
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_deleteValue
// @run-at       document-start // Run earlier to catch events
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    // --- 配置 ---
    // Reduced check interval for MutationObserver fallback/initial checks if needed, but Observer is primary
    const CHECK_INTERVAL_MS = 200;
    const YOUTUBE_ELEMENT_TIMEOUT_MS = 10000; // 等待YouTube元素的最大时间(毫秒)
    const GEMINI_ELEMENT_TIMEOUT_MS = 15000; // 等待Gemini元素的最大时间(毫秒)
    const GEMINI_PROMPT_EXPIRY_MS = 300000; // 提示词传输有效期5分钟
    // Removed URL_CHECK_INTERVAL_MS as we now use events

    // --- 调试日志 ---
    const DEBUG = false; // Set to true to enable detailed logs
    function debugLog(message) {
        if (DEBUG) {
            console.log(`[YT->Gemini Optimized] ${message}`);
        }
    }

    // --- 辅助函数 ---

    /**
     * Waits for one or more elements matching the selectors to appear and be visible in the DOM.
     * Prioritizes MutationObserver for efficiency, falls back to polling if needed.
     * @param {string|string[]} selectors - A CSS selector string or an array of selectors.
     * @param {number} timeoutMs - Maximum time to wait in milliseconds.
     * @param {Element} [parent=document] - The parent element to search within.
     * @returns {Promise<Element>} A promise that resolves with the found element.
     */
    function waitForElement(selectors, timeoutMs, parent = document) {
        const selectorArray = Array.isArray(selectors) ? selectors : [selectors];
        const combinedSelector = selectorArray.join(', '); // Efficiently query all at once

        return new Promise((resolve, reject) => {
            // Check immediately in case the element is already present
            const initialElement = findVisibleElement(combinedSelector, parent);
            if (initialElement) {
                debugLog(`Element found immediately: ${combinedSelector}`);
                return resolve(initialElement);
            }

            let observer = null;
            let timeoutId = null;

            const cleanup = () => {
                if (observer) {
                    observer.disconnect();
                    observer = null;
                    debugLog(`MutationObserver disconnected for: ${combinedSelector}`);
                }
                if (timeoutId) {
                    clearTimeout(timeoutId);
                    timeoutId = null;
                }
            };

            const onTimeout = () => {
                cleanup();
                debugLog(`Element not found or not visible after ${timeoutMs}ms: ${combinedSelector}`);
                reject(new Error(`Element not found or not visible: ${combinedSelector}`));
            };

            const checkNode = (node) => {
                if (node && node.nodeType === Node.ELEMENT_NODE) {
                    // Check if the added node itself matches
                    if (node.matches(combinedSelector) && isElementVisible(node)) {
                         debugLog(`Element found via MutationObserver (direct match): ${combinedSelector}`);
                         cleanup();
                         resolve(node);
                         return true;
                    }
                    // Check if any descendant matches
                    const foundDescendant = findVisibleElement(combinedSelector, node);
                    if (foundDescendant) {
                         debugLog(`Element found via MutationObserver (descendant): ${combinedSelector}`);
                         cleanup();
                         resolve(foundDescendant);
                         return true;
                    }
                }
                return false;
            };

            timeoutId = setTimeout(onTimeout, timeoutMs);

            observer = new MutationObserver((mutations) => {
                for (const mutation of mutations) {
                    if (mutation.type === 'childList') {
                        for (const node of mutation.addedNodes) {
                            if (checkNode(node)) return;
                        }
                    } else if (mutation.type === 'attributes') {
                        // Check if the target element itself became visible or matches now
                        if (checkNode(mutation.target)) return;
                    }
                }
                // Fallback check in case visibility changed without node addition/direct attribute change matching selector
                const element = findVisibleElement(combinedSelector, parent);
                if (element) {
                    debugLog(`Element found via MutationObserver (fallback check): ${combinedSelector}`);
                    cleanup();
                    resolve(element);
                }
            });

            observer.observe(parent === document ? document.documentElement : parent, {
                childList: true,
                subtree: true,
                attributes: true, // Observe attributes changes (like style, class, disabled)
                attributeFilter: ['style', 'class', 'disabled'] // Be specific if possible
            });
            debugLog(`MutationObserver started for: ${combinedSelector}`);
        });
    }

    /**
     * Finds the first visible element matching the selector within the parent.
     * @param {string} selector - The CSS selector.
     * @param {Element} parent - The parent element.
     * @returns {Element|null} The found visible element or null.
     */
    function findVisibleElement(selector, parent) {
        try {
            const elements = parent.querySelectorAll(selector);
            for (const el of elements) {
                if (isElementVisible(el)) {
                     // Skip disabled buttons specifically, as needed by original script
                    if (selector.includes('button') && el.disabled) {
                       continue;
                    }
                    return el;
                }
            }
        } catch (e) {
            debugLog(`Error finding element with selector "${selector}": ${e}`);
        }
        return null;
    }

    /**
     * Checks if an element is potentially visible to the user.
     * @param {Element} el - The element to check.
     * @returns {boolean} True if the element is considered visible.
     */
    function isElementVisible(el) {
        if (!el) return false;
        // Basic check: offsetWidth/Height covers display:none and zero size
        // getClientRects checks for elements like <details> summary when closed
        return (el.offsetWidth > 0 || el.offsetHeight > 0 || el.getClientRects().length > 0);
    }


    function copyToClipboard(text) {
        navigator.clipboard.writeText(text).then(() => {
            debugLog("Text copied to clipboard via modern API.");
        }).catch(err => {
            debugLog(`Clipboard API failed: ${err}, using legacy method.`);
            legacyClipboardCopy(text);
        });
    }

    function legacyClipboardCopy(text) {
        const textarea = document.createElement('textarea');
        textarea.value = text;
        textarea.style.position = 'fixed'; // Prevent scrolling to bottom
        textarea.style.top = '-9999px';
        textarea.style.left = '-9999px';
        document.body.appendChild(textarea);
        textarea.select();
        try {
            const successful = document.execCommand('copy');
            debugLog(`Legacy copy attempt: ${successful ? 'Success' : 'Fail'}`);
        } catch (err) {
            debugLog('Failed to copy to clipboard using legacy execCommand: ' + err);
        }
        document.body.removeChild(textarea);
    }

     function showNotification(elementId, message, styles, duration = 15000) {
        let existingNotification = document.getElementById(elementId);
        if (existingNotification) {
            // Clear existing timeout if replacing notification
            const existingTimeoutId = existingNotification.dataset.timeoutId;
            if (existingTimeoutId) {
                clearTimeout(parseInt(existingTimeoutId));
            }
            existingNotification.remove();
        }

        const notification = document.createElement('div');
        notification.id = elementId;
        // Use textContent for safety, but allow basic formatting via template literal
        notification.textContent = message; // More secure than innerText? Let's stick to textContent for now. Use innerHTML if HTML is needed, carefully.
        Object.assign(notification.style, styles);

        document.body.appendChild(notification);

        const closeButton = document.createElement('button');
        closeButton.textContent = '✕'; // Use textContent
        Object.assign(closeButton.style, {
            position: 'absolute', top: '5px', right: '10px', background: 'transparent',
            border: 'none', color: 'inherit', fontSize: '16px', cursor: 'pointer', padding: '0', lineHeight: '1'
        });
        closeButton.onclick = () => notification.remove(); // Simplified removal
        notification.appendChild(closeButton);

        const timeoutId = setTimeout(() => notification.remove(), duration);
        notification.dataset.timeoutId = timeoutId.toString(); // Store timeout ID
    }


    // --- YouTube Related ---
    const YOUTUBE_NOTIFICATION_ID = 'gemini-yt-notification';
    const YOUTUBE_NOTIFICATION_STYLE = {
        position: 'fixed', bottom: '20px', left: '50%', transform: 'translateX(-50%)',
        backgroundColor: 'rgba(0,0,0,0.85)', color: 'white', padding: '15px 35px 15px 20px', // Adjusted padding for close button
        borderRadius: '8px', zIndex: '9999', maxWidth: 'calc(100% - 40px)', textAlign: 'left',
        boxSizing: 'border-box', whiteSpace: 'pre-wrap', // Use pre-wrap for better line breaks
        boxShadow: '0 4px 12px rgba(0,0,0,0.3)'
    };
    const BUTTON_ID = 'gemini-summarize-btn';

    function isVideoPage() {
        // More robust check for video page
        return window.location.pathname === '/watch' && new URLSearchParams(window.location.search).has('v');
    }

    async function addSummarizeButton() {
        // 1. Check if it's a video page
        if (!isVideoPage()) {
            debugLog("Not a video page, skipping button add.");
            removeSummarizeButtonIfExists(); // Clean up if navigating away
            return;
        }

        // 2. Check if button already exists
        if (document.getElementById(BUTTON_ID)) {
            debugLog("Summarize button already exists.");
            return;
        }

        debugLog("Video page detected. Attempting to add summarize button...");

        // 3. Define potential containers (prioritize more stable ones)
        const containerSelectors = [
            // Primary button containers often near subscribe/join
            '#top-row.ytd-watch-metadata > #subscribe-button', // Insert *before* subscribe
            '#meta-contents #subscribe-button',                // Alternative path
            '#owner #subscribe-button',                       // Another path
            // Fallback locations
            '#meta-contents #top-row', // Add to the end of the top row
             '#above-the-fold #title', // Add near the title
            'ytd-watch-metadata #actions', // Near like/dislike etc.
            '#masthead #end' // Last resort in top bar
        ];

        try {
            // 4. Wait for *any* of the potential containers/anchors
            // We wait for the *anchor* element to insert *relative* to it.
            const anchorElement = await waitForElement(containerSelectors, YOUTUBE_ELEMENT_TIMEOUT_MS);
            debugLog(`Found anchor element using selector matching: ${anchorElement.tagName}[id="${anchorElement.id}"][class="${anchorElement.className}"]`);

             // Re-check if button was added concurrently while waiting
             if (document.getElementById(BUTTON_ID)) {
                 debugLog("Button was added concurrently, skipping.");
                 return;
             }

            // 5. Create the button
            const button = document.createElement('button');
            button.id = BUTTON_ID;
            button.textContent = '📝 Gemini摘要'; // Use textContent

            // Apply styles
            Object.assign(button.style, {
                backgroundColor: '#1a73e8', // Google blue
                color: 'white', border: 'none', borderRadius: '18px', // Match YT button style
                padding: '0 16px', margin: '0 8px', cursor: 'pointer', fontWeight: '500', // Medium weight
                height: '36px', // Match YT button height
                display: 'inline-flex', alignItems: 'center', justifyContent: 'center',
                fontSize: '14px', // Match YT button font size
                zIndex: '100', // Ensure visibility
                whiteSpace: 'nowrap', // Prevent wrapping
                transition: 'background-color 0.3s ease' // Smooth hover
            });
            // Hover effect
            button.onmouseover = () => button.style.backgroundColor = '#185abc'; // Darker blue
            button.onmouseout = () => button.style.backgroundColor = '#1a73e8';

            // 6. Add click listener
            button.addEventListener('click', handleSummarizeClick);

            // 7. Insert the button
            // If we found a specific button like 'subscribe', insert before it. Otherwise, append.
             if (anchorElement.id?.includes('subscribe-button') || anchorElement.tagName === 'BUTTON') {
                 anchorElement.parentNode.insertBefore(button, anchorElement);
                 debugLog(`Button inserted before anchor: ${anchorElement.id || anchorElement.tagName}`);
             } else if (anchorElement.id === 'actions' || anchorElement.id === 'end' || anchorElement.id === 'top-row') {
                 // Append as first child for some containers, last for others might be better? Let's try first child generally
                 anchorElement.insertBefore(button, anchorElement.firstChild);
                 debugLog(`Button inserted as first child of container: ${anchorElement.id || anchorElement.tagName}`);
            } else {
                 // Default: Append to the container found
                 anchorElement.appendChild(button);
                  debugLog(`Button appended to container: ${anchorElement.id || anchorElement.tagName}`);
             }


            debugLog("Summarize button successfully added!");

        } catch (error) {
            console.error('[YT->Gemini Optimized] Failed to add summarize button:', error);
             removeSummarizeButtonIfExists(); // Clean up partial attempts if error occurs
        }
    }

    function handleSummarizeClick() {
        try {
            const youtubeUrl = window.location.href;
            // Try getting title more robustly
            const titleElement = document.querySelector('h1.ytd-watch-metadata, #video-title, #title h1');
            const videoTitle = titleElement?.textContent?.trim() || document.title.replace(/ - YouTube$/, '').trim() || 'Unknown Video';

            const prompt = `请分析这个YouTube视频: ${youtubeUrl}\n\n提供一个全面的摘要，包括主要观点、关键见解和视频中讨论的重要细节，以结构化的方式分解内容，并包括任何重要的结论或要点。`;
            debugLog(`Generated prompt for: ${videoTitle}`);

            // Store data using GM functions
            GM_setValue('geminiPrompt', prompt);
            GM_setValue('videoTitle', videoTitle);
            GM_setValue('timestamp', Date.now());

            // Open Gemini in a new tab
            window.open('https://gemini.google.com/', '_blank');
            debugLog("Opened Gemini tab.");

            // Show notification on YouTube page
            const notificationMessage = `
已跳转到 Gemini！
系统将尝试自动输入提示词并发送请求。

视频: "${videoTitle}"

(如果自动操作失败，提示词已复制到剪贴板，请手动粘贴)
            `.trim();
            showNotification(YOUTUBE_NOTIFICATION_ID, notificationMessage, YOUTUBE_NOTIFICATION_STYLE, 10000); // 10 second duration

            // Copy to clipboard as fallback
            copyToClipboard(prompt);

        } catch (error) {
            console.error("[YT->Gemini Optimized] Error during summarize button click:", error);
            showNotification(YOUTUBE_NOTIFICATION_ID, `创建摘要时出错: ${error.message}`, { ...YOUTUBE_NOTIFICATION_STYLE, backgroundColor: '#d93025', color: 'white' }, 10000);
        }
    }

    function removeSummarizeButtonIfExists() {
        const button = document.getElementById(BUTTON_ID);
        if (button) {
            button.remove();
            debugLog("Removed existing summarize button.");
        }
    }


    // --- Gemini Related ---
    const GEMINI_NOTIFICATION_ID = 'gemini-auto-notification';
    const GEMINI_NOTIFICATION_STYLES = {
        info: { backgroundColor: '#e8f4fd', color: '#1967d2', border: '1px solid #a8c7fa' }, // Google info blue
        warning: { backgroundColor: '#fef7e0', color: '#a56300', border: '1px solid #fdd663' }, // Google warning yellow
        error: { backgroundColor: '#fce8e6', color: '#c5221f', border: '1px solid #f7a7a5' }  // Google error red
    };
    const BASE_GEMINI_NOTIFICATION_STYLE = {
        position: 'fixed', bottom: '20px', right: '20px', padding: '15px 35px 15px 20px', // Adjusted padding
        borderRadius: '8px', zIndex: '9999', maxWidth: '350px', textAlign: 'left',
        boxSizing: 'border-box', boxShadow: '0 4px 12px rgba(0,0,0,0.15)', whiteSpace: 'pre-wrap'
    };

    function showGeminiNotification(message, type = "info") {
        const style = { ...BASE_GEMINI_NOTIFICATION_STYLE, ...(GEMINI_NOTIFICATION_STYLES[type] || GEMINI_NOTIFICATION_STYLES.info) };
        showNotification(GEMINI_NOTIFICATION_ID, message, style, 12000); // 12 second duration
    }

    async function handleGeminiPage() {
        debugLog("Gemini page detected. Checking for pending prompt...");

        const prompt = GM_getValue('geminiPrompt', '');
        const timestamp = GM_getValue('timestamp', 0);
        const videoTitle = GM_getValue('videoTitle', 'N/A');

        // Clean up expired/invalid data immediately
        if (!prompt || Date.now() - timestamp > GEMINI_PROMPT_EXPIRY_MS) {
            debugLog("No valid prompt found or prompt expired.");
            GM_deleteValue('geminiPrompt');
            GM_deleteValue('timestamp');
            GM_deleteValue('videoTitle');
            return;
        }

        debugLog("Valid prompt found. Waiting for Gemini input area...");
        showGeminiNotification(`检测到来自 YouTube 的请求...\n视频: "${videoTitle}"`, "info");

        // Define selectors for input area and send button
        const textareaSelectors = [
            // More specific selectors first
             'div.input-area > div.input-box > div[contenteditable="true"]', // Common structure
             'div[role="textbox"][contenteditable="true"]',
             'textarea[aria-label*="Prompt"]', // Less common but possible
            // Broader fallbacks
            'div[contenteditable="true"]',
            'textarea'
        ];
        const sendButtonSelectors = [
            // More specific selectors first
            'button[aria-label*="Send message"], button[aria-label*="发送消息"]', // Common aria-labels
            'button:has(span[class*="send-icon"])', // Structure based
             'button.send-button', // Potential class
            // Fallbacks (less reliable, might match other buttons)
            'button:has(mat-icon[data-mat-icon-name="send"])', // Material icon (keep as fallback)
            'button[aria-label="Run"], button[aria-label="Submit"]'
        ];

        try {
            // Wait for the input area
            const textarea = await waitForElement(textareaSelectors, GEMINI_ELEMENT_TIMEOUT_MS);
            debugLog("Found input area. Inserting prompt.");

            // --- Input Prompt ---
            textarea.focus();
             let inputSuccess = false;
             if (textarea.isContentEditable) {
                 textarea.textContent = prompt; // Use textContent for contenteditable
                 inputSuccess = true;
             } else if (textarea.tagName === 'TEXTAREA') {
                 textarea.value = prompt;
                 inputSuccess = true;
             }

            if (!inputSuccess) {
                 throw new Error("Could not determine how to input text into the found element.");
             }

            // Trigger input event to ensure Gemini UI updates (e.g., enables send button)
             textarea.dispatchEvent(new Event('input', { bubbles: true, cancelable: true }));
             textarea.dispatchEvent(new Event('change', { bubbles: true, cancelable: true })); // Also trigger change
             debugLog("Prompt inserted and events dispatched.");

             // Short delay to allow UI to potentially update (e.g., enabling send button)
             await new Promise(resolve => setTimeout(resolve, 150)); // Slightly longer? 150ms

             // --- Find and Click Send Button ---
            debugLog("Waiting for send button to be enabled...");
            const sendButton = await waitForElement(sendButtonSelectors, GEMINI_ELEMENT_TIMEOUT_MS);

            // Check if button is truly clickable (not disabled)
             if (sendButton.disabled || sendButton.getAttribute('aria-disabled') === 'true') {
                 debugLog("Send button found but is disabled. Waiting a bit longer...");
                 await new Promise(resolve => setTimeout(resolve, 500)); // Wait half a second more
                 if (sendButton.disabled || sendButton.getAttribute('aria-disabled') === 'true') {
                     throw new Error("Send button remained disabled.");
                 }
                 debugLog("Send button became enabled after waiting.");
             }

            debugLog("Clicking send button...");
            sendButton.click();

             // --- Success ---
            debugLog("Successfully sent prompt to Gemini.");
             const successMessage = `
已自动发送视频摘要请求！
正在为视频分析做准备:
"${videoTitle}"

请稍候...
             `.trim();
            showGeminiNotification(successMessage, "info");

            // Clean up stored data after successful submission
            GM_deleteValue('geminiPrompt');
            GM_deleteValue('timestamp');
            GM_deleteValue('videoTitle');

        } catch (error) {
             console.error('[YT->Gemini Optimized] Error handling Gemini page:', error);
             showGeminiNotification(`自动操作失败: ${error.message}\n\n提示词已复制到剪贴板，请手动粘贴并发送。`, "error");
             copyToClipboard(prompt); // Ensure clipboard has the prompt on error
             // Optionally clear GM values even on error to prevent retries on refresh? Or keep them? Let's clear them.
            GM_deleteValue('geminiPrompt');
            GM_deleteValue('timestamp');
            GM_deleteValue('videoTitle');
        }
    }

    // --- Main Execution Logic ---

    debugLog("Script starting execution...");

    if (window.location.hostname.includes('www.youtube.com')) {
        debugLog("YouTube domain detected.");

        // Initial check in case the script loads after the page is ready
        if (document.readyState === 'complete' || document.readyState === 'interactive') {
            addSummarizeButton();
        } else {
            window.addEventListener('DOMContentLoaded', addSummarizeButton, { once: true });
        }

        // Listen for YouTube's specific navigation events (more reliable than URL polling)
        // 'yt-navigate-finish' fires after navigation and content update
        window.addEventListener('yt-navigate-finish', () => {
             debugLog("yt-navigate-finish event detected.");
             // Use requestAnimationFrame to ensure layout is likely stable after event
             requestAnimationFrame(addSummarizeButton);
            //setTimeout(addSummarizeButton, 50); // Small delay can sometimes help ensure elements are ready
        });

         // Also handle popstate for browser back/forward
         window.addEventListener('popstate', () => {
             debugLog("popstate event detected.");
             requestAnimationFrame(addSummarizeButton);
             //setTimeout(addSummarizeButton, 50);
         });

        // We might not need pushState override if yt-navigate-finish works reliably
        /*
        const originalPushState = history.pushState;
        history.pushState = function() {
            originalPushState.apply(this, arguments);
            debugLog("history.pushState detected.");
            // Use rAF here too
            requestAnimationFrame(addSummarizeButton);
            // setTimeout(addSummarizeButton, 50);
        };
        */


    } else if (window.location.hostname.includes('gemini.google.com')) {
        debugLog("Gemini domain detected.");

        // Handle Gemini logic once the DOM is ready
         if (document.readyState === 'complete' || document.readyState === 'interactive') {
             handleGeminiPage();
         } else {
             window.addEventListener('DOMContentLoaded', handleGeminiPage, { once: true });
         }

    } else {
         debugLog(`Script loaded on unrecognized domain: ${window.location.hostname}`);
     }

})();

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址