/* ============================================================
   theme.js – مدیریت تم + منوی زبان + منوی کاربر + PWA sync
   ============================================================ */
(function () {
    'use strict';

    var STORAGE_KEY = 'quran-theme';
    var THEMES = ['light', 'dark', 'system'];
    var ICONS  = { light: '☀', dark: '🌙', system: '🖥' };
    var LABELS = {
        light:  { fa: 'روشن',  en: 'Light',  ar: 'فاتح' },
        dark:   { fa: 'تاریک', en: 'Dark',   ar: 'داكن' },
        system: { fa: 'سیستم', en: 'System', ar: 'النظام' }
    };

    /* ============================================================
       ابزارهای کمکی
       ============================================================ */
    function getLang() {
        var htmlLang = document.documentElement.lang || 'fa';
        return ['fa','en','ar'].indexOf(htmlLang) >= 0 ? htmlLang : 'fa';
    }

    function systemDark() {
        return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
    }

    function resolve(t) {
        return t === 'system' ? (systemDark() ? 'dark' : 'light') : t;
    }

    /* ============================================================
       اعمال تم + همگام‌سازی با PWA
       ============================================================ */
    function apply(t) {
        var r = resolve(t);
        var html = document.documentElement;

        html.setAttribute('data-theme', r);
        html.setAttribute('data-theme-pref', t);
        html.style.colorScheme = r;

        if (document.body) {
            document.body.setAttribute('data-theme', r);
            document.body.setAttribute('data-theme-pref', t);
        }

        // به‌روزرسانی theme-color (نوار وضعیت مرورگر + PWA)
        updateThemeColorMeta(r);

        // اطلاع به Service Worker
        if (navigator.serviceWorker && navigator.serviceWorker.controller) {
            try {
                navigator.serviceWorker.controller.postMessage({
                    type: 'THEME_CHANGED',
                    theme: r
                });
            } catch (e) {}
        }
    }

    function updateThemeColorMeta(resolved) {
        var color = resolved === 'dark' ? '#0a0e17' : '#f5f2eb';
        var metas = document.querySelectorAll('meta[name="theme-color"]');

        if (metas.length === 0) {
            var meta = document.createElement('meta');
            meta.name = 'theme-color';
            meta.content = color;
            meta.id = 'qt-theme-color';
            document.head.appendChild(meta);
        } else {
            metas.forEach(function (m) {
                m.setAttribute('content', color);
            });
        }

        // برای iOS Safari
        var appleMeta = document.querySelector('meta[name="apple-mobile-web-app-status-bar-style"]');
        if (appleMeta) {
            appleMeta.setAttribute('content', resolved === 'dark' ? 'black-translucent' : 'default');
        }
    }

    /* ============================================================
       خواندن/نوشتن تم
       ============================================================ */
    function get() {
        try {
            var s = localStorage.getItem(STORAGE_KEY);
            return THEMES.indexOf(s) >= 0 ? s : 'system';
        } catch (e) {
            return 'system';
        }
    }

    function save(t) {
        try {
            localStorage.setItem(STORAGE_KEY, t);
        } catch (e) {}
    }

    /* ============================================================
       به‌روزرسانی UI
       ============================================================ */
    function updateUI(t) {
        var lang = getLang();

        // دکمه‌های تم (دسکتاپ + موبایل)
        document.querySelectorAll('[data-theme-btn]').forEach(function (b) {
            var isActive = b.getAttribute('data-theme-btn') === t;
            b.classList.toggle('active', isActive);
            b.setAttribute('aria-pressed', isActive ? 'true' : 'false');
        });

        // آیکون و برچسب اصلی
        document.querySelectorAll('[data-theme-icon]').forEach(function (el) {
            el.textContent = ICONS[t] || ICONS.system;
        });
        document.querySelectorAll('[data-theme-label]').forEach(function (el) {
            el.textContent = (LABELS[t] && LABELS[t][lang]) || LABELS[t].fa;
        });
    }

    function setTheme(t) {
        if (THEMES.indexOf(t) < 0) t = 'system';
        save(t);
        apply(t);
        updateUI(t);
    }

    /* اعمال فوری قبل از رندر */
    apply(get());

    /* ============================================================
       بستن همه‌ی dropdown ها
       ============================================================ */
    function closeAllDropdowns() {
        document.querySelectorAll(
            '.theme-dropdown.open, .lang-dropdown.open, .user-dropdown.open'
        ).forEach(function (dd) { dd.classList.remove('open'); });
    }

    /* ============================================================
       اتصال رویدادها
       ============================================================ */
    function bind() {
        var current = get();
        apply(current);
        updateUI(current);

        /* دکمه‌های تغییر تم (دسکتاپ + موبایل) */
        document.querySelectorAll('[data-theme-btn]').forEach(function (b) {
            if (b.dataset.themeBound) return;
            b.dataset.themeBound = '1';
            b.addEventListener('click', function (e) {
                e.preventDefault();
                e.stopPropagation();
                setTheme(b.getAttribute('data-theme-btn'));
                // بستن dropdown دسکتاپ (نه موبایل)
                if (b.closest('.theme-dropdown')) {
                    closeAllDropdowns();
                }
            });
        });

        /* dropdown تم */
        document.querySelectorAll('[data-theme-dropdown]').forEach(function (btn) {
            if (btn.dataset.themeBound) return;
            btn.dataset.themeBound = '1';
            btn.addEventListener('click', function (e) {
                e.preventDefault();
                e.stopPropagation();
                var dd = btn.closest('.theme-dropdown');
                if (!dd) return;
                var wasOpen = dd.classList.contains('open');
                closeAllDropdowns();
                if (!wasOpen) dd.classList.add('open');
            });
        });

        /* منوی زبان */
        document.querySelectorAll('[data-lang-dropdown]').forEach(function (btn) {
            if (btn.dataset.langBound) return;
            btn.dataset.langBound = '1';
            btn.addEventListener('click', function (e) {
                e.preventDefault();
                e.stopPropagation();
                var dd = btn.closest('.lang-dropdown');
                if (!dd) return;
                var wasOpen = dd.classList.contains('open');
                closeAllDropdowns();
                if (!wasOpen) dd.classList.add('open');
            });
        });

        /* منوی کاربر */
        document.querySelectorAll('[data-user-dropdown]').forEach(function (btn) {
            if (btn.dataset.userBound) return;
            btn.dataset.userBound = '1';
            btn.addEventListener('click', function (e) {
                e.preventDefault();
                e.stopPropagation();
                var dd = btn.closest('.user-dropdown');
                if (!dd) return;
                var wasOpen = dd.classList.contains('open');
                closeAllDropdowns();
                if (!wasOpen) dd.classList.add('open');
            });
        });
    }

    /* اجرا */
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', bind);
    } else {
        bind();
    }

    /* کلیک بیرون → بستن */
    document.addEventListener('click', function (e) {
        document.querySelectorAll(
            '.theme-dropdown.open, .lang-dropdown.open, .user-dropdown.open'
        ).forEach(function (dd) {
            if (!dd.contains(e.target)) dd.classList.remove('open');
        });
    });

    /* Escape → بستن */
    document.addEventListener('keydown', function (e) {
        if (e.key === 'Escape') closeAllDropdowns();
    });

    /* واکنش به تغییرات سیستم */
    if (window.matchMedia) {
        var mq = window.matchMedia('(prefers-color-scheme: dark)');
        var handler = function () {
            if (get() === 'system') {
                apply('system');
                updateUI('system');
            }
        };
        if (mq.addEventListener) mq.addEventListener('change', handler);
        else if (mq.addListener) mq.addListener(handler);
    }

    /* همگام‌سازی بین تب‌ها */
    window.addEventListener('storage', function (e) {
        if (e.key === STORAGE_KEY) {
            var t = get();
            apply(t);
            updateUI(t);
        }
    });

    /* API عمومی */
    window.qtTheme = {
        get: get,
        set: setTheme,
        apply: apply
    };

})();