<?php
/**
 * ZMND Marquebox Widget
 * Based on helper-core marquebox widget
 */

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

require_once WS_PATH . 'elementor/zmnd/includes/ws-zmnd-widget-base.php';

class WS_ZMND_Marquebox_Widget extends WS_ZMND_Widget_Base {

    /**
     * Get widget name
     */
    public function get_name() {
        return 'ws_zmnd_marquebox';
    }

    /**
     * Get widget title
     */
    public function get_title() {
        return esc_html__('Marquebox text', 'watson');
    }

    /**
     * Get widget icon
     */
    public function get_icon() {
        return 'eicon-text-field';
    }

    /**
     * Get widget categories
     */
    public function get_categories() {
        return ['ws-category'];
    }

    /**
     * Get widget keywords
     */
    public function get_keywords() {
        return ['marquebox', 'marque', 'text', 'zmnd', 'watson'];
    }

    /**
     * Get script depends
     */
    public function get_script_depends() {
        return ['ws-zmnd-marquebox'];
    }

    /**
     * Register widget controls
     */
    protected function register_controls() {
        $this->start_controls_section(
            'ws_content_section',
            [
                'label' => esc_html__('Content', 'watson'),
                'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
            ]
        );

        $this->add_control(
            'ws_icon_svg',
            [
                'label'            => esc_html__('Icon', 'watson'),
                'type'             => \Elementor\Controls_Manager::ICONS,
                'label_block'      => true,
                'default'          => [
                    'value'   => 'fas fa-star',
                    'library' => 'fa-solid',
                ],
                'fa4compatibility' => 'icon'
            ]
        );

        $this->add_control(
            'ws_marquebox_color_style',
            [
                'label'   => esc_html__('Text Color', 'watson'),
                'type'    => \Elementor\Controls_Manager::SELECT,
                'default' => 'ws-marquebox-color-black',
                'options' => [
                    "ws-marquebox-color-black" => esc_html__('Black', 'watson'),
                    "ws-marquebox-color-white" => esc_html__('White', 'watson'),
                    "ws-marquebox-color-custom" => esc_html__('Custom', 'watson'),
                ],
            ]
        );
        
        $this->add_control(
            'ws_marquebox_custom_color',
            [
                'label' => esc_html__('Custom Color', 'watson'),
                'type' => \Elementor\Controls_Manager::COLOR,
                'default' => '#6EC1E4',
                'selectors' => [
                    '{{WRAPPER}} .ws-marquebox-color-custom li div' => 'color: {{VALUE}};',
                ],
                'condition' => [
                    'ws_marquebox_color_style' => 'ws-marquebox-color-custom',
                ],
            ]
        );

        $repeater = new \Elementor\Repeater();
        
        $repeater->add_control(
            'ws_content_type',
            [
                'label' => esc_html__('Content Type', 'watson'),
                'type' => \Elementor\Controls_Manager::SELECT,
                'default' => 'text',
                'options' => [
                    'text' => esc_html__('Text', 'watson'),
                    'image' => esc_html__('Image', 'watson'),
                ],
            ]
        );
        
        $repeater->add_control(
            'ws_text',
            [
                'label' => esc_html__('Text', 'watson'),
                'type' => \Elementor\Controls_Manager::TEXT,
                'default' => esc_html__('Text', 'watson'),
                'condition' => [
                    'ws_content_type' => 'text',
                ],
            ]
        );
        
        $repeater->add_control(
            'ws_text_color_type',
            [
                'label' => esc_html__('Text Color Type', 'watson'),
                'type' => \Elementor\Controls_Manager::SELECT,
                'default' => 'global',
                'options' => [
                    'global' => esc_html__('Global', 'watson'),
                    'custom' => esc_html__('Custom', 'watson'),
                ],
                'condition' => [
                    'ws_content_type' => 'text',
                ],
            ]
        );
        
        $repeater->add_control(
            'ws_text_color',
            [
                'label' => esc_html__('Custom Text Color', 'watson'),
                'type' => \Elementor\Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .ws-marquebox__list li[data-index="{{CURRENT_ITEM}}"] div .ws-marquebox-text' => 'color: {{VALUE}} !important;',
                ],
                'condition' => [
                    'ws_content_type' => 'text',
                    'ws_text_color_type' => 'custom',
                ],
            ]
        );
        
        $repeater->add_control(
            'ws_image',
            [
                'label' => esc_html__('Image', 'watson'),
                'type' => \Elementor\Controls_Manager::MEDIA,
                'default' => [
                    'url' => \Elementor\Utils::get_placeholder_image_src(),
                ],
                'condition' => [
                    'ws_content_type' => 'image',
                ],
            ]
        );
        
        $repeater->add_group_control(
            \Elementor\Group_Control_Image_Size::get_type(),
            [
                'name' => 'ws_image_size',
                'default' => 'thumbnail',
                'condition' => [
                    'ws_content_type' => 'image',
                ],
            ]
        );
        
