<?php
namespace dreamsalonelementor\Widgets;

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Typography;
use Elementor\Repeater;

if ( ! defined( 'ABSPATH' ) ) { exit; }

class DSOurAchievements extends Widget_Base {
    public function get_name() { return 'dreamsalon-our-achievements'; }
    public function get_title() { return __( 'DS Our Achievements', 'dreamsalon_elementor' ); }
    public function get_icon() { return 'eicon-counter-circle'; }
    public function get_categories() { return [ 'dreamsalonelemetortheme' ]; }

    protected function _register_controls() {
        // Section header
   

        // Counters
        $this->start_controls_section('section_counters', [ 'label' => __( 'Counters', 'dreamsalon_elementor' ) ]);

        $repeater = new Repeater();

        $repeater->add_control('icon_image', [
            'label' => __( 'Icon Image', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::MEDIA,
            'default' => [ 'url' => get_template_directory_uri() . '/assets/img/icons/counter-01.svg' ],
        ]);

        $repeater->add_control('circle_class', [
            'label' => __( 'Circle Extra Class', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::TEXT,
            'default' => '',
            'description' => __( 'Extra class for the small circle span (e.g. bottom-0).', 'dreamsalon_elementor' ),
        ]);

        $repeater->add_control('item_title', [
            'label' => __( 'Title', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::TEXT,
            'default' => 'Wellness Categories',
        ]);

        $repeater->add_control('counter_value', [
            'label' => __( 'Counter Value', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::TEXT,
            'default' => '50',
        ]);

        $repeater->add_control('counter_suffix', [
            'label' => __( 'Counter Suffix', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::TEXT,
            'default' => '+',
        ]);

        $repeater->add_control('wow_duration', [
            'label' => __( 'Animation Duration', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::TEXT,
            'default' => '1.0s',
        ]);

        $repeater->add_control('wow_delay', [
            'label' => __( 'Animation Delay', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::TEXT,
            'default' => '0.2s',
        ]);

        $this->add_control('counters', [
            'label' => __( 'Counter Items', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::REPEATER,
            'fields' => $repeater->get_controls(),
            'default' => [
                [
                    'icon_image'    => [ 'url' => get_template_directory_uri() . '/assets/img/icons/counter-01.svg' ],
                    'circle_class'  => '',
                    'item_title'    => 'Wellness Categories',
                    'counter_value' => '50',
                    'counter_suffix'=> '+',
                    'wow_duration'  => '1.0s',
                    'wow_delay'     => '0.2s',
                ],
                [
                    'icon_image'    => [ 'url' => get_template_directory_uri() . '/assets/img/icons/counter-02.svg' ],
                    'circle_class'  => 'bottom-0',
                    'item_title'    => 'Client Satisfaction',
                    'counter_value' => '95',
                    'counter_suffix'=> '%',
                    'wow_duration'  => '1.1s',
                    'wow_delay'     => '0.2s',
                ],
                [
                    'icon_image'    => [ 'url' => get_template_directory_uri() . '/assets/img/icons/counter-03.svg' ],
                    'circle_class'  => '',
                    'item_title'    => 'Verified Consultants',
                    'counter_value' => '4',
                    'counter_suffix'=> 'K+',
                    'wow_duration'  => '1.2s',
                    'wow_delay'     => '0.2s',
                ],
                [
                    'icon_image'    => [ 'url' => get_template_directory_uri() . '/assets/img/icons/counter-04.svg' ],
                    'circle_class'  => 'bottom-0',
                    'item_title'    => 'Sessions Booked',
                    'counter_value' => '25',
                    'counter_suffix'=> 'K+',
                    'wow_duration'  => '1.3s',
                    'wow_delay'     => '0.2s',
                ],
            ],
            'title_field' => '{{{ item_title }}}',
        ]);

        $this->end_controls_section();

        // Background images
        $this->start_controls_section('section_background', [ 'label' => __( 'Background Images', 'dreamsalon_elementor' ) ]);

        $this->add_control('left_bg_image', [
            'label' => __( 'Left Background Image', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::MEDIA,
            'default' => [ 'url' => get_template_directory_uri() . '/assets/img/bg/counter-bg-1.png' ],
        ]);

        $this->add_control('right_bg_image', [
            'label' => __( 'Right Background Image', 'dreamsalon_elementor' ),
            'type'  => Controls_Manager::MEDIA,
            'default' => [ 'url' => get_template_directory_uri() . '/assets/img/bg/counter-bg-2.png' ],
        ]);

        $this->end_controls_section();  

        // Style
        $this->start_controls_section(
            'section_style',
            [
                'label' => __( 'Style', 'dreamsalon_elementor' ),
                'tab'   => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_group_control(
            Group_Control_Typography::get_type(),
            [
                'name' => 'title_typography',
                'label' => __( 'Title Typography', 'dreamsalon_elementor' ),
                'selector' => '{{WRAPPER}} .counter-section-four .section-header h2',
            ]
        );

        $this->end_controls_section();
    }

    protected function render() {
        $s = $this->get_settings_for_display();
          $items  = ! empty( $s['counters'] ) && is_array( $s['counters'] ) ? $s['counters'] : [];
          $left_bg_img = ! empty( $s['left_bg_image']['url'] ) ? $s['left_bg_image']['url'] : '';
          $right_bg_img = ! empty( $s['right_bg_image']['url'] ) ? $s['right_bg_image']['url'] : '';
        ?>
        <section class="counter-section-four section">
            <div class="container">
 

                <div class="row row-gap-4">
                    <?php if ( ! empty( $items ) ) : ?>
                        <?php foreach ( $items as $index => $item ) :
                            $icon_url    = ! empty( $item['icon_image']['url'] ) ? $item['icon_image']['url'] : '';
                            $circle_cls  = ! empty( $item['circle_class'] ) ? $item['circle_class'] : '';
                            $item_title  = ! empty( $item['item_title'] ) ? $item['item_title'] : '';
                            $value       = isset( $item['counter_value'] ) ? $item['counter_value'] : '';
                            $suffix      = isset( $item['counter_suffix'] ) ? $item['counter_suffix'] : '';
                            $wow_dur     = ! empty( $item['wow_duration'] ) ? $item['wow_duration'] : '1.0s';
                            $wow_delay   = ! empty( $item['wow_delay'] ) ? $item['wow_delay'] : '0.2s';
                        ?>
                        <div class="col-xl-3 col-md-6 d-flex">
                            <div class="counter-item-four bg-transparent p-0 flex-fill wow fadeInUp" data-wow-duration="<?php echo esc_attr( $wow_dur ); ?>" data-wow-delay="<?php echo esc_attr( $wow_delay ); ?>">
                                <div class="counter-img">
                                    <?php if ( $icon_url ) : ?>
                                    <img src="<?php echo esc_url( $icon_url ); ?>" class="img-fluid" alt="icon">
                                    <?php endif; ?>
                                    <span class="<?php echo esc_attr( $circle_cls ); ?>"><i class="ti ti-circle-filled"></i></span>
                                </div>
                                <?php if ( $item_title ) : ?>
                                <h3><?php echo esc_html( $item_title ); ?></h3>
                                <?php endif; ?>
                                <p class="counter-value"><span class="counter"><?php echo esc_html( $value ); ?></span><?php echo esc_html( $suffix ); ?></p>
                            </div>
                        </div>
                        <?php endforeach; ?>
                    <?php endif; ?>
                </div>

                <?php if ( $left_bg_img ) : ?>
                <img src="<?php echo esc_url( $left_bg_img ); ?>" class="img-fluid counter-bg left-top achievements-leftimage" alt="left background">
                <?php endif; ?>
                
                <?php if ( $right_bg_img ) : ?>
                <img src="<?php echo esc_url( $right_bg_img ); ?>" class="img-fluid counter-bg right-bottom" alt="right background">
                <?php endif; ?>

            </div>
        </section>
        <?php
    }
}