<?php

namespace Unlockafe_addons\Widgets;

use Unlockafe_addons\Traits\Utils as UnlockafeUtils;
use Unlockafe_addons\Traits\Widget_helper;
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Repeater;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Image_Size;

if (!defined('ABSPATH'))
    exit; // Exit if accessed directly

/**
 * Image Scroller Widget
 *
 * @since 1.0.0
 */
class Image_Scroller extends Widget_Base
{
    use Widget_helper, UnlockafeUtils;

    /**
     * Retrieve the widget name.
     */
    public function get_name()
    {
        return 'unlockafe-image-scroller';
    }

    /**
     * Retrieve the widget title.
     */
    public function get_title()
    {
        return __('Image Scroller', 'unlock-addons-for-elementor');
    }

    /**
     * Retrieve the widget icon.
     */
    public function get_icon()
    {
        return 'eicon-slider-push ulicon';
    }

    /**
     * Retrieve the list of categories.
     */
    public function get_categories()
    {
        return ['unlockafe-addons'];
    }

    /**
     * Retrieve the list of keywords.
     */
    public function get_keywords()
    {
        return ['image', 'scroller', 'slider', 'carousel', 'gallery', 'scroll', 'horizontal'];
    }

    /**
     * Retrieve the list of scripts.
     */
    public function get_script_depends()
    {
        return ['unlockafe-image-scroller-scripts'];
    }

    /**
     * Retrieve the list of styles.
     */
    public function get_style_depends()
    {
        return ['unlockafe-image-scroller-style'];
    }

    /**
     * Register widget controls.
     */
    protected function register_controls()
    {
        $this->register_content_controls();
        $this->register_style_controls();
    }

