<?php
/**
 * BlazeBlog Customizer functionality
 *
 * @package WordPress
 * @subpackage blazeblog
 * @since BlazeBlog 1.0
 */

function blazeblog_custom_header_and_background() {
	$color_scheme             = blazeblog_get_color_scheme();
	$default_background_color = trim( $color_scheme[0], '#' );
	$default_text_color       = trim( $color_scheme[4], '#' );

	/**
     * Filter the arguments used when adding 'custom-background' support in BlazeBlog.
     *
     * @since BlazeBlog 1.0
     *
     * @param array $args {
     *     An array of custom-background support arguments.
     *
     *     @type string $default-color Default color of the background.
     * }
     */
    add_theme_support( 'custom-background', apply_filters( 'blazeblog_custom_background_args', array(
		'default-color' => $default_background_color,
	) ) );

	/**
     * Filter the arguments used when adding 'custom-header' support in BlazeBlog.
     *
     * @since BlazeBlog 1.0
     *
     * @param array $args {
     *     An array of custom-header support arguments.
     *
     *     @type string $default-text-color Default color of the header text.
     *     @type int      $width            Width in pixels of the custom header image. Default 1200.
     *     @type int      $height           Height in pixels of the custom header image. Default 280.
     *     @type bool     $flex-height      Whether to allow flexible-height header images. Default true.
     *     @type callable $wp-head-callback Callback function used to style the header image and text
     *                                      displayed on the blog.
     * }
     */
	add_theme_support( 'custom-header', apply_filters( 'blazeblog_custom_header_args', array(
		'default-text-color'     => $default_text_color,
		'width'                  => 1200,
		'height'                 => 280,
		'flex-height'            => true,
		'wp-head-callback'       => 'blazeblog_header_style',
	) ) );
}
add_action( 'after_setup_theme', 'blazeblog_custom_header_and_background' );

if ( ! function_exists( 'blazeblog_header_style' ) ) :
    /**
     * Styles the header text displayed on the site.
     *
     * Create your own blazeblog_header_style() function to override in a child theme.
     *
     * @since BlazeBlog 1.0
     *
     * @see blazeblog_custom_header_and_background().
     */
    function blazeblog_header_style() {
        // If the header text option is untouched, let's bail.
        if ( display_header_text() ) {
            return;
        }
    }
endif;

/**
 * Registers color schemes for Twenty Sixteen.
 *
 * Can be filtered with {@see 'blazeblog_color_schemes'}.
 *
 * The order of colors in a colors array:
 * 1. Main Background Color.
 * 2. Page Background Color.
 * 3. Link Color.
 * 4. Main Text Color.
 * 5. Secondary Text Color.
 *
 * @since BlazeBlog 1.0
 *
 * @return array An associative array of color scheme options.
 */
function blazeblog_get_color_schemes() {
	/**
     * Filter the color schemes registered for use with BlazeBlog.
     *
     * The default schemes are 'default', 'dark', 'gray', 'red', and 'yellow'.
     *
     * @since BlazeBlog 1.0
     *
     * @param array $schemes {
     *     Associative array of color schemes data.
     *
     *     @type array $slug {
     *         Associative array of information for setting up the color scheme.
     *
     *         @type string $label  Color scheme label.
     *         @type array  $colors HEX codes for default colors prepended with a hash symbol ('#').
     *                              Colors are defined in the following order: Main background, page
     *                              background, link, main text, secondary text.
     *     }
     * }
     */
	return apply_filters( 'ggfxcolor_schemes', array(
		'default' => array(
			'label'  => __( 'Default', 'blazeblog' ),
			'colors' => array(
				'#e1e1e1',
				'#e1e1e1',
                '#ffffff',
				'#007acc',
				'#1a1a1a',
				'#686868',
			),
		),
		'dark' => array(
			'label'  => __( 'Dark', 'blazeblog' ),
			'colors' => array(
				'#262626',
				'#1a1a1a',
                '#1a1a1a',
				'#9adffd',
				'#e5e5e5',
				'#c1c1c1',
			),
		),
		'gray' => array(
			'label'  => __( 'Gray', 'blazeblog' ),
			'colors' => array(
				'#616a73',
				'#4d545c',
                '#4d545c',
				'#c7c7c7',
				'#f2f2f2',
				'#f2f2f2',
			),
		),
		'red' => array(
			'label'  => __( 'Red', 'blazeblog' ),
			'colors' => array(
				'#ffffff',
				'#ff675f',
                '#ff675f',
				'#640c1f',
				'#402b30',
				'#402b30',
			),
		),
		'yellow' => array(
			'label'  => __( 'Yellow', 'blazeblog' ),
			'colors' => array(
				'#3b3721',
				'#ffef8e',
                '#ffef8e',
				'#774e24',
				'#3b3721',
				'#5b4d3e',
			),
		),
	) );
}

