<?php
/**
 * Expand WP_Customize_Control as requirement and develop according theme settings.
 *
 * @package CodeVibrant
 * @subpackage Enrollment
 * @since 1.0.0
 */

if ( class_exists( 'WP_Customize_Control' ) ) {

    /**
     * Category dropdwon control
     * @return HTML
     *
     * @since 1.0.0
     */
    class Enrollment_Customize_Category_Control extends WP_Customize_Control {
        
        /**
         * Render the control's content.
         *
         * @since 3.4.0
         */
        public function render_content() {
            $dropdown = wp_dropdown_categories(
                array(
                    'name'              => '_customize-dropdown-categories-' . $this->id,
                    'echo'              => 0,
                    'show_option_none'  => __( '&mdash; Select Category &mdash;', 'enrollment' ),
                    'option_none_value' => '0',
                    'selected'          => $this->value(),
                    'value_field'       => 'slug',
                )
            );
 
            // Hackily add in the data link parameter.
            $dropdown = str_replace( '<select', '<select ' . $this->get_link(), $dropdown );
 
            printf(
                '<label class="customize-control-select"><span class="customize-control-title">%s</span><span class="description customize-control-description">%s</span> %s </label>',
                $this->label,
                $this->description,
                $dropdown
            );
        }
    }

/*------------------------------------------------------------------------------------------------------------*/
    /**
     * Radio toggle customize control.
     *
     * @since  1.0.0
     * @access public
     */
    class Enrollment_Control_Toggle extends WP_Customize_Control {
        
        /**
         * The control type.
         *
         * @access public
         * @var string
         * @since 1.0.0
         */
        public $type = 'cv-toggle';

        /**
         * Whitelisting the "required" argument.
         *
         * @since 1.0.0
         * @var array
         */
        public $required = array();
        
        /**
         * Refresh the parameters passed to the JavaScript via JSON.
         *
         * @see WP_Customize_Control::to_json()
         * @since 1.0.0
         */
        public function to_json() {
            parent::to_json();

            $this->json['value']   = $this->value();
            $this->json['link']    = $this->get_link();
            $this->json['id']      = $this->id;
            $this->json['required'] = $this->required;
        }

        /**
         * Don't render the content via PHP.  This control is handled with a JS template.
         *
         * @access public
         * @return void
         * @since  1.0.0
         */
        public function render_content() {}
        
        /**
         * An Underscore (JS) template for this control's content (but not its container).
         *
         * Class variables for this control class are available in the `data` JS object;
         * export custom variables by overriding {@see WP_Customize_Control::to_json()}.
         *
         * @see WP_Customize_Control::print_template()
         *
         * @access protected
         * @since 1.0.0
         */
        protected function content_template() {
    ?>
            <div class="cv-toggle">
                <div class="toggle--wrapper">
                    <# if ( data.label ) { #>
                        <span class="customize-control-title">{{ data.label }}</span>
                    <# } #>

                    <input id="toggle-{{ data.id }}" type="checkbox" class="toggle--input" value="{{ data.value }}" {{{ data.link }}} <# if ( data.value ) { #> checked="checked" <# } #> />
                    <label for="toggle-{{ data.id }}" class="toggle--label"></label>
                </div><!-- .toggle--wrapper -->

                <# if ( data.description ) { #>
                    <span class="description customize-control-description">{{ data.description }}</span>
                <# } #>
            </div><!-- .cv-toggle -->
    <?php
        }
    }

/*------------------------------------------------------------------------------------------------------------*/
    /**
     * Radio image customize control.
     *
     * @since  1.0.0
     * @access public
     */
    class Enrollment_Customize_Control_Radio_Image extends WP_Customize_Control {
        /**
         * The type of customize control being rendered.
         *
         * @since  1.0.0
         * @access public
         * @var    string
         */
        public $type = 'radio-image';

        /**
         * Loads the jQuery UI Button script and custom scripts/styles.
         *
         * @since  1.0.0
         * @access public
         * @return void
         */
        public function enqueue() {
            wp_enqueue_script( 'jquery-ui-button' );
        }

        /**
         * Add custom JSON parameters to use in the JS template.
         *
         * @since  1.0.0
         * @access public
         * @return void
         */
        public function to_json() {
            parent::to_json();

            // We need to make sure we have the correct image URL.
            foreach ( $this->choices as $value => $args )
                $this->choices[ $value ]['url'] = esc_url( sprintf( $args['url'], get_template_directory_uri(), get_stylesheet_directory_uri() ) );

            $this->json['choices'] = $this->choices;
            $this->json['link']    = $this->get_link();
            $this->json['value']   = $this->value();
            $this->json['id']      = $this->id;
        }

        /**
         * Underscore JS template to handle the control's output.
         *
         * @since  1.0.0
         * @access public
         * @return void
         */

        public function content_template() { ?>
    <# if ( data.label ) { #>
        <span class="customize-control-title">{{ data.label }}</span>
    <# } #>

    <# if ( data.description ) { #>
        <span class="description customize-control-description">{{{ data.description }}}</span>
    <# } #>

    <div class="buttonset">

        <# for ( key in data.choices ) { #>

            <label for="{{ data.id }}-{{ key }}">
                <input type="radio"
                       value="{{ key }}"
                       name="_customize-{{ data.type }}-{{ data.id }}"
                       id="{{ data.id }}-{{ key }}"
                       {{{ data.link }}}
                       <# if ( key === data.value ) { #> checked="checked" <# } #> 
                        /> 
                     <label for="{{ data.id }}-{{ key }}">
                    <img src="{{ data.choices[ key ]['url'] }}"
                     title="{{ data.choices[ key ]['label'] }}"
                     alt="{{ data.choices[ key ]['label'] }}"/>

                <span class="image-label">{{ data.choices[ key ]['label'] }}</span>
            </label>

        <# } #>

    </div><!-- .buttonset -->
<?php }

    }

/*------------------------------------------------------------------------------------------------------------*/
    /**
     * Customize controls for repeater field
     *
     * @since 1.0.0
     */
    class Enrollment_Repeater_Controler extends WP_Customize_Control {
        /**
         * The control type.
         *
         * @access public
         * @var string
         */
        public $type = 'repeater';

        public $enrollment_box_label = '';

        public $enrollment_box_add_control = '';

        /**
         * The fields that each container row will contain.
         *
         * @access public
         * @var array
         */
        public $fields = array();

        /**
         * Repeater drag and drop controller
         *
         * @since  1.0.0
         */
        public function __construct( $manager, $id, $args = array(), $fields = array() ) {
            $this->fields = $fields;
            $this->enrollment_box_label = $args['enrollment_box_label'] ;
            $this->enrollment_box_add_control = $args['enrollment_box_add_control'];
            parent::__construct( $manager, $id, $args );
        }

        public function render_content() {

            $values = json_decode( $this->value() );
            $repeater_id = $this->id;
            $field_count = count( $values );;
        ?>
            <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>

            <?php if ( $this->description ) { ?>
                <span class="description customize-control-description">
                    <?php echo wp_kses_post( $this->description ); ?>
                </span>
            <?php } ?>

            <ul class="cv-repeater-field-control-wrap">
                <?php $this->enrollment_get_fields(); ?>
            </ul>

            <input type="hidden" <?php esc_attr( $this->link() ); ?> class="cv-repeater-collector" value="<?php echo esc_attr( $this->value() ); ?>" />
            <input type="hidden" name="<?php echo esc_attr( $repeater_id ).'_count'; ?>" class="field-count" value="<?php echo absint( $field_count ); ?>">
            <input type="hidden" name="field_limit" class="field-limit" value="5">
            <button type="button" class="button cv-repeater-add-control-field"><?php echo esc_html( $this->enrollment_box_add_control ); ?></button>
    <?php
        }

        private function enrollment_get_fields() {
            $fields = $this->fields;
            $values = json_decode( $this->value() );

            if ( is_array( $values ) ) {
                foreach( $values as $value ) {
        ?>
                    <li class="cv-repeater-field-control">
                        <h3 class="cv-repeater-field-title"><?php echo esc_html( $this->enrollment_box_label ); ?></h3>
            
                        <div class="cv-repeater-fields">
                        <?php
                            foreach ( $fields as $key => $field ) {
                            $class = isset( $field['class'] ) ? $field['class'] : '';
                        ?>
                            <div class="cv-repeater-field cv-repeater-type-<?php echo esc_attr( $field['type'] ).' '. esc_attr( $class ); ?>">

                            <?php 
                                $label = isset( $field['label'] ) ? $field['label'] : '';
                                $description = isset( $field['description'] ) ? $field['description'] : '';
                                if ( $field['type'] != 'checkbox' ) { 
                            ?>
                                <span class="customize-control-title"><?php echo esc_html( $label ); ?></span>
                                <span class="description customize-control-description"><?php echo esc_html( $description ); ?></span>
                            <?php 
                                }

                                $new_value = isset( $value->$key ) ? $value->$key : '';
                                $default = isset( $field['default'] ) ? $field['default'] : '';

                                switch ( $field['type'] ) {

                                    case 'url':
                                        echo '<input data-default="'.esc_attr( $default ).'" data-name="'.esc_attr( $key ).'" type="text" value="'.esc_url( $new_value ).'"/>';
                                        break;

                                    case 'social_icon':
                                        echo '<div class="cv-repeater-selected-icon"><i class="'.esc_attr( $new_value ).'"></i><span><i class="fa fa-angle-down"></i></span></div><ul class="cv-repeater-icon-list clearfix">';
                                        $enrollment_font_awesome_social_icon_array = enrollment_font_awesome_social_icon_array();
                                        foreach ( $enrollment_font_awesome_social_icon_array as $enrollment_font_awesome_icon ) {
                                            $icon_class = $new_value == $enrollment_font_awesome_icon ? 'icon-active' : '';
                                            echo '<li class='.esc_attr( $icon_class ).'><i class="'. esc_attr( $enrollment_font_awesome_icon ).'"></i></li>';
                                        }
                                        echo '</ul><input data-default="'.esc_attr( $default ).'" type="hidden" value="'.esc_attr( $new_value ).'" data-name="'.esc_attr( $key ).'"/>';
                                        break;

                                    default:
                                        break;
                                }
                    ?>
                            </div><!-- .cv-repeater-field -->
                        <?php } ?>

                            <div class="clearfix cv-repeater-footer">
                                <div class="alignright">
                                    <a class="cv-repeater-field-remove" href="#remove"><?php esc_html_e( 'Delete', 'enrollment' ) ?></a> |
                                    <a class="cv-repeater-field-close" href="#close"><?php esc_html_e( 'Close', 'enrollment' ) ?></a>
                                </div>
                            </div>
                        </div><!-- .cv-repeater-fields -->
                    </li>
            <?php   
            }
            }
        }
    }
/*-----------------------------------------------------------------------------------------------------------------------*/
    /**
     * Custom class for typography 
     */
    class Enrollment_Typography_Customizer_Control extends WP_Customize_Control {
    
        /**
         * The type of customize control being rendered.
         *
         * @since  1.0.0
         * @access public
         * @var    string
         */
        public $type = 'typography';

        /**
         * Array 
         *
         * @since  1.0.0
         * @access public
         * @var    string
         */
        public $cv_l10n = array();

        /**
         * Set up our control.
         *
         * @since  1.0.0
         * @access public
         * @param  object  $manager
         * @param  string  $id
         * @param  array   $args
         * @return void
         */
        public function __construct( $manager, $id, $args = array() ) {

            // Let the parent class do its thing.
            parent::__construct( $manager, $id, $args );

            // Make sure we have labels.
            $this->cv_l10n = wp_parse_args(
                $this->cv_l10n,
                array(
                    'family'            => esc_html__( 'Font Family', 'enrollment' ),
                    'size'              => esc_html__( 'Font Size',   'enrollment' ),
                    'style'             => esc_html__( 'Font Weight/Style', 'enrollment' ),
                    'line_height'       => esc_html__( 'Line Height', 'enrollment' ),
                    'px_line_height'    => esc_html__( 'Line Height', 'enrollment' ),
                    'text_decoration'   => esc_html__( 'Text Decoration', 'enrollment' ),
                    'text_transform'    => esc_html__( 'Text Transform', 'enrollment' ),
                    'typocolor'         => esc_html__( 'Font Color', 'enrollment' ),
                    'bg_color'          => esc_html__( 'Background Color', 'enrollment' )
                )
            );
        }

        /**
         * Enqueue scripts/styles.
         *
         * @since  1.0.0
         * @access public
         * @return void
         */
        public function enqueue() {
            wp_enqueue_script( 'wp-color-picker' );
            wp_enqueue_style( 'wp-color-picker' );
        }

        /**
         * Add custom parameters to pass to the JS via JSON.
         *
         * @since  1.0.0
         * @access public
         * @return void
         */
        public function to_json() {
            parent::to_json();

            // Loop through each of the settings and set up the data for it.
            foreach ( $this->settings as $setting_key => $setting_id ) {
                $this->json[ $setting_key ] = array(
                    'link'  => $this->get_link( $setting_key ),
                    'value' => $this->value( $setting_key ),
                    'label' => isset( $this->cv_l10n[ $setting_key ] ) ? $this->cv_l10n[ $setting_key ] : ''
                );

                if ( 'family' === $setting_key )
                    $this->json[ $setting_key ]['choices'] = $this->get_font_families();

                elseif ( 'style' === $setting_key )
                    $this->json[ $setting_key ]['choices'] = $this->get_font_weight_choices();

                elseif ( 'text_transform' === $setting_key )
                    $this->json[ $setting_key ]['choices'] = $this->get_text_transform_choices();

                elseif ( 'text_decoration' === $setting_key )
                    $this->json[ $setting_key ]['choices'] = $this->get_text_decoration_choices();
            }
        }

        /**
         * Underscore JS template to handle the control's output.
         *
         * @since  1.0.0
         * @access public
         * @return void
         */
        public function content_template() {
        ?>

        <# if ( data.label ) { #>
            <span class="customize-control-title">{{ data.label }}</span>
        <# } #>

        <# if ( data.description ) { #>
            <span class="description customize-control-description">{{{ data.description }}}</span>
        <# } #>

        <ul>

        <# if ( data.family && data.family.choices ) { #>

            <li class="typography-font-family">

            <# if ( data.family.label ) { #>
                <span class="customize-control-title">{{ data.family.label }}</span>
            <# } #>

                <select {{{ data.family.link }}} id="{{ data.section }}" class="typography_face">

                <# _.each( data.family.choices, function( label, choice ) { #>
                    <option value="{{ choice }}" <# if ( choice === data.family.value ) { #> selected="selected" <# } #>>{{ label }}</option>
                <# } ) #>

                </select>

            </li>
        <#  } #>

        <# if ( data.style && data.style.choices ) { #>

            <li class="typography-font-style">

            <# if ( data.style.label ) { #>
                <span class="customize-control-title">{{ data.style.label }}</span>
            <# } #>

                <select {{{ data.style.link }}}>

                <# _.each( data.style.choices, function( label, choice ) { #>
                    <option value="{{ choice }}" <# if ( choice === data.style.value ) { #> selected="selected" <# } #>>{{ label }}</option>
                <# } ) #>

                </select>
            </li>
        <#  } #>

        <# if ( data.text_transform && data.text_transform.choices ) { #>

            <li class="typography-text-transform">

            <# if ( data.text_transform.label ) { #>
                <span class="customize-control-title">{{ data.text_transform.label }}</span>
            <# } #>

                <select {{{ data.text_transform.link }}} id="p_typography_text_transform" class="typography_text_transform">

                    <# _.each( data.text_transform.choices, function( label, choice ) { #>
                        <option value="{{ choice }}" <# if ( choice === data.text_transform.value ) { #> selected="selected" <# } #>>{{ label }}</option>
                    <# } ) #>

                </select>
            </li>
        <# } #>

        <# if ( data.text_decoration && data.text_decoration.choices ) { #>

            <li class="typography-text-decoration">

            <# if ( data.text_decoration.label ) { #>
                <span class="customize-control-title">{{ data.text_decoration.label }}</span>
            <# } #>

                <select {{{ data.text_decoration.link }}} id="p_typography_text_decoration" class="typography_text_decoration">

                    <# _.each( data.text_decoration.choices, function( label, choice ) { #>
                        <option value="{{ choice }}" <# if ( choice === data.text_decoration.value ) { #> selected="selected" <# } #>>{{ label }}</option>
                    <# } ) #>

                </select>
            </li>
        <#  } #>

        <# if ( data.size ) { #>

            <li class="typography-font-size">

            <# if ( data.size.label ) { #>
                <span class="customize-control-title">{{ data.size.label }} </span>
            <# } #>

                <span class="slider-value-size"></span>px
                <input type="hidden" {{{ data.size.link }}} value="{{ data.size.value }}" />
                <div class="slider-range-size" value="{{ data.size.value }}" ></div>

            </li>
        <#  } #>

        <# if ( data.line_height ) { #>

            <li class="typography-line-height">

            <# if ( data.line_height.label ) { #>
                <span class="customize-control-title">{{ data.line_height.label }}</span>
            <# } #>

                <span class="slider-value-line-height"></span>
                <input type="hidden" {{{ data.line_height.link }}} value="{{ data.line_height.value }}" />
                <div class="slider-range-line-height" value="{{ data.line_height.value }}"></div>
          
            </li>
        <#  } #>

        <# if ( data.px_line_height ) { #>

            <li class="typography-line-height">

            <# if ( data.px_line_height.label ) { #>
                <span class="customize-control-title">{{ data.px_line_height.label }}</span>
            <# } #>

                <span class="slider-value-size"></span>px
                <div class="slider-range-size" {{{ data.px_line_height.link }}} value="{{ data.px_line_height.value }}"  ></div>
          
            </li>
        <#  } #>

        <# if ( data.typocolor ) { #>

            <li class="typography-color">
                <# if ( data.typocolor.label ) { #>
                    <span class="customize-control-title">{{{ data.typocolor.label }}}</span>
                <# } #>

                    <div class="customize-control-content">
                        <input class="color-picker-hex" type="text" maxlength="7" placeholder="<?php esc_attr_e( 'Hex Value', 'enrollment' ); ?>" {{{ data.typocolor.link }}} value="{{ data.typocolor.value }}"  />
                    </div>
            </li>
        <#  } #>

        <# if ( data.bg_color ) { #>

            <li class="typography-color">
                <# if ( data.bg_color.label ) { #>
                    <span class="customize-control-title">{{{ data.bg_color.label }}}</span>
                <# } #>

                    <div class="customize-control-content">
                        <input class="color-picker-hex" type="text" maxlength="7" placeholder="<?php esc_attr_e( 'Hex Value', 'enrollment' ); ?>" {{{ data.bg_color.link }}} value="{{ data.bg_color.value }}"  />
                    </div>
            </li>
        <#  } #>

        </ul>
        <?php }

        /**
         * Returns the available fonts.  Fonts should have available weights, styles, and subsets.
         *
         * @todo Integrate with Google fonts.
         *
         * @since  1.0.0
         * @access public
         * @return array
         */
        public function get_fonts() { return array(); }

        /**
         * Returns the available font families.
         *
         * @todo Pull families from `get_fonts()`.
         *
         * @since  1.0.0
         * @access public
         * @return array
         */
        function get_font_families() {

            $google_fonts_file = get_template_directory() . '/inc/customizer/webfonts.json';

            $get_file_content   = file_get_contents( $google_fonts_file );
            $get_google_fonts   = json_decode( $get_file_content, 1 );

            $enrollment_google_font = get_option( 'enrollment_google_font', '' );
            if ( empty( $enrollment_google_font ) ) {
                update_option( 'enrollment_google_font', $get_google_fonts );
                $enrollment_google_font = get_option( 'enrollment_google_font', '' );
            }

            foreach ( $enrollment_google_font as $key => $value ) {
                $cv_fonts[$value['family']] =  $value['family'] ;
            }

            return $cv_fonts;
        }

        /**
         * Returns the available font weights.
         *
         * @since  1.0.0
         * @access public
         * @return array
         */
        public function get_font_weight_choices() {
            if ( $this->settings['family']->id ) {
                $enrollment_font_list = get_option( 'enrollment_google_font', '' );

                $font_family_id         = $this->settings['family']->id;
                $default_font_family    = $this->settings['family']->default;
                $get_font_family        = get_theme_mod( $font_family_id, $default_font_family );

                $font_array = enrollment_search_key( $enrollment_font_list, 'family', $get_font_family );

                $variants_array = $font_array['0']['variants'] ;

                if ( is_array( $variants_array ) ) {
                    $options_array = array();
                    foreach ( $variants_array  as $key => $variants ) {
                        $options_array[$key] = $variants;
                    }
                    return $options_array;
                }else{
                    return array(
                      '400' => esc_html__( 'Normal', 'enrollment' ),
                      '700' => esc_html__( 'Bold', 'enrollment' ),
                    );
                }
            } else {
                return array(
                  '400' => esc_html__( 'Normal', 'enrollment' ),
                  '700' => esc_html__( 'Bold', 'enrollment' ),
                );
            }
        }

        /**
         * Returns the available font text decoration.
         *
         * @since  1.0.0
         * @access public
         * @return array
         */
        public function get_text_decoration_choices() {
            return array(
                'none'          => esc_html__( 'None', 'enrollment' ),
                'underline'     => esc_html__( 'Underline', 'enrollment' ),
                'line-through'  => esc_html__( 'Line-through', 'enrollment' ),
                'overline'      => esc_html__( 'Over-line', 'enrollment' )
            );
        }

        /**
         * Returns the available font text transform.
         *
         * @since  1.0.0
         * @access public
         * @return array
         */
        public function get_text_transform_choices() {
            return array(
                'none'       => esc_html__( 'None', 'enrollment' ),
                'uppercase'  => esc_html__( 'Uppercase', 'enrollment' ),
                'lowercase'  => esc_html__( 'Lowercase', 'enrollment' ),
                'capitalize' => esc_html__( 'Capitalize', 'enrollment' )
            );
        }

    }// end class
}

