import { defineAsyncComponent, nextTick, watch } from "vue";
import Teek from "vitepress-theme-teek";
import TeekLayoutProvider from "./components/TeekLayoutProvider.vue";
import { globalState, getAudio, stopAudioImmediately } from './composables/musicManager'

import "vitepress-theme-teek/index.css";
import './styles/index.css';

// 组件导入
const MusicCard = defineAsyncComponent(() => import("./components/MusicCard.vue"))
const DragonChat = defineAsyncComponent(() => import("./components/DragonChat.vue"))
const HomeUnderline = defineAsyncComponent(() => import("./components/HomeUnderline.vue"))
const List = defineAsyncComponent(() => import("./components/List.vue"))

const sponsorModules = import.meta.glob('./components/Sponsor.vue')
const tableModules = import.meta.glob('./components/SponsorTable.vue')
const Sponsor = sponsorModules['./components/Sponsor.vue']
    ? defineAsyncComponent(sponsorModules['./components/Sponsor.vue'] as any)
    : null;
const SponsorTable = tableModules['./components/SponsorTable.vue']
    ? defineAsyncComponent(tableModules['./components/SponsorTable.vue'] as any)
    : null;

let homePageStyle: HTMLStyleElement | undefined

export default {
    extends: Teek,
    Layout: TeekLayoutProvider,
    enhanceApp({ app, router }) {
        app.component('MusicCard', MusicCard)
        app.component('DragonChat', DragonChat)
        app.component('HomeUnderline', HomeUnderline)
        app.component('List', List)
        if (Sponsor) app.component('Sponsor', Sponsor)
        if (SponsorTable) app.component('SponsorTable', SponsorTable)

        // --- 核心修复：绝对禁止在 SSR 阶段运行任何逻辑 ---
        if (typeof window === 'undefined' || import.meta.env.SSR) return;

        // --- A. 协同逻辑：切回标签页恢复播放 ---
        document.addEventListener('visibilitychange', () => {
            const audio = getAudio();
            if (document.visibilityState === 'visible' && globalState.isPlayed && audio?.paused) {
                audio.play().catch(() => {});
            }
        });

        // --- B. 路由拦截：立即停播逻辑 ---
        // 增加 isPlayed 判断，避免在没有播放时重复执行 stop 逻辑
        router.onAfterRouteChanged = () => {
            // 确保只在浏览器端且处于播放状态时处理
            if (globalState.isPlayed) {
                nextTick(() => {
                    // 延迟 10ms 是为了绕过 Vue 在 SSR 期间对同步状态更新的敏感检测
                    setTimeout(() => {
                        if (globalState.activeInstances <= 0 && globalState.playingId) {
                            console.log('[Music] No card detected, stopping...');
                            stopAudioImmediately();
                        }
                    }, 10);
                });
            }
        }

        // --- C. 彩虹背景 ---
        watch(() => router.route.path, (path) => {
            updateHomePageStyle(path === "/" || path === "/FurryReading");
        }, { immediate: true });
    },
};

function updateHomePageStyle(value: boolean) {
    if (typeof document === 'undefined') return;
    if (value) {
        if (homePageStyle) return;
        homePageStyle = document.createElement('style');
        homePageStyle.innerHTML = `:root { animation: rainbow 12s linear infinite; }`;
        document.body.appendChild(homePageStyle);
    } else if (homePageStyle) {
        homePageStyle.remove();
        homePageStyle = undefined;
    }
}