<?php
namespace Elementor;

/**
 * Elementor Widget
 * @package Feron
 * @since 1.0.0
 */ 
 
class Game_Grid extends Widget_Base {

	/**
	 * Get widget name.
	 * Retrieve button widget name.
	 *
	 * @since  1.0.0
	 * @access public
	 * @return string Widget name.
	 */
	public function get_name() {
		return 'feron-game-grid-widget';
	}

	/**
	 * Get widget title.
	 * Retrieve button widget title.
	 *
	 * @since  1.0.0
	 * @access public
	 * @return string Widget title.
	 */
	public function get_title() {
		return esc_html__( 'Game Grid', 'feron-core' );
	}

	/**
	 * Get widget icon.
	 * Retrieve button widget icon.
	 *
	 * @since  1.0.0
	 * @access public
	 * @return string Widget icon.
	 */
	public function get_icon() {
		return 'eicon-flash';
	}

	/**
	 * Get widget categories.
	 * Retrieve the list of categories the button widget belongs to.
	 * Used to determine where to display the widget in the editor.
	 *
	 * @since  2.0.0
	 * @access public
	 * @return array Widget categories.
	 */
	public function get_categories()
    {
        return ['feron_widgets'];
    }
	
	/**
	 * Register button widget controls.
	 * Adds different input fields to allow the user to change and customize the widget settings.
	 *
	 * @since  1.0.0
	 * @access protected
	 */
	protected function register_controls() {

		// Tab Start - 1

		$this->start_controls_section(
			'game_grid',
			[
				'label' => esc_html__( 'Game Grid', 'feron-core' ),
			]
		);		
		
		$this->add_control(
			'style',
			[
				'label'   => esc_html__( 'Select Style', 'feron-core' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'style1',
				'options' => array(
					'style1'   => esc_html__( 'Style One', 'feron-core' ),
					'style2'   => esc_html__( 'Style Two', 'feron-core' ),
					'style3'   => esc_html__( 'Style Three ', 'feron-core' ),
				),
			]
		);

		$this->add_control(
			'subtitle',
			[
				'label'       => __( 'Sub Title', 'feron-core' ),
				'type'        => Controls_Manager::TEXTAREA,
				'default' => esc_html__('Get specialist cargo services worldwide', 'feron-core'),
				'dynamic'     => [
					'active' => true,
				],
			]
		);
		
		$this->add_control(
			'title',
			[
				'label'       => __( 'Title', 'feron-core' ),
				'type'        => Controls_Manager::TEXTAREA,
				'dynamic'     => [
					'active' => true,
				],
				'placeholder' => __( 'Enter your title', 'feron-core' ),
				'default'     => __( 'Default Title', 'feron-core' ),
			]
		);

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

		$this->end_controls_section();

		// Tab Start - 2

		$this->start_controls_section(
			'content_section',
			[
				'label' => __( 'Project Grid Block', 'feron-core' ),
				'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
			]
		);
		$this->add_control(
		  'repeat', 
			[
				'type' => Controls_Manager::REPEATER,
				'separator' => 'before',
				'default' => 
					[
						['block_title' => esc_html__('Hello World', 'feron-core')],
					],
				'fields' => 
					[	

						'block_title' =>
						[
							'name' => 'block_title',
							'label' => esc_html__('Title', 'feron-core'),
							'type' => Controls_Manager::TEXTAREA,
							'default' => esc_html__('', 'feron-core'),
						],

						'block_subtitle' =>
						[
							'name' => 'block_subtitle',
							'label' => esc_html__('Subtitle', 'feron-core'),
							'type' => Controls_Manager::TEXTAREA,
							'default' => esc_html__('', 'feron-core'),
						],	
						
						'block_button_link' =>
						[
						  'name' => 'block_button_link',
						  'label' => __( 'Button Url', 'feron-core' ),
						  'type' => Controls_Manager::URL,
						  'placeholder' => __( 'https://your-link.com', 'feron-core' ),
						  'show_external' => true,
						  'default' => [
							'url' => '',
							'is_external' => true,
							'nofollow' => true,
						  ],						  
					   ],

						'block_image' => 	
						[
						'name' => 'block_image',
						'label' => __( 'Image', 'feron-core' ),
						'type' => Controls_Manager::MEDIA,
						'default' => ['url' => Utils::get_placeholder_image_src(),],
						],	

						'block_image2' => 	
						[
						'name' => 'block_image2',
						'label' => __( 'Image 2', 'feron-core' ),
						'type' => Controls_Manager::MEDIA,
						'default' => ['url' => Utils::get_placeholder_image_src(),],
						],

						'block_image3' => 	
						[
						'name' => 'block_image3',
						'label' => __( 'Image 3', 'feron-core' ),
						'type' => Controls_Manager::MEDIA,
						'default' => ['url' => Utils::get_placeholder_image_src(),],
						],

						'block_col_number' =>
						[
							'name' => 'block_col_number',
							'label' => __( 'Select Column', 'feron-core' ),
							'type' => Controls_Manager::SELECT,
							'options' => [
								'col-xl-12' => __( 'Col XL 12', 'feron-core' ),
								'col-xl-9' => __( 'Col XL 9', 'feron-core' ),
								'col-xl-8' => __( 'Col XL 8', 'feron-core' ),
								'col-xl-7' => __( 'Col XL 7', 'feron-core' ),
								'col-xl-6' => __( 'Col XL 6', 'feron-core' ),
								'col-xl-5' => __( 'Col XL 5', 'feron-core' ),
								'col-xl-4' => __( 'Col XL 4', 'feron-core' ),
								'col-xl-3' => __( 'Col XL 3', 'feron-core' ),
								],
								'default' => 'col-xl-3',
						],
						
					],
				'title_field' => '{{block_title}}',
			 ]
	);
		
		
	$this->end_controls_section();	

	
		}

	/**
	 * Render button widget output on the frontend.
	 * Written in PHP and used to generate the final HTML.
	 *
	 * @since  1.0.0
	 * @access protected
	 */
	protected function render() {
		$settings = $this->get_settings_for_display();
		$allowed_tags = wp_kses_allowed_html('post');
		?>


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

		<div class="swiper game-slider-2">
			<div class="swiper-wrapper">

				<?php foreach($settings['repeat'] as $item):?>	
				<div class="swiper-slide">
					<div class="gt-gaming-card-item">
						<div class="gt-gaming-image">
							<?php if(!empty(wp_get_attachment_url($item['block_image']['id']))): ?>
								<img src="<?php echo wp_get_attachment_url($item['block_image']['id']);?>" alt="">
							<?php endif;?>
							<a href="<?php echo esc_url($item['block_button_link']['url']);?>" class="icon">
								<i class="fa-solid fa-arrow-right"></i>
							</a>
							<div class="gt-gaming-content">
								<h6><?php echo wp_kses($item['block_subtitle'], $allowed_tags);?></h6>
								<h3>
									<a href="<?php echo esc_url($item['block_button_link']['url']);?>"><?php echo wp_kses($item['block_title'], $allowed_tags);?></a>
								</h3>
							</div>
						</div>
					</div>
				</div>
				<?php endforeach; ?>

			</div>
		</div>
		<div class="container">
				<div class="game-slider-pagination">
				<div class="game-progress p-relative">
					<div class="game-swiper-pagination"></div>
				</div>
					<div class="array-button d-flex align-items-center">
					<button class="array-prev">
						<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none">
							<g clip-path="url(#clip0_0_434)">
								<path d="M1.16006 18L14.762 18C15.4019 18 15.9222 17.4797 15.9222 16.8398C15.9222 16.2 15.4019 15.6797 14.762 15.6797L3.96553 15.6797L17.6589 1.98281C18.1124 1.5293 18.1124 0.794531 17.6589 0.341017C17.2054 -0.112499 16.4706 -0.112499 16.0171 0.341017L2.32373 14.0379L2.32373 3.24141C2.32373 2.60156 1.80342 2.08125 1.16357 2.08125C0.52373 2.08125 0.00341662 2.60156 0.00341668 3.24141L0.00341787 16.8398C-9.73203e-05 17.4797 0.520214 18 1.16006 18Z" fill="#0B0E13"/>
							</g>
							<defs>
								<clipPath id="clip01_0_434">
								<rect width="18" height="18" fill="white" transform="translate(18 18) rotate(180)"/>
								</clipPath>
							</defs>
						</svg>
					</button>
					<button class="array-next">
						<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none">
						<g clip-path="url(#clip0_0_427)">
							<path d="M16.8399 0H3.23799C2.59814 0 2.07783 0.520312 2.07783 1.16016C2.07783 1.8 2.59814 2.32031 3.23799 2.32031H14.0345L0.341113 16.0172C-0.112402 16.4707 -0.112402 17.2055 0.341113 17.659C0.794629 18.1125 1.52939 18.1125 1.98291 17.659L15.6763 3.96211V14.7586C15.6763 15.3984 16.1966 15.9187 16.8364 15.9187C17.4763 15.9187 17.9966 15.3984 17.9966 14.7586V1.16016C18.0001 0.520312 17.4798 0 16.8399 0Z" fill="#0B0E13"/>
						</g>
						<defs>
							<clipPath id="clip02_0_427">
							<rect width="18" height="18" fill="white"/>
							</clipPath>
						</defs>
						</svg>
					</button>
				</div>
			</div>
		</div>

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

	<div class="row g-4">

		<?php foreach($settings['repeat'] as $item):?>	
		<div class="<?php echo esc_attr($item['block_col_number']); ?> wow fadeInUp" data-wow-delay=".3s">
			<div class="gt-gaming-card-item-5 mt-0">
				<div class="gt-gaming-image">
					<?php if(!empty(wp_get_attachment_url($item['block_image']['id']))): ?>
						<img src="<?php echo wp_get_attachment_url($item['block_image']['id']);?>" alt="">
					<?php endif;?>
					<a href="<?php echo esc_url($item['block_button_link']['url']);?>" class="icon"><i class="fa-solid fa-arrow-right"></i></a>
					<div class="gt-gaming-content">
						<h6><?php echo wp_kses($item['block_subtitle'], $allowed_tags);?></h6>
						<h3>
							<a href="<?php echo esc_url($item['block_button_link']['url']);?>"><?php echo wp_kses($item['block_title'], $allowed_tags);?></a>
						</h3>
					</div>
				</div>
			</div>
		</div>
		<?php endforeach; ?>

	</div>

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

		 <section class="gt-popular-game-section  section-padding pt-0">
            <div class="bg-shape">
            <?php  if ( !empty(esc_url($settings['image']['id']) )) : ?>   
				<img src="<?php echo wp_get_attachment_url($settings['image']['id']);?>" alt=""/>
			<?php endif;?>
            </div>
            <div class="container">
                <div class="section-title-2 text-center">
                    <h6 class="wow fadeInUp"><?php echo $settings['subtitle'];?></h6>
                    <h2 class="wow fadeInUp" data-wow-delay=".3s">
                        <?php echo $settings['title'];?>
                    </h2>
                </div>
                <div class="swiper gt-popular-slider">
                    <div class="swiper-wrapper">

						<?php foreach($settings['repeat'] as $item):?>	
                        <div class="swiper-slide">
                            <div class="gt-popular-game-items">
                                <div class="gt-thumb">
                                    <?php if(!empty(wp_get_attachment_url($item['block_image']['id']))): ?>
										<img src="<?php echo wp_get_attachment_url($item['block_image']['id']);?>" alt="">
									<?php endif;?>
                                    <div class="gt-content">
                                        <a href="<?php echo esc_url($item['block_button_link']['url']);?>" class="post-cat"><?php echo wp_kses($item['block_subtitle'], $allowed_tags);?></a>
                                        <h3><a href="<?php echo esc_url($item['block_button_link']['url']);?>"><?php echo wp_kses($item['block_title'], $allowed_tags);?></a></h3>
                                    </div>
                                </div>
                                <div class="app-store">
									
									<?php  if ( $item['block_image2']['id'] ) : ?>
                                    <a href="#" class="app">
                                    <?php if(!empty(wp_get_attachment_url($item['block_image2']['id']))): ?>
										<img src="<?php echo wp_get_attachment_url($item['block_image2']['id']);?>" alt="">
									<?php endif;?>
                                    </a>
									<?php endif ;?>	

									<?php  if ( $item['block_image3']['id'] ) : ?>
                                    <a href="#" class="app">
									<?php if(!empty(wp_get_attachment_url($item['block_image3']['id']))): ?>
										<img src="<?php echo wp_get_attachment_url($item['block_image3']['id']);?>" alt="">
									<?php endif;?>
                                    </a>
									<?php endif ;?>	

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

                    </div>
                </div>
                <div class="game-slider-pagination">
                    <div class="game-progress p-relative">
                        <div class="game-swiper-pagination"></div>
                    </div>
                     <div class="array-button d-flex align-items-center">
                        <button class="array-prev">
                            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none">
                                <g clip-path="url(#clip0_0_434)">
                                    <path d="M1.16006 18L14.762 18C15.4019 18 15.9222 17.4797 15.9222 16.8398C15.9222 16.2 15.4019 15.6797 14.762 15.6797L3.96553 15.6797L17.6589 1.98281C18.1124 1.5293 18.1124 0.794531 17.6589 0.341017C17.2054 -0.112499 16.4706 -0.112499 16.0171 0.341017L2.32373 14.0379L2.32373 3.24141C2.32373 2.60156 1.80342 2.08125 1.16357 2.08125C0.52373 2.08125 0.00341662 2.60156 0.00341668 3.24141L0.00341787 16.8398C-9.73203e-05 17.4797 0.520214 18 1.16006 18Z" fill="#0B0E13"/>
                                </g>
                                <defs>
                                    <clipPath id="clip0_0_434">
                                    <rect width="18" height="18" fill="white" transform="translate(18 18) rotate(180)"/>
                                    </clipPath>
                                </defs>
                            </svg>
                        </button>
                        <button class="array-next">
                            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none">
                            <g clip-path="url(#clip0_0_427)">
                                <path d="M16.8399 0H3.23799C2.59814 0 2.07783 0.520312 2.07783 1.16016C2.07783 1.8 2.59814 2.32031 3.23799 2.32031H14.0345L0.341113 16.0172C-0.112402 16.4707 -0.112402 17.2055 0.341113 17.659C0.794629 18.1125 1.52939 18.1125 1.98291 17.659L15.6763 3.96211V14.7586C15.6763 15.3984 16.1966 15.9187 16.8364 15.9187C17.4763 15.9187 17.9966 15.3984 17.9966 14.7586V1.16016C18.0001 0.520312 17.4798 0 16.8399 0Z" fill="#0B0E13"/>
                            </g>
                            <defs>
                                <clipPath id="clip0_0_427">
                                <rect width="18" height="18" fill="white"/>
                                </clipPath>
                            </defs>
                            </svg>
                        </button>
                    </div>
                </div>
            </div>     
        </section>

<?php endif ;?>	

             
		<?php 
	}


}

Plugin::instance()->widgets_manager->register_widget_type(new Game_Grid());