<?php
namespace EcafeAddons\Widgets;

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Css_Filter;
use Elementor\Group_Control_Image_Size;

use EcafeAddons\EcafeElementLoad;

// Prevent direct access to files
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

class Ecafe_Image_AnimatedShape extends Widget_Base {

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

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

	public function get_icon() {
		return 'ecafe-ele-back-icon ecafe-image-animated-shape-icon';
	}
	public function get_categories() {
		return array( 'essential' );
	}
	public function get_keywords() {
		return array( 'image hover', 'advanced image hover', 'image effect', 'image shape', 'animated shape' );
	}

	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__( 'Image Animated Shape', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_CONTENT,
			)
		);
		$this->add_control(
			'layout',
			array(
				'label'   => esc_html__( 'Layout', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'layout-1',
				'options' => array(
					'layout-1'  => esc_html__( 'Layout 1', 'essential-classy-addons-for-elementor' ),
					'layout-2'  => esc_html__( 'Layout 2', 'essential-classy-addons-for-elementor' ),
					'layout-3'  => esc_html__( 'Layout 3', 'essential-classy-addons-for-elementor' ),
					'layout-4'  => esc_html__( 'Layout 4', 'essential-classy-addons-for-elementor' ),
					'layout-5'  => esc_html__( 'Layout 5', 'essential-classy-addons-for-elementor' ),
					'layout-6'  => esc_html__( 'Layout 6', 'essential-classy-addons-for-elementor' ),
					'layout-7'  => esc_html__( 'Layout 7', 'essential-classy-addons-for-elementor' ),
					'layout-8'  => esc_html__( 'Layout 8', 'essential-classy-addons-for-elementor' ),
					'layout-9'  => esc_html__( 'Layout 9', 'essential-classy-addons-for-elementor' ),
					'layout-10' => esc_html__( 'Layout 10', 'essential-classy-addons-for-elementor' ),
					'layout-11' => esc_html__( 'Layout 11', 'essential-classy-addons-for-elementor' ),
					'layout-12' => esc_html__( 'Layout 12', 'essential-classy-addons-for-elementor' ),
					'layout-13' => esc_html__( 'Layout 13', 'essential-classy-addons-for-elementor' ),
					'layout-14' => esc_html__( 'Layout 14', 'essential-classy-addons-for-elementor' ),
					'layout-15' => esc_html__( 'Layout 15', 'essential-classy-addons-for-elementor' ),
					'layout-16' => esc_html__( 'Layout 16', 'essential-classy-addons-for-elementor' ),
					'layout-17' => esc_html__( 'Layout 17', 'essential-classy-addons-for-elementor' ),
					'layout-18' => esc_html__( 'Layout 18', 'essential-classy-addons-for-elementor' ),
					'layout-19' => esc_html__( 'Layout 19', 'essential-classy-addons-for-elementor' ),
					'layout-20' => esc_html__( 'Layout 20', 'essential-classy-addons-for-elementor' ),
					'layout-21' => esc_html__( 'Layout 21', 'essential-classy-addons-for-elementor' ),
					'layout-22' => esc_html__( 'Layout 22', 'essential-classy-addons-for-elementor' ),
					'layout-23' => esc_html__( 'Layout 23', 'essential-classy-addons-for-elementor' ),
					'layout-24' => esc_html__( 'Layout 24', 'essential-classy-addons-for-elementor' ),
					'layout-25' => esc_html__( 'Layout 25', 'essential-classy-addons-for-elementor' ),
					'layout-26' => esc_html__( 'Layout 26', 'essential-classy-addons-for-elementor' ),
					'layout-27' => esc_html__( 'Layout 27', 'essential-classy-addons-for-elementor' ),
					'layout-28' => esc_html__( 'Layout 28', 'essential-classy-addons-for-elementor' ),
					'layout-29' => esc_html__( 'Layout 29', 'essential-classy-addons-for-elementor' ),
					'layout-30' => esc_html__( 'Layout 30', 'essential-classy-addons-for-elementor' ),
					'layout-31' => esc_html__( 'Layout 31', 'essential-classy-addons-for-elementor' ),
					'layout-32' => esc_html__( 'Layout 32', 'essential-classy-addons-for-elementor' ),
					'layout-33' => esc_html__( 'Layout 33', 'essential-classy-addons-for-elementor' ),
					'layout-34' => esc_html__( 'Layout 34', 'essential-classy-addons-for-elementor' ),
					'layout-35' => esc_html__( 'Layout 35', 'essential-classy-addons-for-elementor' ),
					'layout-36' => esc_html__( 'Layout 36', 'essential-classy-addons-for-elementor' ),
					'layout-37' => esc_html__( 'Layout 37', 'essential-classy-addons-for-elementor' ),
					'layout-38' => esc_html__( 'Layout 38', 'essential-classy-addons-for-elementor' ),
					'layout-39' => esc_html__( 'Layout 39', 'essential-classy-addons-for-elementor' ),
					'layout-40' => esc_html__( 'Layout 40', 'essential-classy-addons-for-elementor' ),
					'layout-41' => esc_html__( 'Layout 41', 'essential-classy-addons-for-elementor' ),
					'layout-42' => esc_html__( 'Layout 42', 'essential-classy-addons-for-elementor' ),
					'layout-43' => esc_html__( 'Layout 43', 'essential-classy-addons-for-elementor' ),
					'layout-44' => esc_html__( 'Layout 44', 'essential-classy-addons-for-elementor' ),
					'layout-45' => esc_html__( 'Layout 45', 'essential-classy-addons-for-elementor' ),
					'layout-46' => esc_html__( 'Layout 46', 'essential-classy-addons-for-elementor' ),
					'layout-47' => esc_html__( 'Layout 47', 'essential-classy-addons-for-elementor' ),
					'layout-48' => esc_html__( 'Layout 48', 'essential-classy-addons-for-elementor' ),
					'layout-49' => esc_html__( 'Layout 49', 'essential-classy-addons-for-elementor' ),
					'layout-50' => esc_html__( 'Layout 50', 'essential-classy-addons-for-elementor' ),
					'layout-51' => esc_html__( 'Layout 51', 'essential-classy-addons-for-elementor' ),
					'layout-52' => esc_html__( 'Layout 52', 'essential-classy-addons-for-elementor' ),
					'layout-53' => esc_html__( 'Layout 53', 'essential-classy-addons-for-elementor' ),
					'layout-54' => esc_html__( 'Layout 54', 'essential-classy-addons-for-elementor' ),
					'layout-55' => esc_html__( 'Layout 55', 'essential-classy-addons-for-elementor' ),
					'layout-56' => esc_html__( 'Layout 56', 'essential-classy-addons-for-elementor' ),
					'layout-57' => esc_html__( 'Layout 57', 'essential-classy-addons-for-elementor' ),
					'layout-58' => esc_html__( 'Layout 58', 'essential-classy-addons-for-elementor' ),
					'layout-59' => esc_html__( 'Layout 59', 'essential-classy-addons-for-elementor' ),
					'layout-60' => esc_html__( 'Layout 60', 'essential-classy-addons-for-elementor' ),
					'layout-61' => esc_html__( 'Layout 61', 'essential-classy-addons-for-elementor' ),
					'layout-62' => esc_html__( 'Layout 62', 'essential-classy-addons-for-elementor' ),
					'layout-63' => esc_html__( 'Layout 63', 'essential-classy-addons-for-elementor' ),
					'layout-64' => esc_html__( 'Layout 64', 'essential-classy-addons-for-elementor' ),
					'layout-65' => esc_html__( 'Layout 65', 'essential-classy-addons-for-elementor' ),
					'layout-66' => esc_html__( 'Layout 66', 'essential-classy-addons-for-elementor' ),
					'layout-67' => esc_html__( 'Layout 67', 'essential-classy-addons-for-elementor' ),
					'layout-68' => esc_html__( 'Layout 68', 'essential-classy-addons-for-elementor' ),
					'layout-69' => esc_html__( 'Layout 69', 'essential-classy-addons-for-elementor' ),
					'layout-70' => esc_html__( 'Layout 70', 'essential-classy-addons-for-elementor' ),
				),
			)
		);
		$this->add_control(
			'aiheeImage',
			array(
				'label'     => esc_html__( 'Image', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::MEDIA,
				'default'   => array(
					'url' => \Elementor\Utils::get_placeholder_image_src(),
				),
				'dynamic'    => array(
					'active' => true,
				),
				'separator' => 'before',
			)
		);
		$this->add_group_control(
			Group_Control_Image_Size::get_type(),
			array(
				'name'      => 'thumbnail',
				'default'   => 'full',
				'separator' => 'none',
			)
		);
		$this->add_control(
			'aiheeImageLink',
			array(
				'label'         => esc_html__( 'Image Link', 'essential-classy-addons-for-elementor' ),
				'type'          => Controls_Manager::URL,
				'placeholder'   => esc_html__( 'https://www.demo-link.com', 'essential-classy-addons-for-elementor' ),
				'dynamic'       => array( 'active' => true ),
				'show_external' => true,
			)
		);
		$this->add_responsive_control(
			'iasAnimation',
			array(
				'label'      => esc_html__( 'Animation Duration', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 25,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .ec-animated-shape img' => 'animation-duration:{{SIZE}}s;',
				),
			)
		);
		$this->end_controls_section();

		/*Notice panel*/
		$ecwidgetdemolink = esc_url( 'https://ecaddons.com/elements/image-animated-shape/' );
		$ecwidgetdoclink  = esc_url( 'https://ecaddons.com/docs/image-animated-shape-widget-tutorial/' );
		include ECAFE_PATH . 'element/widgets/ecafe-widgetpanel-help.php';

		$this->start_controls_section(
			'iasStyling',
			array(
				'label' => esc_html__( 'Image', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'iasWidth',
			array(
				'type'        => Controls_Manager::SLIDER,
				'label'       => esc_html__( 'Width', 'essential-classy-addons-for-elementor' ),
				'size_units'  => array( 'px' ),
				'range'       => array(
					'px' => array(
						'min'  => 1,
						'max'  => 500,
						'step' => 1,
					),
				),
				'render_type' => 'ui',
				'selectors'   => array(
					'{{WRAPPER}} .ec-animated-shape img' => 'width: {{SIZE}}{{unit}};',
				),
			)
		);
		$this->add_responsive_control(
			'iasAlign',
			array(
				'label'     => esc_html__( 'Alignment', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::CHOOSE,
				'options'   => array(
					'left'   => 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',
					),
					'right'  => array(
						'title' => esc_html__( 'Right', 'essential-classy-addons-for-elementor' ),
						'icon'  => 'eicon-text-align-right',
					),
				),
				'selectors' => array(
					'{{WRAPPER}} .ec-animated-shape' => 'text-align:{{VALUE}};',
				),
			)
		);
		$this->start_controls_tabs( 'tabsIASStyle' );
		$this->start_controls_tab(
			'iasNormal',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Css_Filter::get_type(),
			array(
				'name'     => 'iasFilters',
				'selector' => '{{WRAPPER}} .ec-animated-shape img',
			)
		);
		$this->add_control(
			'iasOpacity',
			array(
				'label'     => __( 'Opacity', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::NUMBER,
				'min'       => 0,
				'max'       => 1,
				'step'      => 0.1,
				'selectors' => array(
					'{{WRAPPER}} .ec-animated-shape img' => 'opacity:{{VALUE}};',
				),
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'iasHover',
			array(
				'label' => esc_html__( 'Hover', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Css_Filter::get_type(),
			array(
				'name'     => 'iasFiltersH',
				'selector' => '{{WRAPPER}} .ec-animated-shape img:hover',
			)
		);
		$this->add_control(
			'iasOpacityH',
			array(
				'label'     => __( 'Opacity', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::NUMBER,
				'min'       => 0,
				'max'       => 1,
				'step'      => 0.1,
				'selectors' => array(
					'{{WRAPPER}} .ec-animated-shape img:hover' => 'opacity:{{VALUE}};',
				),
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();
	}

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

		$layout = $settings['layout'];
		$imgAlt = $image_src = '';
		if ( ! empty( $settings['aiheeImage']['id'] ) ) {
			$image_id  = $settings['aiheeImage']['id'];
			$image_src = wp_get_attachment_image_src( $image_id, $settings['thumbnail_size'] );
			$image_alt = get_post_meta( $image_id, '_wp_attachment_image_alt', true );
			if ( ! empty( $image_src[0] ) ) {
				$image_src = $image_src[0];
				if ( $image_alt ) {
					$imgAlt = 'alt="' . esc_attr( $image_alt ) . '"';
				}
			}
		} else {
			$image_src = ECAFE_ASSETS_PATH . 'images/placeholder.png';
		}
		if ( ! empty( $settings['aiheeImageLink']['url'] ) ) {
			$aiheeImageLink = $settings['aiheeImageLink'];
			$ail            = '';
			if ( ! empty( $aiheeImageLink ) ) {
				$ail = esc_url( $settings['aiheeImageLink']['url'] );
			}
			$output = '<a class="ec-animated-shape ec-as-' . esc_attr( $layout ) . '" href="' . $ail . '">';
		} else {
			$output = '<div class="ec-animated-shape ec-as-' . esc_attr( $layout ) . '">';
		}

			$output .= '<img src="' . esc_url( $image_src ) . '" class="ec-as-img" ' . $imgAlt . '>';
		if ( ! empty( $settings['aiheeImageLink']['url'] ) ) {
			$output .= '</a>';
		} else {
			$output .= '</div>';
		}

		echo wp_kses_normalize_entities( $output );
	}
}
