<?php
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}
use Sifency\Classes\Sifency_Addons_Widget_Base;
use \Elementor\Widget_Base;
use \Elementor\Control_Media;
use \Elementor\Group_Control_Image_Size;
use \Elementor\Controls_Manager;
use \Elementor\Group_Control_Typography;
use \Elementor\Group_Control_Text_Shadow;
use \Elementor\Group_Control_Border;
use \Elementor\Group_Control_Box_Shadow;
use \Elementor\Repeater;
use \Elementor\Utils;
use Sifency\Traits\Sifency_Addons_Master_Typography;
use Sifency\Traits\Sifency_Addons_Image_Style_Controls;
use Sifency\Traits\Sifency_Addons_Help_Controls;

class Sifency_Typography_Block extends Sifency_Addons_Widget_Base {
	use Sifency_Addons_Master_Typography;
	use Sifency_Addons_Image_Style_Controls;
	use Sifency_Addons_Help_Controls;
	public function __construct( $data = array(), $args = null ) {
		parent::__construct( $data, $args );
		$this->wg_config = array(
			'name'     => 'sifency_typography_block',
			'title'    => 'Content Block',
			'icon'     => 'eicon-text-area',
			'category' => array( 'sifency-typography-category' ),
			'keywords' => array( 'typography', 'text', 'heading', 'paragraph', 'blockquote', 'image', 'caption', 'content block' ),
		);}
	protected function register_controls() {
		$this->start_controls_section(
			'section_content',
			array(
				'label' => esc_html__( 'Content Builder', 'sifency-addons' ),
			)
		);
		$repeater = new Repeater();

		$repeater->add_control(
			'element_type',
			array(
				'label'   => esc_html__( 'Element Type', 'sifency-addons' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'heading',
				'options' => array(
					'heading'    => esc_html__( 'Heading (H1-H6)', 'sifency-addons' ),
					'text'       => esc_html__( 'Text / Paragraph', 'sifency-addons' ),
					'blockquote' => esc_html__( 'Blockquote', 'sifency-addons' ),
					'image'      => esc_html__( 'Image', 'sifency-addons' ),
					'divider'    => esc_html__( 'Divider / Spacer', 'sifency-addons' ),
				),
			)
		);

		$repeater->add_control(
			'heading_tag',
			array(
				'label'     => esc_html__( 'HTML Tag', 'sifency-addons' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'h2',
				'options'   => array(
					'h1' => 'H1',
					'h2' => 'H2',
					'h3' => 'H3',
					'h4' => 'H4',
					'h5' => 'H5',
					'h6' => 'H6',
				),
				'condition' => array(
					'element_type' => 'heading',
				),
			)
		);

		$repeater->add_control(
			'text_tag',
			array(
				'label'     => esc_html__( 'HTML Tag', 'sifency-addons' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'p',
				'options'   => array(
					'p'    => 'Paragraph (P)',
					'div'  => 'Div',
					'span' => 'Span',
				),
				'condition' => array(
					'element_type' => 'text',
				),
			)
		);

		$repeater->add_control(
			'content_heading',
			array(
				'label'     => esc_html__( 'Heading Text', 'sifency-addons' ),
				'type'      => Controls_Manager::TEXTAREA,
				'rows'      => 3,
				'dynamic'   => array( 'active' => true ),
				'condition' => array(
					'element_type' => 'heading',
				),
			)
		);

		$repeater->add_control(
			'content_wysiwyg',
			array(
				'label'     => esc_html__( 'Content', 'sifency-addons' ),
				'type'      => Controls_Manager::WYSIWYG,
				'condition' => array(
					'element_type' => array( 'text', 'blockquote' ),
				),
			)
		);

		$repeater->add_control(
			'image',
			array(
				'label'     => esc_html__( 'Choose Image', 'sifency-addons' ),
				'type'      => Controls_Manager::MEDIA,
				'dynamic'   => array( 'active' => true ),
				'default'   => array(
					'url' => Utils::get_placeholder_image_src(),
				),
				'condition' => array(
					'element_type' => 'image',
				),
			)
		);

		$repeater->add_control(
			'image_caption',
			array(
				'label'     => esc_html__( 'Image Caption', 'sifency-addons' ),
				'type'      => Controls_Manager::TEXT,
				'dynamic'   => array( 'active' => true ),
				'condition' => array(
					'element_type' => 'image',
				),
			)
		);

		$repeater->add_responsive_control(
			'item_margin',
			array(
				'label'     => esc_html__( 'Space Bottom', 'sifency-addons' ),
				'type'      => Controls_Manager::SLIDER,
				'range'     => array(
					'px' => array(
						'min' => 0,
						'max' => 100,
					),
				),
				'selectors' => array(
					'{{WRAPPER}} {{CURRENT_ITEM}}' => 'margin-bottom: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->add_control(
			'items',
			array(
				'label'       => esc_html__( 'Block Items', 'sifency-addons' ),
				'type'        => Controls_Manager::REPEATER,
				'fields'      => $repeater->get_controls(),
				'default'     => array(
					array(
						'element_type'    => 'heading',
						'heading_tag'     => 'h2',
						'content_heading' => 'This is a Heading 2',
					),
					array(
						'element_type'    => 'text',
						'content_wysiwyg' => 'This is a standard paragraph following the heading. It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using Content here content here making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for lorem ipsum will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).',
					),
					array(
						'element_type' => 'image',
					),
				),
				'title_field' => '{{{ element_type.toUpperCase() }}}',
			)
		);
		$this->add_responsive_control(
			'align',
			array(
				'label'     => esc_html__( 'Alignment', 'sifency-addons' ),
				'type'      => Controls_Manager::CHOOSE,
				'options'   => array(
					'left'    => array(
						'title' => esc_html__( 'Left', 'sifency-addons' ),
						'icon'  => 'eicon-text-align-left',
					),
					'center'  => array(
						'title' => esc_html__( 'Center', 'sifency-addons' ),
						'icon'  => 'eicon-text-align-center',
					),
					'right'   => array(
						'title' => esc_html__( 'Right', 'sifency-addons' ),
						'icon'  => 'eicon-text-align-right',
					),
					'justify' => array(
						'title' => esc_html__( 'Justified', 'sifency-addons' ),
						'icon'  => 'eicon-text-align-justify',
					),
				),
				'selectors' => array(
					'{{WRAPPER}} .sifency-typo-block-item' => 'text-align: {{VALUE}};',
					'{{WRAPPER}} .sifency-typo-image img'  => 'margin-left: auto; margin-right: auto;',
				),
			)
		);
		$this->end_controls_section();
		$this->add_sifency_addons_help_controls();
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'     => 'heading_one_style_',
				'label'      => 'Heading 1',
				'selector'   => 'h1.sifency-typo-heading',
				'color_only' => true,
				'exclude'    => array( 'shadow', 'tabs', 'transitions', 'radius', 'bg', 'transition' ),
			)
		);
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'     => 'heading_two_style_',
				'label'      => 'Heading 2',
				'selector'   => 'h2.sifency-typo-heading',
				'color_only' => true,
				'exclude'    => array( 'shadow', 'tabs', 'transitions', 'radius', 'bg', 'transition' ),
			)
		);
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'     => 'heading_3456_style_',
				'label'      => 'Heading 3-6',
				'selector'   => 'h3.sifency-typo-heading, h4.sifency-typo-heading, h5.sifency-typo-heading, h6.sifency-typo-heading',
				'color_only' => true,
				'exclude'    => array( 'shadow', 'tabs', 'transitions', 'radius', 'bg', 'transition' ),
			)
		);
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'          => 'text_style',
				'label'           => 'Paragraph',
				'selector'        => '.sifency-typo-text.sifency-typo-block-item',
				'target_children' => true,
				'color_only'      => true,
				'exclude'         => array( 'shadow', 'tabs', 'transitions', 'bg', 'radius', 'shadow', 'transition' ),
			)
		);
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'          => 'blockquote_style',
				'label'           => 'Blockquote',
				'selector'        => '.sifency-typo-blockquote',
				'target_children' => true,
				'color_only'      => true,
				'exclude'         => array( 'shadow', 'tabs', 'transitions' ),
			)
		);

		$this->add_sifency_addons_image_style_controls(
			array(
				'prefix'    => 'image_style',
				'label'     => 'Image',
				'selector'  => '.sifency-typo-image img',
				'selectors' => array(
					'image'      => '.sifency-typo-image img',
					'container'  => '.sifency-typo-image img',
					'dimensions' => '.sifency-typo-image img',
				),
				'exclude'   => array( 'shadow', 'tabs', 'transitions' ),
			)
		);
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'     => 'caption_style',
				'label'      => 'Image Caption',
				'selector'   => '.sifency-typo-caption',
				'color_only' => true,
				'exclude'    => array( 'shadow', 'tabs', 'transitions', 'bg', 'radius', 'shadow', 'transition' ),
			)
		);

		$this->start_controls_section(
			'style_divider_section',
			array(
				'label' => esc_html__( 'Typo Divider', 'sifency-addons' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'divider_width',
			array(
				'label'      => esc_html__( 'Width', 'sifency-addons' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', '%', 'vw' ),
				'range'      => array(
					'px' => array(
						'min' => 0,
						'max' => 1000,
					),
					'%'  => array(
						'min' => 0,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .sifency-typo-divider' => 'width: {{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'divider_height',
			array(
				'label'      => esc_html__( 'Height', 'sifency-addons' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', '%', 'vh' ),
				'range'      => array(
					'px' => array(
						'min' => 0,
						'max' => 100,
					),
					'%'  => array(
						'min' => 0,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .sifency-typo-divider' => 'height: {{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'divider_border',
				'label'    => esc_html__( 'Border / Line Style', 'sifency-addons' ),
				'selector' => '{{WRAPPER}} .sifency-typo-divider',
			)
		);
		$this->add_control(
			'divider_color',
			array(
				'label'       => esc_html__( 'Quick Color', 'sifency-addons' ),
				'type'        => Controls_Manager::COLOR,
				'description' => 'Use this for quick color changes if border is solid.',
				'selectors'   => array(
					'{{WRAPPER}} .sifency-typo-divider' => 'border-color: {{VALUE}}; background-color: {{VALUE}};',
				),
			)
		);
		$this->end_controls_section();
	}

	protected function render_dom( array $context ) {
		$settings = $this->get_settings_for_display();

		if ( empty( $settings['items'] ) ) {
			return;
		}

		echo '<div class="sifency-typography-block-wrapper">';

		foreach ( $settings['items'] as $index => $item ) {
			$repeater_setting_key = $this->get_repeater_setting_key( 'content', 'items', $index );
			$item_type            = $item['element_type'];

			$this->add_render_attribute(
				$repeater_setting_key,
				'class',
				array(
					'sifency-typo-block-item',
					'sifency-typo-' . $item_type,
					'elementor-repeater-item-' . $item['_id'],
				)
			);

			if ( 'heading' === $item_type && ! empty( $item['content_heading'] ) ) {
				$tag = \Elementor\Utils::validate_html_tag( $item['heading_tag'] );
				// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor widget rendering attributes
				echo '<' . tag_escape( $tag ) . ' ' . $this->get_render_attribute_string( $repeater_setting_key ) . '>';
				echo wp_kses_post( $item['content_heading'] );
				echo '</' . tag_escape( $tag ) . '>';
			} elseif ( 'text' === $item_type ) {
				$tag = \Elementor\Utils::validate_html_tag( $item['text_tag'] );
				// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor widget rendering attributes
				echo '<' . tag_escape( $tag ) . ' ' . $this->get_render_attribute_string( $repeater_setting_key ) . '>';
				// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- WYSIWYG editor content parsed by Elementor
				echo $this->parse_text_editor( $item['content_wysiwyg'] );
				echo '</' . tag_escape( $tag ) . '>';
			} elseif ( 'blockquote' === $item_type ) {
				// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor widget rendering attributes
				echo '<blockquote ' . $this->get_render_attribute_string( $repeater_setting_key ) . '>';
				// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- WYSIWYG editor content parsed by Elementor
				echo $this->parse_text_editor( $item['content_wysiwyg'] );
				echo '</blockquote>';
			} elseif ( 'image' === $item_type && ! empty( $item['image']['url'] ) ) {
				$caption = ! empty( $item['image_caption'] ) ? $item['image_caption'] : '';
				// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor widget rendering attributes
				echo '<div ' . $this->get_render_attribute_string( $repeater_setting_key ) . '>';
				echo '<figure>';
				// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor image attachment markup
				echo \Elementor\Group_Control_Image_Size::get_attachment_image_html( $item, 'image', 'image' );
				if ( $caption ) {
					echo '<figcaption class="sifency-typo-caption">' . esc_html( $caption ) . '</figcaption>';
				}
				echo '</figure></div>';
			} elseif ( 'divider' === $item_type ) {
				// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor widget rendering attributes
				echo '<div ' . $this->get_render_attribute_string( $repeater_setting_key ) . '><hr class="sifency-typo-divider"></div>';
			}
		}

		echo '</div>';
	}
}
