- ';
+ foreach ( $args['links'] as $index => $link ) {
+
+ if ( $link['attrs'] ) {
+
+ $content .= '
- '; + + // Attribute mapping. + $attributes = ' target="_blank" '; + foreach ( $link['attrs'] as $attr => $attr_value ) { + $attributes .= ' ' . $attr . '="' . esc_attr( $attr_value ) . '" '; + } + + $content .= '' . esc_html( $link['text'] ) . ' '; + + $content .= ''; + + } + + } + + $content .= '
';
+
+ fields_html += '
';
+
+ radiate_field_wrap.html( fields_html );
+
+ $( '#' + control_element.params.name + '-tabs' ).tabs();
+
+ } else {
+
+ var result = control.generateFieldHtml( fields, field_values );
+
+ fields_html += result.html;
+
+ _.each(
+ result.controls,
+ function ( control_value, control_key ) {
+ control_types.push(
+ {
+ key : control_value.key,
+ value : control_value.value,
+ name : control_value.name
+ }
+ );
+ }
+ );
+
+ radiate_field_wrap.html( fields_html );
+
+ }
+
+ _.each(
+ control_types,
+ function ( control_type, index ) {
+
+ switch ( control_type.key ) {
+
+ case 'radiate-color':
+ control.initColorControl( radiate_field_wrap, control_element, control_type.name );
+ break;
+
+ case 'radiate-background':
+ control.initBackgroundControl( control_element, control_type, control_type.name );
+ break;
+
+ case 'radiate-typography':
+ control.initTypographyControl( control_element, control_type, control_type.name );
+ break;
+
+ }
+
+ }
+ );
+
+ wrap.find( '.radiate-field-settings-modal' ).data( 'loaded', true );
+
+ },
+
+ isJSONString : function ( string ) {
+
+ try {
+ JSON.parse( string );
+ } catch ( e ) {
+ return false;
+ }
+
+ return true;
+
+ },
+
+ generateFieldHtml : function ( fields_data, field_values ) {
+
+ var fields_html = '';
+ var control_types = [];
+
+ _.each(
+ fields_data,
+ function ( attr, index ) {
+
+ var new_value = (
+ wp.customize.control( attr.name ) ? wp.customize.control( attr.name ).params.value : ''
+ ),
+ control = attr.control,
+ template_id = 'customize-control-' + control + '-content',
+ template = wp.template( template_id ),
+ value = new_value || attr.default,
+ dataAtts = '',
+ input_attrs = '';
+
+ attr.value = value;
+ attr.title = attr.label;
+
+ // Data attributes.
+ _.each(
+ attr.data_attrs,
+ function ( value, name ) {
+ dataAtts += ' data-' + name + ' ="' + value + '"';
+ }
+ );
+
+ // Input attributes.
+ _.each(
+ attr.input_attrs,
+ function ( value, name ) {
+ input_attrs += name + ' ="' + value + '"';
+ }
+ );
+
+ attr.dataAttrs = dataAtts;
+ attr.inputAttrs = input_attrs;
+
+ control_types.push(
+ {
+ key : control,
+ value : value,
+ name : attr.name
+ }
+ );
+
+ var responsive_switchers = '',
+ controlsType = [
+ 'radiate-typography'
+ ];
+
+ if ( (
+ 'radiate-typography' === attr.control
+ ) && controlsType.includes( attr.control ) ) {
+ attr.languages = RadiateCustomizerControlTypographySubsets;
+ }
+
+ if ( controlsType.includes( attr.control ) ) {
+ responsive_switchers = 'has-responsive-switchers';
+ }
+
+ fields_html += '- ';
+ _.each(
+ fields.tabs,
+ function ( value, key ) {
+ var li_class = '';
+
+ if ( 0 === counter ) {
+ li_class = "active";
+ }
+
+ fields_html += '
- ' + key + ' '; + counter ++; + } + ); + fields_html += '
';
+ _.each(
+ fields.tabs,
+ function ( fields_data, key ) {
+
+ var result = control.generateFieldHtml( fields_data, field_values );
+
+ fields_html += '
';
+
+ fields_html += '';
+ fields_html += result.html;
+
+ _.each(
+ result.controls,
+ function ( control_value, control_key ) {
+ control_types.push(
+ {
+ key : control_value.key,
+ value : control_value.value,
+ name : control_value.name
+ }
+ );
+ }
+ );
+
+ fields_html += '
';
+
+ }
+ );
+ fields_html += '',r+='
",a.html(r),u("#"+n.params.name+"-tabs").tabs()):(t=i.generateFieldHtml(t,s),r+=t.html,_.each(t.controls,function(e,t){c.push({key:e.key,value:e.value,name:e.name})}),a.html(r)),_.each(c,function(e,t){switch(e.key){case"radiate-color":i.initColorControl(a,n,e.name);break;case"radiate-background":i.initBackgroundControl(n,e,e.name);break;case"radiate-typography":i.initTypographyControl(n,e,e.name)}}),e.find(".radiate-field-settings-modal").data("loaded",!0)},isJSONString:function(e){try{JSON.parse(e)}catch(e){return!1}return!0},generateFieldHtml:function(e,t){var c="",s=[];_.each(e,function(e,t){var n=wp.customize.control(e.name)?wp.customize.control(e.name).params.value:"",o=e.control,i="customize-control-"+o+"-content",i=wp.template(i),n=n||e.default,a="",r="";e.value=n,e.title=e.label,_.each(e.data_attrs,function(e,t){a+=" data-"+t+' ="'+e+'"'}),_.each(e.input_attrs,function(e,t){r+=t+' ="'+e+'"'}),e.dataAttrs=a,e.inputAttrs=r,s.push({key:o,value:n,name:e.name});o="",n=["radiate-typography"];"radiate-typography"===e.control&&n.includes(e.control)&&(e.languages=RadiateCustomizerControlTypographySubsets),n.includes(e.control)&&(o="has-responsive-switchers"),c+='- ',_.each(t.tabs,function(e,t){r+='
- '+t+" ",o++}),r+="
',_.each(t.tabs,function(e,t){e=i.generateFieldHtml(e,s);r+='
",r+="',r+=e.html,_.each(e.controls,function(e,t){c.push({key:e.key,value:e.value,name:e.name})}),r+="
"}),r+="
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+
+
+
+ json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ $this->json['choices'] = $this->choices;
+
+ $this->json['inputAttrs'] = '';
+ foreach ( $this->input_attrs as $attr => $value ) {
+ $this->json['inputAttrs'] .= $attr . '="' . esc_attr( $value ) . '" ';
+ }
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+
+
+
+
+
+
+
+
+
+ <# if ( data.value['background-image'] ) { #>
+ 
+
+ <# } else { #>
+
+ <# } #>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+ <# for ( key in data.choices ) { #>
+
+ <# } #>
+
+
+ get_assets_url() . '/assets/css/selectWoo' . $suffix . '.css',
+ array(),
+ RADIATE_THEME_VERSION
+ );
+
+ // Main CSS file.
+ wp_enqueue_style(
+ 'radiate-customize-controls',
+ $this->get_assets_url() . '/assets/css/customize-controls' . $suffix . '.css',
+ array( 'wp-color-picker' ),
+ RADIATE_THEME_VERSION
+ );
+ wp_style_add_data( 'radiate-customize-controls', 'rtl', 'replace' );
+
+ /**
+ * Enqueue required Customize Controls JS files.
+ */
+ // SelectWoo JS library file.
+ wp_enqueue_script(
+ 'selectWoo',
+ $this->get_assets_url() . '/assets/js/selectWoo' . $suffix . '.js',
+ array(),
+ RADIATE_THEME_VERSION,
+ true
+ );
+
+ // WP Color Picker Alpha JS library file.
+ wp_enqueue_script(
+ 'wp-color-picker-alpha',
+ $this->get_assets_url() . '/assets/js/wp-color-picker-alpha' . $suffix . '.js',
+ array(
+ 'wp-color-picker',
+ ),
+ RADIATE_THEME_VERSION,
+ true
+ );
+
+ // Main JS file.
+ wp_enqueue_script(
+ 'radiate-customize-controls',
+ $this->get_assets_url() . '/assets/js/customize-controls' . $suffix . '.js',
+ array(
+ 'jquery',
+ ),
+ RADIATE_THEME_VERSION,
+ true
+ );
+
+ }
+
+ public function get_assets_url() {
+ // Get correct URL and path to wp-content.
+ $content_url = untrailingslashit( dirname( dirname( get_stylesheet_directory_uri() ) ) );
+ $content_dir = wp_normalize_path( untrailingslashit( WP_CONTENT_DIR ) );
+
+ $url = str_replace( $content_dir, $content_url, wp_normalize_path( __DIR__ ) );
+ $url = set_url_scheme( $url );
+
+ return $url;
+ }
+
+}
diff --git a/inc/customizer/core/custom-controls/class-radiate-customize-base-control.php b/inc/customizer/core/custom-controls/class-radiate-customize-base-control.php
new file mode 100644
index 0000000..4667eda
--- /dev/null
+++ b/inc/customizer/core/custom-controls/class-radiate-customize-base-control.php
@@ -0,0 +1,105 @@
+register_control_type( $attributes['callback'] );
+ }
+
+ }
+
+ /**
+ * Returns control instance.
+ *
+ * @param string $control_type Control type.
+ *
+ * @return string
+ */
+ public static function get_control_instance( $control_type ) {
+
+ $control_class = self::get_control( $control_type );
+
+ if ( isset( $control_class['callback'] ) ) {
+ return class_exists( $control_class['callback'] ) ? $control_class['callback'] : false;
+ }
+
+ return false;
+
+ }
+
+ /**
+ * Returns control and its attributes.
+ *
+ * @param string $control_type Control type.
+ *
+ * @return array
+ */
+ public static function get_control( $control_type ) {
+
+ if ( isset( self::$controls[ $control_type ] ) ) {
+ return self::$controls[ $control_type ];
+ }
+
+ return array();
+
+ }
+
+ /**
+ * Returns santize callback for control.
+ *
+ * @param string $control Control type for customize option.
+ *
+ * @return string
+ */
+ public static function get_sanitize_callback( $control ) {
+
+ if ( isset( self::$controls[ $control ]['sanitize_callback'] ) ) {
+ return self::$controls[ $control ]['sanitize_callback'];
+ }
+
+ return false;
+
+ }
+
+}
+
+return new Radiate_Customize_Base_Control();
diff --git a/inc/customizer/core/custom-controls/color/class-radiate-color-control.php b/inc/customizer/core/custom-controls/color/class-radiate-color-control.php
new file mode 100644
index 0000000..9e3e1d1
--- /dev/null
+++ b/inc/customizer/core/custom-controls/color/class-radiate-color-control.php
@@ -0,0 +1,121 @@
+=' ) ) {
+ wp_localize_script(
+ 'wp-color-picker',
+ 'wpColorPickerL10n',
+ array(
+ 'clear' => esc_html__( 'Clear', 'radiate' ),
+ 'clearAriaLabel' => esc_html__( 'Clear color', 'radiate' ),
+ 'defaultString' => esc_html__( 'Default', 'radiate' ),
+ 'defaultAriaLabel' => esc_html__( 'Select default color', 'radiate' ),
+ 'pick' => esc_html__( 'Select Color', 'radiate' ),
+ 'defaultLabel' => esc_html__( 'Color value', 'radiate' ),
+ )
+ );
+ }
+ }
+
+ /**
+ * Refresh the parameters passed to the JavaScript via JSON.
+ *
+ * @see WP_Customize_Control::to_json()
+ */
+ public function to_json() {
+
+ parent::to_json();
+
+ $this->json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+ json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ $this->json['info'] = $this->info;
+ $this->json['links'] = $this->links;
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+
+
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+ <# if ( data.info ) { #>
+
+ {{{ data.info }}}
+
+ <# } #>
+
+ <# if ( data.links ) { #>
+ -
+ <# _.each( data.links, function( links, id ) { #>
+
- {{{ links.text }}} + <# } ) #> +
+ <# if ( data.placement == 'above' ) { #>
+
+ <# } #> + +
+ <# } #> +
+
+ json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ $dropdown = wp_dropdown_categories(
+ array(
+ 'echo' => false,
+ 'name' => '_customize-dropdown-categories-' . esc_attr( $this->id ),
+ 'show_option_none' => ' ',
+ 'option_none_value' => '-1',
+ 'selected' => esc_attr( $this->value() ),
+ )
+ );
+
+ // Add in the data link parameter for dropdown categories.
+ $dropdown = str_replace( '+ <# } #> + +
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+ <# if ( data.placement == 'below' ) { #>
+ + <# } #> +
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+ {{{ data.dropdown }}}
+
+
+ json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+
+ ';
+ $tmpl .= '- ';
+ $tmpl .= '
+
+
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+
+
+
+ 0 ) {
+ get_open_popup.trigger( 'click' );
+ }
+
+ if ( is_loaded ) {
+ parent_wrap.find( '.radiate-field-settings-modal' ).show();
+ } else {
+
+ var fields = control.params.radiate_fields,
+ modal_wrap = $( RadiateCustomizerControlGroup.group_modal_tmpl ),
+ device = $( '#customize-footer-actions .active' ).attr( 'data-device' );
+
+ parent_wrap.find( '.radiate-field-settings-wrap' ).append( modal_wrap );
+ parent_wrap.find( '.radiate-fields-wrap' ).attr( 'data-control', control.params.name );
+ control.radiate_render_field( parent_wrap, fields, control );
+ parent_wrap.find( '.radiate-field-settings-modal' ).show();
+
+ if ( 'mobile' === device ) {
+ $( '.control-wrap.mobile' ).addClass( 'active' );
+ $( '.responsive-switchers .preview-mobile' ).addClass( 'active' );
+
+ $( '.control-wrap.tablet, .control-wrap.desktop' ).removeClass( 'active' );
+ $( '.responsive-switchers .preview-tablet, .responsive-switchers .preview-desktop' ).removeClass( 'active' );
+ } else if ( 'tablet' === device ) {
+ $( '.control-wrap.tablet' ).addClass( 'active' );
+ $( '.responsive-switchers .preview-tablet' ).addClass( 'active' );
+
+ $( '.control-wrap.mobile, .control-wrap.desktop' ).removeClass( 'active' );
+ $( '.responsive-switchers .preview-mobile, .responsive-switchers .preview-desktop' ).removeClass( 'active' );
+ } else {
+ $( '.control-wrap.desktop' ).addClass( 'active' );
+ $( '.responsive-switchers .preview-desktop' ).addClass( 'active' );
+
+ $( '.control-wrap.mobile, .control-wrap.tablet' ).removeClass( 'active' );
+ $( '.responsive-switchers .preview-mobile, .responsive-switchers .preview-tablet' ).removeClass( 'active' );
+ }
+
+ }
+
+ }
+
+ $this.toggleClass( 'open' );
+
+ }
+ );
+
+ control.container.on(
+ 'click',
+ '.radiate-group-wrap > .customizer-text',
+ function ( e ) {
+
+ e.preventDefault();
+ e.stopPropagation();
+
+ $( this ).find( '.radiate-group-toggle-icon' ).trigger( 'click' );
+
+ }
+ );
+
+ },
+
+ radiate_render_field : function ( wrap, fields, control_element ) {
+
+ var control = this;
+ var radiate_field_wrap = wrap.find( '.radiate-fields-wrap' );
+ var fields_html = '';
+ var control_types = [];
+ var field_values = control.isJSONString( control_element.params.value ) ? JSON.parse( control_element.params.value ) : {};
+
+ if ( 'undefined' != typeof fields.tabs ) {
+
+ var counter = 0;
+ fields_html += '';
+
+ fields_html += '
';
+
+ radiate_field_wrap.html( fields_html );
+
+ $( '#' + control_element.params.name + '-tabs' ).tabs();
+
+ } else {
+
+ var result = control.generateFieldHtml( fields, field_values );
+
+ fields_html += result.html;
+
+ _.each(
+ result.controls,
+ function ( control_value, control_key ) {
+ control_types.push(
+ {
+ key : control_value.key,
+ value : control_value.value,
+ name : control_value.name
+ }
+ );
+ }
+ );
+
+ radiate_field_wrap.html( fields_html );
+
+ }
+
+ _.each(
+ control_types,
+ function ( control_type, index ) {
+
+ switch ( control_type.key ) {
+
+ case 'radiate-color':
+ control.initColorControl( radiate_field_wrap, control_element, control_type.name );
+ break;
+
+ case 'radiate-background':
+ control.initBackgroundControl( control_element, control_type, control_type.name );
+ break;
+
+ case 'radiate-typography':
+ control.initTypographyControl( control_element, control_type, control_type.name );
+ break;
+
+ }
+
+ }
+ );
+
+ wrap.find( '.radiate-field-settings-modal' ).data( 'loaded', true );
+
+ },
+
+ isJSONString : function ( string ) {
+
+ try {
+ JSON.parse( string );
+ } catch ( e ) {
+ return false;
+ }
+
+ return true;
+
+ },
+
+ generateFieldHtml : function ( fields_data, field_values ) {
+
+ var fields_html = '';
+ var control_types = [];
+
+ _.each(
+ fields_data,
+ function ( attr, index ) {
+
+ var new_value = (
+ wp.customize.control( attr.name ) ? wp.customize.control( attr.name ).params.value : ''
+ ),
+ control = attr.control,
+ template_id = 'customize-control-' + control + '-content',
+ template = wp.template( template_id ),
+ value = new_value || attr.default,
+ dataAtts = '',
+ input_attrs = '';
+
+ attr.value = value;
+ attr.title = attr.label;
+
+ // Data attributes.
+ _.each(
+ attr.data_attrs,
+ function ( value, name ) {
+ dataAtts += ' data-' + name + ' ="' + value + '"';
+ }
+ );
+
+ // Input attributes.
+ _.each(
+ attr.input_attrs,
+ function ( value, name ) {
+ input_attrs += name + ' ="' + value + '"';
+ }
+ );
+
+ attr.dataAttrs = dataAtts;
+ attr.inputAttrs = input_attrs;
+
+ control_types.push(
+ {
+ key : control,
+ value : value,
+ name : attr.name
+ }
+ );
+
+ var responsive_switchers = '',
+ controlsType = [
+ 'radiate-typography'
+ ];
+
+ if ( (
+ 'radiate-typography' === attr.control
+ ) && controlsType.includes( attr.control ) ) {
+ attr.languages = RadiateCustomizerControlTypographySubsets;
+ }
+
+ if ( controlsType.includes( attr.control ) ) {
+ responsive_switchers = 'has-responsive-switchers';
+ }
+
+ fields_html += '- ';
+ _.each(
+ fields.tabs,
+ function ( value, key ) {
+ var li_class = '';
+
+ if ( 0 === counter ) {
+ li_class = "active";
+ }
+
+ fields_html += '
- ' + key + ' '; + counter ++; + } + ); + fields_html += '
';
+ _.each(
+ fields.tabs,
+ function ( fields_data, key ) {
+
+ var result = control.generateFieldHtml( fields_data, field_values );
+
+ fields_html += '
';
+
+ fields_html += '';
+ fields_html += result.html;
+
+ _.each(
+ result.controls,
+ function ( control_value, control_key ) {
+ control_types.push(
+ {
+ key : control_value.key,
+ value : control_value.value,
+ name : control_value.name
+ }
+ );
+ }
+ );
+
+ fields_html += '
';
+
+ }
+ );
+ fields_html += '
+
+
+
+ json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+
+ json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+ $this->json['navigate_info'] = $this->navigate_info;
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+ ',
+ '{{{ data.navigate_info.target_label }}}',
+ ''
+ );
+ ?>
+
+ json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ $this->json['image_col'] = $this->image_col;
+
+ foreach ( $this->choices as $key => $value ) {
+ $this->json['choices'][ $key ] = $value['url'];
+ $this->json['choices_titles'][ $key ] = $value['label'];
+ }
+
+ $this->json['inputAttrs'] = '';
+ $this->json['labelStyle'] = '';
+ foreach ( $this->input_attrs as $attr => $value ) {
+ if ( 'style' !== $attr ) {
+ $this->json['inputAttrs'] .= $attr . '="' . esc_attr( $value ) . '" ';
+ } else {
+ $this->json['labelStyle'] = 'style="' . esc_attr( $value ) . '" ';
+ }
+ }
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+ <# for ( key in data.choices ) { #>
+ checked="checked"<# } #>
+ >
+
+
+ <# } #>
+
+
+ json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ $this->json['suffix'] = $this->suffix;
+
+ $this->json['inputAttrs'] = '';
+ foreach ( $this->input_attrs as $attr => $value ) {
+ $this->json['inputAttrs'] .= $attr . '="' . esc_attr( $value ) . '" ';
+ }
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+
+ json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ $this->json['choices'] = $this->choices;
+
+ $this->json['inputAttrs'] = '';
+ foreach ( $this->input_attrs as $attr => $value ) {
+ $this->json['inputAttrs'] .= $attr . '="' . esc_attr( $value ) . '" ';
+ }
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+ -
+ <# _.each( data.value, function( choiceID ) { #>
+ <# if ( data.choices[ choiceID ] ) { #>
+
- + + + {{{ data.choices[ choiceID ] }}} + + <# } #> + <# } ); #> + + <# _.each( data.choices, function( choiceLabel, choiceID ) { #> + <# if ( Array.isArray(data.value) && -1 === data.value.indexOf( choiceID ) ) { #> +
- + + + {{{ choiceLabel }}} + + <# } #> + <# } ); #> +
+
+ <# if ( data.link ) { #>
+
+
+ json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ $this->json['inputAttrs'] = '';
+ foreach ( $this->input_attrs as $attr => $value ) {
+ $this->json['inputAttrs'] .= $attr . '="' . esc_attr( $value ) . '" ';
+ }
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+
+ Doc
+
+
+ <# } #>
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+
+ get_system_fonts();
+ $google_fonts = $this->get_google_fonts();
+ $custom_fonts = $this->get_custom_fonts();
+ $google_font_subsets = Radiate_Fonts::get_google_font_subsets();
+ $localize_scripts = array(
+ 'standardfontslabel' => esc_html__( 'Standard Fonts', 'radiate' ),
+ 'googlefontslabel' => esc_html__( 'Google Fonts', 'radiate' ),
+ 'standard' => $standard_fonts,
+ 'google' => $google_fonts,
+ );
+
+ // If custom fonts is available,then add it for localization.
+ if ( ! empty( $custom_fonts ) ) {
+ $localize_scripts['customfontslabel'] = esc_html__( 'Custom Fonts', 'radiate' );
+ $localize_scripts['custom'] = $custom_fonts;
+ }
+
+ // Loading available fonts.
+ wp_localize_script(
+ 'radiate-customize-controls',
+ 'RadiateCustomizerControlTypography',
+ $localize_scripts
+ );
+
+ // Loading Google font subsets.
+ wp_localize_script(
+ 'radiate-customize-controls',
+ 'RadiateCustomizerControlTypographySubsets',
+ $google_font_subsets
+ );
+
+ }
+
+ /**
+ * Formats variants.
+ *
+ * @access protected
+ *
+ * @param array $variants The variants.
+ *
+ * @return array
+ */
+ protected function format_variants_array( $variants ) {
+
+ $font_variants = Radiate_Fonts::get_font_variants();
+ $variants_array = array();
+
+ foreach ( $variants as $variant ) {
+
+ if ( is_string( $variant ) ) {
+ $variants_array[] = array(
+ 'id' => $variant,
+ 'label' => isset( $font_variants[ $variant ] ) ? $font_variants[ $variant ] : $variant,
+ );
+ } elseif ( is_array( $variant ) && isset( $variant['id'] ) && isset( $variant['label'] ) ) {
+ $variants_array[] = $variant;
+ }
+ }
+
+ return $variants_array;
+
+ }
+
+ /**
+ * Gets standard fonts properly formatted for control.
+ */
+ public function get_system_fonts() {
+
+ $standard_fonts = Radiate_Fonts::get_system_fonts();
+ $standard_fonts_array = array();
+ $default_variants = $this->format_variants_array(
+ array(
+ 'regular',
+ 'italic',
+ )
+ );
+
+ foreach ( $standard_fonts as $key => $font ) {
+
+ $standard_fonts_array[] = array(
+ 'family' => $font['family'],
+ 'label' => $font['label'],
+ 'subsets' => array(),
+ 'variants' => ( isset( $font['variants'] ) ) ? $this->format_variants_array( $font['variants'] ) : $default_variants,
+ );
+
+ }
+
+ return $standard_fonts_array;
+
+ }
+
+ /**
+ * Gets Google fonts properly formatted for control.
+ */
+ public function get_google_fonts() {
+
+ // Get formatted array of google fonts.
+ $google_fonts = Radiate_Fonts::get_google_fonts();
+ $font_variants = Radiate_Fonts::get_font_variants();
+ $foogle_fonts__subsets = Radiate_Fonts::get_google_font_subsets();
+ $google_fonts_array = array();
+
+ foreach ( $google_fonts as $family => $args ) {
+
+ // Get label, variants, subsets of individual font.
+ $label = ( isset( $args['label'] ) ) ? $args['label'] : $family;
+ $variants = ( isset( $args['variants'] ) ) ? $args['variants'] : array( 'regular' );
+ $subsets = ( isset( $args['subsets'] ) ) ? $args['subsets'] : array();
+
+ $available_variants = array();
+ if ( is_array( $variants ) ) {
+ foreach ( $variants as $variant ) {
+ if ( array_key_exists( $variant, $font_variants ) ) {
+ $available_variants[] = array(
+ 'id' => $variant,
+ 'label' => $font_variants[ $variant ],
+ );
+ }
+ }
+ }
+
+ $available_subsets = array();
+ if ( is_array( $subsets ) ) {
+ foreach ( $subsets as $subset ) {
+ if ( array_key_exists( $subset, $foogle_fonts__subsets ) ) {
+ $available_subsets[] = array(
+ 'id' => $subset,
+ 'label' => $foogle_fonts__subsets[ $subset ],
+ );
+ }
+ }
+ }
+
+ $google_fonts_array[] = array(
+ 'family' => $family,
+ 'label' => $label,
+ 'variants' => $available_variants,
+ 'subsets' => $available_subsets,
+ );
+
+ }
+
+ return $google_fonts_array;
+
+ }
+
+ /**
+ * Gets custom fonts properly formatted for control.
+ */
+ public function get_custom_fonts() {
+
+ $custom_fonts = Radiate_Fonts::get_custom_fonts();
+ $custom_fonts_array = array();
+ $default_variants = $this->format_variants_array(
+ array(
+ 'regular',
+ 'italic',
+ )
+ );
+
+ foreach ( $custom_fonts as $key => $font ) {
+
+ $custom_fonts_array[] = array(
+ 'family' => $font['family'],
+ 'label' => $font['label'],
+ 'subsets' => array(),
+ 'variants' => ( isset( $font['variants'] ) ) ? $this->format_variants_array( $font['variants'] ) : $default_variants,
+ );
+
+ }
+
+ return $custom_fonts_array;
+
+ }
+
+ /**
+ * Refresh the parameters passed to the JavaScript via JSON.
+ *
+ * @see WP_Customize_Control::to_json()
+ */
+ public function to_json() {
+
+ parent::to_json();
+
+ $this->json['default'] = $this->setting->default;
+ if ( isset( $this->default ) ) {
+ $this->json['default'] = $this->default;
+ }
+ $this->json['value'] = $this->value();
+
+ $this->json['link'] = $this->get_link();
+ $this->json['id'] = $this->id;
+ $this->json['label'] = esc_html( $this->label );
+ $this->json['description'] = $this->description;
+
+ $this->json['choices'] = $this->choices;
+ $this->json['input_attrs'] = $this->input_attrs;
+ $this->json['languages'] = Radiate_Fonts::get_google_font_subsets();
+
+ }
+
+ /**
+ * 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
+ */
+ protected function content_template() {
+ ?>
+
+
+ <# if ( data.label ) { #>
+ {{{ data.label }}}
+ <# } #>
+
+ <# if ( data.description ) { #>
+ {{{ data.description }}}
+ <# } #>
+
+
+
+
+ <# if ( data.default['font-family'] ) { #>
+
+
+
+ render_content() for the internals.
+ */
+ protected function render() {
+
+ $id = 'customize-control-' . str_replace( array( '[', ']' ), array( '-', '' ), $this->id );
+ $class = 'customize-control has-responsive-switchers customize-control-' . $this->type;
+ ?>
+
+
+
+
+
+ <# if ( data.default['font-weight'] ) { #>
+
+
+
+
+
+
+ <# } #>
+
+ <# if ( data.default['subsets'] ) { #>
+
+
+
+
+
+
+ <# } #>
+
+ <# } #>
+
+ <# if ( data.default['font-size'] ) { #>
+
+
+
+
+
+
+ <# } #>
+
+ <# if ( data.default['line-height'] ) { #>
+ -
+
- + + +
- + + +
- + + +
+
+ value="{{ data.value['font-size']['desktop'] }}"
+ <# } else { #>
+ value="{{ data.default['font-size']['desktop'] }}"
+ <# } #>
+ <# if ( data.input_attrs && data.input_attrs['desktop'] ) { #>
+ <# if ( data.input_attrs['desktop']['font-size']['step'] ) { #>
+ step="{{ data.input_attrs['desktop']['font-size']['step'] }}"
+ <# } #>
+ <# if ( 0 == data.input_attrs['desktop']['font-size']['min'] || data.input_attrs['desktop']['font-size']['min'] ) { #>
+ min="{{ data.input_attrs['desktop']['font-size']['min'] }}"
+ <# } #>
+ <# if ( data.input_attrs['desktop']['font-size']['max'] ) { #>
+ max="{{ data.input_attrs['desktop']['font-size']['max'] }}"
+ <# } #>
+ <# } #>
+ />
+ px
+
+
+
+
+ value="{{ data.value['font-size']['tablet'] }}"
+ <# } else { #>
+ value="{{ data.default['font-size']['tablet'] }}"
+ <# } #>
+ <# if ( data.input_attrs && data.input_attrs['tablet'] ) { #>
+ <# if ( data.input_attrs['tablet']['font-size']['step'] ) { #>
+ step="{{ data.input_attrs['tablet']['font-size']['step'] }}"
+ <# } #>
+ <# if ( 0 == data.input_attrs['tablet']['font-size']['min'] || data.input_attrs['tablet']['font-size']['min'] ) { #>
+ min="{{ data.input_attrs['tablet']['font-size']['min'] }}"
+ <# } #>
+ <# if ( data.input_attrs['tablet']['font-size']['max'] ) { #>
+ max="{{ data.input_attrs['tablet']['font-size']['max'] }}"
+ <# } #>
+ <# } #>
+ />
+ px
+
+
+
+
+ value="{{ data.value['font-size']['mobile'] }}"
+ <# } else { #>
+ value="{{ data.default['font-size']['mobile'] }}"
+ <# } #>
+ <# if ( data.input_attrs && data.input_attrs['mobile'] ) { #>
+ <# if ( data.input_attrs['mobile']['font-size']['step'] ) { #>
+ step="{{ data.input_attrs['mobile']['font-size']['step'] }}"
+ <# } #>
+ <# if ( 0 == data.input_attrs['mobile']['font-size']['min'] || data.input_attrs['mobile']['font-size']['min'] ) { #>
+ min="{{ data.input_attrs['mobile']['font-size']['min'] }}"
+ <# } #>
+ <# if ( data.input_attrs['mobile']['font-size']['max'] ) { #>
+ max="{{ data.input_attrs['mobile']['font-size']['max'] }}"
+ <# } #>
+ <# } #>
+ />
+ px
+
+
+
+
+ <# } #>
+
+ <# if ( data.default['letter-spacing'] ) { #>
+ -
+
- + + +
- + + +
- + + +
+
+ value="{{ data.value['line-height']['desktop'] }}"
+ <# } else { #>
+ value="{{ data.default['line-height']['desktop'] }}"
+ <# } #>
+ <# if ( data.input_attrs && data.input_attrs['desktop'] ) { #>
+ <# if ( data.input_attrs['desktop']['line-height']['step'] ) { #>
+ step="{{ data.input_attrs['desktop']['line-height']['step'] }}"
+ <# } #>
+ <# if ( 0 == data.input_attrs['desktop']['line-height']['min'] || data.input_attrs['desktop']['line-height']['min'] ) { #>
+ min="{{ data.input_attrs['desktop']['line-height']['min'] }}"
+ <# } #>
+ <# if ( data.input_attrs['desktop']['line-height']['max'] ) { #>
+ max="{{ data.input_attrs['desktop']['line-height']['max'] }}"
+ <# } #>
+ <# } #>
+ />
+
+
+
+
+ value="{{ data.value['line-height']['tablet'] }}"
+ <# } else { #>
+ value="{{ data.default['line-height']['tablet'] }}"
+ <# } #>
+ <# if ( data.input_attrs && data.input_attrs['tablet'] ) { #>
+ <# if ( data.input_attrs['tablet']['line-height']['step'] ) { #>
+ step="{{ data.input_attrs['tablet']['line-height']['step'] }}"
+ <# } #>
+ <# if ( 0 == data.input_attrs['tablet']['line-height']['min'] || data.input_attrs['tablet']['line-height']['min'] ) { #>
+ min="{{ data.input_attrs['tablet']['line-height']['min'] }}"
+ <# } #>
+ <# if ( data.input_attrs['tablet']['line-height']['max'] ) { #>
+ max="{{ data.input_attrs['tablet']['line-height']['max'] }}"
+ <# } #>
+ <# } #>
+ />
+
+
+
+
+ value="{{ data.value['line-height']['mobile'] }}"
+ <# } else { #>
+ value="{{ data.default['line-height']['mobile'] }}"
+ <# } #>
+ <# if ( data.input_attrs && data.input_attrs['mobile'] ) { #>
+ <# if ( data.input_attrs['mobile']['line-height']['step'] ) { #>
+ step="{{ data.input_attrs['mobile']['line-height']['step'] }}"
+ <# } #>
+ <# if ( 0 == data.input_attrs['mobile']['line-height']['min'] || data.input_attrs['mobile']['line-height']['min'] ) { #>
+ min="{{ data.input_attrs['mobile']['line-height']['min'] }}"
+ <# } #>
+ <# if ( data.input_attrs['mobile']['line-height']['max'] ) { #>
+ max="{{ data.input_attrs['mobile']['line-height']['max'] }}"
+ <# } #>
+ <# } #>
+ />
+
+
+
+
+ <# } #>
+
+ <# if ( data.default['font-style'] ) { #>
+ -
+
- + + +
- + + +
- + + +
+
+ value="{{ data.value['letter-spacing']['desktop'] }}"
+ <# } else { #>
+ value="{{ data.default['letter-spacing']['desktop'] }}"
+ <# } #>
+ <# if ( data.input_attrs && data.input_attrs['desktop'] ) { #>
+ <# if ( data.input_attrs['desktop']['letter-spacing']['step'] ) { #>
+ step="{{ data.input_attrs['desktop']['letter-spacing']['step'] }}"
+ <# } #>
+ <# if ( 0 == data.input_attrs['desktop']['letter-spacing']['min'] || data.input_attrs['desktop']['letter-spacing']['min'] ) { #>
+ min="{{ data.input_attrs['desktop']['letter-spacing']['min'] }}"
+ <# } #>
+ <# if ( data.input_attrs['desktop']['letter-spacing']['max'] ) { #>
+ max="{{ data.input_attrs['desktop']['letter-spacing']['max'] }}"
+ <# } #>
+ <# } #>
+ />
+ px
+
+
+
+
+ value="{{ data.value['letter-spacing']['tablet'] }}"
+ <# } else { #>
+ value="{{ data.default['letter-spacing']['tablet'] }}"
+ <# } #>
+ <# if ( data.input_attrs && data.input_attrs['tablet'] ) { #>
+ <# if ( data.input_attrs['tablet']['letter-spacing']['step'] ) { #>
+ step="{{ data.input_attrs['tablet']['letter-spacing']['step'] }}"
+ <# } #>
+ <# if ( 0 == data.input_attrs['tablet']['letter-spacing']['min'] || data.input_attrs['tablet']['letter-spacing']['min'] ) { #>
+ min="{{ data.input_attrs['tablet']['letter-spacing']['min'] }}"
+ <# } #>
+ <# if ( data.input_attrs['tablet']['letter-spacing']['max'] ) { #>
+ max="{{ data.input_attrs['tablet']['letter-spacing']['max'] }}"
+ <# } #>
+ <# } #>
+ />
+ px
+
+
+
+
+ value="{{ data.value['letter-spacing']['mobile'] }}"
+ <# } else { #>
+ value="{{ data.default['letter-spacing']['mobile'] }}"
+ <# } #>
+ <# if ( data.input_attrs && data.input_attrs['mobile'] ) { #>
+ <# if ( data.input_attrs['mobile']['letter-spacing']['step'] ) { #>
+ step="{{ data.input_attrs['mobile']['letter-spacing']['step'] }}"
+ <# } #>
+ <# if ( 0 == data.input_attrs['mobile']['letter-spacing']['min'] || data.input_attrs['mobile']['letter-spacing']['min'] ) { #>
+ min="{{ data.input_attrs['mobile']['letter-spacing']['min'] }}"
+ <# } #>
+ <# if ( data.input_attrs['mobile']['letter-spacing']['max'] ) { #>
+ max="{{ data.input_attrs['mobile']['letter-spacing']['max'] }}"
+ <# } #>
+ <# } #>
+ />
+ px
+
+
+
+
+ <# } #>
+
+ <# if ( data.default['text-transform'] ) { #>
+
+
+
+
+
+
+ <# } #>
+
+ <# if ( data.default['text-decoration'] ) { #>
+
+
+
+
+
+
+ <# } #>
+
+
+
+
+
+
+