<?php

namespace Materialis;


class SidebarGroupButtonControl extends \Kirki_Customize_Control
{

    public $type = "sidebar-button-group";
    public $popupId = '';
    public $in_row_with = array();
    public $always_active = false;

    public function __construct($manager, $id, $args = array())
    {
        $this->popupId       = uniqid('cp-sidebar-button-group-');
        $this->in_row_with   = isset($args['in_row_with']) ? $args['in_row_with'] : array();
        $this->always_active = isset($args['always_active']) ? $args['always_active'] : false;
        parent::__construct($manager, $id, $args);
    }

    public function enqueue()
    {
        $jsRoot = get_template_directory_uri() . "/customizer/js";
        wp_enqueue_script('materialis-sb-group-button-control', $jsRoot . "/sb-group-button-control.js");

    }

    public function json()
    {
        $fields  = \Kirki::$fields;
        $grouped = array();
        foreach ($fields as $field) {
            if (isset($field['group']) && $field['group'] == $this->setting->id) {
                $grouped[] = $field["settings"];
            }
        }
        if ( ! count($grouped)) {
            $grouped = $this->choices;
        }

        $grouped = apply_filters($this->setting->id . "_filter", (array)$this->choices + $grouped);

        if (count($grouped)) {
            $this->choices = $grouped;
        }

        $json                  = parent::json();
        $json['popup']         = $this->popupId;
        $json['in_row_with']   = $this->in_row_with;
        $json['always_active'] = $this->always_active;

        return $json;
    }

    protected function content_template()
    {
        ?>

        <label>

            <# if ( data.description ) { #>
            <span class="title customize-control-title" style="visibility: hidden;">{{{ data.description }}}</span>
            <# } #>

            <button type="button" class="button" data-sidebar-container="{{ data.popup }}" id="group_customize-button-{{ data.popup }}">
                {{{ data.label }}}
            </button>
        </label>

        <div id="{{ data.popup }}-popup" class="customizer-right-section">
            <span data-close-right-sidebar="true" title="<?php esc_attr_e("Close Panel", 'materialis'); ?>" class="close-panel"></span>
            <ul class="section-settings-container accordion-section-content no-border"></ul>
        </div>
        <?php

    }
}
