<?php

namespace Calio\Widgets;

use Elementor\Controls_Manager;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Text_Shadow;
use Elementor\Group_Control_Text_Stroke;
use Elementor\Group_Control_Typography;
use Elementor\Icons_Manager;

if (!defined('ABSPATH')) {
    exit;
}

/**
 * Call Out widget with title, description and CTA button.
 */
class CallOutWidget extends BaseWidget
{
    public function get_name(): string
    {
        return 'calio-call-out';
    }

    public function get_title(): string
    {
        return esc_html__('Call Out', 'calio-addon');
    }

    public function get_icon(): string
    {
        return 'eicon-call-to-action';
    }

    public function get_style_depends(): array
    {
        return $this->resolve_widget_style_depends('calio-widget-call-out');
    }

    public function get_keywords(): array
    {
        return array_merge(parent::get_keywords(), ['callout', 'action']);
    }

    protected function register_controls(): void
    {
        $this->start_controls_section(
            'section_content_layout',
            [
                'label' => esc_html__('Layout', 'calio-addon'),
            ]
        );

        $this->add_control(
            'title',
            [
                'label' => esc_html__('Title', 'calio-addon'),
                'type' => Controls_Manager::TEXT,
                'dynamic' => ['active' => true],
                'default' => esc_html__('This is your call to action title', 'calio-addon'),
                'placeholder' => esc_html__('Call to action title', 'calio-addon'),
                'label_block' => true,
            ]
        );

        $this->add_control(
            'description',
            [
                'label' => esc_html__('Text', 'calio-addon'),
                'type' => Controls_Manager::TEXTAREA,
                'dynamic' => ['active' => true],
                'default' => esc_html__('A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.', 'calio-addon'),
                'placeholder' => esc_html__('Call to action description', 'calio-addon'),
                'label_block' => true,
            ]
        );

        $this->add_control(
            'title_size',
            [
                'label' => esc_html__('Title HTML Tag', 'calio-addon'),
                'type' => Controls_Manager::SELECT,
                'default' => 'h3',
                'options' => $this->title_tags(),
            ]
        );

        $this->add_responsive_control(
            'text_alignment',
            [
                'label' => esc_html__('Text Alignment', 'calio-addon'),
                'type' => Controls_Manager::CHOOSE,
                'options' => [
                    'left' => [
                        'title' => esc_html__('Left', 'calio-addon'),
                        'icon' => 'eicon-text-align-left',
                    ],
                    'center' => [
                        'title' => esc_html__('Center', 'calio-addon'),
                        'icon' => 'eicon-text-align-center',
                    ],
                    'right' => [
                        'title' => esc_html__('Right', 'calio-addon'),
                        'icon' => 'eicon-text-align-right',
                    ],
                    'justify' => [
                        'title' => esc_html__('Justify', 'calio-addon'),
                        'icon' => 'eicon-text-align-justify',
                    ],
                ],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout *' => 'text-align: {{VALUE}};',
                ],
            ]
        );

        $this->end_controls_section();

        $this->start_controls_section(
            'section_content_button',
            [
                'label' => esc_html__('Button', 'calio-addon'),
            ]
        );

        $this->add_control(
            'button_text',
            [
                'label' => esc_html__('Text', 'calio-addon'),
                'type' => Controls_Manager::TEXT,
                'dynamic' => ['active' => true],
                'default' => esc_html__('Click Here', 'calio-addon'),
            ]
        );

        $this->add_control(
            'link',
            [
                'label' => esc_html__('Link', 'calio-addon'),
                'type' => Controls_Manager::URL,
                'dynamic' => ['active' => true],
                'placeholder' => 'http://your-link.com',
                'default' => [
                    'url' => '#',
                ],
            ]
        );

        $this->add_control(
            'button_align',
            [
                'label' => esc_html__('Position', 'calio-addon'),
                'type' => Controls_Manager::SELECT,
                'default' => 'right',
                'options' => [
                    'left' => esc_html__('Left', 'calio-addon'),
                    'right' => esc_html__('Right', 'calio-addon'),
                    'center' => esc_html__('Center', 'calio-addon'),
                ],
            ]
        );

        $this->add_control(
            'callout_icon',
            [
                'label' => esc_html__('Icon', 'calio-addon'),
                'type' => Controls_Manager::ICONS,
                'fa4compatibility' => 'icon',
                'label_block' => false,
                'skin' => 'inline',
            ]
        );

        $this->add_control(
            'icon_align',
            [
                'label' => esc_html__('Icon Position', 'calio-addon'),
                'type' => Controls_Manager::SELECT,
                'default' => 'right',
                'options' => [
                    'left' => esc_html__('Left', 'calio-addon'),
                    'right' => esc_html__('Right', 'calio-addon'),
                ],
                'condition' => [
                    'callout_icon[value]!' => '',
                ],
            ]
        );