        $repeater->add_group_control(
            \Elementor\Group_Control_Typography::get_type(),
            [
                'name' => 'ws_text_typography',
                'label' => esc_html__('Typography', 'watson'),
                'selector' => '{{WRAPPER}} .ws-marquebox ul li div',
            ]
        );
        
        $this->add_control(
            'ws_texts',
            [
                'label'       => '',
                'type'        => \Elementor\Controls_Manager::REPEATER,
                'fields'      => $repeater->get_controls(),
            ]
        );

        $this->end_controls_section();

        // Style Section
        $this->start_controls_section(
            'ws_style_section',
            [
                'label' => esc_html__('Style', 'watson'),
                'tab' => \Elementor\Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_control(
            'ws_icon_color',
            [
                'label' => esc_html__('Icon Color', 'watson'),
                'type' => \Elementor\Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .ws-marquebox__list li div i' => 'color: {{VALUE}}',
                    '{{WRAPPER}} .ws-marquebox__list li div svg' => 'fill: {{VALUE}}',
                ],
            ]
        );
        
        $this->add_responsive_control(
            'ws_image_width',
            [
                'label' => esc_html__('Image Width', 'watson'),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => ['px', '%', 'em', 'rem'],
                'range' => [
                    'px' => [
                        'min' => 10,
                        'max' => 500,
                        'step' => 1,
                    ],
                    '%' => [
                        'min' => 1,
                        'max' => 100,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 80,
                ],
                'selectors' => [
                     '{{WRAPPER}} .ws-marquebox__list li div' => 'width: {{SIZE}}{{UNIT}};',
                ],
            ]
        );
        
        $this->add_responsive_control(
            'ws_image_height',
            [
                'label' => esc_html__('Image Height', 'watson'),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => ['px', 'em', 'rem'],
                'range' => [
                    'px' => [
                        'min' => 10,
                        'max' => 300,
                        'step' => 1,
                    ],
                ],
                'selectors' => [
                    '{{WRAPPER}} .ws-marquebox__list li div img' => 'height: {{SIZE}}{{UNIT}}; object-fit: cover;',
                ],
            ]
        );
        
        $this->add_control(
            'ws_image_border_radius',
            [
                'label' => esc_html__('Image Border Radius', 'watson'),
                'type' => \Elementor\Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%', 'em', 'rem'],
                'selectors' => [
                    '{{WRAPPER}} .ws-marquebox__list li div img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->add_control(
            'ws_icon_size',
            [
                'label' => esc_html__('Icon Size', 'watson'),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => ['px', 'em', 'rem'],
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 100,
                        'step' => 1,
                    ],
                ],
                'selectors' => [
                    '{{WRAPPER}} .ws-marquebox__list li div i' => 'font-size: {{SIZE}}{{UNIT}}',
                    '{{WRAPPER}} .ws-marquebox__list li div svg' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}}',
                ],
            ]
        );
        
        $this->add_responsive_control(
            'ws_icon_offset',
            [
                'label' => esc_html__('Icon Offset', 'watson'),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => -100,
                        'max' => 100,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 25,
                ],
                'selectors' => [
                    '{{WRAPPER}} .ws-marquebox__list li div svg' => 'right: -{{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->end_controls_section();
    }

    /**
     * Render widget output
     */
    protected function render() {
        $settings = $this->get_settings_for_display();
        ?>
        <div class="ws-marquebox">
            <ul class="ws-marquebox__list <?php echo esc_attr($settings['ws_marquebox_color_style']); ?>">  
                <?php foreach ($settings['ws_texts'] as $index => $item) : ?>
                    <li data-index="<?php echo esc_attr($index); ?>">
                        <div>
                            <?php if ($item['ws_content_type'] === 'text') : ?>
                                <span class="ws-marquebox-text<?php echo ($item['ws_text_color_type'] === 'custom') ? ' ws-custom-color' : ''; ?>"><?php echo wp_kses_post($item['ws_text']); ?></span>
                            <?php else : ?>
                                <?php 
                                $image_html = ''; 
                                if (!empty($item['ws_image']['id'])) {
                                    $image_html = \Elementor\Group_Control_Image_Size::get_attachment_image_html($item, 'ws_image_size', 'ws_image');
                                } elseif (!empty($item['ws_image']['url'])) {
                                    $image_html = '<img src="' . esc_url($item['ws_image']['url']) . '" alt="' . esc_attr__('Marquebox Image', 'watson') . '">';
                                }
                                echo $image_html;
                                ?>
                            <?php endif; ?>
                            
                            <?php if (!empty($settings['ws_icon_svg']['value'])) : ?>
                                <?php \Elementor\Icons_Manager::render_icon($settings['ws_icon_svg']); ?>
                            <?php endif; ?>
                        </div>
                    </li>
                <?php endforeach; ?>
            </ul>
        </div>
        <?php
    }
}
