<?php
namespace EcafeAddons\Widgets;

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Image_Size;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;

use EcafeAddons\EcafeElementLoad;

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

class Ecafe_Post_Image extends Widget_Base {

	public function get_name() {
		return 'ecafe-post-image';
	}

	public function get_title() {
		return esc_html__( 'Post Image', 'essential-classy-addons-for-elementor' );
	}

	public function get_icon() {
		return 'ecafe-ele-back-icon ecafe-post-image-icon';
	}

	public function get_categories() {
		return array( 'essential' );
	}

	public function get_keywords() {
		return array( 'post', 'feature', 'image', 'post image', 'post feature image' );
	}

	public function get_script_depends() {
		return array( 'ecafe-post-image' );
	}
	public function get_custom_help_url() {
		return 'https://store.kapasias.com/helpdesk/';
	}
	public function has_widget_inner_wrapper(): bool {
		return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
	}
	protected function register_controls() {

		$this->start_controls_section(
			'contentSection',
			array(
				'label' => esc_html__( 'Post Image', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_CONTENT,
			)
		);
		$this->add_control(
			'imageType',
			array(
				'label'   => esc_html__( 'Type', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'image',
				'options' => array(
					'image'      => esc_html__( 'Image', 'essential-classy-addons-for-elementor' ),
					'background' => esc_html__( 'Background', 'essential-classy-addons-for-elementor' ),
				),
			)
		);
		$this->add_group_control(
			Group_Control_Image_Size::get_type(),
			array(
				'name'    => 'imageSize',
				'default' => 'full',
				'exclude' => array( 'custom' ),
			)
		);
		$this->add_control(
			'imageAlign',
			array(
				'label'       => esc_html__( 'Alignment', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::CHOOSE,
				'options'     => array(
					'flex-start' => array(
						'title' => esc_html__( 'Left', 'essential-classy-addons-for-elementor' ),
						'icon'  => 'eicon-text-align-left',
					),
					'center'     => array(
						'title' => esc_html__( 'Center', 'essential-classy-addons-for-elementor' ),
						'icon'  => 'eicon-text-align-center',
					),
					'flex-end'   => array(
						'title' => esc_html__( 'Right', 'essential-classy-addons-for-elementor' ),
						'icon'  => 'eicon-text-align-right',
					),
				),
				'selectors'   => array(
					'{{WRAPPER}} .ec-post-image-wrapper' => 'justify-content: {{VALUE}};',
				),
				'condition'   => array(
					'imageType' => 'image',
				),
				'label_block' => false,
			)
		);
		$this->add_control(
			'imageLink',
			array(
				'label'     => esc_html__( 'Link', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::SWITCHER,
				'default'   => 'no',
				'label_on'  => esc_html__( 'Enable', 'essential-classy-addons-for-elementor' ),
				'label_off' => esc_html__( 'Disable', 'essential-classy-addons-for-elementor' ),
				'condition' => array(
					'imageType' => 'image',
				),
			)
		);
		$this->add_control(
			'imageBgOn',
			array(
				'label'     => esc_html__( 'Background On', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'section',
				'options'   => array(
					'section'      => esc_html__( 'Section', 'essential-classy-addons-for-elementor' ),
					'innersection' => esc_html__( 'Inner Section', 'essential-classy-addons-for-elementor' ),
					'column'       => esc_html__( 'Column', 'essential-classy-addons-for-elementor' ),
					'container'    => esc_html__( 'Container', 'essential-classy-addons-for-elementor' ),
				),
				'condition' => array(
					'imageType' => 'background',
				),
			)
		);
		$this->end_controls_section();

		/*Notice panel*/
		$ecwidgetdoclink = esc_url( 'https://ecaddons.com/docs/post-image-blog-builder-tutorial/' );
		include ECAFE_PATH . 'element/widgets/ecafe-widgetpanel-help.php';

		/*image start*/
		$this->start_controls_section(
			'imageStyling',
			array(
				'label'     => esc_html__( 'Image', 'essential-classy-addons-for-elementor' ),
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => array(
					'imageType' => 'image',
				),
			)
		);
		$this->add_responsive_control(
			'imageSize',
			array(
				'label'      => esc_html__( 'Size', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', '%' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 1000,
					),
					'%'  => array(
						'min'  => 1,
						'max'  => 100,
						'step' => 1,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .ec-post-image-wrapper img' => 'width:{{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'imagePadding',
			array(
				'label'      => esc_html__( 'Padding', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .ec-post-image-wrapper img' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'imageMargin',
			array(
				'label'      => esc_html__( 'Margin', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .ec-post-image-wrapper img' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->start_controls_tabs( 'tabsImageStyle' );
		$this->start_controls_tab(
			'tabImageN',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'imageBg',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .ec-post-image-wrapper img',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'imageBorder',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .ec-post-image-wrapper img',
			)
		);
		$this->add_responsive_control(
			'imageBr',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .ec-post-image-wrapper img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'imageShadow',
				'selector' => '{{WRAPPER}} .ec-post-image-wrapper img',
			)
		);
		$this->add_control(
			'imageTransition',
			array(
				'label'       => esc_html__( 'Transition css', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'placeholder' => esc_html__( 'all .3s linear', 'essential-classy-addons-for-elementor' ),
				'selectors'   => array(
					'{{WRAPPER}} .ec-post-image-wrapper img' => 'transition:{{VALUE}};',
				),
			)
		);
		$this->add_control(
			'imageTransform',
			array(
				'label'       => esc_html__( 'Transform css', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'placeholder' => esc_html__( 'skew(-20deg)', 'essential-classy-addons-for-elementor' ),
				'selectors'   => array(
					'{{WRAPPER}} .ec-post-image-wrapper img' => 'transform: {{VALUE}};-ms-transform: {{VALUE}};-moz-transform: {{VALUE}};-webkit-transform: {{VALUE}};',
				),
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'tabImageHover',
			array(
				'label' => esc_html__( 'Hover', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'imageBgH',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .ec-post-image-wrapper img:hover',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'imageBorderH',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .ec-post-image-wrapper img:hover',
			)
		);
		$this->add_responsive_control(
			'imageBrH',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .ec-post-image-wrapper img:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'imageShadowH',
				'selector' => '{{WRAPPER}} .ec-post-image-wrapper img:hover',
			)
		);
		$this->add_control(
			'imageTransitionH',
			array(
				'label'       => esc_html__( 'Transition css', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'placeholder' => esc_html__( 'all .3s linear', 'essential-classy-addons-for-elementor' ),
				'selectors'   => array(
					'{{WRAPPER}} .ec-post-image-wrapper img:hover' => 'transition:{{VALUE}};',
				),
			)
		);
		$this->add_control(
			'imageTransformH',
			array(
				'label'       => esc_html__( 'Transform css', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'placeholder' => esc_html__( 'skew(-20deg)', 'essential-classy-addons-for-elementor' ),
				'selectors'   => array(
					'{{WRAPPER}} .ec-post-image-wrapper img:hover' => 'transform: {{VALUE}};-ms-transform: {{VALUE}};-moz-transform: {{VALUE}};-webkit-transform: {{VALUE}};',
				),
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();
		/*image start*/

		/*background start*/
		$this->start_controls_section(
			'backgroundStyling',
			array(
				'label'     => esc_html__( 'Background', 'essential-classy-addons-for-elementor' ),
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => array(
					'imageType' => 'background',
				),
			)
		);
		$this->add_responsive_control(
			'imageBgSize',
			array(
				'label'     => esc_html__( 'Background Size', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'cover',
				'options'   => array(
					'auto'    => esc_html__( 'Auto', 'essential-classy-addons-for-elementor' ),
					'cover'   => esc_html__( 'Cover', 'essential-classy-addons-for-elementor' ),
					'contain' => esc_html__( 'Contain', 'essential-classy-addons-for-elementor' ),
				),
				'selectors' => array(
					'#ecpi{{ID}}.ec-post-image-wrapper.ec-post-background' => 'background-size: {{VALUE}}  !important;',
				),
			)
		);
		$this->add_responsive_control(
			'imageBgRepeat',
			array(
				'label'     => esc_html__( 'Background Repeat', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'no-repeat',
				'options'   => array(
					'no-repeat' => esc_html__( 'No-repeat', 'essential-classy-addons-for-elementor' ),
					'repeat'    => esc_html__( 'Repeat', 'essential-classy-addons-for-elementor' ),
					'repeat-x'  => esc_html__( 'Repeat-x', 'essential-classy-addons-for-elementor' ),
					'repeat-y'  => esc_html__( 'Repeat-y', 'essential-classy-addons-for-elementor' ),
				),
				'selectors' => array(
					'#ecpi{{ID}}.ec-post-image-wrapper.ec-post-background' => 'background-repeat: {{VALUE}}  !important;',
				),
			)
		);
		$this->add_responsive_control(
			'imageBgPosition',
			array(
				'label'     => esc_html__( 'Background Position', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'center center',
				'options'   => array(
					'center center' => esc_html__( 'Center Center', 'essential-classy-addons-for-elementor' ),
					'center left'   => esc_html__( 'Center Left', 'essential-classy-addons-for-elementor' ),
					'center right'  => esc_html__( 'Center Right', 'essential-classy-addons-for-elementor' ),
					'top center'    => esc_html__( 'Top Center', 'essential-classy-addons-for-elementor' ),
					'top left'      => esc_html__( 'Top Left', 'essential-classy-addons-for-elementor' ),
					'top right'     => esc_html__( 'Top Right', 'essential-classy-addons-for-elementor' ),
					'bottom center' => esc_html__( 'Bottom Center', 'essential-classy-addons-for-elementor' ),
					'bottom left'   => esc_html__( 'Bottom Left', 'essential-classy-addons-for-elementor' ),
					'bottom right'  => esc_html__( 'Bottom Right', 'essential-classy-addons-for-elementor' ),
				),
				'selectors' => array(
					'#ecpi{{ID}}.ec-post-image-wrapper.ec-post-background' => 'background-position: {{VALUE}}  !important;',
				),
			)
		);
		$this->add_responsive_control(
			'imageBgAttachment',
			array(
				'label'     => esc_html__( 'Background Attachment', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'scroll',
				'options'   => array(
					''       => esc_html__( 'None', 'essential-classy-addons-for-elementor' ),
					'scroll' => esc_html__( 'Scroll', 'essential-classy-addons-for-elementor' ),
					'fixed'  => esc_html__( 'Fixed', 'essential-classy-addons-for-elementor' ),
				),
				'selectors' => array(
					'#ecpi{{ID}}.ec-post-image-wrapper.ec-post-background' => 'background-attachment: {{VALUE}}  !important;',
				),
			)
		);
		$this->add_control(
			'imageBgOverlay',
			array(
				'label'     => esc_html__( 'Overlay', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::SWITCHER,
				'default'   => 'no',
				'label_on'  => esc_html__( 'Enable', 'essential-classy-addons-for-elementor' ),
				'label_off' => esc_html__( 'Disable', 'essential-classy-addons-for-elementor' ),
				'separator' => 'before',
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'      => 'imageBgOverlayBg',
				'types'     => array( 'classic', 'gradient' ),
				'selector'  => '#ecpi{{ID}}.ec-post-image-wrapper.ec-post-background:before',
				'condition' => array(
					'imageBgOverlay' => 'yes',
				),
			)
		);
		$this->end_controls_section();
		/*background start*/
	}

	protected function render() {

		$settings  = $this->get_settings_for_display();
		$imageType = ! empty( $settings['imageType'] ) ? $settings['imageType'] : 'image';
		$imageSize = ! empty( $settings['imageSize_size'] ) ? $settings['imageSize_size'] : 'full';
		$postId    = get_the_ID();

		$output = $imgSrc = '';
		if ( ! empty( $imageType ) ) {
			if ( $imageType == 'image' ) {
				$imageLink = ! empty( $settings['imageLink'] ) ? $settings['imageLink'] : 'no';
				$imgUrl    = get_the_post_thumbnail_url( $postId, $imageSize );

				if ( ! empty( $imageLink ) && $imageLink == 'yes' ) {
					$output .= '<a class="ec-post-image-wrapper" href="' . esc_url( get_the_permalink() ) . '">';
				} else {
					$output .= '<div class="ec-post-image-wrapper">';
				}
						$output .= '<img src="' . esc_url( $imgUrl ) . '" alt="' . get_the_title() . '" class="ec-post-image" />';
				if ( ! empty( $imageLink ) && $imageLink == 'yes' ) {
					$output .= '</a>';
				} else {
					$output .= '</div>';
				}
			} elseif ( $imageType == 'background' ) {
				if ( has_post_thumbnail( $postId ) ) {
					$imgSrc = get_the_post_thumbnail_url( $postId, $imageSize );
				}
				$imageBgOn = ! empty( $settings['imageBgOn'] ) ? $settings['imageBgOn'] : 'section';
				$wid       = $this->get_id();
				$output   .= '<div id="ecpi' . esc_attr( $wid ) . '" class="ec-post-image-wrapper ec-post-background" style="background:url(' . esc_url( $imgSrc ) . ')" data-bgon=' . esc_attr( $imageBgOn ) . '></div>';
				if ( ! empty( $settings['imageBgOverlay'] ) && $settings['imageBgOverlay'] == 'yes' ) {
					$output .= '<style>#ecpi' . esc_attr( $wid ) . '.ec-post-image-wrapper.ec-post-background:before{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:100%}</style>';
				}
			}
		}
		echo $output;
	}
}
