<?php
namespace Elementor; // Custom widgets must be defined in the Elementor namespace
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly (security measure)

/**
 * Widget Name: Section Heading 
 */
class PBMIT_TabsElement extends Widget_Base{

 	/**
	 * Get widget name.
	 *
	 * Retrieve tabs widget name.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return string Widget name.
	 */
	public function get_name() {
		return 'pbmit_tabs_element';
	}

	/**
	 * Get widget title.
	 *
	 * Retrieve tabs widget title.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return string Widget title.
	 */
	public function get_title() {
		return esc_html__( 'Kidzieo Tabs Element', 'kidzieo' );
	}

	/**
	 * Get widget icon.
	 *
	 * Retrieve tabs widget icon.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return string Widget icon.
	 */
	public function get_icon() {
		return 'fas fa-box';
	}

	// The get_categories method, lets you set the category of the widget, return the category name as a string.
	public function get_categories() {
		return [ 'kidzieo_category' ];
	}

	/**
	 * Get widget keywords.
	 *
	 * Retrieve the list of keywords the widget belongs to.
	 *
	 * @since 2.1.0
	 * @access public
	 *
	 * @return array Widget keywords.
	 */
	public function get_keywords() {
		return [ 'tabs', 'accordion', 'toggle' ];
	}

	protected function register_controls() {

		//Content Service box
		$this->start_controls_section(
			'content_section',
			[
				'label' => esc_attr( 'Tabs', 'kidzieo' ),
			]
		);

		$repeater = new Repeater();

		$repeater->add_control(
			'tab_icon',
			[
				'label'				=> esc_attr( 'Icon', 'kidzieo' ),
				'type'				=> Controls_Manager::ICONS,
				'fa4compatibility'	=> 'icon',
				'default'			=> [
					'value'				=> 'fas fa-star',
					'library'			=> 'fa-solid',
					'url'				=> '',
				],
			]
		);

		$repeater->add_control(
			'tab_title',
			[
				'label'			=> esc_attr( 'Title & Description', 'kidzieo' ),
				'type'			=> Controls_Manager::TEXT,
				'default'		=> esc_attr( 'Tab Title', 'kidzieo' ),
				'placeholder'	=> esc_attr( 'Tab Title', 'kidzieo' ),
				'label_block'	=> true,
			]
		);

		$repeater->add_control(
			'tab_content',
			[
				'label'			=> esc_attr( 'Content', 'kidzieo' ),
				'default'		=> esc_attr( 'Tab Content', 'kidzieo' ),
				'placeholder'	=> esc_attr( 'Tab Content', 'kidzieo' ),
				'type'			=> Controls_Manager::WYSIWYG,
				'show_label'	=> false,
			]
		);

		$this->add_control(
			'tabs',
			[
				'label'			=> esc_attr( 'Tabs Items', 'kidzieo' ),
				'type'			=> Controls_Manager::REPEATER,
				'fields'		=> $repeater->get_controls(),
				'default'		=> [
					[
						'tab_title'		=> esc_attr( 'Tab #1', 'kidzieo' ),
						'tab_icon'		=> [ 'value' => 'fas fa-star', 'library' => 'fa-solid' ],
						'tab_content'	=> esc_attr( 'We help ambitious businesses like yours generate more profits by building awareness, driving web traffic, connecting with customers, and growing overall sales. Give us a call.', 'kidzieo' ),
					],
					[
						'tab_title'		=> esc_attr( 'Tab #2', 'kidzieo' ),
						'tab_icon'		=> [ 'value' => 'fas fa-star', 'library' => 'fa-solid' ],
						'tab_content'	=> esc_attr( 'We help ambitious businesses like yours generate more profits by building awareness, driving web traffic, connecting with customers, and growing overall sales. Give us a call.', 'kidzieo' ),
					],
				],
				'title_field'	=> '{{{ tab_title }}}',
			]
		);

		$this->end_controls_section();

	}

