<?php
declare(strict_types=1);

namespace AuraBuilder\Widgets\Basic;

use AuraBuilder\Document\Node;
use AuraBuilder\Widgets\WidgetBase;

final class CarouselWidget extends WidgetBase {
	public function get_type(): string { return 'carousel'; }
	public function get_title(): string { return 'Carrossel'; }
	public function get_icon(): string { return 'carousel'; }

	public function get_defaults(): array {
		return array(
			'images'       => '',
			'height'       => '280',
			'layout'       => 'single', // single | multi | fade
			'per_view'     => '1',
			'autoplay'     => '1',
			'dots'         => '1',
			'arrows'       => '1',
			'gap'          => '8',
			'slide_effect' => 'slide', // fade | slide | zoom | flip
			'slide_speed'  => '450',
		);
	}

	public function sanitize_settings( array $settings ): array {
		$gw  = new GalleryWidget();
		$tmp = $gw->sanitize_settings(
			array(
				'images'  => $settings['images'] ?? '',
				'columns' => '1',
				'gap'     => '0',
			)
		);
		$layout = sanitize_key( (string) ( $settings['layout'] ?? 'single' ) );
		if ( ! in_array( $layout, array( 'single', 'multi', 'fade' ), true ) ) {
			$layout = 'single';
		}
		$slide_effect = sanitize_key( (string) ( $settings['slide_effect'] ?? 'slide' ) );
		if ( ! in_array( $slide_effect, array( 'fade', 'slide', 'zoom', 'flip' ), true ) ) {
			$slide_effect = 'slide';
		}
		// layout=fade forces fade effect.
		if ( $layout === 'fade' ) {
			$slide_effect = 'fade';
		}
		$flag = static function ( $v, string $d = '1' ): string {
			if ( $v === null || $v === '' ) {
				return $d;
			}
			return ( $v === true || $v === 1 || $v === '1' || $v === 'true' || $v === 'yes' ) ? '1' : '0';
		};
		return array(
			'images'       => $tmp['images'],
			'height'       => (string) max( 120, min( 800, (int) ( $settings['height'] ?? 280 ) ) ),
			'layout'       => $layout,
			'per_view'     => (string) max( 1, min( 4, (int) ( $settings['per_view'] ?? 1 ) ) ),
			'autoplay'     => $flag( $settings['autoplay'] ?? null, '1' ),
			'dots'         => $flag( $settings['dots'] ?? null, '1' ),
			'arrows'       => $flag( $settings['arrows'] ?? null, '1' ),
			'gap'          => (string) max( 0, min( 40, (int) ( $settings['gap'] ?? 8 ) ) ),
			'slide_effect' => $slide_effect,
			'slide_speed'  => (string) max( 150, min( 2000, (int) ( $settings['slide_speed'] ?? 450 ) ) ),
		);
	}

	public function render( Node $node, array $context = array() ): string {
		$s    = $node->settings;
		$urls = GalleryWidget::urls_from_images( $s['images'] ?? '[]' );
		if ( ! $urls ) {
			return ! empty( $context['editor'] ) ? '<div class="ab-carousel ab-empty">Carrossel — abra a mídia</div>' : '';
		}
		$h        = (int) ( $s['height'] ?? 280 );
		$layout   = (string) ( $s['layout'] ?? 'single' );
		$per      = max( 1, min( 4, (int) ( $s['per_view'] ?? 1 ) ) );
		$gap      = max( 0, min( 40, (int) ( $s['gap'] ?? 8 ) ) );
		$autoplay = ( $s['autoplay'] ?? '1' ) === '1' ? '1' : '0';
		$dots     = ( $s['dots'] ?? '1' ) === '1';
		$arrows   = ( $s['arrows'] ?? '1' ) === '1';
		$fx       = sanitize_key( (string) ( $s['slide_effect'] ?? 'slide' ) );
		$speed    = max( 150, min( 2000, (int) ( $s['slide_speed'] ?? 450 ) ) );

		if ( $layout === 'single' ) {
			$per = 1;
		}
		if ( $layout === 'fade' ) {
			$fx = 'fade';
		}

		$style = sprintf(
			'--ab-carousel-h:%dpx;--ab-carousel-per:%d;--ab-carousel-gap:%dpx;--ab-carousel-speed:%dms',
			$h,
			$per,
			$gap,
			$speed
		);

		$html  = '<div class="ab-carousel ab-carousel--' . esc_attr( $layout ) . ' ab-carousel--fx-' . esc_attr( $fx ) . '" style="' . esc_attr( $style ) . '" data-ab-carousel="1" data-layout="' . esc_attr( $layout ) . '" data-per="' . esc_attr( (string) $per ) . '" data-autoplay="' . $autoplay . '" data-slide-effect="' . esc_attr( $fx ) . '" data-slide-speed="' . esc_attr( (string) $speed ) . '">';
		$html .= '<div class="ab-carousel__track">';
		foreach ( $urls as $i => $u ) {
			$u = esc_url( (string) $u );
			if ( $u === '' ) {
				continue;
			}
			$html .= '<div class="ab-carousel__slide' . ( $i === 0 ? ' is-active' : '' ) . '"><img src="' . $u . '" alt="" loading="lazy"/></div>';
		}
		$html .= '</div>';
		if ( $arrows && count( $urls ) > $per ) {
			$html .= '<button type="button" class="ab-carousel__nav ab-carousel__nav--prev" data-ab-car-prev aria-label="Anterior">‹</button>';
			$html .= '<button type="button" class="ab-carousel__nav ab-carousel__nav--next" data-ab-car-next aria-label="Próximo">›</button>';
		}
		if ( $dots && count( $urls ) > 1 ) {
			$html .= '<div class="ab-carousel__dots">';
			foreach ( $urls as $i => $_u ) {
				$html .= '<button type="button" class="ab-carousel__dot' . ( $i === 0 ? ' is-active' : '' ) . '" data-ab-car-dot="' . esc_attr( (string) $i ) . '" aria-label="Slide ' . esc_attr( (string) ( $i + 1 ) ) . '"></button>';
			}
			$html .= '</div>';
		}
		$html .= '</div>';
		return $html;
	}
}
