document.addEventListener('DOMContentLoaded', async () => {
    const articleTag = (() => {
        const path = window.location.pathname;
        const segments = path.split('/').filter(Boolean);
        return segments.length > 0 ? segments[0] : 'DefaultTag';
    })();


    const apiUrl = `https://bookstack.xinon.at/api/search?query=%5Bshowurl%3D${encodeURIComponent(articleTag)}%5D%7Btype%3Apage%7D`;
    const linkElement = document.getElementById('bookstackLink');

    try {
        const response = await fetch(apiUrl, {
            headers: {
                'Authorization': 'Token XmGSDWlg3bZhHKXFchNXQ9LpXvCaBuM1:k6XNe6RUU1BIxkv5pxpZ9PSErqZbHJ4i'
            }
        });
        const data = await response.json();

        if (data.data && data.data.length > 0) {
            const article = data.data[0];
            linkElement.style.display = 'block';
            linkElement.querySelector('a').addEventListener('click', (e) => {
                e.preventDefault();
                showArticleModal(article.url);
            });
        }
    } catch (error) {
        console.error('BookStack API error:', error);
        linkElement.style.display = 'none';
    }

    function showArticleModal(url) {
        const modal = document.createElement('div');
        modal.className = 'bookstack-integration-modal';
        modal.innerHTML = `
            <div class="bookstack-integration-modal-content">
                <button class="bookstack-integration-close-btn">×</button>
                <iframe src="${url}?iframe=true" class="bookstack-integration-iframe"></iframe>
            </div>
        `;

        modal.querySelector('.bookstack-integration-close-btn').addEventListener('click', () => modal.remove());
        modal.addEventListener('click', (e) => {
            if (e.target === modal) modal.remove();
        });

        document.body.appendChild(modal);
    }
});