<?php
if ( ! class_exists( 'WP_Customize_Control' ) ) {
    return;
}

class Newsxo_HF_Repeater_Control extends WP_Customize_Control {

    public $type = 'newsxo-hf-repeater';
    public $fields = array();
    public $select_choices = array();
    public $disabled_choices = array();
    public $add_button_text = '';
    public $select_label = '';
    public $position_label = '';
    public $column_label = '';
    public $element_sections = array();
    public $element_panels = array();
    public $edit_button_text = '';

    public function enqueue() {
        wp_enqueue_script(
            'newsxo-hf-repeater-control',
            get_template_directory_uri() . '/inc/ansar/custom-control/newsxo-hf-repeater/newsxo-hf-repeater.js',
            array( 'jquery', 'jquery-ui-sortable', 'customize-controls' ),
            '1.0',
            true
        );

        wp_enqueue_style(
            'newsxo-hf-repeater-control',
            get_template_directory_uri() . '/inc/ansar/custom-control/newsxo-hf-repeater/newsxo-hf-repeater.css',
            array(),
            '1.0'
        );
    }

    public function to_json() {
        parent::to_json();

        $this->json['fields']           = $this->fields;
        $this->json['select_choices']   = $this->select_choices;
        $this->json['disabled_choices'] = $this->disabled_choices;
        $this->json['add_button_text']  = $this->add_button_text ?? __( 'Add Item', 'newsxo' );
        $this->json['select_label']     = $this->select_label ?? __( 'Select', 'newsxo' );
        $this->json['position_label']   = $this->position_label ?? __( 'Position', 'newsxo' );
        $this->json['column_label']     = $this->column_label ?? __( 'Column', 'newsxo' );
        $this->json['edit_button_text'] = $this->edit_button_text ?? __( 'Edit Element', 'newsxo' );
        $this->json['element_sections'] = $this->element_sections;
        $this->json['element_panels']   = $this->element_panels;
        $this->json['default_items']    = $this->setting->default;
        $this->json['value']            = $this->value();
    }

    protected function content_template() {
        ?>
        <div class="newsxo-hf-repeater-control text-center">
            <span class="customize-control-title text-left">{{ data.label }}</span>

            <ul class="newsxo-hf-repeater-list text-left"></ul>

            <button type="button" class="button-primary newsxo-add-item">
                <span class="dashicons dashicons-plus-alt2"></span>
                <span class="newsxo-add-text">{{ data.add_button_text }}</span>
            </button>
            <input type="hidden"
                class="newsxo-hf-repeater-value"
                data-customize-setting-link="{{ data.settings.default }}" />
        </div>
        <?php
    }
}