/**
 * OKT Lottie Widget Handler
 * Depends on lottie-web (lottie.min.js)
 */
(function () {

    function initLottie( container ) {
        if ( container.dataset.oktLottieInit === '1' ) {
            return;
        }
        container.dataset.oktLottieInit = '1';

        var src        = container.dataset.src        || '';
        var trigger    = container.dataset.trigger    || 'autoplay';
        var loop       = container.dataset.loop       !== 'false';
        var loopTimes  = parseInt( container.dataset.loopTimes ) || 0;
        var speed      = parseFloat( container.dataset.speed )   || 1;
        var direction  = parseInt( container.dataset.direction ) || 1;
        var renderer   = container.dataset.renderer  || 'svg';

        if ( ! src ) return;

        var anim = lottie.loadAnimation({
            container : container,
            renderer  : renderer,
            loop      : ( loopTimes > 0 ) ? false : loop,
            autoplay  : false,
            path      : src,
        });

        anim.setSpeed( speed );
        anim.setDirection( direction );

        var loopCount = 0;

        if ( loopTimes > 0 ) {
            anim.addEventListener( 'complete', function () {
                loopCount++;
                if ( loopCount < loopTimes ) {
                    anim.goToAndPlay( 0, true );
                }
            });
        }

        // ── Trigger: Auto Play ────────────────────────────────────────────
        if ( trigger === 'autoplay' ) {
            anim.play();

        // ── Trigger: Hover ────────────────────────────────────────────────
        } else if ( trigger === 'hover' ) {
            var hoverTarget = container.closest( '.okt-lottie-wrapper' ) || container;

            hoverTarget.addEventListener( 'mouseenter', function () {
                loopCount = 0;
                anim.goToAndPlay( 0, true );
            });

            hoverTarget.addEventListener( 'mouseleave', function () {
                anim.stop();
            });

        // ── Trigger: Click ────────────────────────────────────────────────
        } else if ( trigger === 'click' ) {
            var clickTarget = container.closest( '.okt-lottie-wrapper' ) || container;
            clickTarget.style.cursor = 'pointer';

            clickTarget.addEventListener( 'click', function () {
                if ( anim.isPaused ) {
                    loopCount = 0;
                    anim.play();
                } else {
                    anim.pause();
                }
            });

        // ── Trigger: Viewport ─────────────────────────────────────────────
        } else if ( trigger === 'viewport' ) {
            if ( 'IntersectionObserver' in window ) {
                var observer = new IntersectionObserver( function ( entries ) {
                    entries.forEach( function ( entry ) {
                        if ( entry.isIntersecting ) {
                            loopCount = 0;
                            anim.play();
                        } else {
                            anim.stop();
                        }
                    });
                }, { threshold: 0.4 } );

                observer.observe( container );
            } else {
                // Fallback: just autoplay
                anim.play();
            }

        // ── Trigger: None (Freeze on first frame) ─────────────────────────
        } else if ( trigger === 'none' ) {
            anim.goToAndStop( 0, true );
        }
    }

    function initAllInScope( scope ) {
        var containers = ( scope || document ).querySelectorAll( '.okt-lottie-container' );
        containers.forEach( initLottie );
    }

    // ── Elementor frontend hook ───────────────────────────────────────────
    (function ( $ ) {
        $( window ).on( 'elementor/frontend/init', function () {
            elementorFrontend.hooks.addAction(
                'frontend/element_ready/okthemes-lottie.default',
                function ( $element ) {
                    initAllInScope( $element[0] );
                }
            );
        });
    })( jQuery );

    // ── Plain DOM fallback (non-Elementor context) ────────────────────────
    document.addEventListener( 'DOMContentLoaded', function () {
        initAllInScope();
    });

})();
