<?php

if (!defined("ABSPATH")) {

    exit(); // Exit if accessed directly.

}

class Elementor_tow_tabs_Widget extends \Elementor\Widget_Base
{

    /**
     * Get widget name.
     */

    public function get_name()
    {
        return "tow-tabs";
    }

    /**
     * Get widget title.
     */

    public function get_title()
    {
       return esc_html__("Tow Tabs", "Elementor_tow_tabs_Widget");
    }

    /**
     * Get widget Icon.
     */

    public function get_icon()
    {
        return "eicon-slider-full-screen";
    }

    /**
     * Get widget categories.
     */

    public function get_categories()
    {
        return ["tow-theme-element"];
    }

    /**
     * Get widget keywords.
     */
    public function get_keywords()
    {
        return ["tabs"];
    }

    /**
     * Register widget controls.
     */
    protected function register_controls()
    {

        $this->start_controls_section(
            "content_section",
            [
                "label" => esc_html__(
                   "Display Content",
                   "Elementor_tow_tabs_Widget"
                ),
                "tab" => \Elementor\Controls_Manager::TAB_CONTENT,
           ]
        );

 
        $repeater = new \Elementor\Repeater();      

         $repeater->add_control(
            'icon',
            [
                'label'     => __( 'Tab Icon', 'Elementor_tow_tabs_Widget' ),
                'type'      => \Elementor\Controls_Manager::ICONS,
                'default'   => [
                    'value'   => 'bi bi-bell',
					'library' => 'bootstrap-icon',
                ],
                
            ]
        );
		
        $repeater->add_control("list_title", [
           "label" => esc_html__("Tab Title", "Elementor_tow_tabs_Widget"),
            "type" => \Elementor\Controls_Manager::TEXT,
            "default" => esc_html__("Tab Title", "Elementor_tow_tabs_Widget"),
            "label_block" => true,
        ]);

       $repeater->add_control("list_desc", [
           "label" => esc_html__("Tab Desc", "Elementor_tow_tabs_Widget"),
            "type" => \Elementor\Controls_Manager::WYSIWYG,
            "default" => esc_html__("Tab Desc", "Elementor_tow_tabs_Widget"),
            "label_block" => true,
       ]);

        $this->add_control(
            "list",
            [
               "label" => esc_html__("Repeater List", "Elementor_tow_tabs_Widget"),
               "type" => \Elementor\Controls_Manager::REPEATER,
               "fields" => $repeater->get_controls(),
               "default" => [
                   [
                        "list_title" => esc_html__(
                            "Title #1",
                            "Elementor_tow_tabs_Widget"
                        ),
                        "list_desc" => esc_html__(
                            "Desc #1",
                            "Elementor_tow_tabs_Widget"
                        ),
                       
                    ],
                ],
               "title_field" => "{{{ list_title }}}",
            ]
        );
		
		
        $this->end_controls_section();
		
		
		/************************************ STYLE TAB ***************************************/
		
		$this->start_controls_section("section_style", [
            "label" => esc_html__("Style", "textdomain"),
            "tab" => \Elementor\Controls_Manager::TAB_STYLE,
        ]);
		
		$this->add_control(
            'icon_color',
            [
                'label' => esc_html__( 'Tabs Icon Color', 'Elementor_themeht_heading_Widget' ),
                'type' => \Elementor\Controls_Manager::SELECT,
                'default' => 'col_oran',
                'options' => [
                    'text-white' => esc_html__( 'White', 'Elementor_themeht_heading_Widget' ),
					'text-grey-400' => esc_html__( 'Grey', 'Elementor_themeht_heading_Widget' ),
					'text-black' => esc_html__( 'Black', 'Elementor_themeht_heading_Widget' ),
                    'col_blue' => esc_html__( 'Blue', 'Elementor_themeht_heading_Widget' ),
                    'col_oran'  => esc_html__( 'Orange', 'Elementor_themeht_heading_Widget' ),
                ],
            ]
        );
		
		
        $this->end_controls_section();
		
   }

    /**



     * Render widget output on the frontend.



     */



     protected function render()

    {

        // generate the final HTML on the frontend using PHP



        $settings = $this->get_settings_for_display();

        if ($settings["list"]) { 
		  
		?>
			<div class="approach_1l">
				 <ul class="nav nav-tabs mb-4 border-0 mt-4">
				    <?php
					   $i = 1;
		               foreach ($settings["list"] as $item) {
		             ?>
						<li class="nav-item d-inline-block">
							<a href="#tab<?php print $i;?>" data-bs-toggle="tab" aria-expanded="true" class="nav-link<?php if($i==1){?> active<?php }?>">
							   <span class="d-md-block ">
							    <span class="<?php echo esc_attr($settings["icon_color"]); ?>">
							     <?php 
								  if ( isset($item['icon'] ) && $item['icon'] ) {
								
										 \Elementor\Icons_Manager::render_icon( $item['icon'], [ 'aria-hidden' => 'true', 'class' => 'me-1' ] ); 
									}
								  else{ ?>
									 <i class="fa fa-leaf col_oran me-1"></i> 
								  <?php 
									 } 
								   ?>
							    </span>
							   <?php echo $item["list_title"]; ?>
							   </span>
							</a>
						</li>
						
					  <?php  $i++; } ?>
					  
					</ul>
					<div class="tab-content">
					
					   <?php
					      $i = 1;
		                 foreach ($settings["list"] as $item) {
		                ?>
							<div class="tab-pane<?php if($i==1){?> active<?php }?>" id="tab<?php print $i;?>">
								<div class="tab<?php print $i;?>">
								  <p class="mb-0"><?php echo $item["list_desc"]; ?></p>
								</div>
							</div>
						
							
					       <?php $i++; } ?>
					
					   </div>
					
			</div>		
		
	


     <?php } ?>

         

        <?php

    }

}