<?php
/*
 * Elementor Confin Funfact Widget
 * Author & Copyright: themexshaper
*/

namespace Elementor;

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

class Confin_Funfact extends Widget_Base{

	/**
	 * Retrieve the widget name.
	*/
	public function get_name(){
		return 'tmx-confin_funfact';
	}

	/**
	 * Retrieve the widget title.
	*/
	public function get_title(){
		return esc_html__( 'Funfact', 'confin-core' );
	}

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

	/**
	 * Retrieve the list of categories the widget belongs to.
	*/
	public function get_categories() {
		return ['themexshaper-category'];
	}

	/**
	 * Retrieve the list of scripts the Confin Funfact widget depended on.
	 * Used to set scripts dependencies required to run the widget.
	*/
	public function get_script_depends() {
		return ['tmx-confin_funfact'];
	}
	
	/**
	 * Register Confin Funfact widget controls.
	 * Adds different input fields to allow the user to change and customize the widget settings.
	*/
	protected function register_controls(){
		
		$this->start_controls_section(
			'section_funfact',
			[
				'label' => esc_html__( 'Funfact Options', 'confin-core' ),
			]
		);
		$repeater = new Repeater();
		$repeater->add_control(
			'funfact_title',
			[
				'label' => esc_html__( 'Title Text', 'confin-core' ),
				'type' => Controls_Manager::TEXT,
				'default' => esc_html__( 'Title Text', 'confin-core' ),
				'placeholder' => esc_html__( 'Type title text here', 'confin-core' ),
				'label_block' => true,
			]
		);
		$repeater->add_control(
			'funfact_number',
			[
				'label' => esc_html__( 'Funfact Number', 'confin-core' ),
				'type' => Controls_Manager::TEXT,
				'default' => esc_html__( '250', 'confin-core' ),
				'placeholder' => esc_html__( 'Type funfact Number here', 'confin-core' ),
				'label_block' => true,
			]
		);
		$repeater->add_control(
			'funfact_plus',
			[
				'label' => esc_html__( 'Funfact Plus/Percentage', 'confin-core' ),
				'type' => Controls_Manager::TEXT,
				'default' => esc_html__( '+', 'confin-core' ),
				'placeholder' => esc_html__( 'Type funfact Plus/Percentage here', 'confin-core' ),
				'label_block' => true,
			]
		);
		$this->add_control(
			'funfactItems_groups',
			[
				'label' => esc_html__( 'Funfact Items', 'confin-core' ),
				'type' => Controls_Manager::REPEATER,
				'default' => [
					[
						'funfact_title' => esc_html__( 'Funfact', 'confin-core' ),
					],
					
				],
				'fields' =>  $repeater->get_controls(),
				'title_field' => '{{{ funfact_title }}}',
			]
		);
		$this->end_controls_section();// end: Section
		

		// Funfact Number
		$this->start_controls_section(
			'funfact_number_style',
			[
				'label' => esc_html__( 'Number', 'confin-core' ),
				'tab' => Controls_Manager::TAB_STYLE,
			]
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'label' => esc_html__( 'Typography', 'confin-core' ),
				'name' => 'confin_number_typography',
				'selector' => '{{WRAPPER}} .fun-fact-section .grid h3, .fun-fact-section .grid h3 span',
			]
		);
		$this->add_control(
			'number_color',
			[
				'label' => esc_html__( 'Color', 'confin-core' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .fun-fact-section .grid h3, .fun-fact-section .grid h3 span' => 'color: {{VALUE}};',
				],
			]
		);
		$this->add_control(
			'number_padding',
			[
				'label' => __( 'Number Padding', 'confin-core' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em' ],
				'selectors' => [
					'{{WRAPPER}} .fun-fact-section .grid h3, .fun-fact-section .grid h3 span' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->end_controls_section();// end: Section

		// Funfact Title
		$this->start_controls_section(
			'funfact_title_style',
			[
				'label' => esc_html__( 'Funfact Title', 'confin-core' ),
				'tab' => Controls_Manager::TAB_STYLE,
			]
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'label' => esc_html__( 'Typography', 'confin-core' ),
				'name' => 'ntrsvt_funfact_title_typography',
				'selector' => '{{WRAPPER}} .fun-fact-section .grid h3 + p',
			]
		);
		$this->add_control(
			'funfact_title',
			[
				'label' => esc_html__( 'Color', 'confin-core' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .fun-fact-section .grid h3 + p' => 'color: {{VALUE}};',
				],
			]
		);
		$this->add_control(
			'funfact_title_padding',
			[
				'label' => __( 'Number Padding', 'confin-core' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em' ],
				'selectors' => [
					'{{WRAPPER}} .fun-fact-section .grid h3 + p' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->end_controls_section();// end: Section

		
	}

	/**
	 * Render Funfact widget output on the frontend.
	 * Written in PHP and used to generate the final HTML.
	*/
	protected function render() {
		$settings = $this->get_settings_for_display();
		$funfactItems_groups = !empty( $settings['funfactItems_groups'] ) ? $settings['funfactItems_groups'] : [];

		// Turn output buffer on
		ob_start();
		?>
		<div class="fun-fact-section">
		    <div class="fun-fact-grids clearfix">
					<?php 	// Group Param Output
						if( is_array( $funfactItems_groups ) && !empty( $funfactItems_groups ) ){
						foreach ( $funfactItems_groups as $each_item ) { 

						$funfact_title = !empty( $each_item['funfact_title'] ) ? $each_item['funfact_title'] : '';
						$funfact_number = !empty( $each_item['funfact_number'] ) ? $each_item['funfact_number'] : '';
						$funfact_plus = !empty( $each_item['funfact_plus'] ) ? $each_item['funfact_plus'] : '';

						?>
		        <div class="grid">
		            <div class="info">
		            	<?php 
		            		if( $funfact_number ) { echo '<h3><span class="odometer" data-count="'.esc_html( $funfact_number ).'">'.esc_html__( '00','confin-core' ).'</span>'.esc_html( $funfact_plus ).'</h3>'; } 
		            		if( $funfact_title ) { echo '<p>'.wp_kses_post( $funfact_title ).'</p>'; } 
		            	?>
		            </div>
		        </div>
		      <?php }
					} ?>
		    </div>
		</div>
		<?php
			// Return outbut buffer
			echo ob_get_clean();	
		}
	/**
	 * Render Funfact widget output in the editor.
	 * Written as a Backbone JavaScript template and used to generate the live preview.
	*/
	
	//protected function _content_template(){}
	
}
Plugin::instance()->widgets_manager->register( new Confin_Funfact() );