if ( ! function_exists( 'blazeblog_get_color_scheme' ) ) :
    function blazeblog_get_color_scheme() {
        $color_scheme_option = get_theme_mod( 'color_scheme', 'default' );
        $color_schemes       = blazeblog_get_color_schemes();

        if ( array_key_exists( $color_scheme_option, $color_schemes ) ) {
            return $color_schemes[ $color_scheme_option ]['colors'];
        }

        return $color_schemes['default']['colors'];
    }
endif;

function blazeblog_customize_register( $wp_customize ) {
    $color_scheme = blazeblog_get_color_scheme();

    $wp_customize->get_section( 'title_tagline' )->title = esc_html__('Site Title, Tagline & Logo', 'blazeblog');
    $wp_customize->get_setting( 'blogname' )->transport         = 'postMessage';
	$wp_customize->get_setting( 'blogdescription' )->transport  = 'postMessage';
    $wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage';

    $wp_customize->selective_refresh->add_partial( 'blogname', array(
        'selector' => '.site-title',
        'render_callback' => 'blazeblog_customize_partial_blogname',
    ) );

	$wp_customize->selective_refresh->add_partial( 'blogdescription', array(
		'selector' => '.site-description',
		'render_callback' => 'blazeblog_customize_partial_blogdescription',
	) );



    $wp_customize->add_setting( 'blazeblog_icon_logo',
        array(
            'default' => '',
            'sanitize_callback' => 'sanitize_text_field',
        )
    );

    $wp_customize->add_control(
        'blazeblog_icon_logo',
        array(
            'label' 		=> esc_html__('Icon as Logo', 'blazeblog'),
            'description'	=> __('you can use FontAwesome icon <strong>fa fa-lightbulb-o</strong> or Bootstrap Glyphicons <strong>glyphicon glyphicon-knight</strong>.
                                   Image logo will take precedence over icon.', 'blazeblog'),
            'section' 		=> 'title_tagline',
            'type'          => 'text',
            )
        );

    $wp_customize->add_setting( 'blazeblog_hide_sitetitle',
        array(
            'sanitize_callback' => 'blazeblog_sanitize_checkbox',
            'default'           => 0,
        )
    );
    $wp_customize->add_control(
        'blazeblog_hide_sitetitle',
        array(
            'label' 		=> esc_html__('Hide Site Title', 'blazeblog'),
            'section' 		=> 'title_tagline',
            'type'          => 'checkbox',
        )
    );

    $wp_customize->add_setting( 'blazeblog_hide_tagline',
        array(
            'sanitize_callback' => 'blazeblog_sanitize_checkbox',
            'default'           => 0,
        )
    );
    $wp_customize->add_control(
        'blazeblog_hide_tagline',
        array(
            'label' 		=> esc_html__('Hide Site Tagline', 'blazeblog'),
            'section' 		=> 'title_tagline',
            'type'          => 'checkbox',

            )
        );


	// Add color scheme setting and control.
	$wp_customize->add_setting( 'color_scheme', array(
		'default'           => 'default',
		'sanitize_callback' => 'blazeblog_sanitize_color_scheme',
		'transport'         => 'refresh',
	) );

	$wp_customize->add_control( 'color_scheme', array(
		'label'    => __( 'Base Color Scheme', 'blazeblog' ),
		'section'  => 'colors',
		'type'     => 'select',
		'choices'  => blazeblog_get_color_scheme_choices(),
		'priority' => 1,
	) );

	// Add page background color setting and control.
	$wp_customize->add_setting( 'page_background_color', array(
		'default'           => $color_scheme[1],
		'sanitize_callback' => 'sanitize_hex_color',
		'transport'         => 'postMessage',
	) );

	$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'page_background_color', array(
		'label'       => __( 'Page Background Color', 'blazeblog' ),
		'section'     => 'colors',
	) ) );

    $wp_customize->add_setting( 'blazeblog_page_background_transparent',
        array(
            'sanitize_callback' => 'blazeblog_sanitize_checkbox',
            'default'           => 0,
        )
    );
    $wp_customize->add_control(
        'blazeblog_page_background_transparent',
        array(
            'label' 		=> esc_html__('Transparent Page Background', 'blazeblog'),
            'section' 		=> 'colors',
            'type'          => 'checkbox',

            )
        );

    $wp_customize->add_setting( 'blazeblog_page_background_shadow',
        array(
            'sanitize_callback' => 'blazeblog_sanitize_checkbox',
            'default'           => 0,
        )
    );
    $wp_customize->add_control(
        'blazeblog_page_background_shadow',
        array(
            'label' 		=> esc_html__('Page Background Shadow', 'blazeblog'),
            'section' 		=> 'colors',
            'type'          => 'checkbox',

            )
        );

	// Remove the core header textcolor control, as it shares the main text color.
	$wp_customize->remove_control( 'header_textcolor' );
    // Remove the code display header text checkbox control.
    $wp_customize->remove_control( 'display_header_text' );


	// Add section background color setting and control.
	$wp_customize->add_setting( 'section_background_color', array(
		'default'           => $color_scheme[2],
		'sanitize_callback' => 'sanitize_hex_color',
		'transport'         => 'postMessage',
	) );

	$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'section_background_color', array(
		'label'       => __( 'Section Background Color', 'blazeblog' ),
		'section'     => 'colors',
	) ) );

	// Add link color setting and control.
	$wp_customize->add_setting( 'link_color', array(
		'default'           => $color_scheme[3],
		'sanitize_callback' => 'sanitize_hex_color',
		'transport'         => 'postMessage',
	) );

	$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'link_color', array(
		'label'       => __( 'Link Color', 'blazeblog' ),
		'section'     => 'colors',
	) ) );

	// Add main text color setting and control.
	$wp_customize->add_setting( 'main_text_color', array(
		'default'           => $color_scheme[4],
		'sanitize_callback' => 'sanitize_hex_color',
		'transport'         => 'postMessage',
	) );

	$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'main_text_color', array(
		'label'       => __( 'Main Text Color', 'blazeblog' ),
		'section'     => 'colors',
	) ) );

	// Add secondary text color setting and control.
	$wp_customize->add_setting( 'secondary_text_color', array(
		'default'           => $color_scheme[5],
		'sanitize_callback' => 'sanitize_hex_color',
		'transport'         => 'postMessage',
	) );

	$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'secondary_text_color', array(
		'label'       => __( 'Secondary Text Color', 'blazeblog' ),
		'section'     => 'colors',
	) ) );
}
add_action( 'customize_register', 'blazeblog_customize_register' );

