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

class Elementor_Parking_Spots extends \Elementor\Widget_Base {

	public function get_name() {
		return 'parking_spots';
	}

	public function get_title() {
		return esc_html__( 'Miejsca Postojowe', 'elementor-addon' );
	}

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

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

	public function get_keywords() {
		return [ 'parking', 'miejsca', 'postojowe', 'garaz' ];
	}

	protected function register_controls() {
		$this->start_controls_section(
			'section_setting',
			[
				'label' => esc_html__( 'Settings', 'elementor-addon' ),
				'tab'   => \Elementor\Controls_Manager::TAB_CONTENT,
			]
		);

		$this->end_controls_section();
	}

	public function get_style_depends() {
		return [ 'elementor-addon-main-css' ];
	}

	public function get_script_depends() {
		return [ 'elementor-addon-main-js' ];
	}

	protected function render() {
		$group_zwykle   = get_field( 'miejsce_postojowe_zwykle', 'option' ) ?: [];
		$group_rodzinne = get_field( 'miejsce_postojowe_rodzinne', 'option' ) ?: [];

		$parking_types = [
			'zwykle' => [
				'label'    => 'Miejsce postojowe zwykłe',
				'price'    => $group_zwykle['miejsce_postojowe_zwykle_cena'] ?? '',
				'price_m2' => $group_zwykle['miejsce_postojowe_zwykle_cena_m2'] ?? '',
			],
			'rodzinne' => [
				'label'    => 'Miejsce postojowe rodzinne',
				'price'    => $group_rodzinne['miejsce_postojowe_rodzinne_cena'] ?? '',
				'price_m2' => $group_rodzinne['miejsce_postojowe_rodzinne_cena_m2'] ?? '',
			],
		];
		?>

		<div class="parking-spots">
			<?php foreach ( $parking_types as $type => $data ) : ?>
			<div class="parking-spot-card">
				<div class="parking-spot-card__header">
					<h3 class="parking-spot-card__title"><?php echo esc_html( $data['label'] ); ?></h3>
				</div>
				<?php if ( ! empty( $data['price'] ) ) : ?>
				<div class="parking-spot-card__price">
					<?php echo esc_html( $data['price'] ); ?> zł
				</div>
				<?php endif; ?>
				<div class="parking-spot-card__history-btn btn-parking-historia-cen"
					data-parking-type="<?php echo esc_attr( $type ); ?>">
					HISTORIA CEN

					<svg xmlns="http://www.w3.org/2000/svg" width="12" height="7" viewBox="0 0 12 7" fill="none">
						<g clip-path="url(#clip0_parking_<?php echo esc_attr( $type ); ?>)">
							<path d="M6 7L0.370835 0.25L11.6292 0.250001L6 7Z" fill="#192C44"/>
						</g>
						<defs>
							<clipPath id="clip0_parking_<?php echo esc_attr( $type ); ?>">
								<rect width="12" height="7" fill="white"/>
							</clipPath>
						</defs>
					</svg>
				</div>
			</div>
			<?php endforeach; ?>
		</div>

		<?php
		// Popup historia cen — renderuj tylko jeśli nie ma go w DOM (apartamenty mogą go już mieć)
		?>
		<div class="price-history-overlay price-history-overlay--parking-fallback" id="price-history-overlay-parking" aria-hidden="true" style="display:none;">
			<div class="price-history-modal" role="dialog" aria-modal="true">
				<button class="price-history-modal__close" id="price-history-close-parking" aria-label="Zamknij">
					<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
						<path d="M13 1L1 13M1 1L13 13" stroke="#192C44" stroke-width="2" stroke-linecap="round"/>
					</svg>
				</button>
				<h3 class="price-history-modal__title" id="price-history-title-parking"></h3>
				<div class="price-history-modal__current">
					<div class="price-history-modal__row price-history-modal__row--bold">
						<span>Cena brutto:</span>
						<span class="price-history-modal__val" id="price-history-price-parking"></span>
					</div>
					<div class="price-history-modal__row">
						<span>Cena m²:</span>
						<span class="price-history-modal__val" id="price-history-sqm-parking"></span>
					</div>
				</div>
				<div class="price-history-modal__table-wrap">
					<table class="price-history-modal__table">
						<tbody id="price-history-tbody-parking"></tbody>
					</table>
				</div>
			</div>
		</div>

		<script>
		(function() {
			// Jeśli popup apartamentowy istnieje, ukryj fallback parkingowy
			var mainOverlay = document.getElementById('price-history-overlay');
			var parkingFallback = document.getElementById('price-history-overlay-parking');
			if (mainOverlay && parkingFallback) {
				parkingFallback.remove();
			} else if (parkingFallback) {
				parkingFallback.style.display = '';
				parkingFallback.id = 'price-history-overlay';
				var closeBtn = parkingFallback.querySelector('#price-history-close-parking');
				if (closeBtn) closeBtn.id = 'price-history-close';
				var title = parkingFallback.querySelector('#price-history-title-parking');
				if (title) title.id = 'price-history-title';
				var price = parkingFallback.querySelector('#price-history-price-parking');
				if (price) price.id = 'price-history-price';
				var sqm = parkingFallback.querySelector('#price-history-sqm-parking');
				if (sqm) sqm.id = 'price-history-sqm';
				var tbody = parkingFallback.querySelector('#price-history-tbody-parking');
				if (tbody) tbody.id = 'price-history-tbody';
			}
		})();
		</script>

		<?php
	}
}