	protected function render() {
		$settings = $this->get_settings_for_display();
		?>

		<div class="pbmit-tabs">
			<?php if ( $settings['tabs'] ) : ?>
			<ul class="pbmit-tabs-heading">
				<?php $i = 1; foreach ( $settings['tabs'] as $tabs ) { ?>
					<?php $active_li_class = ( $i==1 ) ? 'pbmit-tab-li-active' : '' ; ?>

					<?php
					// icon
					$icon_html = '';
					if( !empty($tabs['tab_icon']['value']) ){
						if($tabs['tab_icon']['library']=='svg'){
							ob_start();
							Icons_Manager::render_icon( $tabs['tab_icon'] , [ 'aria-hidden' => 'true' ] );
							$icon_html = ob_get_contents();
							ob_end_clean();
							$icon_html			= '<div class="pbmit-tab-svg"><div class="pbmit-tab-svg-wrapper">' . $icon_html . '</div></div>';
							$icon_type_class	= 'icon';
						} else {
							ob_start();
							Icons_Manager::render_icon( $tabs['tab_icon'] , [ 'aria-hidden' => 'true' ] );
							$icon_code = ob_get_contents();
							ob_end_clean();
							$icon_html = '<div class="pbmit-tab-icon">' . pbmit_esc_kses( $icon_code ) . '</div>';
							wp_enqueue_style( 'elementor-icons-'.$tabs['tab_icon']['library']);
						}
					}
					?>

				<li class="pbmit-tab-link <?php echo esc_attr($active_li_class); ?>" data-pbmit-tab="<?php echo esc_attr($i); ?>"><?php echo pbmit_esc_kses($icon_html); ?><span><?php echo esc_html($tabs['tab_title']); ?></span></li>
				<?php $i++; } ?>
			</ul>

			<div class="pbmit-tab-content-wrapper">
				<?php $j = 1; foreach ( $settings['tabs'] as $tabs ) { ?>
					<?php $active_class = ( $j==1 ) ? 'pbmit-tab-active' : '' ; ?>
					<div class="pbmit-tab-content pbmit-tab-content-<?php echo esc_attr($j); ?> <?php echo esc_attr($active_class); ?>">
						<?php
						$icon_html = ''; // icon
						if( !empty($tabs['tab_icon']['value']) ){
							if($tabs['tab_icon']['library']=='svg'){
								ob_start();
								Icons_Manager::render_icon( $tabs['tab_icon'] , [ 'aria-hidden' => 'true' ] );
								$icon_html = ob_get_contents();
								ob_end_clean();
								$icon_html	   = '<div class="pbmit-tab-svg"><div class="pbmit-tab-svg-wrapper">' . $icon_html . '</div></div>';
								$icon_type_class = 'icon';
							} else {
								ob_start();
								Icons_Manager::render_icon( $tabs['tab_icon'] , [ 'aria-hidden' => 'true' ] );
								$icon_code = ob_get_contents();
								ob_end_clean();
								$icon_html = '<div class="pbmit-tab-icon">' . pbmit_esc_kses( $icon_code ) . '</div>';
								wp_enqueue_style( 'elementor-icons-'.$tabs['tab_icon']['library']);
							}
						}
						?>
						<div class="pbmit-tab-content-title" data-pbmit-tab="<?php echo esc_attr($j); ?>"><?php echo pbmit_esc_kses($icon_html); ?><?php echo esc_html($tabs['tab_title']); ?></div>
						<div class="pbmit-tab-content-inner">
							<?php echo pbmit_esc_kses($tabs['tab_content']); ?>
						</div>
					</div>
				<?php $j++; } ?>
			</div>

			<?php endif; ?>
		</div>
		<?php
	}

	protected function content_template() {}
}
// After the Schedule class is defined, I must register the new widget class with Elementor:
Plugin::instance()->widgets_manager->register( new PBMIT_TabsElement() );