if ( ! function_exists( 'blazeblog_get_color_scheme_choices' ) ) :
    /**
     * Retrieves an array of color scheme choices registered for Twenty Sixteen.
     *
     * Create your own blazeblog_get_color_scheme_choices() function to override
     * in a child theme.
     *
     * @since BlazeBlog 1.0
     *
     * @return array Array of color schemes.
     */
    function blazeblog_get_color_scheme_choices() {
        $color_schemes                = blazeblog_get_color_schemes();
        $color_scheme_control_options = array();

        foreach ( $color_schemes as $color_scheme => $value ) {
            $color_scheme_control_options[ $color_scheme ] = $value['label'];
        }

        return $color_scheme_control_options;
    }
endif; // blazeblog_get_color_scheme_choices

if ( ! function_exists( 'blazeblog_sanitize_color_scheme' ) ) :
    /**
     * Handles sanitization for BlazeBlog color schemes.
     *
     * Create your own blazeblog_sanitize_color_scheme() function to override
     * in a child theme.
     *
     * @since BlazeBlog 1.0
     *
     * @param string $value Color scheme name value.
     * @return string Color scheme name.
     */
    function blazeblog_sanitize_color_scheme( $value ) {
        $color_schemes = blazeblog_get_color_scheme_choices();

        if ( ! array_key_exists( $value, $color_schemes ) ) {
            return 'default';
        }

        return $value;
    }
endif; // blazeblog_sanitize_color_scheme

if ( ! function_exists( 'blazeblog_sanitize_checkbox' ) ) {
    function blazeblog_sanitize_checkbox( $input ) {
        if ( $input == 1 ) {
            return 1;
        } else {
            return 0;
        }
    }
}

/**
 * Enqueues front-end CSS for color scheme.
 *
 * @since BlazeBlog 1.0
 *
 * @see wp_add_inline_style()
 */
