<?php
/**
 * Image Overlay Effect — hover overlay with title/text/link.
 *
 * @package AuraBuilder
 */

declare(strict_types=1);

namespace AuraBuilder\Widgets\Basic;

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

final class ImageOverlayWidget extends WidgetBase {

	public function get_type(): string {
		return 'image_overlay';
	}

	public function get_title(): string {
		return 'Sobreposição de imagem';
	}

	public function get_category(): string {
		return 'creative';
	}

	public function get_icon(): string {
		return 'image_box';
	}

	public function get_defaults(): array {
		return array(
			'image'           => '',
			'title'           => 'Infantil',
			'text'            => 'Descoberta e brincadeira com propósito',
			'link'            => '#',
			'effect'          => 'fade',
			'color'           => '#0f172a',
			'opacity'         => '70',
			'height'          => '280',
			'radius'          => '16',
			'object_position' => '50% 50%',
		);
	}

	public function sanitize_settings( array $settings ): array {
		$effect = sanitize_key( (string) ( $settings['effect'] ?? 'fade' ) );
		if ( ! in_array( $effect, array( 'fade', 'slide-up', 'zoom', 'color', 'blur' ), true ) ) {
			$effect = 'fade';
		}
		$color = trim( (string) ( $settings['color'] ?? '#0f172a' ) );
		if ( ! preg_match( '/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/', $color ) ) {
			$color = '#0f172a';
		}
		return array(
			'image'           => esc_url_raw( (string) ( $settings['image'] ?? '' ) ),
			'title'           => sanitize_text_field( (string) ( $settings['title'] ?? '' ) ),
			'text'            => sanitize_textarea_field( (string) ( $settings['text'] ?? '' ) ),
			'link'            => esc_url_raw( (string) ( $settings['link'] ?? '' ) ),
			'effect'          => $effect,
			'color'           => strtolower( $color ),
			'opacity'         => (string) max( 20, min( 95, (int) ( $settings['opacity'] ?? 70 ) ) ),
			'height'          => (string) max( 120, min( 700, (int) ( $settings['height'] ?? 280 ) ) ),
			'radius'          => (string) max( 0, min( 40, (int) ( $settings['radius'] ?? 16 ) ) ),
			'object_position' => self::sanitize_object_position( $settings['object_position'] ?? '50% 50%' ),
		);
	}

	public function render( Node $node, array $context = array() ): string {
		$s       = $node->settings;
		$img     = (string) ( $s['image'] ?? '' );
		$title   = (string) ( $s['title'] ?? '' );
		$text    = (string) ( $s['text'] ?? '' );
		$link    = (string) ( $s['link'] ?? '' );
		$effect  = esc_attr( (string) ( $s['effect'] ?? 'fade' ) );
		$color   = esc_attr( (string) ( $s['color'] ?? '#0f172a' ) );
		$opacity = (int) ( $s['opacity'] ?? 70 );
		$height  = (int) ( $s['height'] ?? 280 );
		$radius  = (int) ( $s['radius'] ?? 16 );
		$pos     = esc_attr( self::sanitize_object_position( $s['object_position'] ?? '50% 50%' ) );

		if ( $img === '' ) {
			return ! empty( $context['editor'] )
				? '<div class="ab-img-overlay ab-empty">Sobreposição de imagem</div>'
				: '';
		}

		$tag  = $link !== '' ? 'a' : 'div';
		$href = $link !== '' ? ' href="' . esc_url( $link ) . '"' : '';

		$html  = '<' . $tag . $href . ' class="ab-img-overlay ab-img-overlay--' . $effect . '" style="--ab-io-h:' . esc_attr( (string) $height ) . 'px;--ab-io-r:' . esc_attr( (string) $radius ) . 'px;--ab-io-color:' . $color . ';--ab-io-op:' . esc_attr( (string) ( $opacity / 100 ) ) . ';--ab-io-pos:' . $pos . '">';
		$html .= '<img class="ab-img-overlay__img" src="' . esc_url( $img ) . '" alt="' . esc_attr( $title ) . '" loading="lazy" style="object-fit:cover;object-position:' . $pos . '"/>';
		$html .= '<span class="ab-img-overlay__mask" aria-hidden="true"></span>';
		$html .= '<span class="ab-img-overlay__content">';
		if ( $title !== '' ) {
			$html .= '<span class="ab-img-overlay__title">' . esc_html( $title ) . '</span>';
		}
		if ( $text !== '' ) {
			$html .= '<span class="ab-img-overlay__text">' . esc_html( $text ) . '</span>';
		}
		$html .= '</span></' . $tag . '>';
		return $html;
	}
}