        $this->add_responsive_control(
            'icon_indent',
            [
                'label' => esc_html__('Icon Spacing', 'calio-addon'),
                'type' => Controls_Manager::SLIDER,
                'default' => [
                    'size' => 8,
                ],
                'range' => [
                    'px' => [
                        'max' => 50,
                    ],
                ],
                'condition' => [
                    'callout_icon[value]!' => '',
                ],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout .calio-flex-align-right' => is_rtl() ? 'margin-right: {{SIZE}}{{UNIT}};' : 'margin-left: {{SIZE}}{{UNIT}};',
                    '{{WRAPPER}} .calio-callout .calio-flex-align-left' => is_rtl() ? 'margin-left: {{SIZE}}{{UNIT}};' : 'margin-right: {{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->add_control(
            'button_css_id',
            [
                'label' => esc_html__('Button ID', 'calio-addon'),
                'type' => Controls_Manager::TEXT,
                'dynamic' => ['active' => true],
                'default' => '',
                'description' => esc_html__('Use unique id without #. Example: my-button', 'calio-addon'),
                'separator' => 'before',
            ]
        );

        $this->end_controls_section();

        $this->start_controls_section(
            'section_style_title',
            [
                'label' => esc_html__('Title', 'calio-addon'),
                'tab' => Controls_Manager::TAB_STYLE,
                'condition' => [
                    'title!' => '',
                ],
            ]
        );

        $this->add_control(
            'title_color',
            [
                'label' => esc_html__('Color', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-title' => 'color: {{VALUE}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Typography::get_type(),
            [
                'name' => 'title_typography',
                'selector' => '{{WRAPPER}} .calio-callout-title',
            ]
        );

        $this->add_group_control(
            Group_Control_Text_Shadow::get_type(),
            [
                'name' => 'text_shadow',
                'selector' => '{{WRAPPER}} .calio-callout-title',
            ]
        );

        $this->add_group_control(
            Group_Control_Text_Stroke::get_type(),
            [
                'name' => 'title_text_stroke',
                'selector' => '{{WRAPPER}} .calio-callout-title',
            ]
        );

        $this->end_controls_section();

        $this->start_controls_section(
            'section_style_text',
            [
                'label' => esc_html__('Text', 'calio-addon'),
                'tab' => Controls_Manager::TAB_STYLE,
                'condition' => [
                    'description!' => '',
                ],
            ]
        );

        $this->add_control(
            'description_color',
            [
                'label' => esc_html__('Color', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-description' => 'color: {{VALUE}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Typography::get_type(),
            [
                'name' => 'description_typography',
                'selector' => '{{WRAPPER}} .calio-callout-description',
            ]
        );

        $this->add_responsive_control(
            'description_spacing',
            [
                'label' => esc_html__('Spacing', 'calio-addon'),
                'type' => Controls_Manager::SLIDER,
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-description' => 'margin-top: {{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->end_controls_section();

        $this->start_controls_section(
            'section_style_button',
            [
                'label' => esc_html__('Button', 'calio-addon'),
                'tab' => Controls_Manager::TAB_STYLE,
                'condition' => [
                    'button_text!' => '',
                ],
            ]
        );

        $this->add_control(
            'attention_button',
            [
                'label' => esc_html__('Attention', 'calio-addon'),
                'type' => Controls_Manager::SWITCHER,
            ]
        );

        $this->start_controls_tabs('tabs_button_style');

        $this->start_controls_tab(
            'tab_button_normal',
            [
                'label' => esc_html__('Normal', 'calio-addon'),
            ]
        );

        $this->add_control(
            'button_text_color',
            [
                'label' => esc_html__('Color', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button' => 'color: {{VALUE}};',
                ],
            ]
        );

        $this->add_control(
            'button_background_color',
            [
                'label' => esc_html__('Background', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button' => 'background-color: {{VALUE}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Background::get_type(),
            [
                'name' => 'button_adv_background',
                'types' => ['gradient'],
                'selector' => '{{WRAPPER}} .calio-callout-button',
            ]
        );

        $this->add_group_control(
            Group_Control_Border::get_type(),
            [
                'name' => 'button_border',
                'selector' => '{{WRAPPER}} .calio-callout-button',
                'separator' => 'before',
            ]
        );

        $this->add_responsive_control(
            'button_border_radius',
            [
                'label' => esc_html__('Border Radius', 'calio-addon'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%'],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->add_responsive_control(
            'button_text_padding',
            [
                'label' => esc_html__('Padding', 'calio-addon'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', 'em', '%'],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->add_responsive_control(
            'button_margin',
            [
                'label' => esc_html__('Margin', 'calio-addon'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', 'em', '%'],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button-wrap' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Box_Shadow::get_type(),
            [
                'name' => 'button_box_shadow',
                'selector' => '{{WRAPPER}} .calio-callout-button',
            ]
        );

        $this->add_group_control(
            Group_Control_Typography::get_type(),
            [
                'name' => 'button_typography',
                'selector' => '{{WRAPPER}} .calio-callout-button',
            ]
        );

        $this->end_controls_tab();

        $this->start_controls_tab(
            'tab_button_hover',
            [
                'label' => esc_html__('Hover', 'calio-addon'),
            ]
        );

        $this->add_control(
            'button_hover_color',
            [
                'label' => esc_html__('Text Color', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button:hover' => 'color: {{VALUE}};',
                ],
            ]
        );

        $this->add_control(
            'button_background_hover_color',
            [
                'label' => esc_html__('Background', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button:hover' => 'background-color: {{VALUE}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Background::get_type(),
            [
                'name' => 'button_adv_background_hover',
                'types' => ['gradient'],
                'selector' => '{{WRAPPER}} .calio-callout-button:hover',
            ]
        );

        $this->add_control(
            'button_hover_border_color',
            [
                'label' => esc_html__('Border Color', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'condition' => [
                    'button_border_border!' => '',
                ],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button:hover' => 'border-color: {{VALUE}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Box_Shadow::get_type(),
            [
                'name' => 'button_hover_box_shadow',
                'selector' => '{{WRAPPER}} .calio-callout-button:hover',
            ]
        );

        $this->add_control(
            'button_hover_animation',
            [
                'label' => esc_html__('Animation', 'calio-addon'),
                'type' => Controls_Manager::HOVER_ANIMATION,
            ]
        );

        $this->end_controls_tab();
        $this->end_controls_tabs();
        $this->end_controls_section();

        $this->start_controls_section(
            'section_style_icon',
            [
                'label' => esc_html__('Icon', 'calio-addon'),
                'tab' => Controls_Manager::TAB_STYLE,
                'condition' => [
                    'callout_icon[value]!' => '',
                ],
            ]
        );

        $this->start_controls_tabs('tabs_callout_icon_style');
        $this->start_controls_tab(
            'tab_callout_icon_normal',
            [
                'label' => esc_html__('Normal', 'calio-addon'),
            ]
        );

        $this->add_control(
            'callout_button_icon_color',
            [
                'label' => esc_html__('Color', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button-icon' => 'color: {{VALUE}};',
                    '{{WRAPPER}} .calio-callout-button-icon svg' => 'fill: {{VALUE}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Background::get_type(),
            [
                'name' => 'callout_icon_background',
                'selector' => '{{WRAPPER}} .calio-callout-button-icon',
            ]
        );

        $this->add_group_control(
            Group_Control_Border::get_type(),
            [
                'name' => 'callout_icon_border',
                'selector' => '{{WRAPPER}} .calio-callout-button-icon',
            ]
        );

        $this->add_responsive_control(
            'callout_icon_radius',
            [
                'label' => esc_html__('Border Radius', 'calio-addon'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%'],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button-icon' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->add_responsive_control(
            'callout_icon_padding',
            [
                'label' => esc_html__('Padding', 'calio-addon'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', 'em', '%'],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->add_responsive_control(
            'callout_icon_size',
            [
                'label' => esc_html__('Icon Size', 'calio-addon'),
                'type' => Controls_Manager::SLIDER,
                'range' => [
                    'px' => [
                        'min' => 10,
                        'max' => 100,
                    ],
                ],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button-icon' => 'font-size: {{SIZE}}{{UNIT}};',
                    '{{WRAPPER}} .calio-callout-button-icon svg' => 'width: {{SIZE}}{{UNIT}};height: {{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->end_controls_tab();

        $this->start_controls_tab(
            'tab_callout_icon_hover',
            [
                'label' => esc_html__('Hover', 'calio-addon'),
            ]
        );

        $this->add_control(
            'callout_button_hover_icon_color',
            [
                'label' => esc_html__('Color', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button:hover .calio-callout-button-icon' => 'color: {{VALUE}};',
                    '{{WRAPPER}} .calio-callout-button:hover .calio-callout-button-icon svg' => 'fill: {{VALUE}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Background::get_type(),
            [
                'name' => 'callout_icon_hover_background',
                'selector' => '{{WRAPPER}} .calio-callout-button:hover .calio-callout-button-icon',
            ]
        );

        $this->add_control(
            'icon_hover_border_color',
            [
                'label' => esc_html__('Border Color', 'calio-addon'),
                'type' => Controls_Manager::COLOR,
                'condition' => [
                    'callout_icon_border_border!' => '',
                ],
                'selectors' => [
                    '{{WRAPPER}} .calio-callout-button:hover .calio-callout-button-icon' => 'border-color: {{VALUE}};',
                ],
            ]
        );

        $this->end_controls_tab();
        $this->end_controls_tabs();
        $this->end_controls_section();
    }

    protected function render(): void
    {
        $settings = $this->get_settings_for_display();

        $button_align = (string) ($settings['button_align'] ?? 'right');
        if (!in_array($button_align, ['left', 'right', 'center'], true)) {
            $button_align = 'right';
        }

        $animation = '';
        if (!empty($settings['button_hover_animation'])) {
            $hover_animation = preg_replace('/[^A-Za-z0-9_-]/', '', (string) $settings['button_hover_animation']);
            if ($hover_animation !== '') {
                $animation = ' elementor-animation-' . $hover_animation;
            }
        }

        $attention = (($settings['attention_button'] ?? '') === 'yes') ? ' calio-attention-button' : '';

        $this->add_render_attribute('callout_title', 'class', 'calio-callout-title');

        $callout_classes = ['calio-callout', 'calio-callout-button-align-' . $button_align];
        if ($button_align !== 'center') {
            $callout_classes[] = 'calio-grid';
            $callout_classes[] = 'calio-grid-large';
            $callout_classes[] = 'calio-flex-middle';
        }
        $this->add_render_attribute('callout', 'class', $callout_classes);

        $icon_align = (string) ($settings['icon_align'] ?? 'right');
        if (in_array($icon_align, ['left', 'right'], true)) {
            $this->add_render_attribute('callout-button', 'class', 'calio-flex calio-flex-middle');
        }

        if (!empty($settings['button_css_id'])) {
            $button_id = preg_replace('/[^A-Za-z0-9_-]/', '', (string) $settings['button_css_id']);
            if ($button_id !== '') {
                $this->add_render_attribute('custom-button', 'id', $button_id);
            }
        }

        if (!empty($settings['link']['url'])) {
            $this->add_link_attributes('custom-button', $settings['link']);
        }

        $this->add_render_attribute('custom-button', 'class', 'calio-callout-button' . $animation . $attention);

        if (!isset($settings['icon']) && !Icons_Manager::is_migration_allowed()) {
            $settings['icon'] = 'fas fa-arrow-right';
        }

        $migrated = isset($settings['__fa4_migrated']['callout_icon']);
        $is_new = empty($settings['icon']) && Icons_Manager::is_migration_allowed();

        echo '<div ' . wp_kses_post($this->get_render_attribute_string('callout')) . '>';
        echo '<div class="calio-width-expand calio-first-column">';

        if (!empty($settings['title'])) {
            $tag = $this->sanitize_tag((string) ($settings['title_size'] ?? 'h3'));
            echo '<' . tag_escape($tag) . ' ' . wp_kses_post($this->get_render_attribute_string('callout_title')) . '>';
            echo esc_html((string) $settings['title']);
            echo '</' . tag_escape($tag) . '>';
        }

        if (!empty($settings['description'])) {
            echo '<div class="calio-callout-description">' . esc_html((string) $settings['description']) . '</div>';
        }

        echo '</div>';
        echo '<div class="calio-callout-button-wrap calio-width-auto-m">';
        echo '<a ' . wp_kses_post($this->get_render_attribute_string('custom-button')) . '>';
        echo '<span ' . wp_kses_post($this->get_render_attribute_string('callout-button')) . '>';
        echo esc_html((string) ($settings['button_text'] ?? ''));

        if (!empty($settings['callout_icon']['value'])) {
            echo '<span class="calio-callout-button-icon calio-flex-align-' . esc_attr($icon_align) . '">';

            if ($is_new || $migrated) {
                echo wp_kses_post($this->get_icon_markup($settings['callout_icon'], ['class' => 'fa-fw']));
            } elseif (!empty($settings['icon'])) {
                echo '<i class="' . esc_attr((string) $settings['icon']) . '" aria-hidden="true"></i>';
            }

            echo '</span>';
        }

        echo '</span>';
        echo '</a>';
        echo '</div>';
        echo '</div>';
    }

    /**
     * @return array<string, string>
     */
    private function title_tags(): array
    {
        return [
            'h1' => 'H1',
            'h2' => 'H2',
            'h3' => 'H3',
            'h4' => 'H4',
            'h5' => 'H5',
            'h6' => 'H6',
            'div' => 'DIV',
            'span' => 'SPAN',
            'p' => 'P',
        ];
    }

    private function sanitize_tag(string $tag): string
    {
        return array_key_exists($tag, $this->title_tags()) ? $tag : 'div';
    }
}
