<?php
if ( ! defined( 'ABSPATH' ) ) {
	exit; }
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Utils;
use Sifency\Traits\Sifency_Addons_Animation_Controls;
use Sifency\Traits\Sifency_Addons_Animation_Manager;
use Sifency\Traits\Sifency_Addons_Master_Typography;
use Sifency\Traits\Sifency_Addons_Help_Controls;
use Sifency\Classes\Sifency_Addons_Widget_Base;

class Sifency_Addons_Widget_Vertical_Text extends Sifency_Addons_Widget_Base {

	use Sifency_Addons_Animation_Controls;
	use Sifency_Addons_Master_Typography;
	use Sifency_Addons_Help_Controls;

	public function __construct( $data = array(), $args = null ) {
		parent::__construct( $data, $args );
		$this->wg_config = array(
			'name'           => 'sifency-vertical-text',
			'title'          => 'Sifency Vertical Text',
			'icon'           => 'eicon-v-align-top',
			'category'       => 'sifency-typography-widgets',
			'keywords'       => array( 'vertical', 'text', 'typography', 'rotation' ),
			'script_depends' => array( 'sifency-typeout-script', 'sifency-typed-lib-script' ),
			'style_depends'  => array( 'sifency-typeout-style', 'sifency-typo-style' ),
		);}
	protected function register_controls() {
		$this->start_controls_section(
			'section_content',
			array( 'label' => esc_html__( 'Text Content', 'sifency-addons' ) )
		);
		$this->add_control(
			'effect_type',
			array(
				'label'   => esc_html__( 'Text Effect', 'sifency-addons' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'normal',
				'options' => array(
					'normal'    => 'Normal',
					'typed'     => 'Typed (Typewriter)',
					'highlight' => 'Highlight (SVG)',
				),
			)
		);
		$this->add_control(
			'before_text',
			array(
				'label'     => esc_html__( 'Before Text', 'sifency-addons' ),
				'type'      => Controls_Manager::TEXT,
				'default'   => 'We are ',
				'condition' => array( 'effect_type' => array( 'typed', 'highlight' ) ),
			)
		);
		$this->add_control(
			'text',
			array(
				'label'       => esc_html__( 'Main Text', 'sifency-addons' ),
				'type'        => Controls_Manager::TEXTAREA,
				'default'     => 'VERTICAL TEXT',
				'description' => 'For Typed effect, enter strings separated by new lines.',
				'dynamic'     => array( 'active' => true ),
			)
		);
		$this->add_control(
			'after_text',
			array(
				'label'     => esc_html__( 'After Text', 'sifency-addons' ),
				'type'      => Controls_Manager::TEXT,
				'default'   => ' Creators',
				'condition' => array( 'effect_type' => array( 'typed', 'highlight' ) ),
			)
		);
		$this->add_control(
			'highlight_shape',
			array(
				'label'     => esc_html__( 'Highlight Shape', 'sifency-addons' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'circle',
				'options'   => array(
					'circle'        => 'Circle',
					'curly'         => 'Curly Line',
					'underline'     => 'Underline',
					'double'        => 'Double Underline',
					'diagonal'      => 'Diagonal',
					'strikethrough' => 'Strikethrough',
				),
				'condition' => array( 'effect_type' => 'highlight' ),
			)
		);
		$this->add_control(
			'highlight_color',
			array(
				'label'     => esc_html__( 'Highlight Color', 'sifency-addons' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#FFCC00',
				'selectors' => array( '{{WRAPPER}} .sifency-highlight-svg path' => 'stroke: {{VALUE}};' ),
				'condition' => array( 'effect_type' => 'highlight' ),
			)
		);
		$this->add_control(
			'type_speed',
			array(
				'label'     => esc_html__( 'Type Speed', 'sifency-addons' ),
				'type'      => Controls_Manager::NUMBER,
				'default'   => 50,
				'condition' => array( 'effect_type' => 'typed' ),
			)
		);
		$this->add_control(
			'back_speed',
			array(
				'label'     => esc_html__( 'Back Speed', 'sifency-addons' ),
				'type'      => Controls_Manager::NUMBER,
				'default'   => 30,
				'condition' => array( 'effect_type' => 'typed' ),
			)
		);
		$this->add_control(
			'loop',
			array(
				'label'     => esc_html__( 'Loop', 'sifency-addons' ),
				'type'      => Controls_Manager::SWITCHER,
				'default'   => 'yes',
				'condition' => array( 'effect_type' => 'typed' ),
			)
		);
		$this->add_control(
			'show_cursor',
			array(
				'label'     => esc_html__( 'Show Cursor', 'sifency-addons' ),
				'type'      => Controls_Manager::SWITCHER,
				'default'   => 'yes',
				'condition' => array( 'effect_type' => 'typed' ),
			)
		);
		$this->add_control(
			'link',
			array(
				'label'     => esc_html__( 'Link', 'sifency-addons' ),
				'type'      => Controls_Manager::URL,
				'dynamic'   => array( 'active' => true ),
				'separator' => 'before',
			)
		);
		$this->add_control(
			'html_tag',
			array(
				'label'   => esc_html__( 'HTML Tag', 'sifency-addons' ),
				'type'    => Controls_Manager::SELECT,
				'options' => array(
					'h1'   => 'H1',
					'h2'   => 'H2',
					'h3'   => 'H3',
					'h4'   => 'H4',
					'h5'   => 'H5',
					'h6'   => 'H6',
					'div'  => 'div',
					'span' => 'span',
					'p'    => 'p',
				),
				'default' => 'h2',
			)
		);
		$this->end_controls_section();
		$this->start_controls_section(
			'section_layout',
			array( 'label' => esc_html__( 'Orientation & Layout', 'sifency-addons' ) )
		);
		$this->add_responsive_control(
			'writing_mode',
			array(
				'label'     => esc_html__( 'Writing Mode', 'sifency-addons' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'vertical-rl',
				'options'   => array(
					'vertical-rl'   => 'Vertical Right-to-Left',
					'vertical-lr'   => 'Vertical Left-to-Right',
					'horizontal-tb' => 'Horizontal',
				),
				'selectors' => array( '{{WRAPPER}} .sifency-vt-container' => 'writing-mode: {{VALUE}}' ),
			)
		);
		$this->add_control(
			'orientation',
			array(
				'label'     => esc_html__( 'Character Orientation', 'sifency-addons' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'mixed',
				'options'   => array(
					'mixed'   => 'Rotated',
					'upright' => 'Upright',
				),
				'selectors' => array( '{{WRAPPER}} .sifency-vt-container' => 'text-orientation: {{VALUE}}' ),
				'condition' => array( 'writing_mode!' => 'horizontal-tb' ),
			)
		);

		$this->add_responsive_control(
			'rotate_180',
			array(
				'label'        => esc_html__( 'Rotate 180°', 'sifency-addons' ),
				'type'         => Controls_Manager::SWITCHER,
				'return_value' => 'rotate(180deg)',
				'default'      => '',
				'selectors'    => array( '{{WRAPPER}} .sifency-vt-container' => 'transform: {{VALUE}};' ),
			)
		);
		$this->add_responsive_control(
			'align_container',
			array(
				'label'     => esc_html__( 'Alignment', 'sifency-addons' ),
				'type'      => Controls_Manager::CHOOSE,
				'options'   => array(
					'flex-start' => array(
						'title' => 'Left',
						'icon'  => 'eicon-h-align-left',
					),
					'center'     => array(
						'title' => 'Center',
						'icon'  => 'eicon-h-align-center',
					),
					'flex-end'   => array(
						'title' => 'Right',
						'icon'  => 'eicon-h-align-right',
					),
				),
				'default'   => 'flex-start',
				'selectors' => array( '{{WRAPPER}} .sifency-vertical-text-wrapper' => 'justify-content: {{VALUE}};' ),
			)
		);

		$this->end_controls_section();
		$this->start_controls_section(
			'style_text',
			array(
				'label'     => esc_html__( 'Style', 'sifency-addons' ),
				'condition' => array( 'effect_type' => 'typed' ),
				'tab'       => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_control(
			'heading_cursor',
			array(
				'label'     => 'Typed Cursor',
				'type'      => Controls_Manager::HEADING,
				'condition' => array( 'effect_type' => 'typed' ),
			)
		);
		$this->add_control(
			'cursor_color',
			array(
				'label'     => 'Cursor Color',
				'type'      => Controls_Manager::COLOR,
				'selectors' => array( '{{WRAPPER}} .typed-cursor' => 'color: {{VALUE}};' ),
				'condition' => array( 'effect_type' => 'typed' ),
			)
		);
		$this->end_controls_section();
		$this->add_sifency_addons_help_controls();
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'   => 'heading_style',
				'label'    => esc_html__( 'Before Text', 'sifency-addons' ),
				'selector' => '.sifency-heading-style',
				'exclude'  => array( 'tabs', 'transition', 'bg', 'shadow', 'stroke', 'radius' ),
			)
		);
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'   => 'label_style',
				'label'    => 'Typeout Style',
				'selector' => '.sifency-label-style',
				'exclude'  => array( 'alignment' ),
			)
		);
		$this->add_sifency_addons_master_typography_controls(
			array(
				'prefix'   => 'content_style',
				'label'    => esc_html__( 'After Text', 'sifency-addons' ),
				'selector' => '.sifency-content-style',
				'exclude'  => array( 'tabs', 'transition', 'bg', 'shadow', 'stroke', 'radius' ),
			)
		);

		$this->add_Sifency_Addons_Animation_Controls();
		$this->update_control(
			'sifency_animation_target',
			array(
				'type'    => Controls_Manager::HIDDEN,
				'default' => 'wrapper',
			)
		);
	}

	protected function render_dom( array $context ) {
		$wrapper_id              = esc_attr( $context['dom_id'] );
		$settings                = $this->get_settings_for_display();
		$animation_manager       = new Sifency_Addons_Animation_Manager( $settings );
		$animation_wrapper_attrs = $animation_manager->get_wrapper_attributes();

		$this->add_render_attribute( 'wrapper', 'class', 'sifency-vertical-text-wrapper' );
		$this->add_render_attribute( 'text', 'class', 'sifency-vt-container' );

		// Effect Logic
		if ( 'typed' === $settings['effect_type'] ) {
			$strings      = explode( "\n", $settings['text'] );
			$json_strings = json_encode( $strings );

			$typed_config = array(
				'typeSpeed'  => $settings['type_speed'] ?? 50,
				'backSpeed'  => $settings['back_speed'] ?? 30,
				'loop'       => ( 'yes' === $settings['loop'] ),
				'showCursor' => ( 'yes' === $settings['show_cursor'] ),
				'strings'    => $strings,
			);

			$this->add_render_attribute( 'typed-span', 'class', 'sifency-typed-text sifency-label-style' );
			$this->add_render_attribute( 'typed-span', 'data-typed-settings', json_encode( $typed_config ) );
		}

		$tag = Utils::validate_html_tag( $settings['html_tag'] );
		?>
		<div id="<?php echo esc_attr( $wrapper_id ); ?>" <?php echo wp_kses_post( $this->get_render_attribute_string( 'wrapper' ) . $animation_wrapper_attrs ); ?>>
			
			<?php if ( ! empty( $settings['link']['url'] ) ) : ?>
				<a href="<?php echo esc_url( $settings['link']['url'] ); ?>" class="sifency-vt-link">
			<?php endif; ?>

			<<?php echo wp_kses_post( $tag ); ?> <?php echo wp_kses_post( $this->get_render_attribute_string( 'text' ) ); ?>>
				
				<?php if ( 'typed' === $settings['effect_type'] ) : ?>
					<span class="sifency-before-text sifency-heading-style"><?php echo esc_html( $settings['before_text'] ); ?></span>
					<span <?php echo wp_kses_post( $this->get_render_attribute_string( 'typed-span' ) ); ?>></span>
					<span class="sifency-after-text sifency-heading-style"><?php echo esc_html( $settings['after_text'] ); ?></span>
				
				<?php elseif ( 'highlight' === $settings['effect_type'] ) : ?>
					<span class="sifency-before-text sifency-heading-style"><?php echo esc_html( $settings['before_text'] ); ?></span>
					<span class="sifency-highlight-wrap shape-<?php echo esc_attr( $settings['highlight_shape'] ); ?>">
						<span class="sifency-highlight-text sifency-content-style"><?php echo esc_html( $settings['text'] ); ?></span>
						<?php $this->render_highlight_svg( $settings['highlight_shape'] ); ?>
					</span>
					<span class="sifency-after-text sifency-heading-style"><?php echo esc_html( $settings['after_text'] ); ?></span>

				<?php else : ?>
					<div class="sifency-heading-style"><?php echo wp_kses_post( $settings['text'] ); ?></div>
				<?php endif; ?>

			</<?php echo wp_kses_post( $tag ); ?>>

			<?php if ( ! empty( $settings['link']['url'] ) ) : ?>
				</a>
			<?php endif; ?>

		</div>
		<?php
	}

	protected function render_highlight_svg( $shape ) {
		// Simple SVG paths for the highlight effect
		$svg = '';
		switch ( $shape ) {
			case 'circle':
				$svg = '<svg class="sifency-highlight-svg" viewBox="0 0 500 150" preserveAspectRatio="none"><path d="M497.4,23.9C301.6,40,155.9,80.6,4,144.4"></path><path d="M14.1,27.6c204.5,20.3,393.8,74,467.3,111.7"></path></svg>';
				break;
			case 'curly':
				$svg = '<svg class="sifency-highlight-svg" viewBox="0 0 500 150" preserveAspectRatio="none"><path d="M3,146.1c17.1-8.8,33.5-17.8,51.4-17.8c15.6,0,17.1,18.1,30.2,18.1c22.9,0,36-18.6,53.9-18.6 c17.1,0,21.3,18.5,37.5,18.5c21.3,0,31.8-18.6,49-18.6c22.1,0,18.8,18.8,36.8,18.8c18.8,0,37.5-18.6,49-18.6c20.4,0,17.1,19,36.8,19 c22.9,0,36.8-20.6,54.7-18.6c17.7,1.4,7.1,19,28.6,19c31.1,0,44.9-20.8,65.4-19"></path></svg>';
				break;
			case 'underline':
				$svg = '<svg class="sifency-highlight-svg" viewBox="0 0 500 10" preserveAspectRatio="none"><path d="M5,5 L495,5"></path></svg>';
				break;
			default:
				// Default simple line
				$svg = '<svg class="sifency-highlight-svg" viewBox="0 0 500 10" preserveAspectRatio="none"><path d="M5,5 L495,5"></path></svg>';
		}
		echo esc_html( $svg );
	}
}
