<?php

namespace MasterAddons\Addons;

use MasterAddons\Inc\Classes\Base\Master_Widget;
use \Elementor\Controls_Stack;
use \Elementor\Controls_Manager as Controls_Manager;
use \Elementor\Group_Control_Border as Group_Control_Border;
use \Elementor\Group_Control_Box_Shadow as Group_Control_Box_Shadow;
use \Elementor\Group_Control_Typography as Group_Control_Typography;
use \Elementor\Core\Kits\Documents\Tabs\Global_Typography;
use \Elementor\Utils;
use \Elementor\Repeater;
use \Elementor\Control_Media;
use \Elementor\Group_Control_Css_Filter;
use \Elementor\Group_Control_Image_Size;
use \Elementor\Core\Kits\Documents\Tabs\Global_Colors;
use \Elementor\Group_Control_Text_Shadow;
use MasterAddons\Inc\Classes\Helper;
use MasterAddons\Inc\Admin\Config;

/**
 * Author Name: Liton Arefin
 * Author URL : https://master-addons.com
 * Date       : 8/28/19
 */

if (!defined('ABSPATH'))
	exit; // If this file is called directly, abort.

if (!defined('ABSPATH'))
	exit; // If this file is called directly, abort.

class Image_Hover_Effects extends Master_Widget
{
	use \MasterAddons\Inc\Traits\Widget_Notice;
	use \MasterAddons\Inc\Traits\Widget_Assets_Trait;

	public function get_name()
	{
		return 'ma-image-hover-effects';
	}

	public function get_title()
	{
		return esc_html__('Image Hover Effects', 'master-addons');
	}

	public function get_icon()
	{
		return 'jltma-icon ' . Config::get_addon_icon($this->get_name());
	}

	public function get_keywords()
	{
		return ['hover', 'image', 'effects', 'image hover', 'banner', 'banner image'];
	}

	protected function register_controls()
	{

		/*
		 * Master Addons: Effects Controls & Image Hover Effects Section Start
		 */

		$this->start_controls_section(
			'ma-image-hover-effect-section',
			[
				'label' => __('Effects & Image', 'master-addons'),
			]
		);

		// Define default free options - Pro version overrides via filter
		$hover_effect_options = apply_filters('master_addons/addons/image_hover_effects/hover_effect', [
			'lily'              => __('Lily', 'master-addons'),
			'sadie'             => __('Sadie', 'master-addons'),
			'roxy'              => __('Roxy', 'master-addons'),
			'bubba'             => __('Bubba', 'master-addons'),
			'romeo'             => __('Romeo', 'master-addons'),
			'layla'             => __('Layla', 'master-addons'),
			'honey'             => __('Honey', 'master-addons'),
			'oscar'             => __('Oscar', 'master-addons'),
			'ma-el-img-hover1'  => __('Marley (Pro)', 'master-addons'),
			'ma-el-img-hover2'  => __('Ruby (Pro)', 'master-addons'),
			'ma-el-img-hover3'  => __('Milo (Pro)', 'master-addons'),
			'ma-el-img-hover4'  => __('Dexter (Pro)', 'master-addons'),
			'ma-el-img-hover5'  => __('Sarah (Pro)', 'master-addons'),
			'ma-el-img-hover6'  => __('Zoe (Pro)', 'master-addons'),
			'ma-el-img-hover7'  => __('Chico (Pro)', 'master-addons'),
			'ma-el-img-hover8'  => __('Julia (Pro)', 'master-addons'),
			'ma-el-img-hover9'  => __('Goliath (Pro)', 'master-addons'),
			'ma-el-img-hover10' => __('Hera (Pro)', 'master-addons'),
			'ma-el-img-hover11' => __('Winston (Pro)', 'master-addons'),
			'ma-el-img-hover12' => __('Selena (Pro)', 'master-addons'),
			'ma-el-img-hover13' => __('Terry (Pro)', 'master-addons'),
			'ma-el-img-hover14' => __('Phoebe (Pro)', 'master-addons'),
			'ma-el-img-hover15' => __('Apollo (Pro)', 'master-addons'),
			'ma-el-img-hover16' => __('Kira (Pro)', 'master-addons'),
			'ma-el-img-hover17' => __('Steve (Pro)', 'master-addons'),
			'ma-el-img-hover18' => __('Moses (Pro)', 'master-addons'),
			'ma-el-img-hover19' => __('Jazz (Pro)', 'master-addons'),
			'ma-el-img-hover20' => __('Ming (Pro)', 'master-addons'),
			'ma-el-img-hover21' => __('Lexi (Pro)', 'master-addons'),
			'ma-el-img-hover22' => __('Duke (Pro)', 'master-addons'),
		]);

		$this->add_control(
			'ma_el_main_image_effect',
			[
				'label'       => esc_html__('Hover Effect', 'master-addons'),
				'type'        => Controls_Manager::SELECT,
				'default'     => 'sadie',
				'options'     => $hover_effect_options,
				'description' => Helper::upgrade_to_pro('20+ more effects on'),
			]
		);

		$this->add_control(
			'ma_el_main_image',
			[
				'label' => __('Upload Image', 'master-addons'),
				'description' => __('Select an Image', 'master-addons'),
				'type' => Controls_Manager::MEDIA,
				'dynamic' => [
					'active' => true,
				],
				'default' => [
					'url' => Utils::get_placeholder_image_src()
				],
			]
		);

		$this->add_control(
			'ma_el_main_image_size',
			[
				'label' => esc_html__('Image Size', 'master-addons'),
				'type' => Controls_Manager::SELECT,
				'options' => [
					'main' => esc_html__('Default', 'master-addons'),
					'custom' => esc_html__('Custom', 'master-addons'),
				],
				'default' => 'main'
			]
		);

		$this->add_group_control(
			Group_Control_Image_Size::get_type(),
			[
				'name' => 'image_thumbnail_size',
				'default' => 'full',
				'condition' => [
					'ma_el_main_image[url]!' => '',
				],
				'exclude' => ['custom'],
				'condition' => [
					'ma_el_main_image_size' => 'main',
				],
			]
		);

		$this->add_control(
			'ma_el_main_image_width',
			[
				'label' => __('Width', 'master-addons'),
				'type' => Controls_Manager::SLIDER,
				'default' => [
					'size' => 200
				],
				'range' => [
					'px' => [
						'min' => 100,
						'max' => 1000,
						'step' => 1
					]
				],
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect figure, {{WRAPPER}} .jltma-image-hover-effect figure img' => 'width: {{SIZE}}px;'
				],
				'condition' => [
					'ma_el_main_image_size' => 'custom',
				],
			]
		);

