<?php
/**
 * Elementor Property Features Widget.
 *
 * @since 1.0.0
 */
class Elementor_Property_Features_Widget extends \Elementor\Widget_Base {

	public function get_name() {
		return 'property-features';
	}

	public function get_title() {
		return __( 'Features', 'propertyhive' );
	}

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

	public function get_categories() {
		return [ 'property-hive' ];
	}

	public function get_keywords() {
		return [ 'property hive', 'propertyhive', 'property', 'features', 'key', 'bullet' ];
	}

	protected function register_controls() {

		$this->start_controls_section(
			'style_section',
			[
				'label' => __( 'Features', 'propertyhive' ),
				'tab' => \Elementor\Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'show_title',
			[
				'label' => __( 'Show Title', 'propertyhive' ),
				'type' => \Elementor\Controls_Manager::SWITCHER,
				'label_on' => __( 'Show', 'propertyhive' ),
				'label_off' => __( 'Hide', 'propertyhive' ),
				'return_value' => 'yes',
				'default' => 'yes',
			]
		);

		$this->add_group_control(
			\Elementor\Group_Control_Typography::get_type(),
			[
				'name' => 'title_typography',
				'label' => __( 'Title Typography', 'propertyhive' ),
				'global' => [
					'default' => \Elementor\Core\Kits\Documents\Tabs\Global_Typography::TYPOGRAPHY_PRIMARY,
				],
				'selector' => '{{WRAPPER}} .features h4',
				'condition' => [
		            'show_title' => 'yes'
		        ],
			]
		);

		$this->add_control(
			'title_color',
			[
				'label' => __( 'Title Colour', 'propertyhive' ),
				'type' => \Elementor\Controls_Manager::COLOR,
				'global' => [
				    'default' => \Elementor\Core\Kits\Documents\Tabs\Global_Colors::COLOR_PRIMARY,
				],
				'selectors' => [
					'{{WRAPPER}} .features h4' => 'color: {{VALUE}}',
				],
				'condition' => [
		            'show_title' => 'yes'
		        ],
			]
		);

		$this->add_group_control(
			\Elementor\Group_Control_Typography::get_type(),
			[
				'name' => 'features_typography',
				'label' => __( 'List Typography', 'propertyhive' ),
				'global' => [
					'default' => \Elementor\Core\Kits\Documents\Tabs\Global_Typography::TYPOGRAPHY_PRIMARY,
				],
				'selector' => '{{WRAPPER}} .features li',
			]
		);

		$this->add_control(
			'list_color',
			[
				'label' => __( 'List Colour', 'propertyhive' ),
				'type' => \Elementor\Controls_Manager::COLOR,
				'global' => [
				    'default' => \Elementor\Core\Kits\Documents\Tabs\Global_Colors::COLOR_PRIMARY,
				],
				'selectors' => [
					'{{WRAPPER}} .features li' => 'color: {{VALUE}}',
				],
			]
		);

		$this->add_control(
			'bullet_type',
			[
				'label' => __( 'Bullet Type', 'propertyhive' ),
				'type' => \Elementor\Controls_Manager::SELECT,
				'default' => 'disc',
				'options' => [
					'disc'   => __( 'Circle', 'propertyhive' ),
					'square' => __( 'Square', 'propertyhive' ),
					'icon'   => __( 'Icon', 'propertyhive' ),
				],
				'selectors' => [
					'{{WRAPPER}} .features ul' => 'list-style-type: {{VALUE}};',
				],
			]
		);

		$this->add_control(
			'bullet_icon',
			[
				'label' => __( 'Icon', 'propertyhive' ),
				'type' => \Elementor\Controls_Manager::ICONS,
				'fa4compatibility' => 'bullet_icon_old',
				'condition' => [
					'bullet_type' => 'icon',
				],
			]
		);

		$this->add_control(
			'bullet_color',
			[
				'label' => __( 'Bullet Colour', 'propertyhive' ),
				'type' => \Elementor\Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .features ul li::marker' => 'color: {{VALUE}};',
					'{{WRAPPER}} .features .ph-feature-icon' => 'color: {{VALUE}};',
					'{{WRAPPER}} .features .ph-feature-icon svg' => 'fill: {{VALUE}};',
				],
			]
		);

		$this->add_responsive_control(
			'columns',
			[
				'label' => __( 'Columns', 'propertyhive' ),
				'type' => \Elementor\Controls_Manager::NUMBER,
				'min' => 1,
				'max' => 3,
				'step' => 1,
				'default' => 1,
				'selectors' => [
					'{{WRAPPER}} .features ul' => 'column-count: {{VALUE}};',
				],
			]
		);

		$this->end_controls_section();

	}

	protected function render() {

		global $property;

		$settings = $this->get_settings_for_display();

		if ( !isset($property->id) ) {
			return;
		}

		if ( isset($settings['show_title']) && $settings['show_title'] != 'yes' )
		{
?>
<style type="text/css">
.features h4 { display:none; }
</style>
<?php
		}

		$bullet_type = isset( $settings['bullet_type'] ) ? $settings['bullet_type'] : 'disc';

		ob_start();
		propertyhive_template_single_features();
		$output = ob_get_clean();

		if ( $bullet_type === 'icon' && ! empty( $settings['bullet_icon']['value'] ) ) {

			$icon_html = '<span class="ph-feature-icon" aria-hidden="true">';
			ob_start();
			\Elementor\Icons_Manager::render_icon(
				$settings['bullet_icon'],
				[
					'aria-hidden' => 'true',
				]
			);
			$icon_html .= ob_get_clean();
			$icon_html .= '</span>';

			$output = preg_replace(
				'/<li([^>]*)>/i',
				'<li$1>' . $icon_html,
				$output
			);

			?>
			<style type="text/css">
				.elementor-widget-property-features .features ul {
					list-style: none !important;
					padding-left: 0;
				}
				.elementor-widget-property-features .features ul li {
					display: flex;
					align-items: flex-start;
					gap: 8px;
				}
				.elementor-widget-property-features .features .ph-feature-icon {
					display: inline-flex;
					flex: 0 0 auto;
					line-height: 1;
					margin-top: 0.15em;
				}
				.elementor-widget-property-features .features .ph-feature-icon i,
				.elementor-widget-property-features .features .ph-feature-icon svg {
					width: 1em;
					height: 1em;
				}
			</style>
			<?php
		}

		// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Feature text is escaped during assembly; selected icons are generated by Elementor Icons_Manager.
		echo $output;
	}

}