<?php
if ( ! defined( 'ABSPATH' ) ) {
	exit; }

use Sifency\Classes\Sifency_Addons_Widget_Base;
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Sifency\Traits\Sifency_Addons_Animation_Controls;
use Sifency\Traits\Sifency_Addons_Animation_Manager;
use Sifency\Traits\Sifency_Addons_Master_Typography;
use Sifency\Traits\Sifency_Addons_Help_Controls;

class Sifency_Addons_Widget_Preloader extends Sifency_Addons_Widget_Base {
	use Sifency_Addons_Master_Typography;
	use Sifency_Addons_Animation_Controls;
	use Sifency_Addons_Help_Controls;
	public function __construct( $data = array(), $args = null ) {
		parent::__construct( $data, $args );
		$this->wg_config = array(
			'name'           => 'sifency-preloader',
			'title'          => 'Sifency Preloader',
			'icon'           => 'eicon-loading',
			'category'       => array( 'sifency-creative-widgets' ),
			'script_depends' => array( 'sifency-preloader-script' ),
			'style_depends'  => array( 'sifency-preloader-style' ),
		);}

	protected function register_controls() {
		$this->start_controls_section(
			'section_content',
			array( 'label' => esc_html__( 'Loader Settings', 'sifency-addons' ) )
		);
		$this->add_control(
			'loader_style',
			array(
				'label'   => esc_html__( 'Loader Style', 'sifency-addons' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'spinner-1',
				'options' => array(
					'spinner-1'    => esc_html__( '1. Classic Spinner', 'sifency-addons' ),
					'spinner-2'    => esc_html__( '2. Double Ring', 'sifency-addons' ),
					'dots-1'       => esc_html__( '3. Bouncing Dots', 'sifency-addons' ),
					'dots-2'       => esc_html__( '4. Scaling Dots', 'sifency-addons' ),
					'bars'         => esc_html__( '5. Equalizer Bars', 'sifency-addons' ),
					'pulse'        => esc_html__( '6. Ripple Pulse', 'sifency-addons' ),
					'circle'       => esc_html__( '7. Circle Fill', 'sifency-addons' ),
					'cube'         => esc_html__( '8. Cube Grid', 'sifency-addons' ),
					'text'         => esc_html__( '9. Text Loading', 'sifency-addons' ),
					'image'        => esc_html__( '10. Custom Image/Logo', 'sifency-addons' ),
					'fill-counter' => esc_html__( '11. Fill Counter', 'sifency-addons' ),
				),
			)
		);
		$this->add_control(
			'custom_image',
			array(
				'label'     => esc_html__( 'Upload Image', 'sifency-addons' ),
				'type'      => Controls_Manager::MEDIA,
				'condition' => array( 'loader_style' => 'image' ),
			)
		);
		$this->add_control(
			'loading_text',
			array(
				'label'     => esc_html__( 'Loading Text', 'sifency-addons' ),
				'type'      => Controls_Manager::TEXT,
				'default'   => 'LOADING',
				'condition' => array( 'loader_style' => 'text' ),
			)
		);
		$this->add_control(
			'bg_color',
			array(
				'label'     => 'Overlay Color',
				'type'      => Controls_Manager::COLOR,
				'default'   => '#ffffff',
				'selectors' => array( '{{WRAPPER}} .sifency-preloader-overlay' => 'background-color: {{VALUE}};' ),
			)
		);

		$this->add_control(
			'loader_color',
			array(
				'label'     => 'Loader Color 1',
				'type'      => Controls_Manager::COLOR,
				'default'   => '#007BFF',
				'selectors' => array( '{{WRAPPER}}' => '--sp-color-1: {{VALUE}};' ),
			)
		);
		$this->add_control(
			'loader_color_2',
			array(
				'label'     => 'Loader Color 2',
				'type'      => Controls_Manager::COLOR,
				'default'   => '#00c6fb',
				'selectors' => array( '{{WRAPPER}}' => '--sp-color-2: {{VALUE}};' ),
			)
		);
		$this->add_control(
			'loader_color_3',
			array(
				'label'     => 'Loader Color 3',
				'type'      => Controls_Manager::COLOR,
				'default'   => '#008000ff',
				'selectors' => array( '{{WRAPPER}}' => '--sp-color-3: {{VALUE}};' ),
			)
		);
		$this->add_control(
			'loader_color_text',
			array(
				'label'     => 'Loader Text Color',
				'type'      => Controls_Manager::COLOR,
				'selectors' => array( '{{WRAPPER}}' => '--sp-color-text: {{VALUE}};' ),
			)
		);

		$this->add_control(
			'max_time',
			array(
				'label'       => esc_html__( 'Max Display Time (ms)', 'sifency-addons' ),
				'type'        => Controls_Manager::NUMBER,
				'default'     => 3000,
				'description' => 'Force hide after this time even if page still loads.',
			)
		);
		$this->add_control(
			'transition',
			array(
				'label'   => esc_html__( 'Exit Animation', 'sifency-addons' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'fade',
				'options' => array(
					'fade'     => 'Fade Out',
					'slide-up' => 'Slide Up',
					'split'    => 'Split Screen',
				),
			)
		);
		$this->add_control(
			'fill_counter_icon',
			array(
				'label'     => esc_html__( 'Close Icon', 'sifency-addons' ),
				'type'      => Controls_Manager::ICONS,
				'condition' => array(
					'loader_style' => 'fill-counter',
				),
				'default'   => array(
					'value'   => 'fas fa-times',
					'library' => 'fa-solid',
				),
			)
		);
		$this->end_controls_section();
		$this->add_sifency_addons_help_controls();
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'   => 'fill_counter_',
				'label'    => esc_html__( 'Fill Counter Style', 'sifency-addons' ),
				'selector' => '.sifency-fc-count',
				'exclude'  => array( 'bg', 'radius', 'tabs', 'transition', 'shadow', 'stroke', 'padding', 'margin', 'border', 'indent', 'alignment' ),
			)
		);
		$this->start_controls_section(
			'style_text',
			array(
				'label'     => 'Text Style',
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => array( 'loader_style' => 'text' ),
			)
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'text_typo',
				'selector' => '{{WRAPPER}} .sifency-loader-text',
			)
		);
		$this->add_control(
			'text_color',
			array(
				'label'     => 'Color',
				'type'      => Controls_Manager::COLOR,
				'selectors' => array( '{{WRAPPER}} .sifency-loader-text' => 'color: {{VALUE}};' ),
			)
		);
		$this->end_controls_section();