function blazeblog_color_scheme_css() {
	$color_scheme_option = get_theme_mod( 'color_scheme', 'default' );

	// Don't do anything if the default color scheme is selected.
    //if ( 'default' === $color_scheme_option ) {
    //    return;
    //}

	$color_scheme = blazeblog_get_color_scheme();

	// Convert secondary text hex color to rgba.
	$color_textcolor_rgb = blazeblog_hex2rgb( $color_scheme[5] );

	// If the rgba values are empty return early.
	if ( empty( $color_textcolor_rgb ) ) {
		return;
	}

    $background_color = get_theme_mod('background_color', $color_scheme[0]);

    $background_color = (strpos($background_color, '#') === false ? '#'.$background_color : $background_color);

	// If we get this far, we have a custom color scheme.
	$colors = array(
		'background_color'          => $background_color,
		'page_background_color'     => get_theme_mod('page_background_color', $color_scheme[1]),
        'section_background_color'  => get_theme_mod('section_background_color', $color_scheme[2]),
		'link_color'                => get_theme_mod('link_color', $color_scheme[3]),
		'main_text_color'           => get_theme_mod('main_text_color', $color_scheme[4]),
		'secondary_text_color'      => get_theme_mod('secondary_text_color', $color_scheme[5]),
		'border_color'              => vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.2)', $color_textcolor_rgb ),

	);

	$color_scheme_css = blazeblog_get_color_scheme_css( $colors );

	wp_add_inline_style( 'blaze-style', $color_scheme_css );
}
add_action( 'wp_enqueue_scripts', 'blazeblog_color_scheme_css' );

/**
 * Render the site title for the selective refresh partial.
 *
 * @since BlazeBlog 1.0
 * @see blazeblog_customize_register()
 *
 * @return void
 */
function blazeblog_customize_partial_blogname() {
	bloginfo( 'name' );
}

/**
 * Render the site tagline for the selective refresh partial.
 *
 * @since BlazeBlog 1.0
 * @see blazeblog_customize_register()
 *
 * @return void
 */
function blazeblog_customize_partial_blogdescription() {
	bloginfo( 'description' );
}

function blazeblog_customize_control_js() {
	wp_enqueue_script( 'customizer-controls', get_template_directory_uri() . '/assets/js/customizer-controls.js', array( 'customize-controls', 'iris', 'underscore', 'wp-util' ), '20160225', true );
	wp_localize_script( 'customizer-controls', 'colorScheme', blazeblog_get_color_schemes() );
}
add_action( 'customize_controls_enqueue_scripts', 'blazeblog_customize_control_js' );

/**
 * Binds JS handlers to make the Customizer preview reload changes asynchronously.
 *
 * @since BlazeBlog 1.0
 */
function blazeblog_customize_preview_js() {
	wp_enqueue_script( 'ggfx-customize-preview', get_template_directory_uri() . '/assets/js/customize-preview.js', array( 'customize-preview' ), '20160312', true );
}
add_action( 'customize_preview_init', 'blazeblog_customize_preview_js' );

/**
 * Returns CSS for the color schemes.
 *
 * @since BlazeBlog 1.0
 *
 * @param array $colors Color scheme colors.
 * @return string Color scheme CSS.
 */
function blazeblog_get_color_scheme_css( $colors, $is_preview_template = false ) {
	$colors = wp_parse_args( $colors, array(
		'background_color'          => '',
		'page_background_color'     => '',
        'section_background_color'  => '',
		'link_color'                => '',
		'main_text_color'           => '',
		'secondary_text_color'      => '',
		'border_color'              => '',
	) );

    $scss = new scssc();

    $scss_code = "
body {
    background-color: {$colors['background_color']};
    color: {$colors['main_text_color']};
}

a {
    color: {$colors['link_color']};
}

    a:hover {
        color: {$colors['secondary_text_color']};
    }";

if ( get_theme_mod('blazeblog_hide_sitetitle') ) :
$scss_code .= ".site-title {
display: none;
}";
endif;

if ( get_theme_mod('blazeblog_hide_tagline') ) :
    $scss_code .= ".site-description {
display: none;
}";
endif;

if ( get_theme_mod( 'custom_logo', false ) ) :
    $scss_code .= ".site-icon-logo {
display: none;
}";
endif;

if(get_theme_mod( 'custom_logo' )) :
$scss_code .= "
@media (max-width: 460px) {
    .site-title,
    .site-description {
        display: none;
    }
}";
endif;

$scss_code .= "
@media (max-width: 640px) {
    .site-description {
        display: none;
    }
}

