<?php
namespace EcafeAddons\Widgets;

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Css_Filter;

use EcafeAddons\EcafeElementLoad;

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

class Ecafe_ecafeCircularImageHoverEffect extends Widget_Base {

	public function get_name() {
		return 'ecafe-circular-image-hover-effect';
	}

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

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

	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__( 'Circular Image Hover Effect', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_CONTENT,
			)
		);
		$this->add_control(
			'ciheLayout',
			array(
				'label'   => esc_html__( 'Layout', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::SELECT,
				'default' => '',
				'options' => array(
					''        => esc_html__( 'Layout 1', 'essential-classy-addons-for-elementor' ),
					'layout2' => esc_html__( 'Layout 2', 'essential-classy-addons-for-elementor' ),
					'layout3' => esc_html__( 'Layout 3', 'essential-classy-addons-for-elementor' ),
				),
			)
		);
		$this->add_control(
			'ciheLayoutAlign',
			array(
				'label'   => esc_html__( 'Alignment', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::SELECT,
				'default' => '',
				'options' => array(
					''            => esc_html__( 'Default', 'essential-classy-addons-for-elementor' ),
					'aligncenter' => esc_html__( 'Center', 'essential-classy-addons-for-elementor' ),
				),
			)
		);
		$this->add_control(
			'circularimage1',
			array(
				'label'   => esc_html__( 'Image 1', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::MEDIA,
				'default' => array(
					'url' => \Elementor\Utils::get_placeholder_image_src(),
				),
			)
		);
		$this->add_control(
			'circularimage2',
			array(
				'label'   => esc_html__( 'Image 2', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::MEDIA,
				'default' => array(
					'url' => \Elementor\Utils::get_placeholder_image_src(),
				),
			)
		);
		$this->add_control(
			'circularimage3',
			array(
				'label'   => esc_html__( 'Image 3', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::MEDIA,
				'default' => array(
					'url' => \Elementor\Utils::get_placeholder_image_src(),
				),
			)
		);
		$this->add_control(
			'circularimage4',
			array(
				'label'   => esc_html__( 'Image 4', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::MEDIA,
				'default' => array(
					'url' => \Elementor\Utils::get_placeholder_image_src(),
				),
			)
		);
		$this->add_control(
			'circularImageUrl',
			array(
				'label'         => esc_html__( 'URL', '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->end_controls_section();

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

		$this->start_controls_section(
			'circularImageStyling',
			array(
				'label' => esc_html__( 'Circular Image', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'circularImageGap',
			array(
				'label'      => esc_html__( 'Gap', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 20,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .ec-circular-image-wrapper' => '--eccihegap:{{SIZE}}{{UNIT}};',
				),
				'condition'  => array(
					'ciheLayout!' => 'layout2',
				),
			)
		);
		$this->add_responsive_control(
			'circularImageWidth',
			array(
				'label'      => esc_html__( 'Image Size', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 800,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .ec-circular-image-wrapper > .ec-cihe-img' => 'width:{{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->end_controls_section();
	}

	protected function render() {
		$settings               = $this->get_settings_for_display();
		$circularImageUrl       = ! empty( $settings['circularImageUrl']['url'] ) ? esc_url( $settings['circularImageUrl']['url'] ) : '';
		$circularImageUrlTarget = $circularImageUrlNoFollow = '';
		if ( ! empty( $circularImageUrl ) ) {
			$circularImageUrlTarget   = $settings['circularImageUrl']['is_external'] ? ' target="_blank"' : '';
			$circularImageUrlNoFollow = $settings['circularImageUrl']['nofollow'] ? ' rel="nofollow"' : '';
		}
		$ciheLayout      = ! empty( $settings['ciheLayout'] ) ? 'ec-cihe-' . $settings['ciheLayout'] : '';
		$ciheLayoutAlign = ! empty( $settings['ciheLayoutAlign'] ) ? 'ec-cihe-' . $settings['ciheLayoutAlign'] : '';
		if ( ! empty( $circularImageUrl ) ) {
			$circularImageUrlTarget   = ! empty( $settings['circularImageUrl']['is_external'] ) ? ' target="_blank"' : '';
			$circularImageUrlNoFollow = ! empty( $settings['circularImageUrl']['nofollow'] ) ? ' rel="nofollow"' : '';
			$output                   = '<a href="' . $circularImageUrl . '"' . $circularImageUrlTarget . $circularImageUrlNoFollow . ' class="ec-circular-image-wrapper ' . esc_attr( $ciheLayout ) . ' ' . esc_attr( $ciheLayoutAlign ) . '">';
		} else {
			$output = '<div class="ec-circular-image-wrapper ' . esc_attr( $ciheLayout ) . ' ' . esc_attr( $ciheLayoutAlign ) . '">';
		}

			$imgAlt1 = $imageSrc1 = $imgAlt2 = $imageSrc2 = $imgAlt3 = $imageSrc3 = $imgAlt4 = $imageSrc4 = '';
		if ( ! empty( $settings['circularimage1']['id'] ) ) {
			$imageId1  = $settings['circularimage1']['id'];
			$imageSrc1 = wp_get_attachment_image_src( $imageId1, 'full' );
			$imageAlt1 = get_post_meta( $imageId1, '_wp_attachment_image_alt', true );
			if ( ! empty( $imageSrc1[0] ) ) {
				$imageSrc1 = $imageSrc1[0];
				if ( $imageAlt1 ) {
					$imgAlt1 = 'alt="' . esc_attr( $imageAlt1 ) . '"';
				}
			}
		} else {
			$imageSrc1 = ECAFE_ASSETS_PATH . 'images/placeholder.png';
		}

		if ( ! empty( $settings['circularimage2']['id'] ) ) {
			$imageId2  = $settings['circularimage2']['id'];
			$imageSrc2 = wp_get_attachment_image_src( $imageId2, 'full' );
			$imageAlt2 = get_post_meta( $imageId2, '_wp_attachment_image_alt', true );
			if ( ! empty( $imageSrc2[0] ) ) {
				$imageSrc2 = $imageSrc2[0];
				if ( $imageAlt2 ) {
					$imgAlt2 = 'alt="' . esc_attr( $imageAlt2 ) . '"';
				}
			}
		} else {
			$imageSrc2 = ECAFE_ASSETS_PATH . 'images/placeholder.png';
		}

		if ( ! empty( $settings['circularimage3']['id'] ) ) {
			$imageId3  = $settings['circularimage3']['id'];
			$imageSrc3 = wp_get_attachment_image_src( $imageId3, 'full' );
			$imageAlt3 = get_post_meta( $imageId3, '_wp_attachment_image_alt', true );
			if ( ! empty( $imageSrc3[0] ) ) {
				$imageSrc3 = $imageSrc3[0];
				if ( $imageAlt3 ) {
					$imgAlt3 = 'alt="' . esc_attr( $imageAlt3 ) . '"';
				}
			}
		} else {
			$imageSrc3 = ECAFE_ASSETS_PATH . 'images/placeholder.png';
		}

		if ( ! empty( $settings['circularimage4']['id'] ) ) {
			$imageId4  = $settings['circularimage4']['id'];
			$imageSrc4 = wp_get_attachment_image_src( $imageId4, 'full' );
			$imageAlt4 = get_post_meta( $imageId4, '_wp_attachment_image_alt', true );
			if ( ! empty( $imageSrc4[0] ) ) {
				$imageSrc4 = $imageSrc4[0];
				if ( $imageAlt4 ) {
					$imgAlt4 = 'alt="' . esc_attr( $imageAlt4 ) . '"';
				}
			}
		} else {
			$imageSrc4 = ECAFE_ASSETS_PATH . 'images/placeholder.png';
		}

			$output .= '<img src="' . esc_url( $imageSrc1 ) . '" class="ec-cihe-img" ' . $imgAlt1 . '>';
			$output .= '<img src="' . esc_url( $imageSrc2 ) . '" class="ec-cihe-img" ' . $imgAlt2 . '>';
			$output .= '<img src="' . esc_url( $imageSrc3 ) . '" class="ec-cihe-img" ' . $imgAlt3 . '>';
			$output .= '<img src="' . esc_url( $imageSrc4 ) . '" class="ec-cihe-img" ' . $imgAlt4 . '>';

		if ( ! empty( $circularImageUrl ) ) {
			$output .= '</a>';
		} else {
			$output .= '</div>';
		}
		echo wp_kses_normalize_entities( $output );
	}
}