		$this->add_control(
			'ma_el_main_image_height',
			[
				'label' => __('Height', 'master-addons'),
				'type' => Controls_Manager::SLIDER,
				'default' => [
					'size' => 200
				],
				'range' => [
					'px' => [
						'min' => 100,
						'max' => 1000,
						'step' => 1
					]
				],
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect figure, {{WRAPPER}} .jltma-image-hover-effect figure img' => 'height: {{SIZE}}px;'
				],
				'condition' => [
					'ma_el_main_image_size' => 'custom',
				],
			]
		);

		$this->add_control(
			'ma_el_image_hover_link_type',
			[
				'label' => esc_html__('Links or Popup?', 'master-addons'),
				'type' => Controls_Manager::CHOOSE,
				'options' => [
					'none' => [
						'title' => esc_html__('None', 'master-addons'),
						'icon' => 'eicon-close-circle',
					],
					'popup' => [
						'title' => esc_html__('Popup', 'master-addons'),
						'icon' => 'eicon-search',
					],
					'links' => [
						'title' => esc_html__('External Links', 'master-addons'),
						'icon' => 'eicon-editor-external-link',
					],
				],
				'default' => 'none'
			]
		);

		$this->add_control(
			'ma_el_main_image_more_link_url',
			[
				'label' => esc_html__('Link URL', 'master-addons'),
				'type' => Controls_Manager::URL,
				'label_block' => true,
				'default' => [
					'url' => '#',
					'is_external' => '',
				],
				'condition' => [
					'ma_el_image_hover_link_type' => 'links'
				],
				'show_external' => true,
			]
		);

		// Define default free options - Pro version overrides via filter
		$popup_type_options = apply_filters('master_addons/addons/image_hover_effects/popup_type', [
			'image_pro'    => esc_html__('Image (Pro)', 'master-addons'),
			'content_pro'  => esc_html__('Content (Pro)', 'master-addons'),
			'section_pro'  => esc_html__('Saved Section (Pro)', 'master-addons'),
			'widget_pro'   => esc_html__('Saved Widget (Pro)', 'master-addons'),
			'template_pro' => esc_html__('Saved Page Template (Pro)', 'master-addons'),
		]);

		$this->add_control(
			'ma_el_image_popup_type',
			[
				'label'       => esc_html__('Content Type', 'master-addons'),
				'type'        => Controls_Manager::SELECT,
				'label_block' => false,
				'options'     => $popup_type_options,
				'default'     => 'content',
				'description' => Helper::upgrade_to_pro('Popup Content Types on'),
				'condition'   => [
					'ma_el_image_hover_link_type' => 'popup'
				]
			]
		);

		$this->add_control(
			'popup_image',
			[
				'label' => esc_html__('Image', 'master-addons'),
				'type' => Controls_Manager::MEDIA,
				'dynamic' => [
					'active' => true,
				],
				'default' => [
					'url' => Utils::get_placeholder_image_src(),
				],
				'condition' => [
					'ma_el_image_popup_type' => 'image',
					'ma_el_image_hover_link_type' => 'popup'
				],
				'conditions' => [
					'terms' => [
						[
							'name' => 'ma_el_image_popup_type',
							'operator' => '==',
							'value' => 'image',
						],
					],
				],
			]
		);

		$this->add_control(
			'popup_content',
			[
				'label' => esc_html__('Content', 'master-addons'),
				'type' => Controls_Manager::WYSIWYG,
				'default' => esc_html__('Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.', 'master-addons'),
				'condition' => [
					'ma_el_image_popup_type' => 'content',
					'ma_el_image_hover_link_type' => 'popup'
				],
			]
		);

		$this->add_control(
			'popup_saved_widget',
			[
				'label' => __('Choose Widget', 'master-addons'),
				'type' => Controls_Manager::SELECT,
				'options' => Helper::get_page_template_options('widget'),
				'default' => '-1',
				'condition' => [
					'ma_el_image_popup_type' => 'widget',
					'ma_el_image_hover_link_type' => 'popup'
				],
				'conditions' => [
					'terms' => [
						[
							'name' => 'ma_el_image_popup_type',
							'operator' => '==',
							'value' => 'widget',
						],
					],
				],
			]
		);

		$this->add_control(
			'popup_saved_section',
			[
				'label' => __('Choose Section', 'master-addons'),
				'type' => Controls_Manager::SELECT,
				'options' => Helper::get_page_template_options('section'),
				'default' => '-1',
				'condition' => [
					'ma_el_image_popup_type' => 'section',
					'ma_el_image_hover_link_type' => 'popup'
				],
				'conditions' => [
					'terms' => [
						[
							'name' => 'ma_el_image_popup_type',
							'operator' => '==',
							'value' => 'section',
						],
					],
				],
			]
		);

		$this->add_control(
			'popup_templates',
			[
				'label' => __('Choose Template', 'master-addons'),
				'type' => Controls_Manager::SELECT,
				'options' => Helper::get_page_template_options('page'),
				'default' => '-1',
				'condition' => [
					'ma_el_image_popup_type' => 'template',
					'ma_el_image_hover_link_type' => 'popup'
				],
				'conditions' => [
					'terms' => [
						[
							'name' => 'ma_el_image_popup_type',
							'operator' => '==',
							'value' => 'template',
						],
					],
				],
			]
		);

		$this->add_responsive_control(
			'ma_el_main_image_vertical_align',
			[
				'label' => __('Vertical Align', 'master-addons'),
				'type' => Controls_Manager::SELECT,
				'condition' => [
					'ma_el_main_image_height' => 'custom'
				],
				'options' => [
					'flex-start' => __('Top', 'master-addons'),
					'center' => __('Middle', 'master-addons'),
					'flex-end' => __('Bottom', 'master-addons'),
					'inherit' => __('Full', 'master-addons')
				],
				'default' => 'flex-start',
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect figure' => 'align-items: {{VALUE}}; -webkit-align-items: {{VALUE}};'
				]
			]
		);

		$this->end_controls_section();

		/*
		 * Master Addons: Style Controls
		 */
		$this->start_controls_section(
			'ma_el_main_image_content_heading_section',
			[
				'label' => esc_html__('Heading', 'master-addons')
			]
		);

		$this->add_control(
			'ma_el_main_image_title',
			[
				'label' => __('Title', 'master-addons'),
				'placeholder' => __('Title for this Image', 'master-addons'),
				'type' => Controls_Manager::TEXTAREA,
				'dynamic' => ['active' => true],
				'default' => __('Master Addons', 'master-addons'),
				'label_block' => false
			]
		);

		$this->add_control(
			'title_html_tag',
			[
				'label' => __('HTML Tag', 'master-addons'),
				'type' => Controls_Manager::SELECT,
				'options' => [
					'h1' => __('H1', 'master-addons'),
					'h2' => __('H2', 'master-addons'),
					'h3' => __('H3', 'master-addons'),
					'h4' => __('H4', 'master-addons'),
					'h5' => __('H5', 'master-addons'),
					'h6' => __('H6', 'master-addons'),
					'span' => __('span', 'master-addons'),
				],
				'default' => 'h2',
			]
		);

		$this->end_controls_section();

		/*
		 * Master Addons: Sub Heading
		 */
		$this->start_controls_section(
			'ma_el_main_image_content_subheading_section',
			[
				'label' => __('Sub Heading', 'master-addons'),
				'condition' => [
					"ma_el_main_image_effect" => [
						"honey",
					]
				]
			]
		);

		$this->add_control(
			'ma_el_main_image_sub_title',
			[
				'label' => __('Sub Title', 'master-addons'),
				'placeholder' => __('Sub Title for this Image', 'master-addons'),
				'type' => Controls_Manager::TEXT,
				'default' => __('Elementor', 'master-addons'),
				'label_block' => false
			]
		);

		$this->end_controls_section();

		/*
		 * Master Addons: Image Descriptions
		 */
		$this->start_controls_section(
			'ma_el_main_image_desc_section',
			[
				'label' => __('Description', 'master-addons'),
				'type' => Controls_Manager::HEADING,
				'condition' => [
					"ma_el_main_image_effect" => [
						"lily",
						"zoe",
						"sadie",
						"layla",
						"oscar",
						"marley",
						"dexter",
						"sarah",
						"chico",
						"kira",
						"apollo",
						"steve",
						"moses",
						"jazz",
						"ming",
						"lexi",
						"duke",
						"milo",
						"bubba",
						"goliath",
						"selena",
						"roxy",
						"bubba",
						"romeo",
						"ruby"
					]
				]
			]
		);

		$this->add_control(
			'ma_el_main_image_desc',
			[
				'label' => __('Description', 'master-addons'),
				'description' => __('Give the description to this banner', 'master-addons'),
				'type' => Controls_Manager::TEXTAREA,
				'dynamic' => ['active' => true],
				'default' => __('Master Addons gives your website a vibrant and lively style, you would love.', 'master-addons'),
				'label_block' => true,
				'condition' => [
					'ma_el_main_image_effect!' => ['julia']
				]

			]
		);

		$this->end_controls_section();

		/*
		 * Master Addons: Set 2 Image Descriptions
		 */
		$this->start_controls_section(
			'ma_el_main_image_desc_set2_heading',
			[
				'label' => __('Description', 'master-addons'),
				'type' => Controls_Manager::HEADING,
				'description' => __('Write Description Each line', 'master-addons'),
				'condition' => [
					'ma_el_main_image_effect' => ['julia']
				]
			]
		);

		$repeater = new Repeater();

		$repeater->add_control(
			'ma_el_main_image_desc_set2',
			[
				'label' => __('Read More Text', 'master-addons'),
				'type' => Controls_Manager::TEXTAREA,
				'dynamic' => ['active' => true],
				'default' => 'Julia dances in the deep dark',
			]
		);

		$this->add_control(
			'ma_el_main_image_desc_set2_tabs',
			[
				'type' => Controls_Manager::REPEATER,
				'default' => [
					['ma_el_main_image_desc_set2' => 'Julia dances in the deep dark'],
					['ma_el_main_image_desc_set2' => 'She loves the smell of the ocean'],
					['ma_el_main_image_desc_set2' => 'And dives into the morning light']
				],
				'fields' => $repeater->get_controls(),
				'title_field' => '{{ma_el_main_image_desc_set2}}'
			]
		);

		$this->end_controls_section();

		/*
		 * Master Addons: Image Hover Social Links
		 */
		$this->start_controls_section(
			'ma_el_main_image_social_link_section',
			[
				'label' => esc_html__('Social Links', 'master-addons'),
				'condition' => [
					'ma_el_main_image_effect' => ['zoe', 'hera', 'winston', 'terry', 'phoebe', 'kira']
				]
			]
		);

		/* Icons Dependencies for Styles */

		$this->add_control(
			'ma_el_main_image_icon_heading',
			[
				'label' => __('Social Icons', 'master-addons'),
				'type' => Controls_Manager::HEADING,
				'description' => __('Select Social Icons', 'master-addons')
			]
		);
		$repeater = new Repeater();

		$repeater->add_control(
			'ma_el_main_image_icon',
			[
				'label' => esc_html__('Icon', 'master-addons'),
				'description' => esc_html__('Please choose an icon from the list.', 'master-addons'),
				'type' => Controls_Manager::ICONS,
				'default' => [
					'value' => 'eicon-elementor-circle',
					'library' => 'eicon',
				],
				'render_type' => 'template'
			]
		);

		$repeater->add_control(
			'ma_el_main_image_icon_link',
			[
				'label' => __('Icon Link', 'master-addons'),
				'type' => Controls_Manager::URL,
				'placeholder' => __('https://master-addons.com', 'master-addons'),
				'label_block' => true,
				'default' => [
					'url' => '#',
					'is_external' => true,
				]
			]
		);

		$this->add_control(
			'ma_el_main_image_icon_tabs',
			[
				'type' => Controls_Manager::REPEATER,
				'default' => [
					['ma_el_main_image_icon' => 'eicon-elementor-circle'],
					['ma_el_main_image_icon' => 'eicon-elementor-circle'],
					['ma_el_main_image_icon' => 'eicon-elementor-circle'],
					['ma_el_main_image_icon' => 'eicon-elementor-circle'],
				],
				'fields' => $repeater->get_controls(),
				'title_field' => 'Social Icon'
			]
		);

		$this->end_controls_section();

		/*
		 * Image Hover Style Section
		 */
		$this->start_controls_section(
			'ma_el_main_image_hover_style_section',
			[
				'label' => __('Image', 'master-addons'),
				'tab' => Controls_Manager::TAB_STYLE
			]
		);

		$this->add_control(
			'ma_el_main_image_bg_color',
			[
				'label' => __('Background Color', 'master-addons'),
				'type' => Controls_Manager::COLOR,
				'default' => '',
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect figure' => 'background: {{VALUE}};'
				]
			]
		);

		$this->add_control(
			'ma_el_main_image_opacity',
			[
				'label' => __('Image Opacity', 'master-addons'),
				'type' => Controls_Manager::SLIDER,
				'default' => [
					'size' => .8
				],
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 1,
						'step' => .1
					]
				],
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect figure img' => 'opacity: {{SIZE}};'
				]
			]
		);

		$this->add_control(
			'ma_el_main_image_hover_opacity',
			[
				'label' => __('Hover Opacity', 'master-addons'),
				'type' => Controls_Manager::SLIDER,
				'default' => [
					'size' => 1
				],
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 1,
						'step' => .1
					]
				],
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect figure:hover img' => 'opacity: {{SIZE}};'
				]
			]
		);

		$this->add_group_control(
			Group_Control_Css_Filter::get_type(),
			[
				'name' => 'image_filters',
				'label' => __('Image Filter', 'master-addons'),
				'selector' => '{{WRAPPER}} .jltma-image-hover-effect figure img',
			]
		);

		$this->add_group_control(
			Group_Control_Css_Filter::get_type(),
			[
				'name' => 'hover_image_filters',
				'label' => __('Hover Image Filter', 'master-addons'),
				'selector' => '{{WRAPPER}} .jltma-image-hover-effect figure:hover img'
			]
		);

		$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'ma_el_main_image_border',
				'selector' => '{{WRAPPER}} .jltma-image-hover-effect figure'
			]
		);

		// Image styling Pro controls - filtered through Free_Addons.php
		$image_styling_controls = apply_filters('master_addons/addons/image_hover_effects/image_styling', [
			[
				'type'       => 'responsive_control',
				'control_id' => 'ma_el_main_image_border_radius_pro',
				'args'       => [
					'label'       => __('Border Radius (Pro)', 'master-addons'),
					'type'        => Controls_Manager::CHOOSE,
					'options'     => [
						'1' => [
							'title' => '',
							'icon'  => 'eicon-lock',
						],
					],
					'default'     => '1',
					'description' => Helper::upgrade_to_pro('Border Radius available on'),
				],
			],
			[
				'type'       => 'responsive_control',
				'control_id' => 'ma_el_main_image_pading_pro',
				'args'       => [
					'label'       => __('Padding (Pro)', 'master-addons'),
					'type'        => Controls_Manager::CHOOSE,
					'options'     => [
						'1' => [
							'title' => '',
							'icon'  => 'eicon-lock',
						],
					],
					'default'     => '1',
					'description' => Helper::upgrade_to_pro('Padding available on'),
				],
			],
			[
				'type'       => 'responsive_control',
				'control_id' => 'ma_el_main_image_margin_pro',
				'args'       => [
					'label'       => __('Margin (Pro)', 'master-addons'),
					'type'        => Controls_Manager::CHOOSE,
					'options'     => [
						'1' => [
							'title' => '',
							'icon'  => 'eicon-lock',
						],
					],
					'default'     => '1',
					'description' => Helper::upgrade_to_pro('Margin available on'),
				],
			],
		]);

		foreach ($image_styling_controls as $control) {
			if ($control['type'] === 'responsive_control') {
				$this->add_responsive_control($control['control_id'], $control['args']);
			}
		}

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			[
				'label' => __('Box Shadow', 'master-addons'),
				'name' => 'ma_el_main_image_shadow',
				'selector' => '{{WRAPPER}} .jltma-image-hover-effect figure'
			]
		);
		$this->end_controls_section();

		/*
		 * Title Color
		 */
		$this->start_controls_section(
			'ma_el_main_image_title_style',
			[
				'label' => __('Title', 'master-addons'),
				'tab' => Controls_Manager::TAB_STYLE
			]
		);

		$this->add_control(
			'ma_el_main_image_title_color',
			[
				'label' => __('Color', 'master-addons'),
				'type' => Controls_Manager::COLOR,
				'global' => [
					'default' => Global_Colors::COLOR_PRIMARY,
				],
				'default' => "#fff",
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect .jltma-image-hover-title' => 'color: {{VALUE}};'
				]
			]
		);

		$this->add_control(
			'jltma_main_image_border_color',
			[
				'label' => __('Border Color', 'master-addons'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect figcaption::before' => 'border-color: {{VALUE}};',
					'{{WRAPPER}} .jltma-image-hover-effect figcaption::after' => 'border-color: {{VALUE}};',
				]
			]
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name' => 'ma_el_main_image_title_typography',
				'selector' => '{{WRAPPER}} .jltma-image-hover-effect .jltma-image-hover-title',
				'global' => [
					'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
				],
			]
		);

		$this->add_group_control(
			Group_Control_Text_Shadow::get_type(),
			[
				'label' => __('Box Shadow', 'master-addons'),
				'name' => 'ma_el_main_image_title_shadow',
				'selector' => '{{WRAPPER}} .jltma-image-hover-title'
			]
		);

		// Title styling Pro controls - filtered through Free_Addons.php
		$title_styling_controls = apply_filters('master_addons/addons/image_hover_effects/title_styling', [
			[
				'type'       => 'responsive_control',
				'control_id' => 'ma_el_main_image_title_pading_pro',
				'args'       => [
					'label'       => __('Padding (Pro)', 'master-addons'),
					'type'        => Controls_Manager::CHOOSE,
					'options'     => [
						'1' => [
							'title' => '',
							'icon'  => 'eicon-lock',
						],
					],
					'default'     => '1',
					'description' => Helper::upgrade_to_pro('Padding available on'),
				],
			],
			[
				'type'       => 'responsive_control',
				'control_id' => 'ma_el_main_image_title_margin_pro',
				'args'       => [
					'label'       => __('Margin (Pro)', 'master-addons'),
					'type'        => Controls_Manager::CHOOSE,
					'options'     => [
						'1' => [
							'title' => '',
							'icon'  => 'eicon-lock',
						],
					],
					'default'     => '1',
					'description' => Helper::upgrade_to_pro('Margin available on'),
				],
			],
		]);

		foreach ($title_styling_controls as $control) {
			if ($control['type'] === 'responsive_control') {
				$this->add_responsive_control($control['control_id'], $control['args']);
			}
		}

		$this->end_controls_section();

		/*
		 * Description Style
		 */

		$this->start_controls_section(
			'ma_el_main_image_desc_style_section',
			[
				'label' => __('Description', 'master-addons'),
				'tab' => Controls_Manager::TAB_STYLE
			]
		);

		$this->add_control(
			'ma_el_main_image_desc_color',
			[
				'label' => __('Color', 'master-addons'),
				'type' => Controls_Manager::COLOR,
				'global' => [
					'default' => Global_Colors::COLOR_PRIMARY,
				],
				'default' => '#fff',
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect p' => 'color: {{VALUE}};'
				],
			]
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name' => 'ma_el_main_image_desc_typography',
				'selector' => '{{WRAPPER}} .jltma-image-hover-effect p',
				'global' => [
					'default' => Global_Typography::TYPOGRAPHY_TEXT,
				],
			]
		);

		$this->add_group_control(
			Group_Control_Text_Shadow::get_type(),
			[
				'label' => __('Text Shadow', 'master-addons'),
				'name' => 'ma_el_main_image_desc_text_shadow',
				'selector' => '{{WRAPPER}} .jltma-image-hover-effect p',
			]
		);

		// Description styling Pro controls - filtered through Free_Addons.php
		$desc_styling_controls = apply_filters('master_addons/addons/image_hover_effects/desc_styling', [
			[
				'type'       => 'responsive_control',
				'control_id' => 'ma_el_main_image_desc_pading_pro',
				'args'       => [
					'label'       => __('Padding (Pro)', 'master-addons'),
					'type'        => Controls_Manager::CHOOSE,
					'options'     => [
						'1' => [
							'title' => '',
							'icon'  => 'eicon-lock',
						],
					],
					'default'     => '1',
					'description' => Helper::upgrade_to_pro('Padding available on'),
				],
			],
			[
				'type'       => 'responsive_control',
				'control_id' => 'ma_el_main_image_desc_margin_pro',
				'args'       => [
					'label'       => __('Margin (Pro)', 'master-addons'),
					'type'        => Controls_Manager::CHOOSE,
					'options'     => [
						'1' => [
							'title' => '',
							'icon'  => 'eicon-lock',
						],
					],
					'default'     => '1',
					'description' => Helper::upgrade_to_pro('Margin available on'),
				],
			],
		]);

		foreach ($desc_styling_controls as $control) {
			if ($control['type'] === 'responsive_control') {
				$this->add_responsive_control($control['control_id'], $control['args']);
			}
		}
		$this->end_controls_section();

		/*
		 * Social Icons Style
		 */

		$this->start_controls_section(
			'ma_el_main_image_icon_hover_style_section',
			[
				'label' => __('Social Icons', 'master-addons'),
				'tab' => Controls_Manager::TAB_STYLE,
				'condition' => [
					'ma_el_main_image_effect' => ['zoe', 'hera']
				]
			]
		);

		$this->add_control(
			'ma_el_main_image_icon_size',
			[
				'label' => esc_html__('Icon Size (em)', 'master-addons'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', 'em', 'rem'],
				'range' => [
					'px' => [
						'min' => 10,
						'max' => 100,
						'step' => 1,
					],
					'em' => [
						'min' => 1,
						'max' => 10,
					],
					'rem' => [
						'min' => 1,
						'max' => 10,
					],
				],
				'default' => [
					'unit' => 'rem',
					'size' => 1.2,
				],
				'selectors' => array(
					'{{WRAPPER}} .jltma-image-hover-effect .jltma-icon-links a i' => 'font-size:{{SIZE}}{{UNIT}} !important;',
					'{{WRAPPER}} .jltma-image-hover-effect .jltma-icon-links a svg' => 'width:{{SIZE}}{{UNIT}} !important;',
				),
				'style_transfer' => true
			]
		);

		$this->start_controls_tabs('ma_el_main_image_icon_style_tabs');

		$this->start_controls_tab(
			'ma_el_main_image_icon_style_tab_normal',
			[
				'label' => esc_html__('Normal', 'master-addons')
			]
		);

		$this->add_control(
			'ma_el_main_image_icon_color',
			[
				'label' => __('Color', 'master-addons'),
				'type' => Controls_Manager::COLOR,
				'global' => [
					'default' => Global_Colors::COLOR_SECONDARY,
				],
				//					'default'   => '#fff',
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect .jltma-icon-links a' => 'color: {{VALUE}};',
					'{{WRAPPER}} .jltma-image-hover-effect .jltma-icon-links a svg' => 'fill: {{VALUE}};'
				],
			]
		);

		$this->end_controls_tab();

		$this->start_controls_tab(
			'ma_el_main_image_icon_style_tab_hover',
			[
				'label' => esc_html__('Hover', 'master-addons')
			]
		);

		$this->add_control(
			'ma_el_main_image_icon_hover_color',
			[
				'label' => __('Color', 'master-addons'),
				'type' => Controls_Manager::COLOR,
				'global' => [
					'default' => Global_Colors::COLOR_TEXT,
				],
				//					'default'   => '#fff',
				'selectors' => [
					'{{WRAPPER}} .jltma-image-hover-effect .jltma-icon-links a:hover' => 'color: {{VALUE}};'
				],
			]
		);

		$this->end_controls_section();

		// Help Docs section (links from config.php)
		$this->jltma_help_docs();

		$this->upgrade_to_pro_message();

	}

	private function render_image($image_id, $settings)
	{
		$image_thumbnail_size = $settings['image_thumbnail_size_size'];
		if ('custom_size' === $image_thumbnail_size) {
			$image_src = Group_Control_Image_Size::get_attachment_image_src($image_id, $image_thumbnail_size, $settings);
		} else {
			$image_src = wp_get_attachment_image_src($image_id, $image_thumbnail_size);
			$image_src = $image_src[0];
		}

		return sprintf('<img src="%s"  class="circled" alt="%s" />', esc_url($image_src), esc_html(get_post_meta($image_id, '_wp_attachment_image_alt', true)));
	}

	protected function render()
	{

		$settings = $this->get_settings_for_display();

		// Whitelist allowed HTML tags to prevent XSS
		$allowed_tags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'div', 'span', 'p'];
		$title_html_tag = in_array($settings['title_html_tag'], $allowed_tags, true)
			? $settings['title_html_tag']
			: 'h2';

		// Get hover effects from filter
		$hover_effects = apply_filters('master_addons/addons/image_hover_effects/hover_effect', [
			'lily'   => __('Lily', 'master-addons'),
			'sadie'  => __('Sadie', 'master-addons'),
			'roxy'   => __('Roxy', 'master-addons'),
			'bubba'  => __('Bubba', 'master-addons'),
			'romeo'  => __('Romeo', 'master-addons'),
			'layla'  => __('Layla', 'master-addons'),
			'honey'  => __('Honey', 'master-addons'),
			'oscar'  => __('Oscar', 'master-addons'),
		]);
		$effect_keys = array_keys($hover_effects);
		$selected_effect = $settings['ma_el_main_image_effect'];
		$effect_index = array_search($selected_effect, $effect_keys);

		// Determine effect set based on position (first 15 = one, rest = two)
		$ma_el_image_hover_sets = ($effect_index !== false && $effect_index < 15) ? "one" : "two";

		$this->add_render_attribute('ma_el_image_hover_effect_wrapper', [
			'class' => [
				'jltma-image-hover-effect',
				'jltma-image-hover-effect-' . esc_attr($ma_el_image_hover_sets),
				'jltma-image-hover-effect-' . esc_attr($settings['ma_el_main_image_effect'])
			],
			'id' => 'jltma-image-hover-effect-' . $this->get_id()
		]);

		$this->add_render_attribute('ma_el_image_hover_effect_heading', ['class' => 'jltma-image-hover-title']);

		$ma_el_main_image = $this->get_settings_for_display('ma_el_main_image');

		$ma_el_main_image_effect = $settings['ma_el_main_image_effect'];
		$ma_el_main_image_alt = Control_Media::get_image_alt($settings['ma_el_main_image']);

		// Image Link
		if ($settings['ma_el_image_hover_link_type'] == "links") {
			$this->add_render_attribute('ma_el_image_hover_link', 'class', ['ma-image-hover-read-more']);
			// add_link_attributes() handles href, target, rel and custom_attributes.
			if (!empty($settings['ma_el_main_image_more_link_url']['url'])) {
				$this->add_link_attributes('ma_el_image_hover_link', $settings['ma_el_main_image_more_link_url']);
			}
		}

		// if ($settings['ma_el_main_image']['id'] == "") {
		// 	// echo esc_html__('No Image Selected, Please Upload/Select an Image', 'master-addons' );
		// 	echo Helper::jltma_custom_message('No Image Selected', 'Please Upload/Select an Image');
		// }

		$hover_effects_main_image = $settings['ma_el_main_image'];
		$hover_effects_main_image_url = Group_Control_Image_Size::get_attachment_image_src($hover_effects_main_image['id'], 'image_thumbnail_size', $settings);
		if (empty($hover_effects_main_image_url)) {
			$hover_effects_main_image_url = $hover_effects_main_image['url'];
		} else {
			$hover_effects_main_image_url = $hover_effects_main_image_url;
		}
		?>

		<div <?php echo $this->get_render_attribute_string('ma_el_image_hover_effect_wrapper'); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor render_attribute_string returns sanitized HTML attributes ?>>

			<figure class="jltma-effect-<?php echo esc_attr($settings['ma_el_main_image_effect']); ?>">

				<?php if (isset($settings['ma_el_main_image']['id']) && $settings['ma_el_main_image']['id'] != "") {
					echo $this->render_image($settings['ma_el_main_image']['id'], $settings); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- render_image returns sanitized HTML
				} else {
					echo '<img src="' . esc_url($hover_effects_main_image_url) . '" >';
				} ?>

				<figcaption>
					<div class="jltma-image-hover-content">
						<<?php echo esc_html($title_html_tag); ?>
							<?php echo $this->get_render_attribute_string('ma_el_image_hover_effect_heading'); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor render_attribute_string returns sanitized HTML attributes ?>>

							<?php echo $this->parse_text_editor($settings['ma_el_main_image_title']); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- parse_text_editor returns Elementor-processed safe HTML ?>

							<?php $ma_el_main_image_sub_title = array("honey");
							if (in_array($ma_el_main_image_effect, $ma_el_main_image_sub_title)) { ?>
								<i><?php echo esc_html($settings['ma_el_main_image_sub_title']); ?></i>
							<?php } ?>

						</<?php echo esc_html($title_html_tag); ?>>

						<?php
						// Social Icons Sets
						$ma_el_main_image_socials_array = array("hera", "zoe", "winston", "terry", "phoebe", "kira");
						if (in_array($ma_el_main_image_effect, $ma_el_main_image_socials_array)) { ?>
							<p class="jltma-icon-links">
								<?php foreach ($settings['ma_el_main_image_icon_tabs'] as $index => $tab) {
									$icon_link_key = 'ma_el_icon_link_' . $index;
									if (!empty($tab['ma_el_main_image_icon_link']['url'])) {
										// add_link_attributes() handles href, target, rel and custom_attributes.
										$this->add_link_attributes($icon_link_key, $tab['ma_el_main_image_icon_link']);
									}
									?>
									<a <?php echo $this->get_render_attribute_string($icon_link_key); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor render_attribute_string returns sanitized HTML attributes ?>>
										<span>
											<?php
											$migrated = isset($tab['__fa4_migrated']['ma_el_main_image_icon']);
											$is_new = empty($tab['icon']) && \Elementor\Icons_Manager::is_migration_allowed();

											if ($is_new || $migrated) {
												\Elementor\Icons_Manager::render_icon($tab['ma_el_main_image_icon'], ['aria-hidden' => 'true']);
											} else { ?>
												<i class="<?php echo esc_attr($tab['icon']); ?>" aria-hidden="true"></i>
											<?php } ?>
										</span>
									</a>
								<?php } ?>
							</p>
						<?php } ?>

						<?php
						// Design Specific Descriptions for Set 1
						//if( $settings['ma_el_main_image_effect'] == "julia" ){
						?>
						<?php if (isset($settings['ma_el_main_image_desc_set2_tabs'])) {
							foreach ($settings['ma_el_main_image_desc_set2_tabs'] as $index => $tab) {
								$ma_el_main_image_effect_one_array = array("julia");
								if (in_array($ma_el_main_image_effect, $ma_el_main_image_effect_one_array)) {
									?>
									<p class="jltma-image-hover-desc">
										<?php echo esc_html($tab['ma_el_main_image_desc_set2']); ?>
									</p>
								<?php }
							}
						}
						//		}

						// Design Specific Descriptions for Set 1
						$ma_el_main_image_effect_array = array(
							"goliath",
							"selena",
							"apollo",
							"steve",
							"moses",
							"jazz",
							"ming",
							"lexi",
							"duke",
							"lily",
							"sadie",
							"oscar",
							"layla",
							"marley",
							"dexter",
							"sarah",
							"chico",
							"hera",
							"kira",
							"milo",
							"roxy",
							"bubba",
							"romeo",
							"ruby"
						);
						if (in_array($ma_el_main_image_effect, $ma_el_main_image_effect_array)) { ?>
							<p class="jltma-image-hover-desc">
								<?php echo wp_kses_post($settings['ma_el_main_image_desc']); ?>
							</p>
						<?php } ?>

					</div>

					<?php
					$ma_el_main_image_effect_array = array("zoe");
					if (in_array($ma_el_main_image_effect, $ma_el_main_image_effect_array)) { ?>
						<p class="jltma-image-hover-desc">
							<?php echo wp_kses_post($settings['ma_el_main_image_desc']); ?>
						</p>
					<?php } ?>

					<?php
					// Link types filter - Free version only has 'links', Pro adds 'popup'
					$enabled_link_types = apply_filters('master_addons/addons/image_hover_effects/link_types', ['links']);

					if ($settings['ma_el_image_hover_link_type'] == "links" && $settings['ma_el_main_image_more_link_url']['url'] != "") { ?>

						<a <?php echo $this->get_render_attribute_string('ma_el_image_hover_link'); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor render_attribute_string returns sanitized HTML attributes ?>></a>

					<?php } elseif (in_array('popup', $enabled_link_types) && $settings['ma_el_image_hover_link_type'] == "popup") { ?>

						<a data-fancybox data-src="#jltma-image-hover-<?php echo esc_attr($this->get_id()); ?>" href="javascript:;"
							data-animation-duration="700" data-animation="fade" data-modal="false"
							class="jltma-fancybox elementor-clickable ma-image-hover-read-more" aria-label="Fancybox Popup">
						</a>

						<div style="display: none;" id="jltma-image-hover-<?php echo esc_attr($this->get_id()); ?>">

							<div class="card p-4">
								<div class="card-body">
									<?php
									if ($settings['ma_el_image_popup_type'] == 'content') {

										echo do_shortcode($settings['popup_content']);
									} else if ($settings['ma_el_image_popup_type'] == 'image' && !empty($settings['popup_image']['url'])) {

										echo $this->render_image($settings['popup_image']['id'], $settings); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- render_image returns sanitized HTML
									} else if ($settings['ma_el_image_popup_type'] == 'section' && !empty($settings['popup_saved_section'])) {

										echo \Elementor\Plugin::$instance->frontend->get_builder_content_for_display($settings['popup_saved_section']); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor get_builder_content_for_display returns sanitized HTML
									} else if ($settings['ma_el_image_popup_type'] == 'template' && !empty($settings['popup_templates'])) {

										echo \Elementor\Plugin::$instance->frontend->get_builder_content_for_display($settings['popup_templates']); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor get_builder_content_for_display returns sanitized HTML
									} else if ($settings['ma_el_image_popup_type'] == 'widget' && !empty($settings['popup_saved_widget'])) {

										echo \Elementor\Plugin::$instance->frontend->get_builder_content_for_display($settings['popup_saved_widget']); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor get_builder_content_for_display returns sanitized HTML
									} ?>
								</div>
							</div>

						</div> <!-- jltma-image-hover -->

					<?php } ?>

				</figcaption>

			</figure>

		</div>
		<?php
	}

	protected function content_template()
	{
	}
}
