// Embed functionality for Sunday Comics
// Handles showing embed code modal and copying to clipboard

(function() {
    'use strict';

    const modal = document.getElementById('embed-modal');
    const embedButton = document.getElementById('embed-button');
    const closeButton = modal ? modal.querySelector('.modal-close') : null;
    const embedCodeTextarea = document.getElementById('embed-code');
    const copyButton = document.getElementById('copy-embed-code');
    const previewLink = document.getElementById('embed-preview-link');

    if (!modal || !embedButton) {
        // Embed feature not enabled or elements not found
        return;
    }

    // Get the site URL from the page (we'll add it as a data attribute)
    const siteUrl = document.body.getAttribute('data-site-url') || window.location.origin;

    // Open modal when embed button is clicked
    embedButton.addEventListener('click', function() {
        const comicNumber = this.getAttribute('data-comic-number');
        if (!comicNumber) return;

        // Generate embed code
        const embedUrl = `${siteUrl}/embed/${comicNumber}`;
        const embedCode = `<iframe src="${embedUrl}" width="800" height="600" frameborder="0" scrolling="no" style="max-width: 100%;" title="Comic #${comicNumber}"></iframe>`;

        // Set the embed code in the textarea
        embedCodeTextarea.value = embedCode;

        // Set the preview link
        previewLink.href = embedUrl;

        // Show the modal
        modal.style.display = 'block';
        modal.setAttribute('aria-hidden', 'false');

        // Focus on the textarea
        embedCodeTextarea.focus();
        embedCodeTextarea.select();
    });

    // Close modal when close button is clicked
    if (closeButton) {
        closeButton.addEventListener('click', function() {
            closeModal();
        });
    }

    // Close modal when clicking outside the modal content
    modal.addEventListener('click', function(event) {
        if (event.target === modal) {
            closeModal();
        }
    });

    // Close modal with Escape key
    document.addEventListener('keydown', function(event) {
        if (event.key === 'Escape' && modal.style.display === 'block') {
            closeModal();
        }
    });

    // Copy embed code to clipboard
    if (copyButton) {
        copyButton.addEventListener('click', function() {
            embedCodeTextarea.select();
            embedCodeTextarea.setSelectionRange(0, 99999); // For mobile devices

            try {
                // Modern clipboard API
                if (navigator.clipboard && navigator.clipboard.writeText) {
                    navigator.clipboard.writeText(embedCodeTextarea.value).then(function() {
                        showCopyFeedback();
                    }).catch(function() {
                        // Fallback to execCommand
                        fallbackCopy();
                    });
                } else {
                    // Fallback for older browsers
                    fallbackCopy();
                }
            } catch (err) {
                fallbackCopy();
            }
        });
    }

    function fallbackCopy() {
        try {
            document.execCommand('copy');
            showCopyFeedback();
        } catch (err) {
            alert('Failed to copy. Please select and copy manually.');
        }
    }

    function showCopyFeedback() {
        const originalText = copyButton.textContent;
        copyButton.textContent = 'Copied!';
        copyButton.classList.add('copied');

        setTimeout(function() {
            copyButton.textContent = originalText;
            copyButton.classList.remove('copied');
        }, 2000);
    }

    function closeModal() {
        modal.style.display = 'none';
        modal.setAttribute('aria-hidden', 'true');

        // Return focus to the embed button
        if (embedButton) {
            embedButton.focus();
        }
    }

    // Update embed button when comic changes via client-side navigation
    // This integrates with the existing comic-nav.js functionality
    window.addEventListener('comicUpdated', function(event) {
        if (event.detail && event.detail.comicNumber && embedButton) {
            embedButton.setAttribute('data-comic-number', event.detail.comicNumber);
        }
    });
})();