/**
 * RSL Slideshow Event Listeners
 *
 * Manages play/pause controls for RSL carousel/slideshow components. Provides
 * toggle functionality for slideshow auto-advance with visual feedback, ARIA
 * attributes, and localStorage state management. Integrates with the global
 * carousel pause/resume API.
 *
 * @fileoverview Slideshow control event handlers for play/pause functionality
 * @version 1.0.0
 * @license MIT
 *
 * Key Features:
 * - Play/pause toggle button control
 * - Visual state feedback (icon changes, color changes)
 * - ARIA attribute management for accessibility
 * - localStorage integration for state persistence
 * - Carousel indicator disable/enable on pause
 * - Integration with global carousel API (window.carouselPause/carouselResume)
 *
 * Usage:
 * // HTML:
 * <div class="slider" id="my-slideshow">
 *   <button class="pause-carousel" aria-label="Pause slideshow">
 *     <i class="fa-solid fa-pause"></i>
 *   </button>
 *   <div class="slider-indicators-container">...</div>
 * </div>
 *
 * // JavaScript:
 * pauseSlideshow('#my-slideshow');
 * resumeSlideshow('#my-slideshow');
 *
 * Public API:
 * - pauseSlideshow(slideshowIdentifier) - Pause slideshow and disable controls
 * - resumeSlideshow(slideshowIdentifier) - Resume slideshow and enable controls
 */