    /**
     * Register content controls.
     */
    protected function register_content_controls()
    {
        // General Settings
        $this->start_controls_section(
            'general_section',
            [
                'label' => __('General Settings', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_CONTENT,
            ]
        );

        $this->add_control(
            'scroll_direction',
            [
                'label' => __('Scroll Direction', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SELECT,
                'options' => [
                    'horizontal' => __('Horizontal', 'unlock-addons-for-elementor'),
                    'vertical' => __('Vertical', 'unlock-addons-for-elementor'),
                ],
                'default' => 'horizontal',
            ]
        );

        $this->add_control(
            'auto_scroll',
            [
                'label' => __('Auto Scroll', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SWITCHER,
                'label_on' => __('Yes', 'unlock-addons-for-elementor'),
                'label_off' => __('No', 'unlock-addons-for-elementor'),
                'return_value' => 'yes',
                'default' => 'yes',
            ]
        );

        $this->add_control(
            'scroll_speed',
            [
                'label' => __('Scroll Speed', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'range' => [
                    'px' => [
                        'min' => 1,
                        'max' => 10,
                        'step' => 0.5,
                    ],
                ],
                'default' => [
                    'size' => 3,
                ],
                'condition' => [
                    'auto_scroll' => 'yes',
                ],
            ]
        );

        $this->add_control(
            'pause_on_hover',
            [
                'label' => __('Pause on Hover', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SWITCHER,
                'label_on' => __('Yes', 'unlock-addons-for-elementor'),
                'label_off' => __('No', 'unlock-addons-for-elementor'),
                'return_value' => 'yes',
                'default' => 'yes',
                'condition' => [
                    'auto_scroll' => 'yes',
                ],
            ]
        );

        $this->add_control(
            'infinite_loop',
            [
                'label' => __('Infinite Loop', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SWITCHER,
                'label_on' => __('Yes', 'unlock-addons-for-elementor'),
                'label_off' => __('No', 'unlock-addons-for-elementor'),
                'return_value' => 'yes',
                'default' => 'yes',
            ]
        );

        $this->add_control(
            'duplicate_items',
            [
                'label' => __('Duplicate Items for Seamless Loop', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SWITCHER,
                'label_on' => __('Yes', 'unlock-addons-for-elementor'),
                'label_off' => __('No', 'unlock-addons-for-elementor'),
                'return_value' => 'yes',
                'default' => 'yes',
                'description' => __('Duplicate images for seamless infinite scrolling', 'unlock-addons-for-elementor'),
            ]
        );

        $this->add_control(
            'image_height',
            [
                'label' => __('Image Height', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['px', 'vh', '%'],
                'range' => [
                    'px' => [
                        'min' => 100,
                        'max' => 800,
                    ],
                    'vh' => [
                        'min' => 10,
                        'max' => 100,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 300,
                ],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-image-scroller-item img' => 'height: {{SIZE}}{{UNIT}}; object-fit: cover;',
                ],
            ]
        );

        $this->add_control(
            'image_gap',
            [
                'label' => __('Gap Between Images', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 100,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 20,
                ],
            ]
        );

        $this->end_controls_section();

        // Images Section
        $this->start_controls_section(
            'images_section',
            [
                'label' => __('Images', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_CONTENT,
            ]
        );

        $repeater = new Repeater();

        $repeater->add_control(
            'image',
            [
                'label' => __('Image', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::MEDIA,
                'default' => [
                    'url' => \Elementor\Utils::get_placeholder_image_src(),
                ],
            ]
        );

        $repeater->add_control(
            'image_link',
            [
                'label' => __('Link', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::URL,
                'placeholder' => __('https://your-link.com', 'unlock-addons-for-elementor'),
                'show_external' => true,
                'default' => [
                    'url' => '',
                    'is_external' => true,
                    'nofollow' => true,
                ],
            ]
        );

        $repeater->add_control(
            'image_alt',
            [
                'label' => __('Alt Text', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::TEXT,
                'default' => '',
                'placeholder' => __('Enter alt text', 'unlock-addons-for-elementor'),
            ]
        );

        $this->add_control(
            'scroller_images',
            [
                'label' => __('Images', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::REPEATER,
                'fields' => $repeater->get_controls(),
                'default' => [
                    [
                        'image' => ['url' => \Elementor\Utils::get_placeholder_image_src()],
                    ],
                    [
                        'image' => ['url' => \Elementor\Utils::get_placeholder_image_src()],
                    ],
                    [
                        'image' => ['url' => \Elementor\Utils::get_placeholder_image_src()],
                    ],
                    [
                        'image' => ['url' => \Elementor\Utils::get_placeholder_image_src()],
                    ],
                    [
                        'image' => ['url' => \Elementor\Utils::get_placeholder_image_src()],
                    ],
                ],
                'title_field' => '{{{ image_alt }}}',
            ]
        );

        $this->end_controls_section();
    }

    /**
     * Register style controls.
     */
    protected function register_style_controls()
    {
        // Container Style
        $this->start_controls_section(
            'container_style_section',
            [
                'label' => __('Container', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_control(
            'container_background',
            [
                'label' => __('Background Color', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-image-scroller-wrapper' => 'background-color: {{VALUE}};',
                ],
            ]
        );

        $this->add_responsive_control(
            'container_padding',
            [
                'label' => __('Padding', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', 'em', '%'],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-image-scroller-wrapper' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->add_control(
            'container_border_radius',
            [
                'label' => __('Border Radius', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%'],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-image-scroller-wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->end_controls_section();

        // Image Style
        $this->start_controls_section(
            'image_style_section',
            [
                'label' => __('Image', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_control(
            'image_border_radius',
            [
                'label' => __('Border Radius', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%'],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-image-scroller-item img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Border::get_type(),
            [
                'name' => 'image_border',
                'label' => __('Border', 'unlock-addons-for-elementor'),
                'selector' => '{{WRAPPER}} .unlockafe-image-scroller-item img',
            ]
        );

        $this->add_group_control(
            Group_Control_Box_Shadow::get_type(),
            [
                'name' => 'image_box_shadow',
                'label' => __('Box Shadow', 'unlock-addons-for-elementor'),
                'selector' => '{{WRAPPER}} .unlockafe-image-scroller-item img',
            ]
        );

        $this->add_control(
            'image_opacity',
            [
                'label' => __('Opacity', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 1,
                        'step' => 0.1,
                    ],
                ],
                'default' => [
                    'size' => 1,
                ],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-image-scroller-item img' => 'opacity: {{SIZE}};',
                ],
            ]
        );

        $this->add_control(
            'image_hover_opacity',
            [
                'label' => __('Hover Opacity', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 1,
                        'step' => 0.1,
                    ],
                ],
                'default' => [
                    'size' => 0.8,
                ],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-image-scroller-item:hover img' => 'opacity: {{SIZE}};',
                ],
            ]
        );

        $this->end_controls_section();
    }

    /**
     * Render widget output on the frontend.
     */
    protected function render()
    {
        $settings = $this->get_settings_for_display();
        $scroll_direction = $settings['scroll_direction'] ?? 'horizontal';
        $auto_scroll = $settings['auto_scroll'] === 'yes';
        $scroll_speed = !empty($settings['scroll_speed']['size']) ? $settings['scroll_speed']['size'] : 3;
        $pause_on_hover = $settings['pause_on_hover'] === 'yes';
        $infinite_loop = $settings['infinite_loop'] === 'yes';
        $duplicate_items = $settings['duplicate_items'] === 'yes';
        $image_gap = !empty($settings['image_gap']['size']) ? $settings['image_gap']['size'] : 20;
        $scroller_images = !empty($settings['scroller_images']) ? $settings['scroller_images'] : [];

        $wrapper_class = 'unlockafe-image-scroller-wrapper';
        $wrapper_class .= ' unlockafe-scroll-' . esc_attr($scroll_direction);
        if ($auto_scroll) {
            $wrapper_class .= ' unlockafe-auto-scroll';
        }
        if ($infinite_loop) {
            $wrapper_class .= ' unlockafe-infinite';
        }

        ?>
        <div class="<?php echo esc_attr($wrapper_class); ?>"
             data-auto-scroll="<?php echo $auto_scroll ? 'yes' : 'no'; ?>"
             data-scroll-speed="<?php echo esc_attr($scroll_speed); ?>"
             data-pause-on-hover="<?php echo $pause_on_hover ? 'yes' : 'no'; ?>"
             data-infinite-loop="<?php echo $infinite_loop ? 'yes' : 'no'; ?>"
             data-duplicate-items="<?php echo $duplicate_items ? 'yes' : 'no'; ?>"
             data-image-gap="<?php echo esc_attr($image_gap); ?>"
             data-direction="<?php echo esc_attr($scroll_direction); ?>">
            <div class="unlockafe-image-scroller-track">
                <div class="unlockafe-image-scroller-content">
                    <?php if (!empty($scroller_images)): ?>
                        <?php 
                        // Render original items
                        foreach ($scroller_images as $index => $item): 
                            $image_url = !empty($item['image']['url']) ? esc_url($item['image']['url']) : '';
                            $image_alt = !empty($item['image_alt']) ? esc_attr($item['image_alt']) : '';
                            $image_link = !empty($item['image_link']['url']) ? esc_url($item['image_link']['url']) : '';
                            $link_target = !empty($item['image_link']['is_external']) ? '_blank' : '_self';
                            $link_nofollow = !empty($item['image_link']['nofollow']) ? 'nofollow' : '';
                        ?>
                            <div class="unlockafe-image-scroller-item">
                                <?php if ($image_link): ?>
                                    <a href="<?php echo $image_link; ?>" target="<?php echo $link_target; ?>" rel="<?php echo $link_nofollow; ?>">
                                <?php endif; ?>
                                <?php if ($image_url): ?>
                                    <img src="<?php echo $image_url; ?>" alt="<?php echo $image_alt; ?>" loading="lazy">
                                <?php endif; ?>
                                <?php if ($image_link): ?>
                                    </a>
                                <?php endif; ?>
                            </div>
                        <?php endforeach; ?>
                        
                        <?php if ($duplicate_items && $infinite_loop): ?>
                            <?php 
                            // Duplicate items for seamless loop
                            foreach ($scroller_images as $index => $item): 
                                $image_url = !empty($item['image']['url']) ? esc_url($item['image']['url']) : '';
                                $image_alt = !empty($item['image_alt']) ? esc_attr($item['image_alt']) : '';
                                $image_link = !empty($item['image_link']['url']) ? esc_url($item['image_link']['url']) : '';
                                $link_target = !empty($item['image_link']['is_external']) ? '_blank' : '_self';
                                $link_nofollow = !empty($item['image_link']['nofollow']) ? 'nofollow' : '';
                            ?>
                                <div class="unlockafe-image-scroller-item unlockafe-duplicate">
                                    <?php if ($image_link): ?>
                                        <a href="<?php echo $image_link; ?>" target="<?php echo $link_target; ?>" rel="<?php echo $link_nofollow; ?>">
                                    <?php endif; ?>
                                    <?php if ($image_url): ?>
                                        <img src="<?php echo $image_url; ?>" alt="<?php echo $image_alt; ?>" loading="lazy">
                                    <?php endif; ?>
                                    <?php if ($image_link): ?>
                                        </a>
                                    <?php endif; ?>
                                </div>
                            <?php endforeach; ?>
                        <?php endif; ?>
                    <?php endif; ?>
                </div>
            </div>
        </div>
        <?php
    }
}





