/*
* Article Read Page Scripts
* */
export class ArticleRead {
    constructor() {
        this.init();
    }

    init() {
        // 1. Image Lightbox (PhotoSwipe or simple implementation)
        // For now, simple wrapper to allow future expansion
        $('.article-content img').each(function () {
            $(this).addClass('img-fluid');
            // Optional: Wrap in link for lightbox
        });
        // 2. Table of Contents (Tocbot)
        this.generateToc();
        this.initMobileEvents();
    }

    initMobileEvents() {
        const fab = document.querySelector('.js-toc-fab');
        const toc = document.querySelector('.js-toc');

        if (!fab || !toc) return;

        const toggleToc = () => {
            toc.classList.toggle('is-open-mobile');
        };

        fab.addEventListener('click', (e) => {
            e.preventDefault();
            e.stopPropagation();
            toggleToc();
        });

        // Close when clicking outside
        document.addEventListener('click', (e) => {
            if (window.innerWidth > 1200) return;
            
            // If click is outside TOC and outside FAB, close it
            if (!toc.contains(e.target) && !fab.contains(e.target) && toc.classList.contains('is-open-mobile')) {
                toc.classList.remove('is-open-mobile');
            }
        });

        // Close when clicking a link inside TOC
        toc.addEventListener('click', (e) => {
            if (e.target.tagName === 'A' || e.target.closest('a')) {
                // If it is mobile view
                if (window.innerWidth <= 1200) {
                    toc.classList.remove('is-open-mobile');
                }
            }
        });
    }

    generateToc() {
        let tocContainer = $(".js-toc");
        let content = $(".article-content");

        if (tocContainer.length === 0 || content.length === 0) return;

        // Check if headers exist
        if (content.find("h1,h2,h3").length === 0) {
            if (typeof tocbot !== 'undefined') tocbot.destroy();
            tocContainer.hide();
            return;
        }

        if (typeof tocbot !== 'undefined') {
            tocbot.init({
                tocSelector: '.js-toc',
                contentSelector: '.article-content',
                headingSelector: 'h1, h2, h3',
                hasInnerContainers: true,
                scrollSmooth: true,
                scrollSmoothDuration: 420,
                headingsOffset: 80, // Adjust for sticky header
                scrollSmoothOffset: -80
            });

            // Show TOC with animation
            tocContainer.addClass('is-visible');
        }
    }
}