<?php

namespace ElementPack\Modules\PortfolioGallery\Widgets;

use Elementor\Controls_Manager;
use ElementPack\Base\Module_Base;
use ElementPack\Includes\Controls\GroupQuery\Group_Control_Query;
use ElementPack\Modules\PortfolioGallery\Skins;
use ElementPack\Traits\Global_Controls_Functions;
use ElementPack\Traits\Global_Widget_Controls;

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

class Portfolio_Gallery extends Module_Base {
	use Group_Control_Query;
	use Global_Widget_Controls;
	use Global_Controls_Functions;

	private $_query = null;
	private $widget_prefix = 'portfolio-gallery';

	public function get_name() {
		return 'bdt-portfolio-gallery';
	}

	public function get_title() {
		return BDTEP . esc_html__( 'Portfolio Gallery', 'bdthemes-element-pack' );
	}

	public function get_icon() {
		return 'bdt-wi-portfolio-gallery';
	}

	public function get_categories() {
		return [ 'element-pack' ];
	}

	public function get_keywords() {
		return [ 'portfolio', 'gallery', 'blog', 'recent', 'news', 'works' ];
	}

	public function get_style_depends() {
		if ( $this->ep_is_edit_mode() ) {
			return [ 'ep-styles' ];
		}
		return [ 'ep-font', 'ep-portfolio-gallery' ];
	}

	public function get_script_depends() {
		if ( $this->ep_is_edit_mode() ) {
			return [ 'imagesloaded', 'tilt', 'ep-scripts' ];
		}
		return [ 'imagesloaded', 'tilt', 'ep-portfolio-gallery' ];
	}

	public function register_skins() {
		$this->add_skin( new Skins\Skin_Abetis( $this ) );
		$this->add_skin( new Skins\Skin_Fedara( $this ) );
		$this->add_skin( new Skins\Skin_Trosia( $this ) );
		$this->add_skin( new Skins\Skin_Janes( $this ) );
	}

	public function get_query() {
		return $this->_query;
	}

	public function has_widget_inner_wrapper(): bool {
		return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
	}

	public function register_controls() {
		$this->register_section_controls();
	}

	private function register_section_controls() {
		$this->start_controls_section(
			'section_content_layout',
			[
				'label' => esc_html__( 'Layout', 'bdthemes-element-pack' ),
				'tab'   => Controls_Manager::TAB_CONTENT,
			]
		);

		$this->add_responsive_control(
			'columns',
			[
				'label'              => esc_html__( 'Columns', 'bdthemes-element-pack' ),
				'type'               => Controls_Manager::SELECT,
				'default'            => '3',
				'tablet_default'     => '2',
				'mobile_default'     => '1',
				'options'            => [
					'1' => '1',
					'2' => '2',
					'3' => '3',
					'4' => '4',
					'5' => '5',
					'6' => '6',
				],
				'frontend_available' => true,
			]
		);

		$this->add_control(
			'show_pagination',
			[
				'label' => esc_html__( 'Pagination', 'bdthemes-element-pack' ),
				'type'  => Controls_Manager::SWITCHER,
			]
		);

		$this->register_portfolio_thumbnail_size_control();

		$this->add_control(
			'masonry',
			[
				'label'       => esc_html__( 'Masonry', 'bdthemes-element-pack' ),
				'description' => esc_html__( 'Masonry will not work if you not set filter.', 'bdthemes-element-pack' ),
				'type'        => Controls_Manager::SWITCHER,
				'condition'   => [
					'columns!' => '1',
				],
			]
		);

		$this->add_control(
			'item_ratio',
			[
				'label'     => esc_html__( 'Item Height', 'bdthemes-element-pack' ),
				'type'      => Controls_Manager::SLIDER,
				'default'   => [
					'size' => 250,
				],
				'range'     => [
					'px' => [
						'min'  => 50,
						'max'  => 500,
						'step' => 5,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .bdt-gallery-thumbnail img' => 'height: {{SIZE}}px',
				],
				'condition' => [
					'masonry!' => 'yes',
				],
			]
		);

		$this->end_controls_section();

		$this->register_portfolio_query_section_controls( [ 'posts_per_page_default' => 9 ] );
		$this->register_portfolio_filter_bar_controls();
		$this->register_portfolio_additional_options_controls( [
			'include_link_controls'    => true,
			'excerpt_limit_default'      => 10,
			'show_excerpt_default'       => '',
		] );

		$this->register_portfolio_style_items_controls( $this->widget_prefix );
		$this->register_portfolio_style_title_controls( $this->widget_prefix );
		$this->register_portfolio_style_excerpt_controls( $this->widget_prefix );
		$this->register_portfolio_style_link_controls( $this->widget_prefix );
		$this->register_style_controls_filter();
		$this->register_portfolio_style_filter_controls();
		$this->register_portfolio_style_category_controls( $this->widget_prefix );

		$this->start_controls_section(
			'section_style_pagination',
			[
				'label'     => esc_html__( 'Pagination', 'bdthemes-element-pack' ),
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => [
					'show_pagination' => 'yes',
				],
			]
		);

		$this->register_pagination_controls();
		$this->end_controls_section();
	}

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

		$this->query_posts( $settings['posts_per_page'] );
		$wp_query = $this->get_query();
		if ( ! $wp_query->found_posts ) {
			return;
		}

		$this->render_header( 'default', $settings );

		while ( $wp_query->have_posts() ) {
			$wp_query->the_post();
			$this->render_post( $settings );
		}

		$this->render_footer();

		if ( 'yes' === $settings['show_pagination'] ) {
			?>
			<div class="ep-pagination">
				<?php element_pack_post_pagination( $wp_query ); ?>
			</div>
			<?php
		}

		wp_reset_postdata();
	}

