<?php
/**
 * DS Gallery Widget
 *
 * @since 1.0.0
 */

namespace dreamsalonelementor\Widgets;

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Repeater;
use Elementor\Utils;

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

class DSGallery extends Widget_Base {

	public function get_name() {
		return 'dreamsalon-ds-gallery';
	}

	public function get_title() {
		return __( 'DS Gallery', 'dreamsalon_elementor' );
	}

	public function get_icon() {
		return 'eicon-gallery-grid';
	}

	public function get_categories() {
		return [ 'dreamsalon' ];
	}

	/**
	 * ✅ Enqueue scripts and styles for Fancybox
	 */
	public function get_script_depends() {
		return [ 'jquery', 'jquery-fancybox' ];
	}

	public function get_style_depends() {
		return [ 'jquery-fancybox' ];
	}

	protected function _register_controls() {

		// ✅ Section: Gallery Items
		$this->start_controls_section(
			'section_gallery',
			[
				'label' => __( 'Gallery Images', 'dreamsalon_elementor' ),
			]
		);

		$repeater = new Repeater();

		$repeater->add_control(
			'gallery_image',
			[
				'label' => __( 'Gallery Image', 'dreamsalon_elementor' ),
				'type' => Controls_Manager::MEDIA,
				'default' => [
					'url' => Utils::get_placeholder_image_src(),
				],
			]
		);

		$repeater->add_control(
			'gallery_link',
			[
				'label' => __( 'Image Link (optional)', 'dreamsalon_elementor' ),
				'type' => Controls_Manager::URL,
				'default' => [ 'url' => '' ],
			]
		);

		$repeater->add_control(
			'col_class',
			[
				'label' => __( 'Column Class', 'dreamsalon_elementor' ),
				'type' => Controls_Manager::TEXT,
				'default' => 'col-lg-4 col-md-4 col-sm-6',
				'description' => __( 'Bootstrap column classes (e.g., col-lg-6 col-md-6)', 'dreamsalon_elementor' ),
			]
		);

		$this->add_control(
			'gallery_list',
			[
				'label' => __( 'Gallery Items', 'dreamsalon_elementor' ),
				'type' => Controls_Manager::REPEATER,
				'fields' => $repeater->get_controls(),
				'default' => [
					[
						'gallery_image' => [ 'url' => Utils::get_placeholder_image_src() ],
					],
				],
				'title_field' => __( 'Gallery Image', 'dreamsalon_elementor' ),
			]
		);

		$this->end_controls_section();
	}

	protected function render() {
		$settings = $this->get_settings_for_display();

	

		?>
		<!-- ✅ Start DS Gallery -->
		<div class="content ds-gallery-widget">
			<div class="container">
				<div class="row row-gap-4">
					<?php if ( ! empty( $settings['gallery_list'] ) ) : ?>
						<?php foreach ( $settings['gallery_list'] as $item ) : ?>
							<div class="<?php echo esc_attr( $item['col_class'] ); ?>">
								<div class="position-relative overflow-hidden gallery-item">
									<?php
									$image_url = ! empty( $item['gallery_image']['url'] ) ? $item['gallery_image']['url'] : Utils::get_placeholder_image_src();
									$link_url  = ! empty( $item['gallery_link']['url'] ) ? $item['gallery_link']['url'] : $image_url;
									?>
									<a href="<?php echo esc_url( $link_url ); ?>" data-fancybox="gallery">
										<img src="<?php echo esc_url( $image_url ); ?>" alt="gallery" class="img-fluid w-100 custom-gallery-img rounded">
									</a>
								</div>
							</div>
						<?php endforeach; ?>
					<?php endif; ?>
				</div>
			</div>
		</div>
		<!-- ✅ End DS Gallery -->

		<!-- ✅ Initialize Fancybox -->
		<script>
		jQuery(document).ready(function($){
			if (typeof Fancybox !== 'undefined') {
				Fancybox.bind("[data-fancybox='gallery']", {
					Thumbs: false,
					Toolbar: {
						display: [
							{ id: "zoom", position: "left" },
							{ id: "close", position: "right" }
						]
					}
				});
			}
		});
		</script>
		<?php
	}
}