<?php
/**
 * Elementor Widget Class for 2FOX4 Before After.
 *
 * @package 2FOX4_Before_After
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

class BFAS_Elementor_Widget_Class extends \Elementor\Widget_Base {

	/**
	 * Get widget name.
	 *
	 * @return string
	 */
	public function get_name() {
		return 'bfas_before_after';
	}

	/**
	 * Get widget title.
	 *
	 * @return string
	 */
	public function get_title() {
		return __( '2FOX4 Before After', '2fox4-before-after' );
	}

	/**
	 * Get widget icon.
	 *
	 * @return string
	 */
	public function get_icon() {
		return 'eicon-image-before-after';
	}

	/**
	 * Get widget categories.
	 *
	 * @return array
	 */
	public function get_categories() {
		return array( 'general' );
	}

	/**
	 * Get search keywords.
	 *
	 * @return array
	 */
	public function get_keywords() {
		return array( 'before', 'after', 'compare', 'slider', 'image' );
	}

	/**
	 * Get style dependencies.
	 *
	 * @return array
	 */
	public function get_style_depends() {
		return array( 'bfas-frontend' );
	}

	/**
	 * Get script dependencies.
	 *
	 * @return array
	 */
	public function get_script_depends() {
		return array( 'bfas-frontend' );
	}

	/**
	 * Register widget controls.
	 */
	protected function register_controls() {

		// ---- Images Section ----
		$this->start_controls_section(
			'bfas_section_images',
			array(
				'label' => __( 'Images', '2fox4-before-after' ),
				'tab'   => \Elementor\Controls_Manager::TAB_CONTENT,
			)
		);

		$this->add_control(
			'bfas_before_image',
			array(
				'label'   => __( 'Before Image', '2fox4-before-after' ),
				'type'    => \Elementor\Controls_Manager::MEDIA,
				'default' => array(
					'url' => '',
				),
			)
		);

		$this->add_control(
			'bfas_after_image',
			array(
				'label'   => __( 'After Image', '2fox4-before-after' ),
				'type'    => \Elementor\Controls_Manager::MEDIA,
				'default' => array(
					'url' => '',
				),
			)
		);

		$this->end_controls_section();

		// ---- Slider Settings Section ----
		$this->start_controls_section(
			'bfas_section_settings',
			array(
				'label' => __( 'Slider Settings', '2fox4-before-after' ),
				'tab'   => \Elementor\Controls_Manager::TAB_CONTENT,
			)
		);

		$this->add_control(
			'bfas_mode',
			array(
				'label'       => __( 'Mode', '2fox4-before-after' ),
				'type'        => \Elementor\Controls_Manager::SELECT,
				'default'     => 'slider',
				'options'     => array(
					'slider' => __( 'Slider (images move)', '2fox4-before-after' ),
					'reveal' => __( 'Reveal (images fixed)', '2fox4-before-after' ),
				),
				'description' => __( 'Slider: images are clipped as you drag. Reveal: both images stay fixed, slider reveals one over the other.', '2fox4-before-after' ),
			)
		);

		$this->add_control(
			'bfas_start_position',
			array(
				'label'   => __( 'Start Position (%)', '2fox4-before-after' ),
				'type'    => \Elementor\Controls_Manager::SLIDER,
				'range'   => array(
					'px' => array(
						'min' => 0,
						'max' => 100,
					),
				),
				'default' => array(
					'size' => 50,
				),
			)
		);

		$this->add_control(
			'bfas_orientation',
			array(
				'label'   => __( 'Orientation', '2fox4-before-after' ),
				'type'    => \Elementor\Controls_Manager::SELECT,
				'default' => 'horizontal',
				'options' => array(
					'horizontal' => __( 'Horizontal', '2fox4-before-after' ),
					'vertical'   => __( 'Vertical', '2fox4-before-after' ),
				),
			)
		);

		$this->add_control(
			'bfas_hover_mode',
			array(
				'label'        => __( 'Hover Mode', '2fox4-before-after' ),
				'description'  => __( 'Slider follows the mouse cursor.', '2fox4-before-after' ),
				'type'         => \Elementor\Controls_Manager::SWITCHER,
				'default'      => '',
				'label_on'     => __( 'Yes', '2fox4-before-after' ),
				'label_off'    => __( 'No', '2fox4-before-after' ),
				'return_value' => 'yes',
			)
		);

		$this->add_control(
			'bfas_animate_in',
			array(
				'label'        => __( 'Animate on Load', '2fox4-before-after' ),
				'type'         => \Elementor\Controls_Manager::SWITCHER,
				'default'      => '',
				'label_on'     => __( 'Yes', '2fox4-before-after' ),
				'label_off'    => __( 'No', '2fox4-before-after' ),
				'return_value' => 'yes',
			)
		);

		$this->end_controls_section();

		// ---- Labels Section ----
		$this->start_controls_section(
			'bfas_section_labels',
			array(
				'label' => __( 'Labels', '2fox4-before-after' ),
				'tab'   => \Elementor\Controls_Manager::TAB_CONTENT,
			)
		);

		$this->add_control(
			'bfas_label_before',
			array(
				'label'   => __( 'Before Label', '2fox4-before-after' ),
				'type'    => \Elementor\Controls_Manager::TEXT,
				'default' => '',
			)
		);

		$this->add_control(
			'bfas_label_after',
			array(
				'label'   => __( 'After Label', '2fox4-before-after' ),
				'type'    => \Elementor\Controls_Manager::TEXT,
				'default' => '',
			)
		);

		$this->end_controls_section();

		// ---- Style Section ----
		$this->start_controls_section(
			'bfas_section_style',
			array(
				'label' => __( 'Divider Style', '2fox4-before-after' ),
				'tab'   => \Elementor\Controls_Manager::TAB_STYLE,
			)
		);

		$this->add_control(
			'bfas_divider_color',
			array(
				'label'   => __( 'Divider Color', '2fox4-before-after' ),
				'type'    => \Elementor\Controls_Manager::COLOR,
				'default' => '#ffffff',
			)
		);

		$this->add_control(
			'bfas_css_class',
			array(
				'label'   => __( 'Custom CSS Class', '2fox4-before-after' ),
				'type'    => \Elementor\Controls_Manager::TEXT,
				'default' => '',
			)
		);

		$this->end_controls_section();
	}

	/**
	 * Render widget output on the frontend.
	 */
	protected function render() {
		$settings = $this->get_settings_for_display();

		$before_url = ! empty( $settings['bfas_before_image']['url'] ) ? $settings['bfas_before_image']['url'] : '';
		$after_url  = ! empty( $settings['bfas_after_image']['url'] ) ? $settings['bfas_after_image']['url'] : '';

		if ( empty( $before_url ) || empty( $after_url ) ) {
			if ( \Elementor\Plugin::$instance->editor->is_edit_mode() ) {
				echo '<p style="padding:20px;background:#f0f0f0;text-align:center;">';
				esc_html_e( 'Please select both a before and after image.', '2fox4-before-after' );
				echo '</p>';
			}
			return;
		}

		$shortcode = new BFAS_Shortcode();

		$atts = array(
			'before'        => $before_url,
			'after'         => $after_url,
			'start'         => isset( $settings['bfas_start_position']['size'] ) ? $settings['bfas_start_position']['size'] : 50,
			'mode'          => ! empty( $settings['bfas_mode'] ) ? $settings['bfas_mode'] : 'slider',
			'orientation'   => ! empty( $settings['bfas_orientation'] ) ? $settings['bfas_orientation'] : 'horizontal',
			'label_before'  => ! empty( $settings['bfas_label_before'] ) ? $settings['bfas_label_before'] : '',
			'label_after'   => ! empty( $settings['bfas_label_after'] ) ? $settings['bfas_label_after'] : '',
			'divider_color' => ! empty( $settings['bfas_divider_color'] ) ? $settings['bfas_divider_color'] : '#ffffff',
			'hover'         => ( 'yes' === $settings['bfas_hover_mode'] ) ? '1' : '0',
			'animate'       => ( 'yes' === $settings['bfas_animate_in'] ) ? '1' : '0',
			'css_class'     => ! empty( $settings['bfas_css_class'] ) ? $settings['bfas_css_class'] : '',
		);

		echo wp_kses( $shortcode->build_html( $atts, esc_url( $before_url ), esc_url( $after_url ) ), BFAS_Shortcode::get_kses_allowed_html() );
	}
}