<?php
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}
use Sifency\Classes\Sifency_Addons_Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Background;
use Sifency\Traits\Sifency_Addons_Help_Controls;
class Sifency_Media_Scrubbing extends Sifency_Addons_Widget_Base {
	use Sifency_Addons_Help_Controls;

	public function __construct( $data = array(), $args = null ) {
		parent::__construct( $data, $args );
		$this->wg_config = array(
			'name'           => 'sifency-media-scrubbing',
			'title'          => 'Sifency 3D Sequence Scrub',
			'icon'           => 'eicon-video-camera',
			'category'       => array( 'sifency-creative-widgets' ),
			'script_depends' => array( 'gsap', 'gsap-scrolltrigger', 'sifency-scrubbing-script', 'lenis' ),
			'style_depends'  => array( 'sifency-creative-style' ),
			'keywords'       => array( 'style', 'sequence', 'scrub', 'video scroll', '3d showcase' ),
		);
	}

	protected function register_controls() {
		$this->start_controls_section(
			'section_media',
			array( 'label' => esc_html__( 'Media Source', 'sifency-addons' ) )
		);

		$this->add_control(
			'scrub_type',
			array(
				'label'       => esc_html__( 'Media Type', 'sifency-addons' ),
				'type'        => Controls_Manager::SELECT,
				'default'     => 'sequence',
				'options'     => array(
					'sequence' => esc_html__( 'Image Sequence (Canvas) - Best Performance', 'sifency-addons' ),
					'video'    => esc_html__( 'Video Scrubbing (MP4)', 'sifency-addons' ),
				),
				'description' => 'For Modern-style 3D effects, export your video as an Image Sequence (30-100 frames) and upload it here.',
			)
		);

		// Sequence Gallery
		$this->add_control(
			'image_sequence',
			array(
				'label'       => esc_html__( 'Add Sequence Frames', 'sifency-addons' ),
				'type'        => Controls_Manager::GALLERY,
				'condition'   => array( 'scrub_type' => 'sequence' ),
				'description' => 'Upload 30 to 150 optimized images (JPEG/WebP). Format: frame-01.jpg, frame-02.jpg...',
			)
		);

		// Video URL
		$this->add_control(
			'video_url',
			array(
				'label'       => esc_html__( 'Video URL (.mp4)', 'sifency-addons' ),
				'type'        => Controls_Manager::TEXT,
				'placeholder' => 'https://your-site.com/video.mp4',
				'condition'   => array( 'scrub_type' => 'video' ),
				'description' => 'Note: Video scrubbing requires videos encoded with tight keyframes (Intra-frame) for smooth reversing.',
			)
		);

		$this->end_controls_section();

		// --- Settings Section ---
		$this->start_controls_section(
			'section_settings',
			array( 'label' => esc_html__( 'Scroll Settings', 'sifency-addons' ) )
		);

		$this->add_control(
			'pin_duration',
			array(
				'label'       => esc_html__( 'Scroll Length (Pin Duration)', 'sifency-addons' ),
				'type'        => Controls_Manager::SLIDER,
				'range'       => array(
					'px' => array(
						'min'  => 100,
						'max'  => 1000,
						'step' => 50,
					), // Represents Viewport Height %
				),
				'default'     => array( 'size' => 300 ),
				'description' => '300 means the section will stay pinned for 3x the screen height while the animation plays.',
			)
		);

		$this->add_control(
			'object_fit',
			array(
				'label'   => esc_html__( 'Object Fit', 'sifency-addons' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'cover',
				'options' => array(
					'cover'   => 'Cover (Fills Screen)',
					'contain' => 'Contain (Shows Full Image)',
				),
			)
		);

		$this->end_controls_section();
		$this->add_sifency_addons_help_controls();
	}

	protected function render_dom( array $context ) {
		$settings   = $this->get_settings_for_display();
		$wrapper_id = esc_attr( $context['dom_id'] );
		$type       = $settings['scrub_type'];

		$duration = $settings['pin_duration']['size'] ?? 300;
		$fit      = $settings['object_fit'];

		?>
		<div id="<?php echo esc_attr( $wrapper_id ); ?>" class="sifency-scrub-container" data-duration="<?php echo esc_attr( $duration ); ?>" data-fit="<?php echo esc_attr( $fit ); ?>" data-type="<?php echo esc_attr( $type ); ?>">
			
			<div class="sifency-scrub-pin-wrapper">
				
				<?php
				if ( $type === 'sequence' && ! empty( $settings['image_sequence'] ) ) :
					// Collect all image URLs into an array
					$image_urls = array();
					foreach ( $settings['image_sequence'] as $image ) {
						$image_urls[] = $image['url'];
					}
					?>
					<!-- Canvas for High-Performance Sequence Drawing -->
					<canvas class="sifency-scrub-canvas" data-images='<?php echo esc_attr( wp_json_encode( $image_urls ) ); ?>'></canvas>
				
				<?php elseif ( $type === 'video' && ! empty( $settings['video_url'] ) ) : ?>
					
					<!-- HTML5 Video for Video Scrubbing -->
					<!-- playsinline & muted are mandatory for mobile rendering/scrubbing -->
					<video class="sifency-scrub-video" src="<?php echo esc_url( $settings['video_url'] ); ?>" muted playsinline preload="auto"></video>
				
				<?php endif; ?>

			</div>

		</div>
		<?php
	}
}
