// ==UserScript==
// @name         图像风格切换器
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  给移动端图片添加多种滤镜风格，用户通过菜单输入编号调整喜欢的效果
// @author       You
// @match        *://*/*
// @grant        GM_addStyle
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_registerMenuCommand
// @run-at       document-end
// @downloadURL none
// ==/UserScript==

(function () {
    'use strict';

    // 定义存储风格编号的键
    const STYLE_INDEX_KEY = 'imageStyleIndex';
    // 默认风格编号，如果用户未设置过
    const DEFAULT_STYLE_INDEX = 1;

    // 获取当前风格编号，如果未设置则使用默认值
    let currentStyleIndex = GM_getValue(STYLE_INDEX_KEY, DEFAULT_STYLE_INDEX);

    // 样式数组（保持不变，你的原始样式都在这里）
    const styles = [
        `
        /* 风格 1: 默认复古风格 */
        img {
            filter: sepia(60%) brightness(1.1) contrast(1.2) saturate(1.2);
            border-radius: 10px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
            transition: all 0.3s ease;
        }
        img:hover {
            filter: sepia(80%) brightness(1.2) contrast(1.3);
            transform: scale(1.05) rotate(-2deg);
        }
        `,
        `
        /* 风格 2: 模糊效果 */
        img {
            filter: blur(5px);
            transition: filter 0.3s ease;
        }
        img:hover {
            filter: blur(3px);
        }
        `,
        `
        /* 风格 3: 黑白效果 */
        img {
            filter: grayscale(100%);
            transition: filter 0.3s ease;
        }
        img:hover {
            filter: grayscale(50%);
        }
        `,
        `
        /* 风格 4: 反转颜色 */
        img {
            filter: invert(100%);
            transition: filter 0.3s ease;
        }
        img:hover {
            filter: invert(50%);
        }
        `,
        `
        /* 风格 5: 饱和度调整 */
        img {
            filter: saturate(50%);
            transition: filter 0.3s ease;
        }
        img:hover {
            filter: saturate(150%);
        }
        `,
        `
        /* 风格 6: 色相旋转 */
        img {
            filter: hue-rotate(90deg);
            transition: filter 0.3s ease;
        }
        img:hover {
            filter: hue-rotate(180deg);
        }
        `,
        `
        /* 风格 7: 阴影效果 */
        img {
            filter: drop-shadow(10px 10px 15px rgba(0, 0, 0, 0.5));
            transition: all 0.3s ease;
        }
        img:hover {
            filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.7));
        }
        `,
        `
        /* 风格 8: 透明度调整 */
        img {
            filter: opacity(0.7);
            transition: filter 0.3s ease;
        }
        img:hover {
            filter: opacity(1);
        }
        `,
        `
        /* 风格 9: 圆形裁剪 */
        img {
            border-radius: 50%;
            transition: transform 0.3s ease;
        }
        img:hover {
            transform: scale(1.1);
        }
        `,
        `
        /* 风格 10: 镜像翻转 */
        img {
            transform: scaleX(-1);
            transition: transform 0.3s ease;
        }
        img:hover {
            transform: scaleX(1);
        }
        `,
        `
        /* 风格 11: 动画旋转 */
        img {
            animation: rotate 3s infinite linear;
        }
        @keyframes rotate {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        `,
        `
        /* 风格 12: 复古 + 胶片颗粒 */
        img {
            filter: sepia(50%) contrast(1.2) brightness(1.1);
            /* 注意：这里的 base64 编码的图片数据需要是实际的图片，否则可能无效 */
            /* 示例：background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAABgLZcDAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iV0FNcHBhcmFwZW5kZXJfaWRlYU5hcmNvZmFtZSI+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6NGRhZDU3OTItMTk2Yi0zNDQ2LThlYzEtYzU2Y2M2OTgxMGI0IiB4bXBNTTpEb2N1bWVudElRD0JFMzVFNjkzQjkyQjA0MThCRjA4MkM5RTk0OEE5NzE5IiB4bXBNTTpJbnN0YW5jZUlEPkYyQTUwMTg5NzExRTYyMTFGQ0RCMzVDN0YxN0Y0MTczPiA8c3RSZWY6RG9jdW1lbnRJRD54bXAuZGlkOjRkYWQ1NzkyLTE5NmItMzQ0Ni04ZWMxLWM1NmNjNjk4MTBiNDwvc3RSZWY6RG9jdW1lbnRJRD4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InciPz4oQ60AAAAaSURBVHjaYmBgYGBgYMDAwMDAAAEEAAsABxUABlYFwLgAAAAASUVORK5CYII=') repeat; */
            mix-blend-mode: multiply;
            transition: all 0.3s ease;
        }
        img:hover {
            filter: sepia(70%) contrast(1.4) brightness(1.2);
        }
        `,
        `
        /* 风格 13: 倾斜效果 */
        img {
            transform: skew(10deg, 5deg);
            transition: transform 0.3s ease;
        }
        img:hover {
            transform: skew(0deg, 0deg);
        }
        `,
        `
        /* 风格 14: 亮度增强 */
        img {
            filter: brightness(1.5);
            transition: filter 0.3s ease;
        }
        img:hover {
            filter: brightness(1.2);
        }
        `,
        `
        /* 风格 15: 新拟物风格 */
        img {
            box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2),
                        -10px -10px 20px rgba(255, 255, 255, 0.5);
            border-radius: 12px;
            transition: box-shadow 0.3s ease;
        }
        img:hover {
            box-shadow: inset 10px 10px 20px rgba(0, 0, 0, 0.2),
                        inset -10px -10px 20px rgba(255, 255, 255, 0.5);
        }
        `
    ];

    // --- 功能函数 ---

    // 应用选定的风格
    function applyStyle(index) {
        // 确保索引在有效范围内
        if (index >= 1 && index <= styles.length) {
            // 移除旧的样式（如果存在），以避免冲突
            const existingStyle = document.getElementById('tampermonkey-image-style');
            if (existingStyle) {
                existingStyle.remove();
            }

            // 应用新的样式
            const styleElement = GM_addStyle(styles[index - 1]);
            styleElement.id = 'tampermonkey-image-style'; // 给样式元素一个ID方便移除
            console.log(`图片风格已切换至: 风格 ${index}`);
        } else {
            console.warn(`无效的风格编号: ${index}。请选择 1 到 ${styles.length} 之间的编号。`);
        }
    }

    // 注册油猴菜单命令
    function registerStyleChanger() {
        GM_registerMenuCommand(`当前图片风格: 风格 ${currentStyleIndex}`, () => {
            let newStyle = prompt(`请输入您想应用的图片风格编号 (1 到 ${styles.length} 之间):`, currentStyleIndex);
            if (newStyle !== null) { // 用户点击了确定
                newStyle = parseInt(newStyle, 10);
                if (!isNaN(newStyle) && newStyle >= 1 && newStyle <= styles.length) {
                    GM_setValue(STYLE_INDEX_KEY, newStyle); // 保存新值
                    currentStyleIndex = newStyle; // 更新当前值
                    applyStyle(currentStyleIndex); // 立即应用新风格
                    alert(`图片风格已成功更新为: 风格 ${currentStyleIndex}。`);
                } else {
                    alert(`输入无效。请输入 1 到 ${styles.length} 之间的有效数字。`);
                }
            }
        });
    }

    // --- 主执行逻辑 ---

    // 判断是否是移动端设备
    if (window.innerWidth <= 800) {
        applyStyle(currentStyleIndex); // 页面加载时应用保存的或默认的风格
        registerStyleChanger(); // 注册菜单命令
    }
})();