/*------------------------------------------------------------------------------------------------------------*/

if ( class_exists( 'WP_Customize_Section' ) ) {

    /**
     * Upsell customizer section.
     *
     * @since  1.0.3
     * @access public
     */
    class Enrollment_Customize_Section_Upsell extends WP_Customize_Section {

        /**
         * The type of customize section being rendered.
         *
         * @since  1.0.0
         * @access public
         * @var    string
         */
        public $type = 'upsell';

        /**
         * Custom button text to output.
         *
         * @since  1.0.0
         * @access public
         * @var    string
         */
        public $pro_text = '';

        /**
         * Custom pro button URL.
         *
         * @since  1.0.0
         * @access public
         * @var    string
         */
        public $pro_url = '';

        /**
         * Add custom parameters to pass to the JS via JSON.
         *
         * @since  1.0.0
         * @access public
         * @return void
         */
        public function json() {
            $json = parent::json();

            $json['pro_text'] = $this->pro_text;
            $json['pro_url']  = esc_url( $this->pro_url );

            return $json;
        }

        /**
         * Outputs the Underscore.js template.
         *
         * @since  1.0.0
         * @access public
         * @return void
         */
        protected function render_template() { ?>

            <li id="accordion-section-{{ data.id }}" class="accordion-section control-section control-section-{{ data.type }} cannot-expand">
                <h3 class="accordion-section-title">
                    {{ data.title }}

                    <# if ( data.pro_text && data.pro_url ) { #>
                        <a href="{{ data.pro_url }}" class="button button-secondary alignright" target="_blank">{{ data.pro_text }}</a>
                    <# } #>
                </h3>
            </li>
        <?php }
    }

}