// ==UserScript==
// @name         My Userscript : 自动匹配显示当前网站所有可用的UserJS脚本 (Optimized)
// @name:zh-CN   My Userscript : 显示当前网站所有可用的UserJS脚本 (优化版)
// @version      4.0
// @description  显示当前网站的所有可用UserJS(Tampermonkey)脚本，一键安装。移除冗余依赖，优化代码结构。
// @icon         data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3ggEBCQHM3fXsAAAAVdJREFUOMudkz2qwkAUhc/goBaGJBgUtBCZyj0ILkpwAW7Bws4yO3AHLiCtEFD8KVREkoiFxZzX5A2KGfN4F04zMN+ce+5c4LMUgDmANYBnrnV+plBSi+FwyHq9TgA2LQpvCiEiABwMBtzv95RSfoNEHy8DYBzHrNVqVEr9BWKcqNFoxF6vx3a7zc1mYyC73a4MogBg7vs+z+czO50OW60Wt9stK5UKp9Mpj8cjq9WqDTBHnjAdxzGQZrPJw+HA31oulzbAWgLoA0CWZVBKIY5jzGYzdLtdE9DlcrFNrY98zobqOA6TJKHW2jg4nU5sNBpFDp6mhVe5rsvVasUwDHm9Xqm15u12o+/7Hy0gD8KatOd5vN/v1FozTVN6nkchxFuI6hsAAIMg4OPxMJCXdtTbR7JJCMEgCJhlGUlyPB4XfumozInrupxMJpRSRtZlKoNYl+m/6/wDuWAjtPfsQuwAAAAASUVORK5CYII=
// @include      *
// @require      https://cdn.jsdelivr.net/npm/psl@1.9.0/dist/psl.min.js
// @resource     count https://greasyfork.org/scripts/by-site.json
// @grant        GM_xmlhttpRequest
// @grant        GM_getResourceText
// @grant        GM_getValue
// @grant        GM_setValue
// @grant        GM_addStyle
// @grant        GM_openInTab
// @connect      greasyfork.org
// @run-at       document-end
// @namespace    https://github.com/jae-jae/Userscript-Plus
// @downloadURL https://update.greasyfork.icu/scripts/548869/My%20Userscript%20%3A%20%E8%87%AA%E5%8A%A8%E5%8C%B9%E9%85%8D%E6%98%BE%E7%A4%BA%E5%BD%93%E5%89%8D%E7%BD%91%E7%AB%99%E6%89%80%E6%9C%89%E5%8F%AF%E7%94%A8%E7%9A%84UserJS%E8%84%9A%E6%9C%AC%20%28Optimized%29.user.js
// @updateURL https://update.greasyfork.icu/scripts/548869/My%20Userscript%20%3A%20%E8%87%AA%E5%8A%A8%E5%8C%B9%E9%85%8D%E6%98%BE%E7%A4%BA%E5%BD%93%E5%89%8D%E7%BD%91%E7%AB%99%E6%89%80%E6%9C%89%E5%8F%AF%E7%94%A8%E7%9A%84UserJS%E8%84%9A%E6%9C%AC%20%28Optimized%29.meta.js
// ==/UserScript==

