// ==UserScript==
// @name         摸鱼版枫叶穿行
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  高度834px、宽度自适应，带拖动功能和关闭按钮的iframe容器,iframe地址可以替换为自己喜欢的网址
// @author       richy
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    
    // 防止嵌套渲染 - 检查是否已经在页面中加载过此脚本
    const scriptId = 'game-dialog-script-loaded';
    if (document.getElementById(scriptId)) {
        return; // 如果已经存在标记，说明已经加载过，不再执行
    }
    
    // 创建标记元素
    const scriptMarker = document.createElement('div');
    scriptMarker.id = scriptId;
    scriptMarker.style.display = 'none';
    document.body.appendChild(scriptMarker);
    
    // 检查是否在iframe内部运行，如果是则不执行
    if (window.self !== window.top) {
        // 在iframe内部，可以选择不执行或者根据需要调整行为
        console.log('在iframe内检测到脚本，避免重复渲染');
        return;
    }

    // 创建主容器
    const container = document.createElement('div');
    container.style.cssText = `
        height: 152px;
        width: 651px;
        position: fixed;
        top: 50px;
        left: 0;
        z-index: 9999;
        border: 1px solid #ccc;
        background: white;
        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
        transition: box-shadow 0.2s ease;
        box-sizing: border-box;
    `;

    // 创建拖动把手
    const handle = document.createElement('div');
    handle.style.cssText = `
        height: 30px;
        background: #f5f5f5;
        border-bottom: 1px solid #eee;
        cursor: move;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 80px;
        font-family: Arial, sans-serif;
        font-size: 12px;
        color: #666;
        z-index: 1;
        position: relative;
    `;
    handle.textContent = '拖动此区域移动窗口';

    // 创建折叠/展开按钮
    const toggleBtn = document.createElement('button');
    toggleBtn.style.cssText = `
        position: absolute;
        right: 40px;
        top: 50%;
        transform: translateY(-50%);
        width: 20px;
        height: 20px;
        border: none;
        border-radius: 50%;
        background: #4d94ff;
        color: white;
        font-size: 14px;
        line-height: 1;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        transition: background 0.2s;
    `;
    toggleBtn.textContent = '−';
    toggleBtn.title = '折叠/展开窗口';
    
    // 折叠/展开按钮hover效果
    toggleBtn.addEventListener('mouseover', () => {
        toggleBtn.style.background = '#3385ff';
    });
    toggleBtn.addEventListener('mouseout', () => {
        toggleBtn.style.background = '#4d94ff';
    });
    
    // 折叠/展开状态变量
    let isCollapsed = false;
    let originalHeight = '152px'; // 存储原始高度
    
    // 折叠/展开功能
    toggleBtn.addEventListener('click', (e) => {
        e.stopPropagation();
        
        if (isCollapsed) {
            // 展开
            container.style.height = originalHeight;
            iframe.style.display = 'block';
            toggleBtn.textContent = '−';
            toggleBtn.title = '折叠窗口';
        } else {
            // 折叠
            originalHeight = container.style.height;
            container.style.height = '30px';
            iframe.style.display = 'none';
            toggleBtn.textContent = '+';
            toggleBtn.title = '展开窗口';
        }
        
        isCollapsed = !isCollapsed;
    });

    // 创建关闭按钮
    const closeBtn = document.createElement('button');
    closeBtn.style.cssText = `
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        width: 20px;
        height: 20px;
        border: none;
        border-radius: 50%;
        background: #ff4d4d;
        color: white;
        font-size: 14px;
        line-height: 1;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        transition: background 0.2s;
    `;
    closeBtn.textContent = '×';
    closeBtn.title = '关闭窗口';

    // 关闭按钮hover效果
    closeBtn.addEventListener('mouseover', () => {
        closeBtn.style.background = '#ff3333';
    });
    closeBtn.addEventListener('mouseout', () => {
        closeBtn.style.background = '#ff4d4d';
    });

    // 关闭按钮点击事件
    closeBtn.addEventListener('click', (e) => {
        // 阻止事件冒泡，避免触发拖动
        e.stopPropagation();
        // 移除容器及所有事件监听
        // window.removeEventListener('resize', handleResize);
        document.removeEventListener('mousemove', handleMouseMove);
        container.remove();
    });

    // 创建iframe
    const iframe = document.createElement('iframe');
    iframe.src = 'https://www.bilibili.com/blackboard/fe/activity-HQjQSdd3L8.html'; // 可替换为目标URL
    iframe.style.cssText = `
        width: 100%;
        height: calc(100% - 30px);
        border: none;
        position: relative;
        z-index: 0;
    `;
    iframe.title = '嵌入式内容';

    // 组装元素
    handle.appendChild(toggleBtn);
    handle.appendChild(closeBtn);
    container.appendChild(handle);
    container.appendChild(iframe);
    document.body.appendChild(container);

    // 拖动功能变量
    let isDragging = false;
    let offsetX, offsetY;

    // 窗口大小调整处理
    function handleResize() {
        container.style.width = `${window.innerWidth}px`;
    }
    // window.addEventListener('resize', handleResize);
    // handleResize();

    // 鼠标移动处理函数（提取为单独函数方便移除）
    function handleMouseMove(e) {
        if (!isDragging) return;
        
        const newLeft = e.clientX - offsetX;
        const newTop = e.clientY - offsetY;
        container.style.left = `${newLeft}px`;
        container.style.top = `${newTop}px`;
        // 限制在可视区内
        // if (newLeft >= 0 && newLeft + container.offsetWidth <= window.innerWidth) {
        //     container.style.left = `${newLeft}px`;
        // }
        // if (newTop >= 0 && newTop + container.offsetHeight <= window.innerHeight) {
        //     container.style.top = `${newTop}px`;
        // }
    }

    // 拖动事件
    handle.addEventListener('mousedown', (e) => {
        isDragging = true;
        const rect = container.getBoundingClientRect();
        offsetX = e.clientX - rect.left;
        offsetY = e.clientY - rect.top;
        container.style.boxShadow = '0 6px 16px rgba(0,0,0,0.2)';
        handle.style.background = '#e9e9e9';
        e.preventDefault();
    });

    document.addEventListener('mousemove', handleMouseMove);

    document.addEventListener('mouseup', () => {
        if (isDragging) {
            isDragging = false;
            container.style.boxShadow = '0 4px 12px rgba(0,0,0,0.15)';
            handle.style.background = '#f5f5f5';
        }
    });

})();