<?php

namespace Bookingor\Integrations\Elementor;

use Bookingor;
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Control_Media;
use Elementor\Control_Color;


class BookingorElementorButtonWidget extends Widget_Base
{
    public $plugin_name = 'bookingor';
    public $version =   BOOKINGOR_VERSION;
    public function get_name()
    {
        return 'bookingor_button_widget';
    }

    public function get_title()
    {
        return __('Bookingor Button', 'bookingor');
    }

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

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

    protected function _register_controls()
    {
        $this->start_controls_section(
            'section_button',
            [
                'label' => __('Button Settings', 'bookingor'),
            ]
        );

        $this->add_control(
            'button_text',
            [
                'label' => __('Button Text', 'bookingor'),
                'type' => Controls_Manager::TEXT,
                'default' => __('Book Appointment', 'bookingor'),
            ]
        );

        // $this->add_control(
        //     'button_icon',
        //     [
        //         'label' => __('Button Icon', 'bookingor'),
        //         'type' => Controls_Manager::ICONS,

        //         'options' => [
        //             'none' => __('None', 'bookingor'),
        //             'svg' => __('SVG Library', 'bookingor'),
        //         ],
        //     ]
        // );

        $this->add_control(
            'button_bookingor_design',
            [
                'label' => __('Bookingor Designs', 'bookingor'),
                'type' => Controls_Manager::SELECT,
                'options' => [
                    'design_one' => __('Design 1', 'bookingor'),
                    'design_two' => __('Design 2', 'bookingor'),
                    'design_three' => __('Design 3', 'bookingor'),
                    'design_four' => __('Design 4', 'bookingor'),
                    'design_five' => __('Design 5', 'bookingor'),
                    'design_six' => __('Design 6', 'bookingor'),
                ],
                'default' => 'design_one',
            ]
        );

        $this->end_controls_section();

        // Style Section
        $this->start_controls_section(
            'section_style',
            [
                'label' => __('Button Style', 'bookingor'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_group_control(
            Group_Control_Typography::get_type(),
            [
                'name' => 'typography',
                'label' => __('Typography', 'bookingor'),
                'selector' => '{{WRAPPER}} .elementor-button',
            ]
        );

        $this->add_group_control(
            Group_Control_Border::get_type(),
            [
                'name' => 'border',
                'label' => __('Border', 'bookingor'),
                'selector' => '{{WRAPPER}} .elementor-button',
            ]
        );

        $this->add_group_control(
            Group_Control_Box_Shadow::get_type(),
            [
                'name' => 'box_shadow',
                'label' => __('Box Shadow', 'bookingor'),
                'selector' => '{{WRAPPER}} .elementor-button',
            ]
        );

        $this->add_group_control(
            Group_Control_Background::get_type(),
            [
                'name' => 'background',
                'label' => __('Background', 'bookingor'),
                'types' => ['classic', 'gradient'],
                'selector' => '{{WRAPPER}} .elementor-button',
                'default' => [
                    'background_type' => 'classic',
                    'color' => '#3182ce',
                ],
            ]
        );

        $this->add_control(
            'text_color',
            [
                'label' => __('Text Color', 'bookingor'),
                'type' => Controls_Manager::COLOR,
                'default' => '', // add a default value

            ]
        );
        $this->add_control(
            'button_size',
            [
                'label' => __('Button Size', 'bookingor'),
                'type' => Controls_Manager::SELECT,
                'options' => [
                    'small' => __('Small', 'bookingor'),
                    'medium' => __('Medium', 'bookingor'),
                    'large' => __('Large', 'bookingor'),
                ],
                'default' => 'medium', // add a default value
            ]
        );

        $this->add_control(
            'padding',
            [
                'label' => __('Padding', 'bookingor'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%', 'em'],
                'selectors' => [
                    '{{WRAPPER}} .elementor-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->end_controls_section();
    }

    protected function render()
    {
        $settings = $this->get_settings_for_display();
        $text_color = $settings['text_color'] ?? ''; // provide a default value if not defined
        $ajax_nonce = wp_create_nonce('bookingor_ajax_nonce');
        $base_url = plugin_dir_url(dirname(dirname(__FILE__)));
        ?>
        <script type="text/javascript">
            if (typeof TCN_BIND_FRONT === 'undefined') {
                var TCN_BIND_FRONT = {
                    GET_URL: '<?php echo esc_url(admin_url('admin-ajax.php')); ?>',
                    nonce: '<?php echo esc_js($ajax_nonce); ?>'
                };
            }
        </script>
        <?php

        if (\Elementor\Plugin::$instance->editor->is_edit_mode()) {
            wp_enqueue_script('jquery-ui-slider');
            $widget_js_url = '';
            $widget_css_urls = [];
            if (isset($settings['button_bookingor_design'])) {
                switch ($settings['button_bookingor_design']) {
                    case 'design_one':
                        $widget_js_url = $base_url . 'Frontend/assets/js/design-1/design-1.js';
                        $widget_css_urls[] = $base_url . 'Frontend/assets/css/design-1/design-1.css';
                        break;
                    case 'design_two':
                        $widget_js_url = $base_url . 'Frontend/assets/js/design-2/design-2.js';
                        $widget_css_urls[] = $base_url . 'Frontend/assets/css/design-2/design-2.css';
                        break;
                    case 'design_three':
                        $widget_js_url = $base_url . 'Frontend/assets/js/design-3/design-3.js';
                        $widget_css_urls[] = $base_url . 'Frontend/assets/css/design-3/design-3.css';
                        break;
                    case 'design_four':
                        $widget_js_url = $base_url . 'Frontend/assets/js/design-4/design-4.js';
                        $widget_css_urls[] = $base_url . 'Frontend/assets/css/design-4/design-4.css';
                        break;
                    case 'design_five':
                        $widget_js_url = $base_url . 'Frontend/assets/js/design-5/design-5.js';
                        $widget_css_urls[] = $base_url . 'Frontend/assets/css/design-5/design-5.css';
                        break;
                    case 'design_six':
                        $widget_js_url = $base_url . 'Frontend/assets/js/design-6/design-6.js';
                        $widget_css_urls[] = $base_url . 'Frontend/assets/css/design-6/design-6.css';
                        break;
                }
            }

            $js_ver = time();
            $ajax_load_url = $base_url . 'Frontend/assets/js/design-ajax-load.js?ver=' . $js_ver;
            $widget_js_url_ver = !empty($widget_js_url) ? $widget_js_url . '?ver=' . $js_ver : '';
            ?>
            <script type="text/javascript">
                (function($) {
                    <?php foreach ($widget_css_urls as $css_url) : ?>
                        if ($('link[href^="<?php echo esc_url($css_url); ?>"]').length === 0) {
                            $('<link rel="stylesheet" type="text/css" href="<?php echo esc_url($css_url); ?>?ver=<?php echo $js_ver; ?>">').appendTo('head');
                        }
                    <?php endforeach; ?>

                    function loadScript(src, callback) {
                        var script = document.createElement('script');
                        script.type = 'text/javascript';
                        script.src = src;
                        script.onload = callback;
                        document.body.appendChild(script);
                    }
                    
                    loadScript('<?php echo esc_url($ajax_load_url); ?>', function() {
                        <?php if (!empty($widget_js_url_ver)) : ?>
                            loadScript('<?php echo esc_url($widget_js_url_ver); ?>');
                        <?php endif; ?>
                    });
                })(jQuery);
            </script>
            <?php
        }

        echo '<div type="button" class="elementor-button bookingor-shw-backdrop" data-bs-toggle="modal" data-bs-target="#bookingorModal" style=" cursor: pointer;">' . esc_html($settings['button_text']) . '</div>';        // if (!\Elementor\Plugin::$instance->editor->is_edit_mode()) {

        echo '<div class="bookingor">
        <div class="modal fade" id="bookingorModal" tabindex="-1" aria-labelledby="bookingorModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-centered">
            <div class="modal-content">';

        // Switch case for modal body content
        switch ($settings['button_bookingor_design']) {
            case 'design_one':
                wp_enqueue_style($this->plugin_name . '-design-1-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/css/design-1/design-1.css', [], $this->version, "all");
                wp_enqueue_style($this->plugin_name . '-bootstrap-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.min.css', [], '5.3.3', 'all');
                wp_enqueue_style('jquery-ui-slider', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/jquery/jquery-ui.css', [], '1.12.1', 'all');
                wp_enqueue_script($this->plugin_name . '-bootstrap-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.bundle.min.js', ['jquery'], '5.3.3', true);
                wp_enqueue_script($this->plugin_name . '-design-1-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/js/design-1/design-1.js', ['jquery'], $this->version, true);

                echo do_shortcode('[BOOKINGOR_DESIGN_1]');
                break;
            case 'design_two':
                wp_enqueue_style($this->plugin_name . '-design-2-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/css/design-2/design-2.css', [], $this->version, "all");
                wp_enqueue_style($this->plugin_name . '-bootstrap-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.min.css', [], '5.3.3', 'all');
                wp_enqueue_style('jquery-ui-slider-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/jquery/jquery-ui.css', [], '1.12.1', 'all');
                wp_enqueue_script($this->plugin_name . '-design-2-js-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/js/design-2/design-2.js', ['jquery'], $this->version, true);

                wp_enqueue_script($this->plugin_name . '-bootstrap-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.bundle.min.js', ['jquery'], '5.3.3', true);

                echo do_shortcode('[BOOKINGOR_DESIGN_2]');
                break;
            case 'design_three':
                wp_enqueue_style($this->plugin_name . '-design-3-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/css/design-3/design-3.css', [], $this->version, "all");
                wp_enqueue_style($this->plugin_name . '-bootstrap-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.min.css', [], '5.3.3', 'all');
                wp_enqueue_style('jquery-ui-slider', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/jquery/jquery-ui.css', [], '1.12.1', 'all');
                wp_enqueue_script($this->plugin_name . '-design-3-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/js/design-3/design-3.js', ['jquery'], $this->version, true);

                wp_enqueue_script($this->plugin_name . '-bootstrap-elementor', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.bundle.min.js', ['jquery'], '5.3.3', true);

                echo do_shortcode('[BOOKINGOR_DESIGN_3]');
                break;
            case 'design_four':
                wp_enqueue_style($this->plugin_name . '-bootstraps', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.min.css', [], '5.3.3', 'all');
                wp_enqueue_style($this->plugin_name . '-design-4', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/css/design-4/design-4.css', [], $this->version, "all");
                wp_enqueue_style('jquery-ui-slider', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/jquery/jquery-ui.css', [], '1.12.1', 'all');
                wp_enqueue_script($this->plugin_name . '-design-4', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/js/design-4/design-4.js', ['jquery'], $this->version, true);
                wp_localize_script($this->plugin_name . '-design-4', 'TCN_BIND_FRONT', array('GET_URL' => admin_url('admin-ajax.php')));
                wp_enqueue_script($this->plugin_name . '-bootstrap', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.bundle.min.js', ['jquery'], '5.3.3', true);

                echo do_shortcode('[BOOKINGOR_DESIGN_4]');
                break;
            case 'design_five':
                wp_enqueue_style($this->plugin_name . '-design-5', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/css/design-5/design-5.css', [], $this->version, "all");
                wp_enqueue_style($this->plugin_name . '-bootstrap', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.min.css', [], '5.3.3', 'all');
                wp_enqueue_style('jquery-ui-slider', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/jquery/jquery-ui.css', [], '1.12.1', 'all');
                wp_enqueue_script($this->plugin_name . '-slick', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/slick/slick.js', ['jquery'], $this->version, true);
                wp_enqueue_script($this->plugin_name . '-bootstrap', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.bundle.min.js', ['jquery'], '5.3.3', true);

                echo do_shortcode('[BOOKINGOR_DESIGN_5]');
                break;
            case 'design_six':
                wp_enqueue_style($this->plugin_name . '-design-6', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/css/design-6/design-6.css', [], $this->version, "all");
                wp_enqueue_style($this->plugin_name . '-bootstrap', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.min.css', [], '5.3.3', 'all');
                wp_enqueue_style('jquery-ui-slider', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/jquery/jquery-ui.css', [], '1.12.1', 'all');
                wp_enqueue_script($this->plugin_name . '-design-6', plugin_dir_url(dirname(dirname(__FILE__))) . 'Frontend/assets/js/design-6/design-6.js', ['jquery'], $this->version, true);

                wp_enqueue_script($this->plugin_name . '-bootstrap', plugin_dir_url(dirname(dirname(__FILE__))) . 'includes/bootstrap/bootstrap.bundle.min.js', ['jquery'], '5.3.3', true);

                echo do_shortcode('[BOOKINGOR_DESIGN_6]');
                break;
            default:
                echo 'Default modal content';
                break;
        }

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

    protected function _content_template()
    {


?>
        <#
            // Use the control key `text_color` (not `button_color`).
            var color=settings.text_color || '' ;
            var settings_button_tex="Book Appointment" ;
            var size='' ;
            if ( 'small'===settings.button_size ) {
            size='12px' ;
            } else if ( 'large'===settings.button_size ) {
            size='20px' ;
            } else {
            // default / medium
            size='16px' ;
            }
            #>
            <div class="elementor-button bookingor-shw-backdrop" style="color: {{{ color }}}; font-size: {{{ size }}}; cursor: pointer;">{{{ settings.button_text }}}</div>
    <?php
    }
}