blockquote {
    border-left-color: {$colors['border_color']};
}";

if( get_theme_mod('blazeblog_page_background_transparent', false) ) :
    $scss_code .= "#container {
    background: none;
}";
else :
$scss_code .= "#container {
    background-color: {$colors['page_background_color']};
}";
endif;

if( get_theme_mod('blazeblog_page_background_shadow', false) ) :
    $scss_code .= "#container {
    box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.2);
}";
else :
    $scss_code .= "#container {
    box-shadow: none;
}";
endif;

$scss_code .= "header.page-header > .page-title {
    color: {$colors['main_text_color']};
    border-bottom: 1px solid {$colors['border_color']};
}

    header.page-header > .page-title:before {
        border: 1px solid {$colors['main_text_color']};
    }

.wp-caption p.wp-caption-text {
    color: {$colors['secondary_text_color']};
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    color: #21759b;
}

article.post, article.page {
    background-color: {$colors['section_background_color']};
}

    article.post > .entry-header > .entry-title,
    article.page > .entry-header > .entry-title {
        border-bottom: 1px solid {$colors['border_color']};
        color: {$colors['main_text_color']};
    }

        article.post > .entry-header > .entry-title:before,
        article.page > .entry-header > .entry-title:before {
            border: 1px solid {$colors['main_text_color']};
        }

        article.post > .entry-header > .entry-title > a,
        article.page > .entry-header > .entry-title > a {
            color: {$colors['main_text_color']};
        }

        article.post > .entry-header > .entry-title > a:hover,
        article.page > .entry-header > .entry-title > a:hover {
            color: {$colors['secondary_text_color']};
        }

        article.post > .entry-content .btn-read-more,
        article.page > .entry-content .btn-read-more{
            color: {$colors['link_color']};
            border: 1px solid {$colors['border_color']};
            background-color: {$colors['section_background_color']};
        }

        article.post > .entry-content .btn-read-more:hover,
        article.page > .entry-content .btn-read-more:hover{
            @if (lightness({$colors['link_color']}) > 50) {
            background-color: darken({$colors['section_background_color']}, 20%);
            } @else {
            background-color: lighten({$colors['section_background_color']}, 20%);
            }
            border: 1px solid {$colors['link_color']};
        }

    article.post > .entry-footer > span {
        background-color: transparentize({$colors['secondary_text_color']}, 90%);
        border-left: 2px solid {$colors['border_color']};
    }

    .rtl article.post > .entry-footer > span {
        border-left: 0;
        border-right: 2px solid {$colors['border_color']};
    }

        article.post > .entry-footer > span:hover {
            border-left: 2px solid {$colors['link_color']};
        }

        .rtl article.post > .entry-footer > span:hover {
            border-left: 0;
            border-right: 2px solid {$colors['link_color']};
        }

        article.post > .entry-footer > span.sticky-post,
        article.post > .entry-footer > span a,
        article.post > .entry-footer > span a.url.fn,
        article.post > .entry-footer > span > a {
            color: {$colors['secondary_text_color']};
        }

        article.post > .entry-footer > span.sticky-post {
            background-color: {$colors['link_color']};
            @if (lightness({$colors['link_color']}) > 50) {
            border-left: 2px solid darken({$colors['link_color']}, 20%);
            } @else {
            border-left: 2px solid lighten({$colors['link_color']}, 20%);
            }
            @if (lightness({$colors['link_color']}) > 50) {
            color: darken({$colors['link_color']}, 50%);
            } @else {
            color: lighten({$colors['link_color']}, 50%);
            }
        }

        .rtl article.post > .entry-footer > span.sticky-post {
            background-color: {$colors['link_color']};
            border-left: 0;
            @if (lightness({$colors['link_color']}) > 50) {
            border-right: 2px solid darken({$colors['link_color']}, 20%);
            } @else {
            border-right: 2px solid lighten({$colors['link_color']}, 20%);
            }
            @if (lightness({$colors['link_color']}) > 50) {
            color: darken({$colors['link_color']}, 50%);
            } @else {
            color: lighten({$colors['link_color']}, 50%);
            }
        }

.author-info {
    background-color: {$colors['section_background_color']};
}

