// ==UserScript==
// @name         hao123助手
// @namespace    https://bbs.tampermonkey.net.cn/
// @version      0.1.0
// @description  用于hao123去广告以及页面美化（其实更丑，不建议使用，也不建议使用hao123）
// @author       聚高-
// @match        *://*hao123.com/
// @grant GM_addStyle
// ==/UserScript==

/*global ajaxHooker*/

(function () {
    'use strict';
    // Your code here...

    


    const hideElements = () => {
        const navRecommend = document.getElementById('navrecommend-hjw');
        if (navRecommend) {
            navRecommend.style.display = 'none';
        }

        const ads = document.querySelectorAll('.bottom-banner-link');
        ads.forEach(ad => ad.style.display = 'none');

        const layout = document.querySelectorAll('.layout-main')
        layout.forEach(l => l.style.display = 'none');
        
        document.querySelectorAll('.rightTip-img').forEach(r => r.style.display = 'none');
        document.querySelectorAll('#shortcut-box').forEach(r => r.style.display = 'none');
        document.querySelectorAll('.suggest').forEach(r => r.style.display = 'none');
    };

    const observer = new MutationObserver(hideElements);
    observer.observe(document.body, { childList: true, subtree: true });

    hideElements();





    GM_addStyle(`
        .nav-container {
            right: 20px;
            bottom: 20px;
            background: linear-gradient(135deg,rgb(85, 85, 85) 0%, #16213e 100%);
            border-radius: 15px;
            padding: 20px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
            width: 100%;
            transition: transform 0.3s ease;
        }

        .nav-header {
            text-align: center;
            margin-bottom: 20px;
        }

        .nav-title {
            color: #fff;
            font-family: 'Arial', sans-serif;
            font-size: 24px;
            margin: 0;
            text-shadow: 0 2px 4px rgba(0,0,0,0.3);
        }

        .category-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
            gap: 15px;
        }

        .category-card {
            background: rgba(255,255,255,0.1);
            border-radius: 10px;
            padding: 15px;
            backdrop-filter: blur(5px);
            transition: transform 0.2s ease;
        }

        .category-card:hover {
            transform: translateY(-5px);
        }

        .category-title {
            color: #e94560;
            font-size: 14px;
            margin: 0 0 10px 0;
            font-weight: bold;
            text-align: center;
        }

        .link-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 10px;
        }

        .nav-link {
            display: flex;
            align-items: center;
            padding: 8px;
            background: rgba(255,255,255,0.05);
            border-radius: 6px;
            color: #fff;
            text-decoration: none;
            font-size: 12px;
            transition: all 0.2s ease;
        }

        .nav-link:hover {
            background: rgba(229,69,96,0.2);
            box-shadow: 0 4px 6px rgba(0,0,0,0.2);
        }

        .link-icon {
            width: 20px;
            height: 20px;
            margin-right: 8px;
            filter: drop-shadow(0 2px 2px rgba(0,0,0,0.2));
        }
    `);

    // 导航面板HTML结构
    const navHTML = `
    <div class="nav-container">
        <div class="nav-header">
            <h2 class="nav-title">AI & 媒体导航中心</h2>
        </div>
        <div class="category-grid">
            <!-- AI工具 -->
            <div class="category-card">
                <h3 class="category-title"><i class="fas fa-robot"></i> AI工具</h3>
                <div class="link-grid">
                    <a href="https://chat.openai.com" target="_blank" class="nav-link">
                        <img src="https://chat.openai.com/favicon.ico" class="link-icon"> ChatGPT
                    </a>
                    <a href="https://claude.ai" target="_blank" class="nav-link">
                        <img src="https://www.anthropic.com/favicon.ico" class="link-icon"> Claude
                    </a>
                    <a href="https://bard.google.com" target="_blank" class="nav-link">
                        <img src="https://www.gstatic.com/lamda/images/favicon_v1_150160cddffa5e56.png" class="link-icon"> Bard
                    </a>
                    <a href="https://www.midjourney.com" target="_blank" class="nav-link">
                        <img src="https://www.midjourney.com/favicon.ico" class="link-icon"> Midjourney
                    </a>
                </div>
            </div>

            <!-- 视频平台 -->
            <div class="category-card">
                <h3 class="category-title"><i class="fas fa-video"></i> 视频平台</h3>
                <div class="link-grid">
                    <a href="https://www.youtube.com" target="_blank" class="nav-link">
                        <img src="https://www.youtube.com/favicon.ico" class="link-icon"> YouTube
                    </a>
                    <a href="https://www.bilibili.com" target="_blank" class="nav-link">
                        <img src="https://www.bilibili.com/favicon.ico" class="link-icon"> 哔哩哔哩
                    </a>
                    <a href="https://www.netflix.com" target="_blank" class="nav-link">
                        <img src="https://www.netflix.com/favicon.ico" class="link-icon"> Netflix
                    </a>
                    <a href="https://v.qq.com" target="_blank" class="nav-link">
                        <img src="https://v.qq.com/favicon.ico" class="link-icon"> 腾讯视频
                    </a>
                </div>
            </div>

            <!-- 开发资源 -->
            <div class="category-card">
                <h3 class="category-title"><i class="fas fa-code"></i> 开发资源</h3>
                <div class="link-grid">
                    <a href="https://github.com" target="_blank" class="nav-link">
                        <img src="https://github.com/favicon.ico" class="link-icon"> GitHub
                    </a>
                    <a href="https://stackoverflow.com" target="_blank" class="nav-link">
                        <img src="https://stackoverflow.com/favicon.ico" class="link-icon"> Stack Overflow
                    </a>
                    <a href="https://developer.mozilla.org" target="_blank" class="nav-link">
                        <img src="https://developer.mozilla.org/favicon.ico" class="link-icon"> MDN
                    </a>
                    <a href="https://npmjs.com" target="_blank" class="nav-link">
                        <img src="https://npmjs.com/favicon.ico" class="link-icon"> NPM
                    </a>
                </div>
            </div>
        </div>
    </div>
    `;
    document.body.insertAdjacentHTML('beforeend', navHTML);

})();