		$this->start_controls_section(
			'style_image',
			array(
				'label'     => 'Image Style',
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => array( 'loader_style' => 'image' ),
			)
		);
		$this->add_responsive_control(
			'img_width',
			array(
				'label'     => 'Width',
				'type'      => Controls_Manager::SLIDER,
				'selectors' => array( '{{WRAPPER}} .sifency-loader-img' => 'width: {{SIZE}}px;' ),
			)
		);
		$this->add_control(
			'img_anim',
			array(
				'label'   => 'Animation',
				'type'    => Controls_Manager::SELECT,
				'default' => 'pulse',
				'options' => array(
					'pulse'  => 'Pulse',
					'spin'   => 'Spin',
					'bounce' => 'Bounce',
				),
			)
		);
		$this->end_controls_section();
		$this->add_Sifency_Addons_Animation_Controls();
		$this->update_control(
			'sifency_animation_target',
			array(
				'type'    => Controls_Manager::HIDDEN,
				'default' => 'wrapper',
			)
		);
	}
	protected function render_dom( array $context ) {
		$wrapper_id              = esc_attr( $context['dom_id'] );
		$settings                = $this->get_settings_for_display();
		$animation_manager       = new Sifency_Addons_Animation_Manager( $settings );
		$animation_wrapper_attrs = $animation_manager->get_wrapper_attributes();

		$this->add_render_attribute( 'wrapper', 'class', 'sifency-preloader-wrapper' );
		$this->add_render_attribute( 'overlay', 'class', array( 'sifency-preloader-overlay', 'sifency-exit-' . $settings['transition'] ) );

		$js_settings = array( 'timeout' => $settings['max_time'] );
		$this->add_render_attribute( 'wrapper', 'data-pl-settings', wp_json_encode( $js_settings ) );

		if ( \Elementor\Plugin::$instance->editor->is_edit_mode() ) {
			echo '<div style="padding: 20px; background: #eee; text-align: center; font-weight: bold; color: #555;">Preloader Active (Hidden in Editor)</div>';
			return;
		}

		?>
		<div id="<?php echo esc_attr( $wrapper_id ); ?>" <?php echo wp_kses_post( $this->get_render_attribute_string( 'wrapper' ) ); ?>>
			<div <?php echo wp_kses_post( $this->get_render_attribute_string( 'overlay' ) ); ?>>
				
				<div class="sifency-loader-content" <?php echo wp_kses_post( $animation_wrapper_attrs ); ?>>
					
					<?php if ( 'spinner-1' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-spinner-1"></div>
					
					<?php elseif ( 'spinner-2' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-spinner-2"></div>

					<?php elseif ( 'dots-1' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-dots-1"><span></span><span></span><span></span></div>

					<?php elseif ( 'dots-2' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-dots-2"></div>

					<?php elseif ( 'bars' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-bars"><span></span><span></span><span></span><span></span><span></span></div>

					<?php elseif ( 'pulse' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-pulse"></div>

					<?php elseif ( 'circle' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-circle"></div>

					<?php elseif ( 'cube' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-cube">
							<div class="cube1"></div><div class="cube2"></div><div class="cube3"></div><div class="cube4"></div><div class="cube5"></div><div class="cube6"></div><div class="cube7"></div><div class="cube8"></div><div class="cube9"></div>
						</div>

					<?php elseif ( 'text' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-text" data-text="<?php echo esc_attr( $settings['loading_text'] ); ?>">
							<?php echo esc_html( $settings['loading_text'] ); ?>
						</div>

					<?php elseif ( 'image' === $settings['loader_style'] && ! empty( $settings['custom_image']['url'] ) ) : ?>
						<img src="<?php echo esc_url( $settings['custom_image']['url'] ); ?>" class="sifency-loader-img sifency-anim-<?php echo esc_attr( $settings['img_anim'] ); ?>" alt="Loading">
					
					<?php elseif ( 'fill-counter' === $settings['loader_style'] ) : ?>
						<div class="sifency-loader-fill-counter">
							<span class="sifency-fc-count">0%</span>
							<span class="sifency-fc-icon">
								<?php
								if ( ! empty( $settings['fill_counter_icon']['value'] ) ) {
									\Elementor\Icons_Manager::render_icon( $settings['fill_counter_icon'], array( 'aria-hidden' => 'true' ) );
								} else {
									echo '<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>';
								}
								?>
							</span>
							<div class="sifency-fc-fill-left"></div>
							<div class="sifency-fc-fill-right"></div>
							<div class="sifency-fc-fill-top"></div>
							<div class="sifency-fc-fill-bottom"></div>
							<div class="sifency-fc-mask-tl"></div>
							<div class="sifency-fc-mask-tr"></div>
							<div class="sifency-fc-mask-bl"></div>
							<div class="sifency-fc-mask-br"></div>
						</div>
					<?php endif; ?>

				</div>

			</div>
		</div>
		<?php
	}
}