.pagination, .post-navigation {
    background-color: {$colors['section_background_color']};
}

    .post-navigation a span.meta-nav {
        color: {$colors['main_text_color']};
    }

    .post-navigation .nav-previous > a,
    .post-navigation .nav-next > a {
        border-bottom: 1px solid {$colors['border_color']};
    }

    .page-links > .page-links-title,
    .page-links > a > .page-number,
    .pagination .nav-links .page-numbers {
        border: solid 1px {$colors['border_color']};
    }

        .page-links > .page-number,
        .pagination .nav-links .page-numbers.current {
            color: {$colors['main_text_color']};
            background-color: {$colors['section_background_color']};
            border: 1px solid {$colors['secondary_text_color']};
        }

.comments-area {
    background-color: {$colors['section_background_color']};
}

    .comments-area .media-list ul.children {
        border-top: 1px solid {$colors['border_color']};
    }

    .comments-area .media-list .comment-date > a {
        color: {$colors['secondary_text_color']};
        font-size: 12px;
    }

        .comments-area .media-list .comment-date > a:hover {
            color: {$colors['main_text_color']};
        }

.comment-navigation {
    border: solid 1px {$colors['border_color']};
    border-left: 0;
    border-right: 0;
}

.widget {
    background-color: {$colors['section_background_color']};
}

    .widget:before,
    .widget:after {
        border: 1px solid {$colors['main_text_color']};
    }

    .widget .widget-title {
        border-bottom: 1px solid {$colors['border_color']};
        color: {$colors['main_text_color']};
    }

    .widget ul li:before {
        color: {$colors['secondary_text_color']};
    }

    .widget ul li > a,
    .widget ul li.recentcomments {
        border-bottom: 1px solid {$colors['border_color']};
    }

    .widget .calendar_wrap > table > caption {
        background-color: #222222;
        color: #ffffff;
    }

    .widget .calendar_wrap > table,
    .widget .calendar_wrap > table th,
    .widget .calendar_wrap > table td {
        border: 1px solid {$colors['border_color']};
    }

    .widget .tagcloud > a {
        background-color: {$colors['section_background_color']};
        border: 1px solid {$colors['border_color']};
        color: {$colors['secondary_text_color']};
    }

        .widget .tagcloud > a:hover {
            color: {$colors['main_text_color']};
            border: 1px solid {$colors['main_text_color']};
        }

    .widget.widget_rss span.rss-date,
    .widget.widget_rss cite {
        color: {$colors['secondary_text_color']};
    }

    .widget #btn-searchbar {
        color: {$colors['link_color']};
        @if (lightness({$colors['link_color']}) > 50) {
        background-color: darken({$colors['section_background_color']}, 20%);
        } @else {
        background-color: lighten({$colors['section_background_color']}, 20%);
        }
        border: 1px solid {$colors['border_color']};
    }

    #footer .widget .tagcloud > a {
        background-color: {$colors['section_background_color']};
        border: 1px solid {$colors['border_color']};
        color: {$colors['secondary_text_color']};
    }

        #footer .widget .tagcloud > a:hover {
            color: {$colors['main_text_color']};
            border: 1px solid {$colors['main_text_color']};
        }
";

    if($is_preview_template)
        return $scss_code;
    else
        return $scss->compile($scss_code);
}

function blazeblog_compile_color_scheme_css() {
    $css = $_POST['data'];

    $scss = new scssc();

    $css = $scss->compile($css);
    echo $css;

    wp_die();
}
add_action( 'wp_ajax_blazeblog_compile_color_scheme_css', 'blazeblog_compile_color_scheme_css' );
add_action( 'wp_ajax_nopriv_blazeblog_compile_color_scheme_css', 'blazeblog_compile_color_scheme_css' );

/**
 * Outputs an Underscore template for generating CSS for the color scheme.
 *
 * The template generates the css dynamically for instant display in the
 * Customizer preview.
 *
 * @since BlazeBlog 1.0
 */
function blazeblog_color_scheme_css_template() {
	$colors = array(
		'background_color'          => '{{ data.background_color }}',
		'page_background_color'     => '{{ data.page_background_color }}',
        'section_background_color'  => '{{ data.section_background_color }}',
		'link_color'                => '{{ data.link_color }}',
		'main_text_color'           => '{{ data.main_text_color }}',
		'secondary_text_color'      => '{{ data.secondary_text_color }}',
		'border_color'              => '{{ data.border_color }}',
	);
?>
	<script type="text/html" id="tmpl-ggfx-color-scheme">
		<?php echo blazeblog_get_color_scheme_css( $colors, true ); ?>
	</script>
	<?php
}
add_action( 'customize_controls_print_footer_scripts', 'blazeblog_color_scheme_css_template' );