<?php
namespace Sifency\Traits;

if ( ! defined( 'ABSPATH' ) ) {
	exit;  }
use Elementor\Controls_Manager;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Css_Filter;
use Elementor\Group_Control_Typography;
trait Sifency_Product_image_Controls {

	/**
	 * Add complete icon style controls (normal + hover) for any widget.
	 *
	 * @param array $args Optional customization.
	 */
	protected function add_sifency_product_image_controls( $args = array() ) {

		$this->start_controls_section(
			'section_style_image',
			array(
				'label' => esc_html__( 'Main Image', 'sifency-addons' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'image_width',
			array(
				'label'      => esc_html__( 'Width', 'sifency-addons' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( '%', 'px', 'vw' ),
				'range'      => array(
					'%'  => array(
						'min' => 20,
						'max' => 100,
					),
					'px' => array(
						'min' => 100,
						'max' => 1000,
					),
					'vw' => array(
						'min' => 20,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .woocommerce-product-gallery' => 'width: {{SIZE}}{{UNIT}};',
				),
			)
		);

		// Responsive Height Control
		$this->add_responsive_control(
			'image_height',
			array(
				'label'      => esc_html__( 'Height', 'sifency-addons' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', 'vh' ),
				'range'      => array(
					'px' => array(
						'min' => 100,
						'max' => 1000,
					),
					'vh' => array(
						'min' => 20,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .woocommerce-product-gallery .flex-viewport' => 'height: {{SIZE}}{{UNIT}};',
				),
			)
		);

		// Object Fit Control
		$this->add_responsive_control(
			'image_object_fit',
			array(
				'label'     => esc_html__( 'Object Fit', 'sifency-addons' ),
				'type'      => Controls_Manager::SELECT,
				'options'   => array(
					''        => esc_html__( 'Default', 'sifency-addons' ),
					'fill'    => esc_html__( 'Fill', 'sifency-addons' ),
					'cover'   => esc_html__( 'Cover', 'sifency-addons' ),
					'contain' => esc_html__( 'Contain', 'sifency-addons' ),
				),
				'selectors' => array(
					'{{WRAPPER}} .woocommerce-product-gallery__image img' => 'object-fit: {{VALUE}};',
				),
				'condition' => array(
					'image_height[size]!' => '',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'image_border',
				'selector' => '{{WRAPPER}} .woocommerce-product-gallery__wrapper, {{WRAPPER}} .woocommerce-product-gallery__image:first-child img',
			)
		);
		$this->add_responsive_control(
			'image_border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'sifency-addons' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .woocommerce-product-gallery__wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}; overflow: hidden;',
					'{{WRAPPER}} .woocommerce-product-gallery__image img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);

		$this->start_controls_tabs( 'image_effects_tabs' );

		$this->start_controls_tab( 'image_normal_tab', array( 'label' => esc_html__( 'Normal', 'sifency-addons' ) ) );

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'image_box_shadow',
				'selector' => '{{WRAPPER}} .woocommerce-product-gallery__wrapper',
			)
		);
		$this->add_group_control(
			Group_Control_Css_Filter::get_type(),
			array(
				'name'     => 'image_css_filters',
				'selector' => '{{WRAPPER}} .woocommerce-product-gallery__image img',
			)
		);

		$this->end_controls_tab();

		$this->start_controls_tab( 'image_hover_tab', array( 'label' => esc_html__( 'Hover', 'sifency-addons' ) ) );

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'image_box_shadow_hover',
				'selector' => '{{WRAPPER}} .woocommerce-product-gallery__wrapper:hover',
			)
		);
		$this->add_group_control(
			Group_Control_Css_Filter::get_type(),
			array(
				'name'     => 'image_css_filters_hover',
				'selector' => '{{WRAPPER}} .woocommerce-product-gallery__image:hover img',
			)
		);
		$this->add_control(
			'image_scale_hover',
			array(
				'label'     => esc_html__( 'Scale', 'sifency-addons' ),
				'type'      => Controls_Manager::SLIDER,
				'range'     => array(
					'px' => array(
						'min'  => 1,
						'max'  => 1.5,
						'step' => 0.01,
					),
				),
				'default'   => array(
					'size' => 1,
				),
				'selectors' => array(
					'{{WRAPPER}} .woocommerce-product-gallery__image:hover img' => 'transform: scale({{SIZE}});',
				),
			)
		);
		$this->add_control(
			'hover_transition',
			array(
				'label'     => esc_html__( 'Transition Duration', 'sifency-addons' ),
				'type'      => Controls_Manager::SLIDER,
				'range'     => array(
					'px' => array(
						'max'  => 3,
						'step' => 0.1,
					),
				),
				'selectors' => array(
					'{{WRAPPER}} .woocommerce-product-gallery__image img' => 'transition: all {{SIZE}}s ease;',
				),
			)
		);

		$this->end_controls_tab();
		$this->end_controls_tabs();

		$this->end_controls_section();

		// Thumbnails Style Section
		$this->start_controls_section(
			'section_style_thumbnails',
			array(
				'label' => esc_html__( 'Thumbnails', 'sifency-addons' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'thumbnails_spacing',
			array(
				'label'      => esc_html__( 'Spacing Between', 'sifency-addons' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 0,
						'max' => 50,
					),
				),
				'default'    => array(
					'unit' => 'px',
					'size' => 10,
				),
				'selectors'  => array(
					'{{WRAPPER}} .flex-control-thumbs li' => 'padding: 0 {{SIZE}}{{UNIT}} {{SIZE}}{{UNIT}} 0;',
					'{{WRAPPER}} .flex-control-thumbs'    => 'margin-right: -{{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'thumbnails_border',
				'selector' => '{{WRAPPER}} .flex-control-thumbs img',
			)
		);
		$this->add_responsive_control(
			'thumbnails_border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'sifency-addons' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .flex-control-thumbs img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_control(
			'active_thumbnail_border_color',
			array(
				'label'     => esc_html__( 'Active Border Color', 'sifency-addons' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .flex-control-thumbs img.flex-active, {{WRAPPER}} .flex-control-thumbs li:hover img' => 'border-color: {{VALUE}};',
				),
				'separator' => 'before',
			)
		);
		$this->end_controls_section();

		// Sale Flash Style Section
		$this->start_controls_section(
			'section_sale_flash_style',
			array(
				'label' => esc_html__( 'Sale Flash', 'sifency-addons' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_control(
			'show_sale_flash',
			array(
				'label'        => esc_html__( 'Show Sale Flash', 'sifency-addons' ),
				'type'         => Controls_Manager::SWITCHER,
				'label_on'     => esc_html__( 'Show', 'sifency-addons' ),
				'label_off'    => esc_html__( 'Hide', 'sifency-addons' ),
				'return_value' => 'yes',
				'default'      => 'yes',
				'selectors'    => array(
					'{{WRAPPER}} .woocommerce-product-gallery' => 'position: relative;',
					'{{WRAPPER}} span.onsale' => 'display: block;',
				),
			)
		);

		$this->add_control(
			'sale_flash_text_color',
			array(
				'label'     => esc_html__( 'Text Color', 'sifency-addons' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} span.onsale' => 'color: {{VALUE}};',
				),
				'condition' => array(
					'show_sale_flash' => 'yes',
				),
			)
		);
		$this->add_control(
			'sale_flash_bg_color',
			array(
				'label'     => esc_html__( 'Background Color', 'sifency-addons' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} span.onsale' => 'background-color: {{VALUE}};',
				),
				'condition' => array(
					'show_sale_flash' => 'yes',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'      => 'sale_flash_typography',
				'selector'  => '{{WRAPPER}} span.onsale',
				'condition' => array(
					'show_sale_flash' => 'yes',
				),
			)
		);
		$this->add_responsive_control(
			'sale_flash_border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'sifency-addons' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} span.onsale' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
				'condition'  => array(
					'show_sale_flash' => 'yes',
				),
			)
		);
		$this->add_responsive_control(
			'sale_flash_padding',
			array(
				'label'      => esc_html__( 'Padding', 'sifency-addons' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} span.onsale' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
				'condition'  => array(
					'show_sale_flash' => 'yes',
				),
			)
		);
		$this->add_responsive_control(
			'sale_flash_position_top',
			array(
				'label'      => esc_html__( 'Position Top', 'sifency-addons' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', 'em', '%' ),
				'range'      => array(
					'px' => array(
						'min' => 0,
						'max' => 200,
					),
					'em' => array(
						'min' => 0,
						'max' => 20,
					),
					'%'  => array(
						'min' => 0,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} span.onsale' => 'top: {{SIZE}}{{UNIT}}; right: auto; bottom: auto;',
				),
				'condition'  => array(
					'show_sale_flash' => 'yes',
				),
			)
		);
		$this->add_responsive_control(
			'sale_flash_position_left',
			array(
				'label'      => esc_html__( 'Position Left', 'sifency-addons' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', 'em', '%' ),
				'range'      => array(
					'px' => array(
						'min' => 0,
						'max' => 200,
					),
					'em' => array(
						'min' => 0,
						'max' => 20,
					),
					'%'  => array(
						'min' => 0,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} span.onsale' => 'left: {{SIZE}}{{UNIT}};',
				),
				'condition'  => array(
					'show_sale_flash' => 'yes',
				),
			)
		);
		$this->end_controls_section();
	}
}
