<?php
namespace Elementor;

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

class Big_Matches extends Widget_Base {

	public function get_name() {
		return 'pubzi-big-matches-widget';
	}

	public function get_title() {
		return esc_html__( 'Big matches', 'pubzi-core' );
	}

	public function get_icon() {
		return 'eicon-flash';
	}

	public function get_categories() {
		return ['pubzi_widgets'];
	}

	protected function register_controls() {

        $this->start_controls_section(
            'content_section',
            [
                'label' => __( 'Big matches', 'pubzi-core' ),
                'tab'   => Controls_Manager::TAB_CONTENT,
            ]
        );

		$this->add_control(
			'style',
			[
				'label'   => esc_html__( 'Select Style', 'pubzi-core' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'style1',
				'options' => array(
					'style1'   => esc_html__( 'Style One', 'pubzi-core' ),
					'style2'   => esc_html__( 'Style Two', 'pubzi-core' ),
				),
			]
		);

		$this->add_control(
			'image',
			[
				'label'   => __( 'Image', 'pubzi-core' ),
				'type'    => Controls_Manager::MEDIA,
				'default' => ['url' => Utils::get_placeholder_image_src()],
			]
		);

		
		$this->add_control(
			'subtitle',
			[
				'label'       => __( 'Sub Title', 'pubzi-core' ),
				'type'        => Controls_Manager::TEXT,
				'dynamic'     => ['active' => true],
				'placeholder' => __( 'Enter your title', 'pubzi-core' ),
				'default'     => __( 'Default Title', 'pubzi-core' ),
			]
		);

		$this->add_control(
			'title',
			[
				'label'       => __( 'Title', 'pubzi-core' ),
				'type'        => Controls_Manager::TEXT,
				'dynamic'     => ['active' => true],
				'placeholder' => __( 'Enter your title', 'pubzi-core' ),
				'default'     => __( 'Default Title', 'pubzi-core' ),
			]
		);

        $this->end_controls_section();

        // ========== Slider Loop Section ==========
        $this->start_controls_section(
            'slider_loop_content',
            [
                'label' => __( 'Repeat Items', 'pubzi-core' ),
                'tab'   => Controls_Manager::TAB_CONTENT,
            ]
        );

        $slider_content_repeater = new Repeater();

        $slider_content_repeater->add_control(
            'matches_date',
            [
				'label'   => esc_html__('Matches Date', 'pubzi-core'),
				'type'    => Controls_Manager::TEXT,
				'default' => '',
			]
        );    

        $slider_content_repeater->add_control(
            'matches_team_image',
			[
				'label'   => __( 'Team Image 1', 'pubzi-core' ),
				'type'    => Controls_Manager::MEDIA,
				'default' => ['url' => Utils::get_placeholder_image_src()],
			]
        );

		
        $slider_content_repeater->add_control(
            'matches_team_image2',
			[
				'label'   => __( 'Team Image 2', 'pubzi-core' ),
				'type'    => Controls_Manager::MEDIA,
				'default' => ['url' => Utils::get_placeholder_image_src()],
			]
        );

        $slider_content_repeater->add_control(
            'matches_team_image3',
			[
				'label'   => __( 'Team Image 2', 'pubzi-core' ),
				'type'    => Controls_Manager::MEDIA,
				'default' => ['url' => Utils::get_placeholder_image_src()],
			]
        );

		$slider_content_repeater->add_control(
            'matches_time',
			[
				'label'   => esc_html__('Matches Time', 'pubzi-core'),
				'type'    => Controls_Manager::TEXT,
				'default' => '',
			]
        );

		$slider_content_repeater->add_control(
            'matches_title',
			[
				'label'   => esc_html__('Matches Title', 'pubzi-core'),
				'type'    => Controls_Manager::TEXT,
				'default' => '',
			]
        );

		$slider_content_repeater->add_control(
            'matches_url',
			[
				'label' => __( 'Matches Url', 'pubzi-core' ),
				'type' => Controls_Manager::URL,
				'placeholder' => __( 'https://your-link.com', 'pubzi-core' ),
				'show_external' => true,
				'default' => [
					'url' => '',
					'is_external' => true,
					'nofollow' => true,
				],
			],
        );		

		$slider_content_repeater->add_control(
            'matches_text',
            [
				'label'   => esc_html__('Matches Text', 'pubzi-core'),
				'type'    => Controls_Manager::TEXTAREA,
				'default' => '',
			]
        );

        $slider_content_repeater->add_control(
			'matches_icon_name',
			[
				'label'   => __( 'Matches Icon Name', 'pubzi-core' ),
				'type'    => Controls_Manager::TEXT,
			]
		);

		$slider_content_repeater->add_control(
			'matches_icon',
			[
				'label'   => __( 'Matches Icon', 'pubzi-core' ),
				'type'    => Controls_Manager::ICONS,
			]
		);

		$slider_content_repeater->add_control(
			'matches_icon_url',
			[
				'label' => __( 'Matches Icon Url', 'pubzi-core' ),
				'type' => Controls_Manager::URL,
				'placeholder' => __( 'https://your-link.com', 'pubzi-core'
				),
				'show_external' => true,
				'default' => [
					'url' => '',
					'is_external' => true,
					'nofollow' => true,
				],
			],
		);

        $slider_content_repeater->add_control(
			'matches_icon_name2',
			[
				'label'   => __( 'Matches Icon Name 2', 'pubzi-core' ),
				'type'    => Controls_Manager::TEXT,
			]
		);
		$slider_content_repeater->add_control(
			'matches_icon2',
			[
				'label'   => __( 'Matches Icon 2', 'pubzi-core' ),
				'type'    => Controls_Manager::ICONS,
			]
		);

		$slider_content_repeater->add_control(
			'matches_icon_url2',
			[
				'label' => __( 'Matches Icon Url 2', 'pubzi-core' ),
				'type' => Controls_Manager::URL,
				'placeholder' => __( 'https://your-link.com', 'pubzi-core'
				),
				'show_external' => true,
				'default' => [
					'url' => '',
					'is_external' => true,
					'nofollow' => true,
				],
			],
		);

        $slider_content_repeater->add_control(
			'matches_icon_name3',
			[
				'label'   => __( 'Matches Icon Name 3', 'pubzi-core' ),
				'type'    => Controls_Manager::TEXT,
			]
		);
		$slider_content_repeater->add_control(
			'matches_icon3',
			[
				'label'   => __( 'Matches Icon 3', 'pubzi-core' ),
				'type'    => Controls_Manager::ICONS,
			]
		);

		$slider_content_repeater->add_control(
			'matches_icon_url3',
			[
				'label' => __( 'Matches Icon Url 3', 'pubzi-core' ),
				'type' => Controls_Manager::URL,
				'placeholder' => __( 'https://your-link.com', 'pubzi-core'
				),
				'show_external' => true,
				'default' => [
					'url' => '',
					'is_external' => true,
					'nofollow' => true,
				],
			],
		);

        $slider_content_repeater->add_control(
			'matches_icon_name4',
			[
				'label'   => __( 'Matches Icon Name 4', 'pubzi-core' ),
				'type'    => Controls_Manager::TEXT,
			]
		);
		$slider_content_repeater->add_control(
			'matches_icon4',
			[
				'label'   => __( 'Matches Icon 4', 'pubzi-core' ),
				'type'    => Controls_Manager::ICONS,
			]
		);

		$slider_content_repeater->add_control(
			'matches_icon_url4',
			[
				'label' => __( 'Matches Icon Url 4', 'pubzi-core' ),
				'type' => Controls_Manager::URL,
				'placeholder' => __( 'https://your-link.com', 'pubzi-core'
				),
				'show_external' => true,
				'default' => [
					'url' => '',
					'is_external' => true,
					'nofollow' => true,
				],
			],
		);

        $repeater = new Repeater();

        $repeater->add_control(
            'section_title',
            [
                'label'   => __( 'Nav Title', 'pubzi-core' ),
                'type'    => Controls_Manager::TEXT,
                'default' => __( 'LALIGA EA SPORTS', 'pubzi-core' ),
            ]
        );

        $repeater->add_control(
			'slider_content_loop',
			[
				'label'   => __( 'Match Content Repeater', 'pubzi-core' ),
				'type'    => Controls_Manager::REPEATER,
				'fields'  => $slider_content_repeater->get_controls(),
				'default' => [],
			]
		);

        $this->add_control(
            'tab_nav_loop',
            [
                'type'        => Controls_Manager::REPEATER,
                'fields'      => $repeater->get_controls(),
                'title_field' => '{{{ section_title }}}',
                'default'     => [],
            ]
        );

        $this->end_controls_section();
    }

	protected function render() {
		$settings = $this->get_settings_for_display();
		$allowed_tags = wp_kses_allowed_html('post');

		$tab_nav_loop = ! empty( $settings['tab_nav_loop'] ) && is_array( $settings['tab_nav_loop'] ) ? $settings['tab_nav_loop'] : [];

		?>	

		<?php  if ( 'style1' === $settings['style'] ) : ?>

		  <section class="gt-trending-match-4 section-padding">
            <div class="gt-left-shape">
				<?php if ( !empty($settings['image']['id']) ) : ?>   
					<img src="<?php echo esc_url(wp_get_attachment_url($settings['image']['id']));?>" alt=""/>
				<?php endif;?>   
            </div>
            <div class="container">
                <div class="section-title-area align-items-end">

					<?php if($settings['title']): ?>
                    <div class="section-title-2 mb-0">
                        <h6 class="wow fadeInUp"><?php echo wp_kses($settings['subtitle'], $allowed_tags);?></h6>
                        <h2 class="wow fadeInUp" data-wow-delay=".3s">
                            <?php echo wp_kses($settings['title'], $allowed_tags);?>
                        </h2>
                    </div>
					<?php endif; ?>

                    <ul class="nav">
						<?php foreach($tab_nav_loop as $key=>$item): ?>
                        <li class="nav-item wow fadeInUp" data-wow-delay=".2s">
                            <a href="#all<?php echo esc_attr($key);?>" data-bs-toggle="tab" class="nav-link <?php if($key == 0) echo 'active';?>" aria-selected="<?php echo $key == 0 ? 'true' : 'false'; ?>" role="tab">
                                <?php echo wp_kses($item['section_title'], $allowed_tags);?>
                            </a>
                        </li>
						<?php endforeach; ?>
                    </ul>

                </div>
                <div class="tab-content pt-0">
					<?php foreach($tab_nav_loop as $key=>$item): ?>

					
                    <div id="all<?php echo esc_attr($key);?>" class="tab-pane fade <?php if($key == 0) echo 'show active';?>" role="tabpanel">
						<?php if (!empty($item['slider_content_loop'])) : 
							foreach ( $item['slider_content_loop'] as $platform ) : ?>
                        <div class="gt-trending-match-items-2">
                            <div class="gt-match-logo">
							<?php if(!empty($platform['matches_team_image']['id'])): ?>
								<img class="gt-match-thumb" src="<?php echo esc_url(wp_get_attachment_url($platform['matches_team_image']['id']));?>" alt="">
							<?php endif; ?>
							<?php if(!empty($platform['matches_team_image2']['id'])): ?>
								<img src="<?php echo esc_url(wp_get_attachment_url($platform['matches_team_image2']['id']));?>" alt="">
							<?php endif; ?>
							<?php if(!empty($platform['matches_team_image3']['id'])): ?>
								<img class="gt-match-thumb" src="<?php echo esc_url(wp_get_attachment_url($platform['matches_team_image3']['id']));?>" alt="">
							<?php endif; ?>
                            </div>
                            <div class="gt-match-content">
                                <ul class="gt-date-list">
                                    <li>
                                        <i class="fa fa-calendar-alt"></i>
                                        <?php echo esc_html($platform['matches_date']);?>
                                    </li>
                                    <li>
                                        <i class="fa-regular fa-clock"></i>
                                        <?php echo esc_html($platform['matches_time']);?>
                                    </li>
                                </ul>
                                <h3>
                                    <a href="<?php echo esc_url($platform['matches_url']['url']);?>">
                                        <?php echo esc_html($platform['matches_title']);?>
                                    </a>
                                </h3>
                                <p>
                                    <?php echo esc_html($platform['matches_text']);?>
                                </p>
                            </div>
                            <div class="gt-watch-now-items">
                                <span>Watch live on</span>
                                <ul class="gt-watch-now-list">
                                    <li>

										<?php  if ( $platform['matches_icon']['value'] ) : ?>
                                        <a href="<?php echo esc_url($platform['matches_icon_url']['url']);?>">
                                            <i class="<?php echo str_replace("icon ", " ", esc_attr( $platform['matches_icon']['value']));?>"></i> <?php echo esc_html($platform['matches_icon_name']);?>
                                        </a>
										<?php endif ;?>	

                                    	<?php  if ( $platform['matches_icon2']['value'] ) : ?>
                                        <a href="<?php echo esc_url($platform['matches_icon_url2']['url']);?>">
                                            <i class="<?php echo str_replace("icon ", " ", esc_attr( $platform['matches_icon2']['value']));?>"></i> <?php echo esc_html($platform['matches_icon_name2']);?>
                                        </a>
										<?php endif ;?>	

                                    </li>
                                    <li>

                                    	<?php  if ( $platform['matches_icon3']['value'] ) : ?>
                                        <a href="<?php echo esc_url($platform['matches_icon_url3']['url']);?>">
                                            <i class="<?php echo str_replace("icon ", " ", esc_attr( $platform['matches_icon3']['value']));?>"></i> <?php echo esc_html($platform['matches_icon_name3']);?>
                                        </a>
										<?php endif ;?>	

                                    	<?php  if ( $platform['matches_icon4']['value'] ) : ?>
                                        <a href="<?php echo esc_url($platform['matches_icon_url4']['url']);?>">
                                            <i class="<?php echo str_replace("icon ", " ", esc_attr( $platform['matches_icon4']['value']));?>"></i> <?php echo esc_html($platform['matches_icon_name4']);?>
                                        </a>
										<?php endif ;?>	

                                    </li>
                                </ul>
                            </div>
                        </div>

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

					<?php endforeach; ?>
                </div>
            </div>
        </section>


		<?php  elseif ( 'style2' === $settings['style'] ) : ?>

		<section class="gt-upcoming-streaming-section section-padding pt-0 fix">
            <div class="container">
                <div class="section-title-area align-items-end">
					<?php if($settings['title']): ?>
                    <div class="section-title mb-0">
                        <h6 class="wow fadeInUp"><?php echo wp_kses($settings['subtitle'], $allowed_tags);?></h6>
                        <h2 class="wow fadeInUp" data-wow-delay=".3s">
                            <?php echo wp_kses($settings['title'], $allowed_tags);?>
                        </h2>
                    </div>
					<?php endif; ?>
                    <ul class="nav">
						<?php foreach($tab_nav_loop as $key=>$item): ?>
                        <li class="nav-item wow fadeInUp" data-wow-delay=".2s">
                            <a href="#all<?php echo esc_attr($key);?>" data-bs-toggle="tab" class="nav-link <?php if($key == 0) echo 'active';?>" aria-selected="<?php echo $key == 0 ? 'true' : 'false'; ?>" role="tab">
                                <?php echo wp_kses($item['section_title'], $allowed_tags);?>
                            </a>
                        </li>
						<?php endforeach; ?>
                    </ul>
                </div>
				<div class="tab-content m-0">
					<?php foreach($tab_nav_loop as $key=>$item): ?>
					<div id="all<?php echo esc_attr($key);?>" class="tab-pane fade <?php if($key == 0) echo 'show active';?>">
						<div class="gt-upcoming-main-wrapper">
							<div class="row">
								<div class="col-xl-12">

									<?php if (!empty($item['slider_content_loop'])) : 
									foreach ( $item['slider_content_loop'] as $platform ) : ?>
									<div class="gt-upcoming-streaming-wrapper wow fadeInUp" data-wow-delay=".3s">
										<div class="gt-streaming-image">
											<?php if(!empty($platform['matches_team_image']['id'])): ?>
												<img class="gt-match-thumb" src="<?php echo esc_url(wp_get_attachment_url($platform['matches_team_image']['id']));?>" alt="">
											<?php endif; ?>
										</div>
										<div class="gt-streaming-content">
											<ul class="gt-post">
												<li>
													<i class="fa fa-calendar-alt"></i>
													<?php echo esc_html($platform['matches_date']);?>
												</li>
												<li>
													<i class="fa-regular fa-clock"></i>
													<?php echo esc_html($platform['matches_time']);?>
												</li>
											</ul>
											 <h3>
												<a href="<?php echo esc_url($platform['matches_url']['url']);?>">
													<?php echo esc_html($platform['matches_title']);?>
												</a>
											</h3>
											<p>
												<?php echo esc_html($platform['matches_text']);?>
											</p>
										</div>
										<div class="gt-social-item">
											<h6>Watch live on</h6>
											<ul class="gt-social">
												<li>
													<?php  if ( $platform['matches_icon']['value'] ) : ?>
													<a href="<?php echo esc_url($platform['matches_icon_url']['url']);?>">
														<i class="<?php echo str_replace("icon ", " ", esc_attr( $platform['matches_icon']['value']));?>"></i> <?php echo esc_html($platform['matches_icon_name']);?>
													</a>
													<?php endif ;?>	
												</li>
												<li>
													<?php  if ( $platform['matches_icon2']['value'] ) : ?>
													<a href="<?php echo esc_url($platform['matches_icon_url2']['url']);?>">
														<i class="<?php echo str_replace("icon ", " ", esc_attr( $platform['matches_icon2']['value']));?>"></i> <?php echo esc_html($platform['matches_icon_name2']);?>
													</a>
													<?php endif ;?>	
												</li>
											</ul>
											<ul class="gt-social">
												<li>
													<?php  if ( $platform['matches_icon3']['value'] ) : ?>
													<a href="<?php echo esc_url($platform['matches_icon_url3']['url']);?>">
														<i class="<?php echo str_replace("icon ", " ", esc_attr( $platform['matches_icon3']['value']));?>"></i> <?php echo esc_html($platform['matches_icon_name3']);?>
													</a>
													<?php endif ;?>	
												</li>
												<li>
													<?php  if ( $platform['matches_icon4']['value'] ) : ?>
													<a href="<?php echo esc_url($platform['matches_icon_url4']['url']);?>">
														<i class="<?php echo str_replace("icon ", " ", esc_attr( $platform['matches_icon4']['value']));?>"></i> <?php echo esc_html($platform['matches_icon_name4']);?>
													</a>
													<?php endif ;?>	
												</li>
											</ul>
										</div>
									</div>
									<?php endforeach;
									endif; ?>

								</div>
							</div>
						</div>
					</div>
					<?php endforeach; ?>
				</div>
            </div>
       </section>

		<?php endif ;?>	




		<?php 
	}
}


Plugin::instance()->widgets_manager->register( new Big_Matches() );
