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

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Repeater;
use Elementor\Utils;
use Elementor\Group_Control_Typography;
use Sifency\Traits\Sifency_Addons_Help_Controls;
use Sifency\Classes\Sifency_Addons_Widget_Base;

class Sifency_Stack_Showcase 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-stack-showcase',
			'title'          => 'Sifency Stack Showcase',
			'icon'           => 'eicon-scroll',
			'category'       => array( 'sifency-addons-widgets' ),
			'script_depends' => array( 'sifency-stack-showcase-script' ),
			'style_depends'  => array( 'sifency-pro-creative-style' ),
		);
	}

	protected function register_controls() {

		$this->start_controls_section( 'section_content', array( 'label' => 'Projects' ) );

		$repeater = new Repeater();

		$repeater->add_control(
			'image',
			array(
				'label'   => 'Project Image',
				'type'    => Controls_Manager::MEDIA,
				'default' => array( 'url' => Utils::get_placeholder_image_src() ),
			)
		);

		$repeater->add_control(
			'title',
			array(
				'label'   => 'Title',
				'type'    => Controls_Manager::TEXT,
				'default' => 'Creative Project',
			)
		);

		$repeater->add_control(
			'tags',
			array(
				'label'   => 'Tags (Comma separated)',
				'type'    => Controls_Manager::TEXT,
				'default' => 'Design, Branding, UI/UX',
			)
		);

		$repeater->add_control(
			'btn_text',
			array(
				'label'   => 'Button Text',
				'type'    => Controls_Manager::TEXT,
				'default' => 'View Work',
			)
		);

		$repeater->add_control(
			'link',
			array(
				'label' => 'Link',
				'type'  => Controls_Manager::URL,
			)
		);

		$this->add_control(
			'projects',
			array(
				'label'       => 'Project Cards',
				'type'        => Controls_Manager::REPEATER,
				'fields'      => $repeater->get_controls(),
				'title_field' => '{{{ title }}}',
			)
		);

		$this->end_controls_section();
		$this->add_sifency_addons_help_controls();
		// Style Section
		$this->start_controls_section(
			'section_style',
			array(
				'label' => 'Style',
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);

		$this->add_control(
			'card_bg',
			array(
				'label'     => 'Card Background',
				'type'      => Controls_Manager::COLOR,
				'default'   => '#1a1a1a',
				'selectors' => array( '{{WRAPPER}} .sifency-stack-card' => 'background-color: {{VALUE}};' ),
			)
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'title_typo',
				'selector' => '{{WRAPPER}} .card-title',
			)
		);

		$this->end_controls_section();

	}

	protected function render_dom( array $context ) {
		$wrapper_id = esc_attr( $context['dom_id'] );
		$settings   = $this->get_settings_for_display();
		?>
		<div class="sifency-stack-container">
			<div class="sifency-stack-list">
				<?php
				foreach ( $settings['projects'] as $index => $item ) :
					$tags = explode( ',', $item['tags'] );
					?>
					<div class="sifency-stack-card">
						<div class="card-inner-wrapper">
							
							<div class="card-content-box">
								<div class="card-meta">
									<div class="card-tags">
										<?php foreach ( $tags as $tag ) : ?>
											<span class="tag-item"><?php echo esc_html( trim( $tag ) ); ?></span>
										<?php endforeach; ?>
									</div>
									<div class="card-number">/0<?php echo absint( $index + 1 ); ?></div>
								</div>

								<h2 class="card-title"><?php echo esc_html( $item['title'] ); ?></h2>

								<div class="card-footer">
									<a href="<?php echo esc_url( $item['link']['url'] ); ?>" class="card-btn">
										<?php echo esc_html( $item['btn_text'] ); ?>
									</a>
								</div>
							</div>

							<div class="card-image-box">
								<img src="<?php echo esc_url( $item['image']['url'] ); ?>" alt="">
								<div class="card-overlay"></div>
							</div>

						</div>
					</div>
				<?php endforeach; ?>
			</div>
		</div>
		<?php
	}
}
