<?php
/*
 * Element: Text With Image Block
 */
use Elementor\Controls_Manager;
use Elementor\Repeater;
use Elementor\Group_Control_Typography;
use Elementor\Utils;
class PLS_Elementor_Text_With_Image extends PLS_Elementor_Widget_Base {
	/**
	 * Retrieve the widget name.
	 *
	 * @return string Widget name.
	 */
	public function get_name() {
        return 'pls-text-with-image';
    }

	/**
     * Get widget title.
     *
     * @since 1.0.0
     * @access public
     *
     * @return string Widget title.
     */
    public function get_title() {
        return esc_html__( 'Text with Image', 'modave-core' );
    }

    /**
     * Get widget icon.
     * @return string Widget icon.
     */
    public function get_icon() {
        return 'pls-icon eicon-form-vertical';
    }
	
	/**
     * Register tabs widget controls.
     * @since 1.0.0
     * @access protected
     */
    protected function register_controls() {
		
		
		$this->start_controls_section(
            'general_section',
            [
                'label' => esc_html__( 'Items', 'modave-core' ),
            ]
        );
		
		$repeater = new Repeater();
		$repeater->add_control(
			'image',
			[
				'label' 		=> esc_html__( 'Image', 'modave-core' ),
				'type' 			=> Controls_Manager::MEDIA,
			]
		);	
		$repeater->add_control(
            'title',
            [
                'label' 	=> esc_html__('Title', 'modave-core'),
                'type' 		=> Controls_Manager::TEXT,
				'label_block' => true,
				'placeholder' => esc_html__( 'Text Here', 'modave-core' ),
				'default' => esc_html__( 'Text Here', 'modave-core' ),
            ]
        );
		$repeater->add_control(
			'link',
			[
				'label' 	=> esc_html__( 'Link', 'modave-core' ),
				'type' 		=> Controls_Manager::URL,
			]
		);			
		$this->add_control(
            'text_image_items',
            [
                'label' 	=> esc_html__( ' Item', 'modave-core' ),
                'type' 		=> Controls_Manager::REPEATER,
                'fields' 	=> $repeater->get_controls(),
                'default'	=> [
					[
						'image'			=> ['url' => Utils::get_placeholder_image_src()],
						'title'			=> 'Heritage',
					],
					[
						'image'			=> ['url' => Utils::get_placeholder_image_src()],
						'title'			=> 'Creativity',
						
					],
					[
						'image'			=> ['url' => Utils::get_placeholder_image_src()],
						'title'			=> 'and Passion',
					],
					[
						'title'			=> 'of Three',
					],
					[
						'image'			=> ['url' => Utils::get_placeholder_image_src()],
						'title'			=> 'Generations',
					],	
				],
				'title_field' => '{{{ title }}}',
            ]
        );
		$this->add_control(
			'show_about_button',
			[
				'label' 	=> esc_html__( 'Show About Button', 'modave-core' ),
				'type' 		=> Controls_Manager::SWITCHER,
				'default' 	=> 'yes',
			]
		);
		$this->add_control(
			'about_button_text',
			[
				'label' 	=> esc_html__( 'Button Text', 'modave-core' ),
				'type' 		=> Controls_Manager::TEXT,
				'default' 	=> 'Read More About',
				'condition' => [
					'show_about_button' => 'yes'
				],
			]
		);
		$this->add_control(
			'about_button_link',
			[
				'label' 	=> esc_html__( 'Button Link', 'modave-core' ),
				'type' 		=> Controls_Manager::URL,				
				'condition' => [
					'show_about_button' => 'yes'
				],
			]
		);
		$this->end_controls_section();
		
		$this->start_controls_section(
			'style_section',
			[
				'label'	=> esc_html__( 'Style', 'modave-core' ),
				'tab'	=> Controls_Manager::TAB_STYLE,
			]
		);		
		$this->add_responsive_control(
			'items_gap',
			[
				'label'			=> esc_html__( 'Items Gap', 'modave-core' ),
				'description' 	=> esc_html__( 'Space between items.', 'modave-core' ),
				'type'			=> Controls_Manager::SLIDER, 
				'size_units' 	=> [ 'px', 'rem', '%', 'em', 'custom' ],
				'range'       	=> [
					'px'  => [
						'step' => 1,
						'min'  => 0,
						'max'  => 200,
					],
					'rem' => array(
						'step' => 1,
						'min'  => 0,
						'max'  => 100,
					),
					'%'   => [
						'step' => 1,
						'min'  => 0,
						'max'  => 100,
					],
				],
				'selectors'		=> [
					'{{WRAPPER}} .pls-text-image-items ' => 'gap: {{SIZE}}{{UNIT}}',
				],
			]
		);		
		$this->add_responsive_control(
            'image_icon_size',
            [
                'label' 	=> esc_html__( 'Image Width(px)', 'modave-core' ),
				'type'			=> Controls_Manager::SLIDER,
				'size_units' 	=> [ 'px', '%' ],
				'range'			=> [ 
					'px' 	=> [ 'min' => 0, 'max' => 500 ], 
					'%' 	=> [ 'min' => 1, 'max' => 100 ] 
				],
				'default' 		=> [ 'unit' => 'px', 'size' => 75 ],
				'selectors'		=> [
					'{{WRAPPER}} .pls-ti-image img' => 'max-width: {{SIZE}}{{UNIT}};width: {{SIZE}}{{UNIT}};',
				]
            ]
        );
		$this->add_responsive_control(
			'border_radius',
			[
				'label'			=> esc_html__( 'Image Radius', 'modave-core' ),
				'description' 	=> esc_html__( 'Set image radius.', 'modave-core' ),
				'type'			=> Controls_Manager::DIMENSIONS,
				'size_units' 	=> [ 'px', 'rem', '%', 'em', 'custom' ],
				'range'       	=> [
					'px'  => [
						'step' => 1,
						'min'  => 0,
						'max'  => 100,
					],
					'rem' => array(
						'step' => 1,
						'min'  => 0,
						'max'  => 100,
					),
					'%'   => [
						'step' => 1,
						'min'  => 0,
						'max'  => 100,
					],
				],
				'selectors'		=> [
					'{{WRAPPER}} .pls-ti-image img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(), 
			[
				'name'     => 'title_typography',
				'label'    => esc_html__( 'Title Typography', 'modave-core' ),
				'selector' => '{{WRAPPER}} .pls-ti-title',
			] 
		);
		$this->add_responsive_control(
			'image_title_gap',
			[
				'label'			=> esc_html__( 'Image & Title Gap', 'modave-core' ),
				'description' 	=> esc_html__( 'Space between image & title.', 'modave-core' ),
				'type'			=> Controls_Manager::SLIDER, 
				'size_units' 	=> [ 'px', 'rem', '%', 'em', 'custom' ],
				'range'       	=> [
					'px'  => [
						'step' => 1,
						'min'  => 0,
						'max'  => 200,
					],
					'rem' => array(
						'step' => 1,
						'min'  => 0,
						'max'  => 100,
					),
					'%'   => [
						'step' => 1,
						'min'  => 0,
						'max'  => 100,
					],
				],
				'selectors'		=> [
					'{{WRAPPER}} .pls-text-image-item' => 'gap: {{SIZE}}{{UNIT}}',
				],
			]
		);
		$this->add_responsive_control(
			'button_gap',
			[
				'label'			=> esc_html__( 'Button Gap', 'modave-core' ),
				'description' 	=> esc_html__( 'Space between text image & button.', 'modave-core' ),
				'type'			=> Controls_Manager::SLIDER, 
				'size_units' 	=> [ 'px', 'rem', '%', 'em', 'custom' ],
				'range'       	=> [
					'px'  => [
						'step' => 1,
						'min'  => 0,
						'max'  => 200,
					],
					'rem' => array(
						'step' => 1,
						'min'  => 0,
						'max'  => 100,
					),
					'%'   => [
						'step' => 1,
						'min'  => 0,
						'max'  => 100,
					],
				],
				'selectors'		=> [
					'{{WRAPPER}} .pls-text-image-button' => 'margin-top: {{SIZE}}{{UNIT}}',
				],
			]
		);
		$this->end_controls_section();

	}
	
	protected function render() {
		
		$settings = $this->get_settings();
		extract( $settings );	
		
		if ( empty( $settings['text_image_items'] ) ) {
			return;
		}
		
		$settings['id'] 	= pls_uniqid( 'pls-text-with-image-' );
		$settings['show_about_button'] 	= $show_about_button ? true : false;
		$settings['about_btn_link']['url']	= 'href="#"';
		$link_url = '';		
		if( ! empty( $settings['about_button_link']['url'] ) ) {
			$link_url = pls_core_elementor_get_url_data( $settings['about_button_link'] );			
		}
		if( ! empty( $link_url['url'] ) ){
			$settings['about_btn_link'] = $link_url;
		}
		
		pls_core_get_templates( 'elements-widgets/text-with-image', $settings );
	}
}

$widgets_manager->register( new PLS_Elementor_Text_With_Image() );