<?php
if ( class_exists( 'WP_Customize_Control' ) ) :
class WPCTP_Google_Font_Control extends WP_Customize_Control {
    public $type = 'googlefont';
    public function render_content()
    {
        $listGoogleFont = file_get_contents( WPCTP_ASSETS_URL . '/googlefont.txt' );
        if($listGoogleFont){
            $gfont = json_decode($listGoogleFont, true);
        }
        if( ! $listGoogleFont ){
            $listGoogleFont = wpctp_get_contents( WPCTP_ASSETS_URL . '/googlefont.txt' );  
            $gfont = json_decode($listGoogleFont, true);          
        }
        $value = array();
        if($this->value()){
            $value = json_decode($this->value(), true);
        }
        ?>
        <label>
            <h3><?php echo $this->label; ?></h3>
        </label>
        <?php if ( ! empty( $this->description ) ) : ?>
            <span class="description customize-control-description"><?php echo $this->description; ?></span>
        <?php endif; ?>
        <ul class="wpctp-gff-wrap">
            <li class="customize-control wpctp-gff">
                <label>
                    <span class="customize-control-title"><?php _e( 'Select Font Family', 'wpctp' ); ?></span>
                    <select class="wpctp-gff-select">
                    <option value="" <?php selected( $this->value(), '' ); ?>><?php _e( 'Theme Default', 'wpctp' ); ?></option>
                        <?php
                        foreach ($gfont['items'] as $font) {
                            //print_r($value);print_r($font);
                            $selected = '';
                            if(isset($value['family']) &&  $value['family'] == $font['family']){
                                $selected = 'selected';
                            }
                            ?>
                            <option
                                value="<?php echo esc_attr($font['family']); ?>"
                                data-variants="<?php echo esc_attr( implode(',', $font['variants'])); ?>"
                                data-subsets="<?php echo esc_attr( implode(',', $font['subsets'])); ?>"
                                data-category="<?php echo esc_attr( $font['category'] ); ?>"
                                <?php echo esc_attr($selected) ?> style="font-family:'<?php echo esc_attr($font['family']); ?>', Open Sans, Helvetica, Arial, sans-serif;">
                                <?php echo esc_html($font['family']); ?>
                            </option>
                            <?php
                        }
                        ?>
                    </select>
                </label>
                <br />
                <br />
                <?php
                $font_current_item = $gfont['items'][0];
                if(isset($value['family'])){
                    foreach ($gfont['items'] as $font){
                        if($value['family'] == $font['family']){
                            $font_current_item = $font;
                        }
                    }
                }
                ?>
                <label>
                    <span class="customize-control-title"><?php _e( 'Select Font Variants', 'wpctp' ); ?></span>
                    <ul class="wpctp-gff-variant customize-control-checkbox">
                        <?php
                        foreach ($font_current_item['variants'] as $variant) {
                            $checked = '';
                            if(isset($value['variants']) && in_array($variant, $value['variants'])){
                                $checked = 'checked';
                            }
                            ?>
                            <li><label><input <?php echo esc_attr($checked) ?> class="wpctp-gff-variant " type="checkbox" value="<?php echo esc_attr($variant) ?>"><?php echo esc_html($variant) ?></label></li>
                            <?php
                        }
                        ?>
                    </ul>
                </label>
                <br />
                <label>
                    <span class="customize-control-title"><?php _e( 'Select Font Subsets' ); ?></span>
                    <ul class="wpctp-gff-subset customize-control-checkbox">
                        <?php
                        foreach ($font_current_item['subsets'] as $subset) {
                            $checked = '';
                            if(isset($value['subsets']) && in_array($subset, $value['subsets'])){
                                $checked = 'checked';
                            }
                            ?>
                            <li><label><input <?php echo esc_attr($checked) ?> class="wpctp-gff-subset" type="checkbox" value="<?php echo esc_attr($subset) ?>"><?php echo esc_html($subset) ?></label></li>
                            <?php
                        }
                        ?>
                    </ul>
                </label>
            </li>
            <input class="customize-input-google-font" type="hidden" <?php echo $this->get_link() ?> value="<?php echo esc_attr($this->value()) ?>" />
        </ul>
        <br />
        <hr />
        <?php
    }
}
endif;