(function() {
    'use strict';

    /**
     * Toggle pause button icon and state
     *
     * Updates the pause button icon between play/pause states and calls the
     * global carousel pause/resume methods. Updates ARIA label for screen readers.
     *
     * @param {boolean} isPaused - True to pause, false to resume
     * @param {string} slideshowIdentifier - CSS selector for slideshow container
     * @param {HTMLElement} slideshow - Slideshow DOM element
     * @private
     *
     * @example
     * togglePauseButton2(true, '#carousel-1', document.querySelector('#carousel-1'));
     */
    function togglePauseButton2(isPaused, slideshowIdentifier, slideshow) {
        const container = document.querySelector(slideshowIdentifier);
        if (!container) return;

        const pauseBtn = container.querySelector('.pause-carousel');
        if (!pauseBtn) return;

        const icon = pauseBtn.querySelector('i');

        if (isPaused) {
            // Change to play icon
            icon.className = 'fa-solid fa-play';
            if (typeof window.carouselPause === 'function') {
                window.carouselPause.call(slideshow);
            }
            pauseBtn.setAttribute('aria-label', 'Press Enter to resume this slideshow');
        } else {
            // Change to pause icon
            icon.className = 'fa-solid fa-pause';
            if (typeof window.carouselResume === 'function') {
                window.carouselResume.call(slideshow);
            }
            pauseBtn.setAttribute('aria-label', 'Press Enter to pause this slideshow');
        }
    }

    /**
     * Pause a slideshow and disable carousel controls
     *
     * Stops slideshow auto-advance, disables carousel indicator buttons, and
     * updates visual state (button color, cursor style). Stores original colors
     * in localStorage for restoration on resume. Hides pause button from
     * screen readers while paused.
     *
     * @param {string} slideshowIdentifier - CSS selector for slideshow container (e.g., '#slideshow-1')
     *
     * @example
     * pauseSlideshow('#main-carousel');
     * // Slideshow paused, indicators disabled, play button shown
     */
    window.pauseSlideshow = function(slideshowIdentifier) {
        const slideshow = document.querySelector(slideshowIdentifier);
        if (!slideshow) {
            console.warn('pauseSlideshow: Slideshow not found:', slideshowIdentifier);
            return;
        }

        togglePauseButton2(true, slideshowIdentifier, slideshow);

        const pauseButton = slideshow.querySelector('.pause-carousel');
        const carouselButtons = slideshow.querySelectorAll('.slider-indicator');
        const slideshowContainer = slideshow.querySelector('.slider-indicators-container');

        if (!pauseButton) return;

        // Store original button colors
        const computedStyle = window.getComputedStyle(pauseButton);
        const originalBgColor = computedStyle.backgroundColor;
        const originalColor = computedStyle.color;

        localStorage.setItem('originalBgColor', originalBgColor);
        localStorage.setItem('originalColor', originalColor);

        // Apply paused state styling
        pauseButton.style.backgroundColor = '#c8bfbf';
        pauseButton.style.color = '#e1e1e1';

        // Disable carousel indicators
        carouselButtons.forEach(function(indicator) {
            indicator.classList.add('cursor-event-none');
        });

        if (slideshowContainer) {
            slideshowContainer.classList.add('not-allowed');
        }

        // Hide from screen readers while paused
        pauseButton.setAttribute('aria-hidden', 'true');
        pauseButton.setAttribute('tabindex', '-1');

        // Store and remove original ARIA label
        const originalAriaLabel = pauseButton.getAttribute('aria-label');
        localStorage.setItem('originalAriaLabel', originalAriaLabel);
        pauseButton.removeAttribute('aria-label');

        // Hide pause icon from screen readers
        const pauseIcon = pauseButton.querySelector('i.fa-solid.fa-play');
        if (pauseIcon) {
            pauseIcon.setAttribute('aria-hidden', 'true');
        }

        slideshow.classList.add('paused');
    };

    /**
     * Resume a paused slideshow and re-enable carousel controls
     *
     * Restarts slideshow auto-advance, re-enables carousel indicator buttons,
     * and restores visual state from localStorage. Removes pause button from
     * ARIA hidden state and restores original colors.
     *
     * @param {string} slideshowIdentifier - CSS selector for slideshow container (e.g., '#slideshow-1')
     *
     * @example
     * resumeSlideshow('#main-carousel');
     * // Slideshow resumed, indicators enabled, pause button shown
     */
    window.resumeSlideshow = function(slideshowIdentifier) {
        const slideshow = document.querySelector(slideshowIdentifier);
        if (!slideshow) {
            console.warn('resumeSlideshow: Slideshow not found:', slideshowIdentifier);
            return;
        }

        const pauseButton = slideshow.querySelector('.pause-carousel');
        const carouselButtons = slideshow.querySelectorAll('.slider-indicator');
        const slideshowContainer = slideshow.querySelector('.slider-indicators-container');

        togglePauseButton2(false, slideshowIdentifier, slideshow);

        if (!pauseButton) return;

        // Restore original button colors from localStorage
        const originalBgColor = localStorage.getItem('originalBgColor');
        const originalColor = localStorage.getItem('originalColor');

        if (originalBgColor) {
            pauseButton.style.backgroundColor = originalBgColor;
        }
        if (originalColor) {
            pauseButton.style.color = originalColor;
        }

        // Re-enable carousel indicators
        carouselButtons.forEach(function(indicator) {
            indicator.classList.remove('cursor-event-none');
        });

        if (slideshowContainer) {
            slideshowContainer.classList.remove('not-allowed');
        }

        // Restore screen reader accessibility
        pauseButton.removeAttribute('aria-hidden');
        pauseButton.setAttribute('tabindex', '0');

        // Restore original ARIA label from localStorage
        const originalAriaLabel = localStorage.getItem('originalAriaLabel');
        if (originalAriaLabel) {
            pauseButton.setAttribute('aria-label', originalAriaLabel);
        }

        // Remove aria-hidden from pause icon
        const pauseIcon = pauseButton.querySelector('i.fa-solid.fa-pause');
        if (pauseIcon) {
            pauseIcon.removeAttribute('aria-hidden');
        }

        // Clean up localStorage
        localStorage.removeItem('originalBgColor');
        localStorage.removeItem('originalColor');
        localStorage.removeItem('originalAriaLabel');

        slideshow.classList.remove('paused');
    };

})();