(function() {
    'use strict';

    // 样式定义
    const CSS = `
        #jae_userscript_box { font-family: sans-serif; }
        .jae-userscript { position: fixed; width: 500px; top: 20px; right: 20px; z-index: 2147483647; height: auto; background: #fff; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); padding: 15px; border: 2px solid #4CAF50; display: none; }
        .script-list { max-height: 450px; overflow-y: auto; padding: 10px; }
        .script-item { padding: 15px; margin: 10px 0; border: 1px solid #e0e0e0; border-radius: 6px; background: #fafafa; transition: all 0.3s; }
        .script-item:hover { background-color: #f0f8ff; border-color: #4CAF50; box-shadow: 0 2px 8px rgba(76,175,80,0.2); }
        .script-name { font-weight: bold; color: #333; margin-bottom: 8px; font-size: 15px; line-height: 1.4; }
        .script-desc { font-size: 13px; color: #666; margin-bottom: 10px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
        .script-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; font-size: 12px; }
        .script-meta-item { background: #e8f5e8; color: #2e7d32; padding: 3px 8px; border-radius: 12px; }
        .script-meta-item.installs { background: #e3f2fd; color: #1565c0; }
        .script-meta-item.rating { background: #fff3e0; color: #f57c00; }
        .script-meta-item.updated { background: #f3e5f5; color: #7b1fa2; }
        .script-actions { display: flex; gap: 8px; }
        .script-install { display: inline-block; padding: 8px 12px; background: #4CAF50; color: white; text-decoration: none; border-radius: 4px; font-size: 13px; transition: background-color 0.3s; text-align: center; flex: 1; cursor: pointer; }
        .script-install:hover { background: #45a049; color: white; }
        .script-install.secondary { background: #2196F3; }
        .script-install.secondary:hover { background: #1976D2; }
        .close-btn { position: absolute; top: 8px; right: 8px; background: #ff4444; color: white; border: none; border-radius: 6px; width: 32px; height: 32px; font-size: 18px; font-weight: bold; cursor: pointer; display: flex; align-items: center; justify-content: center; z-index: 10; }
        .close-btn:hover { background: #e53935; }
        .sort-controls { padding: 10px; background: #f8f9fa; border-bottom: 1px solid #eee; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
        .sort-select { padding: 5px 8px; border: 1px solid #ddd; border-radius: 4px; font-size: 12px; background: white; cursor: pointer; }
        
        /* Float Button & Settings */
        #jae_float_container { position: fixed; top: 50%; right: 0; z-index: 2147483646; display: flex; flex-direction: column; align-items: flex-end; transform: translateY(-50%); }
        .jae-float-btn { width: 40px; color: white; border: none; border-radius: 8px 0 0 8px; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,0.2); margin-bottom: 10px; display: flex; align-items: center; justify-content: center; transition: transform 0.3s; }
        .jae-float-btn:hover { transform: translateX(-5px); }
        #jae_settings_box { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2147483647; width: 400px; background: #fff; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,0.3); padding: 20px; border: 2px solid #FF9800; }
        #jae_restore_float_btn { position: fixed; bottom: 20px; right: 20px; z-index: 2147483646; width: 30px; height: 30px; background: #FF9800; color: white; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; }
    `;

    class FetchUserjs {
        constructor() {
            this.host = this.getMainHost();
            this.quietKey = 'jae_fetch_userjs_quiet';
            this.countKey = 'jae_fetch_userjs_count';
            this.settingsKey = 'jae_fetch_userjs_settings';
            this.currentScriptList = [];
            this.settings = this.loadSettings();
            
            GM_addStyle(CSS);
        }

        getMainHost() {
            const host = window.location.hostname;
            try {
                if (typeof psl !== 'undefined' && psl?.get) {
                    return psl.get(host) || host;
                }
                return host.split('.').slice(-2).join('.');
            } catch (e) {
                return host;
            }
        }

        getCountData() {
            try {
                const countData = GM_getResourceText('count');
                if (!countData) return 0;
                const data = JSON.parse(countData);
                return data[this.host] || 0;
            } catch (e) {
                console.error('Data Parse Error:', e);
                return 0;
            }
        }

        fetchScriptList(host) {
            return new Promise((resolve) => {
                GM_xmlhttpRequest({
                    method: 'GET',
                    url: `https://greasyfork.org/zh-CN/scripts/by-site/${encodeURIComponent(host)}.json`,
                    headers: { 'User-Agent': 'Mozilla/5.0 (compatible; My Userscript Optimized)' },
                    timeout: 10000,
                    onload: (res) => {
                        if (res.status === 200) {
                            try {
                                resolve(JSON.parse(res.responseText) || []);
                            } catch { resolve([]); }
                        } else {
                            resolve([]);
                        }
                    },
                    onerror: () => resolve([]),
                    ontimeout: () => resolve([])
                });
            });
        }

        formatDate(dateStr) {
            const date = new Date(dateStr);
            const diffDays = Math.ceil(Math.abs(new Date() - date) / (86400000));
            if (diffDays === 1) return '昨天';
            if (diffDays < 7) return `${diffDays}天前`;
            if (diffDays < 30) return `${Math.ceil(diffDays / 7)}周前`;
            return `${Math.ceil(diffDays / 30)}个月前`;
        }

        formatNumber(num) {
            if (!num) return '0';
            if (num >= 1e6) return (num / 1e6).toFixed(1) + 'M';
            if (num >= 1e3) return (num / 1e3).toFixed(1) + 'K';
            return num.toString();
        }

        loadSettings() {
            return GM_getValue(this.settingsKey, { autoShow: false, floatButtonsVisible: true });
        }

        saveSettings(newSettings) {
            GM_setValue(this.settingsKey, newSettings);
            this.settings = newSettings;
            this.render(); // Re-render to reflect changes
        }

        createEl(html) {
            const div = document.createElement('div');
            div.innerHTML = html.trim();
            return div.firstChild;
        }

        renderSettings() {
            if (document.getElementById('jae_settings_box')) return;
            
            const html = `
                <div id="jae_settings_box">
                    <div style="font-weight:bold;font-size:18px;margin-bottom:15px;text-align:center;">设置</div>
                    <label style="display:block;margin-bottom:15px;cursor:pointer;">
                        <input type="checkbox" id="auto-show-setting" ${this.settings.autoShow ? 'checked' : ''}> 自动显示脚本列表
                    </label>
                    <label style="display:block;margin-bottom:20px;cursor:pointer;">
                        <input type="checkbox" id="float-buttons-setting" ${this.settings.floatButtonsVisible ? 'checked' : ''}> 显示侧边悬浮按钮
                    </label>
                    <div style="text-align:center;">
                        <button id="save-settings" style="padding:5px 15px;margin-right:10px;">保存</button>
                        <button id="cancel-settings" style="padding:5px 15px;">取消</button>
                    </div>
                </div>`;
            
            document.body.appendChild(this.createEl(html));

            document.getElementById('save-settings').onclick = () => {
                this.saveSettings({
                    autoShow: document.getElementById('auto-show-setting').checked,
                    floatButtonsVisible: document.getElementById('float-buttons-setting').checked
                });
                document.getElementById('jae_settings_box').remove();
            };
            document.getElementById('cancel-settings').onclick = () => document.getElementById('jae_settings_box').remove();
        }

        sortScripts(list, method) {
            const sorted = [...list];
            sorted.sort((a, b) => {
                switch(method) {
                    case 'installs_desc': return (b.total_installs || 0) - (a.total_installs || 0);
                    case 'installs_asc': return (a.total_installs || 0) - (b.total_installs || 0);
                    case 'updated_desc': return new Date(b.code_updated_at) - new Date(a.code_updated_at);
                    case 'updated_asc': return new Date(a.code_updated_at) - new Date(b.code_updated_at);
                    default: return 0;
                }
            });
            return sorted;
        }

        renderScriptList(list) {
            const container = document.querySelector('.script-list');
            if (!list.length) {
                container.innerHTML = '<div style="text-align:center;padding:20px;color:#666;">暂无可用脚本</div>';
                return;
            }

            container.innerHTML = '';
            list.forEach(script => {
                const item = document.createElement('div');
                item.className = 'script-item';
                
                // Safe text content setting to prevent XSS
                const safeName = script.name || '未知脚本';
                const safeDesc = script.description || '无描述';
                
                item.innerHTML = `
                    <div class="script-name"></div>
                    <div class="script-desc"></div>
                    <div class="script-meta">
                        <span class="script-meta-item installs">安装: ${this.formatNumber(script.total_installs)}</span>
                        <span class="script-meta-item updated">更新: ${this.formatDate(script.code_updated_at)}</span>
                    </div>
                    <div class="script-actions">
                        <a href="https://greasyfork.org/zh-CN/scripts/${script.id}" target="_blank" class="script-install secondary">详情</a>
                        <a href="${script.code_url || '#'}" class="script-install primary">安装</a>
                    </div>
                `;
                
                item.querySelector('.script-name').textContent = safeName;
                item.querySelector('.script-desc').textContent = safeDesc;
                container.appendChild(item);
            });
        }

        showScriptBox() {
            let box = document.getElementById('jae_userscript_box');
            if (!box) {
                const html = `
                    <div id="jae_userscript_box" class="jae-userscript">
                        <div style="padding:10px;border-bottom:1px solid #eee;position:relative;">
                            <strong>可匹配的脚本</strong>
                            <div style="font-size:12px;color:#666;">当前网站: ${this.host}</div>
                            <button class="close-btn" id="close-script-box">✕</button>
                        </div>
                        <div class="sort-controls">
                            排序: <select id="sort-method" class="sort-select">
                                <option value="default">默认</option>
                                <option value="installs_desc">安装量(高↓)</option>
                                <option value="updated_desc">更新时间(新↓)</option>
                            </select>
                        </div>
                        <div class="script-list">正在加载...</div>
                    </div>`;
                document.body.appendChild(this.createEl(html));
                box = document.getElementById('jae_userscript_box');
                
                document.getElementById('close-script-box').onclick = () => box.style.display = 'none';
                
                document.getElementById('sort-method').onchange = (e) => {
                    this.renderScriptList(this.sortScripts(this.currentScriptList, e.target.value));
                };

                this.fetchScriptList(this.host).then(list => {
                    this.currentScriptList = list;
                    this.renderScriptList(list);
                });
            }
            box.style.display = 'block';
        }

        createFloatButtons() {
            if (document.getElementById('jae_float_container')) return;

            const html = `
                <div id="jae_float_container">
                    <button id="jae_btn_show" class="jae-float-btn" style="background:#4CAF50;height:80px;writing-mode:vertical-lr;font-weight:bold;">UserJS</button>
                    <button id="jae_btn_settings" class="jae-float-btn" style="background:#FF9800;height:40px;">⚙️</button>
                    <button id="jae_btn_close" class="jae-float-btn" style="background:#f44336;height:30px;font-weight:bold;">✕</button>
                </div>`;
            document.body.appendChild(this.createEl(html));

            document.getElementById('jae_btn_show').onclick = () => this.showScriptBox();
            document.getElementById('jae_btn_settings').onclick = () => this.renderSettings();
            
            // Close logic
            document.getElementById('jae_btn_close').onclick = (e) => {
                e.stopPropagation();
                if(confirm('是否仅本次隐藏悬浮窗？\n点击[确定]临时隐藏。\n点击[取消]将在设置中永久关闭悬浮窗。')) {
                    sessionStorage.setItem(this.quietKey, 'true');
                    this.render();
                } else {
                    this.saveSettings({...this.settings, floatButtonsVisible: false});
                }
            };
        }

        render() {
            const isQuiet = sessionStorage.getItem(this.quietKey);
            const container = document.getElementById('jae_float_container');
            const restoreBtn = document.getElementById('jae_restore_float_btn');

            // 处理悬浮按钮显示
            if (this.settings.floatButtonsVisible && !isQuiet) {
                this.createFloatButtons();
                if (restoreBtn) restoreBtn.remove();
            } else {
                if (container) container.remove();
                // 显示恢复小按钮
                if (!restoreBtn) {
                    const btn = this.createEl('<div id="jae_restore_float_btn" title="显示UserJS设置">⚙️</div>');
                    btn.onclick = () => {
                        sessionStorage.removeItem(this.quietKey);
                        this.renderSettings();
                    };
                    document.body.appendChild(btn);
                }
            }

            // 处理自动弹窗
            if (this.settings.autoShow && !isQuiet) {
                const count = this.getCountData();
                if (count > 0) this.showScriptBox();
            }
        }
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', () => new FetchUserjs().render());
    } else {
        new FetchUserjs().render();
    }

})();