<?php
class PZY_Newsletter extends \Elementor\Widget_Base {

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

    public function get_title() {
        return __( 'خبرنامه', 'pezeshkyar' );
    }

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

    public function get_keywords()
    {
        return ['pzy', 'newsletter'];
    }

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

    public function get_script_depends()
    {
        return ['pzy-newsletter'];
    }

    protected function _register_controls() {
        $this->start_controls_section(
            'content_section',
            [
                'label' => __( 'تنطیمات خبرنامه', 'pezeshkyar' ),
                'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
            ]
        );
        $this->add_control(
            'input_placeholder',
            [
                'label' => __( 'متن راهنمای فیلد شماره تلفن / ایمیل', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::TEXT,
                'default' => __( 'شماره تماس یا ایمیل خود را وارد کنید' , 'pezeshkyar' ),
            ]
        );
        $this->add_control(
            'button_text',
            [
                'label' => __( 'متن دکمه ارسال شماره تلفن / ایمیل', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::TEXT,
                'default' => __( 'ثبت' , 'pezeshkyar' ),
            ]
        );
        $this->add_control(
            'button_icon',
            [
                'label' => esc_html__( 'آیکن دکمه ارسال شماره تلفن / ایمیل', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::ICONS,
            ]
        );
        $this->end_controls_section();

        $this->start_controls_section(
            'style_section',
            [
                'label' => __( 'استایل دهی خبرنامه', 'pezeshkyar' ),
                'tab' => \Elementor\Controls_Manager::TAB_STYLE,
            ]
        );
        $this->add_control(
            'gap',
            [
                'label' => esc_html__( 'فاصله بین فیلدهای فرم', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
                'default' => [
                    'unit' => 'px',
                    'size' => 24,
                ],
                'selectors' => [
                    '{{WRAPPER}} .pzy-content-area' => 'gap: {{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->add_control(
            'input_heading',
            [
                'label' => esc_html__( 'فیلد شماره تلفن / ایمیل', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::HEADING,
                'separator' => 'before',
            ]
        );
        $this->add_group_control(
            \Elementor\Group_Control_Typography::get_type(),
            [
                'name' => 'input_typography',
                'selector' => '{{WRAPPER}} input',
            ]
        );
        $this->add_control(
            'input_text_color',
            [
                'label' => esc_html__( 'رنگ متن', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} input' => 'color: {{VALUE}}',
                ],
            ]
        );
        $this->add_control(
            'input_bg_color',
            [
                'label' => esc_html__( 'رنگ پس زمینه', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} input' => 'background-color: {{VALUE}}',
                ],
            ]
        );
        $this->add_group_control(
            \Elementor\Group_Control_Border::get_type(),
            [
                'name' => 'input_border',
                'selector' => '{{WRAPPER}} input',
            ]
        );
        $this->add_control(
            'input_radius',
            [
                'label' => esc_html__( 'شعاع', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
                'selectors' => [
                    '{{WRAPPER}} input' => 'border-radius: {{SIZE}}{{UNIT}};',
                ],
            ]
        );
        $this->add_control(
            'input_padding',
            [
                'label' => esc_html__( 'فاصله داخلی', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::DIMENSIONS,
                'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
                'selectors' => [
                    '{{WRAPPER}} input' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );
        $this->add_control(
            'input_height',
            [
                'label' => esc_html__( 'ارتفاع', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
                'selectors' => [
                    '{{WRAPPER}} input' => 'height: {{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->add_control(
            'button_heading',
            [
                'label' => esc_html__( 'دکمه ارسال شماره تلفن / ایمیل', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::HEADING,
                'separator' => 'before',
            ]
        );
        $this->add_group_control(
            \Elementor\Group_Control_Typography::get_type(),
            [
                'name' => 'button_typography',
                'selector' => '{{WRAPPER}} button',
            ]
        );
        $this->add_control(
            'button_text_color',
            [
                'label' => esc_html__( 'رنگ متن', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} button' => 'color: {{VALUE}}',
                ],
            ]
        );
        $this->add_control(
            'button_bg_color',
            [
                'label' => esc_html__( 'رنگ پس زمینه', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} button' => 'background-color: {{VALUE}}',
                ],
            ]
        );
        $this->add_group_control(
            \Elementor\Group_Control_Border::get_type(),
            [
                'name' => 'button_border',
                'selector' => '{{WRAPPER}} button',
            ]
        );
        $this->add_control(
            'button_radius',
            [
                'label' => esc_html__( 'شعاع', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
                'selectors' => [
                    '{{WRAPPER}} button' => 'border-radius: {{SIZE}}{{UNIT}};',
                ],
            ]
        );
        $this->add_control(
            'button_padding',
            [
                'label' => esc_html__( 'فاصله داخلی', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::DIMENSIONS,
                'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
                'selectors' => [
                    '{{WRAPPER}} button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );
        $this->add_control(
            'button_height',
            [
                'label' => esc_html__( 'ارتفاع', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
                'selectors' => [
                    '{{WRAPPER}} button' => 'height: {{SIZE}}{{UNIT}};',
                ],
            ]
        );
        $this->add_control(
            'button_gap',
            [
                'label' => esc_html__( 'فاصله متن و آیکن', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::SLIDER,
                'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
                'default' => [
                    'unit' => 'px',
                    'size' => 8,
                ],
                'selectors' => [
                    '{{WRAPPER}} button' => 'gap: {{SIZE}}{{UNIT}};',
                ],
            ]
        );
        $this->add_control(
            'message_heading',
            [
                'label' => esc_html__( 'پیام ها', 'pezeshkyar' ),
                'type' => \Elementor\Controls_Manager::HEADING,
                'separator' => 'before',
            ]
        );
        $this->add_group_control(
            \Elementor\Group_Control_Typography::get_type(),
            [
                'name' => 'messages_typography',
                'selector' => '{{WRAPPER}} .pzy-newsletter-message',
            ]
        );
        $this->add_control(
            'messages_padding',
            [
                'label' => esc_html__('فاصله داخلی', 'pezeshkyar'),
                'type' => \Elementor\Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%', 'em', 'rem', 'custom'],
                'selectors' => [
                    '{{WRAPPER}} .pzy-newsletter-message' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );
        $this->add_control(
            'message_success_color',
            [
                'label' => esc_html__('رنگ پیام موفق', 'pezeshkyar'),
                'type' => \Elementor\Controls_Manager::COLOR,
                'default' => 'green',
                'selectors' => [
                    '{{WRAPPER}} .pzy-success-message' => 'color: {{VALUE}}',
                ],
            ]
        );
        $this->add_control(
            'message_error_color',
            [
                'label' => esc_html__('رنگ پیام ناموفق', 'pezeshkyar'),
                'type' => \Elementor\Controls_Manager::COLOR,
                'default' => 'red',
                'selectors' => [
                    '{{WRAPPER}} .pzy-error-message' => 'color: {{VALUE}}',
                ],
            ]
        );
        $this->end_controls_section();
    }

    protected function render() {
        ?>
        <div class="newsletter-widget">
            <form class="newsletter-form">
                <div class="pzy-content-area pzy-d-flex pzy-flex-row-wrap">
                    <input class="pzy-flex-1" type="text" name="contact" required placeholder="<?php echo $this->get_settings_for_display('input_placeholder')?>">
                    <button class="pzy-d-flex pzy-flex-row-wrap pzy-align-items-center">
                        <?php echo $this->get_settings_for_display('button_text')?>
                        <?php if ($button_icon = $this->get_settings_for_display('button_icon')) \Elementor\Icons_Manager::render_icon( $button_icon, [ 'aria-hidden' => 'true' ] );?>
                    </button>
                </div>
                <div class="pzy-newsletter-message pzy-hide"></div>
            </form>
        </div>
        <?php
    }
}