// ==UserScript==
// @name         125论坛手机版优化
// @namespace    http://tampermonkey.net/
// @version      3.8
// @description  通过模拟小米10 Pro设备来优化125论坛移动端显示
// @author       Your name
// @match        https://bbs.125.la/*
// @run-at       document-start
// @downloadURL none
// ==/UserScript==

(function() {
    'use strict';

    // 默认设备配置
    let DEVICE_CONFIG = {
        userAgent: 'Mozilla/5.0 (Linux; Android 11; Mi 10 Pro Build/RKQ1.200826.002) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.104 Mobile Safari/537.36',
        width: 393,
        height: 851,
        deviceScaleFactor: 1.5
    };

    // 创建悬浮窗
    function createControlPanel() {
        const panel = document.createElement('div');
        panel.id = 'deviceControlPanel';
        panel.style.cssText = `
            position: fixed;
            top: 20px;
            right: 20px;
            background: rgba(255, 255, 255, 0.95);
            padding: 15px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.2);
            z-index: 9999;
            font-size: 14px;
            min-width: 200px;
            max-width: 300px;
            transition: opacity 0.3s;
        `;

        // 添加标题和最小化按钮
        const header = document.createElement('div');
        header.style.cssText = `
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 10px;
            cursor: move;
        `;
        header.innerHTML = `
            <span style="font-weight: bold;">设备模拟控制面板</span>
            <button id="togglePanel" style="padding: 2px 6px;">_</button>
        `;
        panel.appendChild(header);

        // 创建内容区域
        const content = document.createElement('div');
        content.id = 'panelContent';
        content.innerHTML = `
            <div style="margin-bottom: 10px;">
                <label>宽度:</label>
                <input type="number" id="deviceWidth" value="${DEVICE_CONFIG.width}" style="width: 60px;">
            </div>
            <div style="margin-bottom: 10px;">
                <label>高度:</label>
                <input type="number" id="deviceHeight" value="${DEVICE_CONFIG.height}" style="width: 60px;">
            </div>
            <div style="margin-bottom: 10px;">
                <label>缩放比例:</label>
                <input type="number" id="deviceScale" value="${DEVICE_CONFIG.deviceScaleFactor}" step="0.1" style="width: 60px;">
            </div>
            <div style="margin-bottom: 10px;">
                <label>设备预设:</label>
                <select id="devicePreset" style="width: 120px;">
                    <option value="custom">自定义</option>
                    <option value="mi10pro">小米10 Pro</option>
                    <option value="iphone14pro">iPhone 14 Pro</option>
                    <option value="pixel6">Pixel 6</option>
                </select>
            </div>
            <button id="applyChanges" style="width: 100%; padding: 5px;">应用更改</button>
        `;
        panel.appendChild(content);

        // 添加拖动功能
        let isDragging = false;
        let currentX;
        let currentY;
        let initialX;
        let initialY;

        header.addEventListener('mousedown', dragStart);
        document.addEventListener('mousemove', drag);
        document.addEventListener('mouseup', dragEnd);

        function dragStart(e) {
            initialX = e.clientX - panel.offsetLeft;
            initialY = e.clientY - panel.offsetTop;
            isDragging = true;
        }

        function drag(e) {
            if (isDragging) {
                e.preventDefault();
                currentX = e.clientX - initialX;
                currentY = e.clientY - initialY;
                panel.style.left = currentX + 'px';
                panel.style.top = currentY + 'px';
                panel.style.right = 'auto';
            }
        }

        function dragEnd() {
            isDragging = false;
        }

        // 添加最小化功能
        const toggleBtn = panel.querySelector('#togglePanel');
        const content_div = panel.querySelector('#panelContent');
        let isMinimized = false;

        toggleBtn.addEventListener('click', () => {
            isMinimized = !isMinimized;
            content_div.style.display = isMinimized ? 'none' : 'block';
            toggleBtn.textContent = isMinimized ? '□' : '_';
            panel.style.opacity = isMinimized ? '0.6' : '0.95';
        });

        // 添加设备预设
        const presets = {
            mi10pro: {
                width: 393,
                height: 851,
                deviceScaleFactor: 1.5
            },
            iphone14pro: {
                width: 430,
                height: 932,
                deviceScaleFactor: 1.5
            },
            pixel6: {
                width: 412,
                height: 915,
                deviceScaleFactor: 1.5
            }
        };

        const presetSelect = content.querySelector('#devicePreset');
        presetSelect.addEventListener('change', () => {
            const preset = presets[presetSelect.value];
            if (preset) {
                content.querySelector('#deviceWidth').value = preset.width;
                content.querySelector('#deviceHeight').value = preset.height;
                content.querySelector('#deviceScale').value = preset.deviceScaleFactor;
            }
        });

        // 应用更改按钮
        const applyBtn = content.querySelector('#applyChanges');
        applyBtn.addEventListener('click', () => {
            DEVICE_CONFIG.width = parseInt(content.querySelector('#deviceWidth').value);
            DEVICE_CONFIG.height = parseInt(content.querySelector('#deviceHeight').value);
            DEVICE_CONFIG.deviceScaleFactor = parseFloat(content.querySelector('#deviceScale').value);
            init();
        });

        document.body.appendChild(panel);
    }

    // 防抖函数
    function debounce(func, wait) {
        let timeout;
        return function() {
            const context = this;
            const args = arguments;
            clearTimeout(timeout);
            timeout = setTimeout(() => func.apply(context, args), wait);
        };
    }

    // 模拟设备特性
    function emulateDevice() {
        // 只在第一次执行时修改User-Agent
        if (!window._userAgentModified) {
            Object.defineProperty(navigator, 'userAgent', {
                get: function() { return DEVICE_CONFIG.userAgent; }
            });
            window._userAgentModified = true;
        }

        // 修改设备属性
        try {
            Object.defineProperties(window.screen, {
                width: { value: DEVICE_CONFIG.width },
                height: { value: DEVICE_CONFIG.height },
                availWidth: { value: DEVICE_CONFIG.width },
                availHeight: { value: DEVICE_CONFIG.height }
            });
        } catch(e) {
            console.log('Screen properties already defined');
        }
    }

    // 设置viewport
    function setupViewport() {
        const existingViewport = document.querySelector('meta[name="viewport"]');
        const viewportContent = `width=${DEVICE_CONFIG.width}, initial-scale=1, user-scalable=yes`;

        if (existingViewport) {
            if (existingViewport.content !== viewportContent) {
                existingViewport.content = viewportContent;
            }
        } else {
            const viewport = document.createElement('meta');
            viewport.name = 'viewport';
            viewport.content = viewportContent;
            document.head.appendChild(viewport);
        }
    }

    // 修改初始化逻辑
    function initialize() {
        emulateDevice();
        setupViewport();
        
        // 确保DOM加载完成后再创建控制面板
        if (document.readyState === 'complete') {
            if (!document.querySelector('#deviceControlPanel')) {
                setTimeout(createControlPanel, 500);
            }
        } else {
            window.addEventListener('load', () => {
                if (!document.querySelector('#deviceControlPanel')) {
                    setTimeout(createControlPanel, 500);
                }
            });
        }
    }

    // 初始执行
    initialize();

    // 监听viewport变化
    const observer = new MutationObserver((mutations) => {
        let needsUpdate = false;
        mutations.forEach((mutation) => {
            if (mutation.type === 'childList') {
                needsUpdate = true;
            }
        });
        if (needsUpdate) {
            debouncedSetupViewport();
        }
    });

    // 延迟启动观察器
    setTimeout(() => {
        observer.observe(document.head, {
            childList: true,
            subtree: true
        });
    }, 1000);

    // 清理函数
    window.addEventListener('unload', () => {
        observer.disconnect();
    });

    // 使用防抖处理viewport变化
    const debouncedSetupViewport = debounce(setupViewport, 100);

})();