	public function render_header( $skin, $settings ) {
		$id = 'bdt-portfolio-gallery' . $this->get_id();

		$this->add_render_attribute( 'portfolio-wrapper', 'class', 'bdt-portfolio-gallery-wrapper' );
		$this->add_render_attribute( 'portfolio', 'id', $id );
		$this->add_render_attribute( 'portfolio', 'class', [ 'bdt-portfolio-gallery', 'bdt-ep-grid-filter-container', 'skin-' . $skin ] );
		$this->add_render_attribute( 'portfolio', 'data-bdt-grid', '' );
		$this->add_render_attribute( 'portfolio', 'class', [ 'bdt-grid', 'bdt-grid-medium' ] );

		$columns_mobile = $settings['columns_mobile'] ?? '1';
		$columns_tablet = $settings['columns_tablet'] ?? '2';
		$columns        = $settings['columns'] ?? '3';

		$this->add_render_attribute( 'portfolio', 'class', 'bdt-child-width-1-' . $columns_mobile );
		$this->add_render_attribute( 'portfolio', 'class', 'bdt-child-width-1-' . $columns_tablet . '@s' );
		$this->add_render_attribute( 'portfolio', 'class', 'bdt-child-width-1-' . $columns . '@m' );

		if ( ! empty( $settings['masonry'] ) ) {
			$this->add_render_attribute( 'portfolio', 'data-bdt-grid', 'masonry: true' );
		}

		if ( ! empty( $settings['show_filter_bar'] ) ) {
			$this->add_render_attribute( 'portfolio-wrapper', 'data-bdt-filter', 'target: #' . $id );
		}

		$show_link = $settings['show_link'];

		if ( $show_link === 'lightbox' || $show_link === 'both' ) {
			$anim = $settings['lightbox_animation'];
			$this->add_render_attribute( 'portfolio', 'data-bdt-lightbox', 'toggle: .bdt-gallery-lightbox-item; animation:' . $anim . ';' );
			if ( ! empty( $settings['lightbox_autoplay'] ) ) {
				$this->add_render_attribute( 'portfolio', 'data-bdt-lightbox', 'autoplay: 500;' );
				if ( ! empty( $settings['lightbox_pause'] ) ) {
					$this->add_render_attribute( 'portfolio', 'data-bdt-lightbox', 'pause-on-hover: true;' );
				}
			}
		}

		$this->add_render_attribute(
			[
				'portfolio-wrapper' => [
					'data-settings' => [
						wp_json_encode( [
							'id'       => '#' . $id,
							'tiltShow' => $settings['tilt_show'] === 'yes',
						] ),
					],
				],
			]
		);
		?>
		<div <?php $this->print_render_attribute_string( 'portfolio-wrapper' ); ?>>
			<?php
			if ( ! empty( $settings['show_filter_bar'] ) ) {
				$this->render_filter_menu( $settings );
			}

			$grid_anim = $settings['grid_animation_type'];
			if ( $grid_anim !== '' ) {
				$this->add_render_attribute( 'portfolio', 'bdt-scrollspy', 'cls: bdt-animation-' . esc_attr( $grid_anim ) . ';' );
				$this->add_render_attribute( 'portfolio', 'bdt-scrollspy', 'delay: ' . esc_attr( $settings['grid_anim_delay']['size'] ?? 300 ) . ';' );
				$this->add_render_attribute( 'portfolio', 'bdt-scrollspy', 'target: > div > div > .bdt-portfolio-inner;' );
			}
			?>
			<div <?php $this->print_render_attribute_string( 'portfolio' ); ?>>
				<?php
	}

	public function render_footer() {
		$this->render_portfolio_footer( $this->widget_prefix );
	}

	public function render_post( $settings ) {
		global $post;
		$element_key = 'portfolio-item-' . $post->ID;

		if ( ! empty( $settings['tilt_show'] ) ) {
			$this->add_render_attribute( 'portfolio-item-inner', 'data-tilt', '', true );
			if ( ! empty( $settings['tilt_scale'] ) ) {
				$this->add_render_attribute( 'portfolio-item-inner', 'data-tilt-scale', '1.2', true );
			}
		}
		$this->add_render_attribute( 'portfolio-item-inner', 'class', 'bdt-portfolio-inner', true );
		$this->add_render_attribute( 'portfolio-item', 'class', 'bdt-gallery-item bdt-transition-toggle', true );
		if ( $settings['show_filter_bar'] === 'yes' ) {
			$this->add_render_attribute( $element_key, 'data-filter', $this->filter_menu_terms(), true );
		}
		?>
		<div <?php $this->print_render_attribute_string( $element_key ); ?>>
			<div <?php $this->print_render_attribute_string( 'portfolio-item' ); ?>>
				<div <?php $this->print_render_attribute_string( 'portfolio-item-inner' ); ?>>
					<div class="bdt-portfolio-content-inner">
						<?php
						$this->render_thumbnail( $settings );
						$this->render_overlay( $settings );
						?>
					</div>
					<?php $this->render_desc( $settings ); ?>
					<?php $this->render_categories_names( $settings ); ?>
				</div>
			</div>
		</div>
		<?php
	}
}
