Customify – A Theme Customizer Booster - Version 1.4.2

Version Description

  • Improved Font style output in front-end. Now is just one style element with all the fonts inside.
  • Improved Fonts panels, now only one can be opened to avoid confusion
  • Fixed Presets with fonts
  • Fixed Google Fonts with italic weights
  • Fixed Range input field
  • Small Fixes
Download this release

Release Info

Developer euthelup
Plugin Icon Customify – A Theme Customizer Booster
Version 1.4.2
Comparing to
See all releases

Code changes from version 1.4.1 to 1.4.2

Files changed (8) hide show
  1. class-pixcustomify.php +68 -71
  2. customify.php +1 -1
  3. features/class-Font_Selector.php +127 -108
  4. features/customizer/controls/class-Pix_Customize_Font_Control.php +8 -5
  5. js/customizer.js +40 -3
  6. js/customizer_preview.js +122 -94
  7. languages/customify.pot +1 -1
  8. readme.txt +9 -1
class-pixcustomify.php CHANGED
@@ -20,7 +20,7 @@ class PixCustomifyPlugin {
20
  * @since 1.0.0
21
  * @const string
22
  */
23
- protected $version = '1.4.1';
24
  /**
25
  * Unique identifier for your plugin.
26
  * Use this value (not the variable name) as the text domain when internationalizing strings of text. It should
@@ -420,15 +420,15 @@ class PixCustomifyPlugin {
420
  continue;
421
  }
422
 
423
- $custom_css .= '@media ' . $media_query . " {\n";
424
 
425
  foreach ( $properties as $key => $property ) {
426
  $property_settings = $property['property'];
427
  $property_value = $property['value'];
428
- $custom_css .= "\t" . self::proccess_css_property( $property_settings, $property_value );
429
  }
430
 
431
- $custom_css .= "\n}\n";
432
 
433
  }
434
  }
@@ -436,11 +436,9 @@ class PixCustomifyPlugin {
436
  $custom_css .= "\n";
437
 
438
  //@todo maybe add a filter to this output ?>
439
- <style id="customify_output_style">
440
- <?php echo( $custom_css ); ?>
441
- </style>
442
- <?php
443
-
444
 
445
  /**
446
  * from now on we output only style tags only for the preview purpose
@@ -844,8 +842,10 @@ class PixCustomifyPlugin {
844
  if ( empty( $unit ) && in_array( $css_property['property'], self::$pixel_dependent_css_properties ) ) {
845
  $unit = 'px';
846
  }
 
 
847
 
848
- $this_property_output = $css_property['selector'] . ' { ' . $css_property['property'] . ': ' . $this_value . $unit . "; } \n";
849
 
850
  if ( isset( $css_property['callback_filter'] ) && function_exists( $css_property['callback_filter'] ) ) {
851
  $this_property_output = call_user_func( $css_property['callback_filter'], $this_value, $css_property['selector'], $css_property['property'], $unit );
@@ -871,29 +871,29 @@ class PixCustomifyPlugin {
871
  }
872
  ob_start();
873
 
874
- echo "\n" . $selector . " { \n";
875
  if ( isset( $value['background-image'] ) && ! empty( $value['background-image'] ) ) {
876
- echo "background-image: url( " . $value['background-image'] . ");\n";
877
  } else {
878
- echo "background-image: none;\n";
879
  }
880
 
881
  if ( isset( $value['background-repeat'] ) && ! empty( $value['background-repeat'] ) ) {
882
- echo "background-repeat:" . $value['background-repeat'] . ";\n";
883
  }
884
 
885
  if ( isset( $value['background-position'] ) && ! empty( $value['background-position'] ) ) {
886
- echo "background-position:" . $value['background-position'] . ";\n";
887
  }
888
 
889
  if ( isset( $value['background-size'] ) && ! empty( $value['background-size'] ) ) {
890
- echo "background-size:" . $value['background-size'] . ";\n";
891
  }
892
 
893
  if ( isset( $value['background-attachment'] ) && ! empty( $value['background-attachment'] ) ) {
894
- echo "background-attachment:" . $value['background-attachment'] . ";\n";
895
  }
896
- echo "\n}\n";
897
 
898
  return ob_get_clean();
899
  }
@@ -910,59 +910,56 @@ class PixCustomifyPlugin {
910
  $custom_css = ob_get_clean(); ?>
911
  <script type="text/javascript">
912
  /* <![CDATA[ */
913
- (function( $ ) {
914
- $( window ).load( function() {
915
- /**
916
- * @param iframe_id the id of the frame you whant to append the style
917
- * @param style_element the style element you want to append
918
- */
919
- var append_script_to_iframe = function( ifrm_id, scriptEl ) {
920
- var myIframe = document.getElementById( ifrm_id );
921
-
922
- var script = myIframe.contentWindow.document.createElement( "script" );
923
- script.type = "text/javascript";
924
- script.innerHTML = scriptEl.innerHTML;
925
-
926
- myIframe.contentWindow.document.head.appendChild( script );
927
- };
928
-
929
- var append_style_to_iframe = function( ifrm_id, styleElment ) {
930
- var ifrm = window.frames[ifrm_id];
931
- ifrm = ( ifrm.contentDocument || ifrm.contentDocument || ifrm.document );
932
- var head = ifrm.getElementsByTagName( 'head' )[0];
933
-
934
- if ( typeof styleElment !== "undefined" ) {
935
- head.appendChild( styleElment );
936
- }
937
- };
938
-
939
- var xmlString = <?php echo json_encode( str_replace( "\n", "", $custom_css ) ); ?>,
940
- parser = new DOMParser(),
941
- doc = parser.parseFromString( xmlString, "text/html" );
942
-
943
- if ( typeof window.frames['content_ifr'] !== 'undefined' ) {
944
-
945
- $.each( doc.head.childNodes, function( key, el ) {
946
-
947
- if ( typeof el !== "undefined" && typeof el.tagName !== "undefined" ) {
948
-
949
- switch ( el.tagName ) {
950
-
951
- case 'STYLE' :
952
- append_style_to_iframe( 'content_ifr', el );
953
- break;
954
-
955
- case 'SCRIPT' :
956
- append_script_to_iframe( 'content_ifr', el );
957
- break;
958
- default:
959
- break;
960
- }
961
- }
962
- } );
963
- }
964
- } );
965
- })( jQuery );
966
  /* ]]> */
967
  </script>
968
  <?php }
20
  * @since 1.0.0
21
  * @const string
22
  */
23
+ protected $version = '1.4.2';
24
  /**
25
  * Unique identifier for your plugin.
26
  * Use this value (not the variable name) as the text domain when internationalizing strings of text. It should
420
  continue;
421
  }
422
 
423
+ $custom_css .= '@media ' . $media_query . " { ";
424
 
425
  foreach ( $properties as $key => $property ) {
426
  $property_settings = $property['property'];
427
  $property_value = $property['value'];
428
+ $custom_css .= self::proccess_css_property( $property_settings, $property_value );
429
  }
430
 
431
+ $custom_css .= " }\n";
432
 
433
  }
434
  }
436
  $custom_css .= "\n";
437
 
438
  //@todo maybe add a filter to this output ?>
439
+ <style id="customify_output_style">
440
+ <?php echo( $custom_css ); ?>
441
+ </style><?php
 
 
442
 
443
  /**
444
  * from now on we output only style tags only for the preview purpose
842
  if ( empty( $unit ) && in_array( $css_property['property'], self::$pixel_dependent_css_properties ) ) {
843
  $unit = 'px';
844
  }
845
+ // lose the tons of tabs
846
+ $css_property['selector'] = trim(preg_replace('/\t+/', '', $css_property['selector'] ));
847
 
848
+ $this_property_output = $css_property['selector'] . ' { ' . $css_property['property'] . ': ' . $this_value . $unit . "; }\n";
849
 
850
  if ( isset( $css_property['callback_filter'] ) && function_exists( $css_property['callback_filter'] ) ) {
851
  $this_property_output = call_user_func( $css_property['callback_filter'], $this_value, $css_property['selector'], $css_property['property'], $unit );
871
  }
872
  ob_start();
873
 
874
+ echo $selector . " {";
875
  if ( isset( $value['background-image'] ) && ! empty( $value['background-image'] ) ) {
876
+ echo "background-image: url( " . $value['background-image'] . ");";
877
  } else {
878
+ echo "background-image: none;";
879
  }
880
 
881
  if ( isset( $value['background-repeat'] ) && ! empty( $value['background-repeat'] ) ) {
882
+ echo "background-repeat:" . $value['background-repeat'] . ";";
883
  }
884
 
885
  if ( isset( $value['background-position'] ) && ! empty( $value['background-position'] ) ) {
886
+ echo "background-position:" . $value['background-position'] . ";";
887
  }
888
 
889
  if ( isset( $value['background-size'] ) && ! empty( $value['background-size'] ) ) {
890
+ echo "background-size:" . $value['background-size'] . ";";
891
  }
892
 
893
  if ( isset( $value['background-attachment'] ) && ! empty( $value['background-attachment'] ) ) {
894
+ echo "background-attachment:" . $value['background-attachment'] . ";";
895
  }
896
+ echo "}\n";
897
 
898
  return ob_get_clean();
899
  }
910
  $custom_css = ob_get_clean(); ?>
911
  <script type="text/javascript">
912
  /* <![CDATA[ */
913
+ (function ($) {
914
+ $(window).load(function () {
915
+ /**
916
+ * @param iframe_id the id of the frame you whant to append the style
917
+ * @param style_element the style element you want to append
918
+ */
919
+ var append_script_to_iframe = function (ifrm_id, scriptEl) {
920
+ var myIframe = document.getElementById(ifrm_id);
921
+
922
+ var script = myIframe.contentWindow.document.createElement("script");
923
+ script.type = "text/javascript";
924
+ script.innerHTML = scriptEl.innerHTML;
925
+
926
+ myIframe.contentWindow.document.head.appendChild(script);
927
+ };
928
+
929
+ var append_style_to_iframe = function (ifrm_id, styleElment) {
930
+ var ifrm = window.frames[ifrm_id];
931
+ ifrm = ( ifrm.contentDocument || ifrm.contentDocument || ifrm.document );
932
+ var head = ifrm.getElementsByTagName('head')[0];
933
+
934
+ if (typeof styleElment !== "undefined") {
935
+ head.appendChild(styleElment);
936
+ }
937
+ };
938
+
939
+ var xmlString = <?php echo json_encode( str_replace( "\n", "", $custom_css ) ); ?>,
940
+ parser = new DOMParser(),
941
+ doc = parser.parseFromString(xmlString, "text/html");
942
+
943
+ if (typeof window.frames['content_ifr'] !== 'undefined') {
944
+
945
+ $.each(doc.head.childNodes, function (key, el) {
946
+ if (typeof el !== "undefined" && typeof el.tagName !== "undefined") {
947
+
948
+ switch (el.tagName) {
949
+ case 'STYLE' :
950
+ append_style_to_iframe('content_ifr', el);
951
+ break;
952
+ case 'SCRIPT' :
953
+ append_script_to_iframe('content_ifr', el);
954
+ break;
955
+ default:
956
+ break;
957
+ }
958
+ }
959
+ });
960
+ }
961
+ });
962
+ })(jQuery);
 
 
 
963
  /* ]]> */
964
  </script>
965
  <?php }
customify.php CHANGED
@@ -3,7 +3,7 @@
3
  Plugin Name: Customify
4
  Plugin URI: https://pixelgrade.com
5
  Description: A Theme Customizer Booster
6
- Version: 1.4.1
7
  Author: PixelGrade
8
  Author URI: https://pixelgrade.com
9
  Author Email: contact@pixelgrade.com
3
  Plugin Name: Customify
4
  Plugin URI: https://pixelgrade.com
5
  Description: A Theme Customizer Booster
6
+ Version: 1.4.2
7
  Author: PixelGrade
8
  Author URI: https://pixelgrade.com
9
  Author Email: contact@pixelgrade.com
features/class-Font_Selector.php CHANGED
@@ -12,6 +12,7 @@ class Customify_Font_Selector extends PixCustomifyPlugin {
12
  protected static $typo_settings = null;
13
  protected static $options_list = null;
14
  static $theme_fonts = null;
 
15
 
16
 
17
  function __construct( $parent ) {
@@ -67,8 +68,8 @@ class Customify_Font_Selector extends PixCustomifyPlugin {
67
 
68
  $args = array(
69
  'google_families' => '',
70
- 'local_families' => '',
71
- 'local_srcs' => '',
72
  );
73
 
74
  foreach ( self::$typo_settings as $id => $font ) {
@@ -175,40 +176,48 @@ class Customify_Font_Selector extends PixCustomifyPlugin {
175
 
176
  $this->output_font_style( $key, $font, $value );
177
  }
 
 
 
 
 
 
 
 
178
  }
179
 
180
  function display_webfont_script( $args ) { ?>
181
  <script type="text/javascript">
182
- var customify_font_loader = function () {
183
- var webfontargs = {
184
- classes: false,
185
- events: false
186
- };
187
  <?php if ( ! empty( $args['google_families'] ) ) { ?>
188
- webfontargs.google = { families: [<?php echo( rtrim( $args['google_families'], ',' ) ); ?>] };
189
  <?php }
190
  if ( ! empty( $args['local_families'] ) && ! empty( $args['local_srcs'] ) ) { ?>
191
- webfontargs.custom = {
192
- families: [<?php echo( rtrim( $args['local_families'], ',' ) ); ?>],
193
- urls: [<?php echo rtrim( $args['local_srcs'], ',' ) ?>]
194
- };
195
  <?php } ?>
196
- WebFont.load(webfontargs);
197
- };
198
-
199
- if ( typeof WebFont !== 'undefined' ) { <?php // if there is a WebFont object, use it ?>
200
- customify_font_loader();
201
- } else { <?php // basically when we don't have the WebFont object we create the google script dynamically ?>
202
- var tk = document.createElement('script');
203
- tk.src = '//ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
204
- tk.type = 'text/javascript';
205
-
206
- tk.onload = tk.onreadystatechange = function () {
207
- customify_font_loader();
208
- };
209
- var s = document.getElementsByTagName('script')[0];
210
- s.parentNode.insertBefore(tk, s);
211
- }
212
  </script>
213
  <?php
214
  }
@@ -227,102 +236,112 @@ class Customify_Font_Selector extends PixCustomifyPlugin {
227
  } else {
228
  $selected_variant = $value['selected_variants'];
229
  }
230
- } ?>
231
- <style id="customify_font_output_for_<?php echo $field; ?>">
232
- <?php
233
- if ( isset( $font['callback'] ) && function_exists( $font['callback'] ) ) {
234
- $output = call_user_func( $font['callback'], $value, $font );
235
- echo $output;
236
- } else {
237
- echo $font['selector'] . " {";
238
-
239
- // First handle the case where we have the font-family in the selected variant (usually this means a custom font from our Fonto plugin)
240
- if ( ! empty( $selected_variant ) && is_array( $selected_variant ) && ! empty( $selected_variant['font-family'] ) ) {
241
- //the variant's font-family
242
- $this->display_property( 'font-family', $selected_variant['font-family'] );
243
-
244
- if ( ! $load_all_weights ) {
245
- // if this is a custom font (like from our plugin Fonto) with individual styles & weights - i.e. the font-family says it all
246
- // we need to "force" the font-weight and font-style
247
- if ( ! empty( $value['type'] ) && 'custom_individual' == $value['type'] ) {
248
- $selected_variant['font-weight'] = '400 !important';
249
- $selected_variant['font-style'] = 'normal !important';
250
- }
251
 
252
- $italic_font = false;
253
 
254
- // output the font weight, if available
255
- if ( ! empty( $selected_variant['font-weight'] ) ) {
256
- echo ": " . $selected_variant['font-weight'] . ";\n";
257
- $italic_font = $this->display_weight_property( $selected_variant['font-weight'] );
258
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
259
 
260
- // output the font style, if available and if it wasn't displayed already
261
- if ( ! $italic_font && ! empty( $selected_variant['font-style'] ) ) {
262
- $this->display_property( 'font-style', $selected_variant['font-style'] );
263
- }
 
 
264
  }
265
 
266
- } elseif ( isset( $value['font_family'] ) ) {
267
- // the selected font family
268
- $this->display_property( 'font-family', $value['font_family'] );
269
-
270
- if ( ! empty( $selected_variant ) && ! $load_all_weights ) {
271
- $weight_and_style = strtolower( $selected_variant );
272
- $italic_font = false;
273
-
274
- //determine if this is an italic font (the $weight_and_style is usually like '400' or '400italic' )
275
- if ( ! empty( $weight_and_style ) ) {
276
- //a little bit of sanity check - in case it's not a number
277
- if( $weight_and_style === 'regular' ) {
278
- $weight_and_style = 'normal';
279
- }
280
- $italic_font = $this->display_weight_property( $weight_and_style );
281
- }
282
 
283
- // output the font style, if available
284
- if ( ! $italic_font && ! empty( $selected_variant['font-style'] ) ) {
285
- $this->display_property( 'font-style', $selected_variant['font-style'] );
 
 
 
 
 
 
286
  }
 
287
  }
288
- } else if ( isset( $value['font-family'] ) ) {
289
- $this->display_property( 'font-family', $value['font-family'] );
290
- }
291
 
292
- if ( ! empty( $value['font_weight'] ) ) {
293
- $italic_font = $this->display_weight_property( $value['font_weight'] );
 
 
294
  }
 
 
 
295
 
296
- if ( ! empty( $value['font_size'] ) ) {
297
- $unit = $this->get_field_unit( $font, 'font-size' );
298
- $this->display_property( 'font-size', $value['font_size'], $unit );
299
- }
300
 
301
- if ( ! empty( $value['line_height'] ) ) {
302
- $unit = $this->get_field_unit( $font, 'line-height' );
303
- $this->display_property( 'line-height', $value['line_height'], $unit );
304
- }
305
 
306
- if ( ! empty( $value['letter_spacing'] ) ) {
307
- $unit = $this->get_field_unit( $font, 'letter-spacing' );
308
- $this->display_property( 'letter-spacing', $value['letter_spacing'], $unit );
309
- }
310
 
311
- if ( ! empty( $value['text_align'] ) ) {
312
- $this->display_property( 'text-align', $value['text_align'] );
313
- }
 
314
 
315
- if ( ! empty( $value['text_transform'] ) ) {
316
- $this->display_property( 'text-transform', $value['text_transform'] );
317
- }
318
 
319
- if ( ! empty( $value['text_decoration'] ) ) {
320
- $this->display_property( 'text-decoration', $value['text_decoration'] );
321
- }
322
- echo "}\n";
323
- } ?>
324
- </style>
325
- <?php
 
 
 
 
 
 
 
 
 
 
 
 
 
326
  }
327
 
328
  function get_field_unit( $font, $field ) {
12
  protected static $typo_settings = null;
13
  protected static $options_list = null;
14
  static $theme_fonts = null;
15
+ protected $customify_CSS_output = array();
16
 
17
 
18
  function __construct( $parent ) {
68
 
69
  $args = array(
70
  'google_families' => '',
71
+ 'local_families' => '',
72
+ 'local_srcs' => '',
73
  );
74
 
75
  foreach ( self::$typo_settings as $id => $font ) {
176
 
177
  $this->output_font_style( $key, $font, $value );
178
  }
179
+
180
+ // in customizer the CSS is printed per option, in front-end we need to print them in bulk
181
+ if ( ! isset( $GLOBALS['wp_customize'] ) ) { ?>
182
+ <style id="customify_fonts_output">
183
+ <?php echo join( "\n", $this->customify_CSS_output ); ?>
184
+ </style><?php
185
+ return;
186
+ }
187
  }
188
 
189
  function display_webfont_script( $args ) { ?>
190
  <script type="text/javascript">
191
+ var customify_font_loader = function () {
192
+ var webfontargs = {
193
+ classes: false,
194
+ events: false
195
+ };
196
  <?php if ( ! empty( $args['google_families'] ) ) { ?>
197
+ webfontargs.google = {families: [<?php echo( rtrim( $args['google_families'], ',' ) ); ?>]};
198
  <?php }
199
  if ( ! empty( $args['local_families'] ) && ! empty( $args['local_srcs'] ) ) { ?>
200
+ webfontargs.custom = {
201
+ families: [<?php echo( rtrim( $args['local_families'], ',' ) ); ?>],
202
+ urls: [<?php echo rtrim( $args['local_srcs'], ',' ) ?>]
203
+ };
204
  <?php } ?>
205
+ WebFont.load(webfontargs);
206
+ };
207
+
208
+ if (typeof WebFont !== 'undefined') { <?php // if there is a WebFont object, use it ?>
209
+ customify_font_loader();
210
+ } else { <?php // basically when we don't have the WebFont object we create the google script dynamically ?>
211
+ var tk = document.createElement('script');
212
+ tk.src = '//ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
213
+ tk.type = 'text/javascript';
214
+
215
+ tk.onload = tk.onreadystatechange = function () {
216
+ customify_font_loader();
217
+ };
218
+ var s = document.getElementsByTagName('script')[0];
219
+ s.parentNode.insertBefore(tk, s);
220
+ }
221
  </script>
222
  <?php
223
  }
236
  } else {
237
  $selected_variant = $value['selected_variants'];
238
  }
239
+ }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
240
 
241
+ ob_start();
242
 
243
+ if ( isset( $font['callback'] ) && function_exists( $font['callback'] ) ) {
244
+ $output = call_user_func( $font['callback'], $value, $font );
245
+ echo $output;
246
+ } else {
247
+ echo $font['selector'] . " {";
248
+
249
+ // First handle the case where we have the font-family in the selected variant (usually this means a custom font from our Fonto plugin)
250
+ if ( ! empty( $selected_variant ) && is_array( $selected_variant ) && ! empty( $selected_variant['font-family'] ) ) {
251
+ //the variant's font-family
252
+ $this->display_property( 'font-family', $selected_variant['font-family'] );
253
+
254
+ if ( ! $load_all_weights ) {
255
+ // if this is a custom font (like from our plugin Fonto) with individual styles & weights - i.e. the font-family says it all
256
+ // we need to "force" the font-weight and font-style
257
+ if ( ! empty( $value['type'] ) && 'custom_individual' == $value['type'] ) {
258
+ $selected_variant['font-weight'] = '400 !important';
259
+ $selected_variant['font-style'] = 'normal !important';
260
+ }
261
 
262
+ $italic_font = false;
263
+
264
+ // output the font weight, if available
265
+ if ( ! empty( $selected_variant['font-weight'] ) ) {
266
+ echo ": " . $selected_variant['font-weight'] . ";\n";
267
+ $italic_font = $this->display_weight_property( $selected_variant['font-weight'] );
268
  }
269
 
270
+ // output the font style, if available and if it wasn't displayed already
271
+ if ( ! $italic_font && ! empty( $selected_variant['font-style'] ) ) {
272
+ $this->display_property( 'font-style', $selected_variant['font-style'] );
273
+ }
274
+ }
275
+
276
+ } elseif ( isset( $value['font_family'] ) ) {
277
+ // the selected font family
278
+ $this->display_property( 'font-family', $value['font_family'] );
 
 
 
 
 
 
 
279
 
280
+ if ( ! empty( $selected_variant ) && ! $load_all_weights ) {
281
+ $weight_and_style = strtolower( $selected_variant );
282
+ $italic_font = false;
283
+
284
+ //determine if this is an italic font (the $weight_and_style is usually like '400' or '400italic' )
285
+ if ( ! empty( $weight_and_style ) ) {
286
+ //a little bit of sanity check - in case it's not a number
287
+ if( $weight_and_style === 'regular' ) {
288
+ $weight_and_style = 'normal';
289
  }
290
+ $italic_font = $this->display_weight_property( $weight_and_style );
291
  }
 
 
 
292
 
293
+ // output the font style, if available
294
+ if ( ! $italic_font && ! empty( $selected_variant['font-style'] ) ) {
295
+ $this->display_property( 'font-style', $selected_variant['font-style'] );
296
+ }
297
  }
298
+ } else if ( isset( $value['font-family'] ) ) {
299
+ $this->display_property( 'font-family', $value['font-family'] );
300
+ }
301
 
302
+ if ( ! empty( $value['font_weight'] ) ) {
303
+ $italic_font = $this->display_weight_property( $value['font_weight'] );
304
+ }
 
305
 
306
+ if ( ! empty( $value['font_size'] ) ) {
307
+ $unit = $this->get_field_unit( $font, 'font-size' );
308
+ $this->display_property( 'font-size', $value['font_size'], $unit );
309
+ }
310
 
311
+ if ( ! empty( $value['line_height'] ) ) {
312
+ $unit = $this->get_field_unit( $font, 'line-height' );
313
+ $this->display_property( 'line-height', $value['line_height'], $unit );
314
+ }
315
 
316
+ if ( ! empty( $value['letter_spacing'] ) ) {
317
+ $unit = $this->get_field_unit( $font, 'letter-spacing' );
318
+ $this->display_property( 'letter-spacing', $value['letter_spacing'], $unit );
319
+ }
320
 
321
+ if ( ! empty( $value['text_align'] ) ) {
322
+ $this->display_property( 'text-align', $value['text_align'] );
323
+ }
324
 
325
+ if ( ! empty( $value['text_transform'] ) ) {
326
+ $this->display_property( 'text-transform', $value['text_transform'] );
327
+ }
328
+
329
+ if ( ! empty( $value['text_decoration'] ) ) {
330
+ $this->display_property( 'text-decoration', $value['text_decoration'] );
331
+ }
332
+ echo "}\n";
333
+ }
334
+
335
+ $CSS = ob_get_clean();
336
+
337
+ if ( isset( $GLOBALS['wp_customize'] ) ) { ?>
338
+ <style id="customify_font_output_for_<?php echo $field; ?>">
339
+ <?php $CSS ?>
340
+ </style><?php
341
+ return;
342
+ } else {
343
+ $this->customify_CSS_output[] = $CSS;
344
+ }
345
  }
346
 
347
  function get_field_unit( $font, $field ) {
features/customizer/controls/class-Pix_Customize_Font_Control.php CHANGED
@@ -92,13 +92,16 @@ class Pix_Customize_Font_Control extends Pix_Customize_Control {
92
  $this->load_google_fonts();
93
 
94
  // since 4.7 all the customizer data is saved in a post type named changeset this is how we get it.
95
- $changeset_data = $wp_customize->changeset_data();
 
96
 
97
- if ( isset( $changeset_data[$this->setting->id] ) ) {
98
- $this->current_value = $changeset_data[$this->setting->id]['value'];
99
- } else {
100
- $this->current_value = $this->value();
101
  }
 
 
102
  }
103
 
104
  /**
92
  $this->load_google_fonts();
93
 
94
  // since 4.7 all the customizer data is saved in a post type named changeset this is how we get it.
95
+ if ( method_exists( $wp_customize, 'changeset_data' ) ) {
96
+ $changeset_data = $wp_customize->changeset_data();
97
 
98
+ if ( isset( $changeset_data[$this->setting->id] ) ) {
99
+ $this->current_value = $changeset_data[$this->setting->id]['value'];
100
+ return;
101
+ }
102
  }
103
+
104
+ $this->current_value = $this->value();
105
  }
106
 
107
  /**
js/customizer.js CHANGED
@@ -193,9 +193,10 @@
193
  });
194
  }
195
 
196
- $(document).on('change', '.customize-control input.range-value', function () {
197
  var range = $(this).siblings('input[type="range"]');
198
  range.val($(this).val());
 
199
  });
200
 
201
  $(document).on('change', '.customify_typography_font_subsets', function ( ev ) {
@@ -322,7 +323,7 @@
322
  $('.js-section-navigation a').on( 'click', function(e) {
323
  e.preventDefault();
324
 
325
- var $sidebar = $('.wp-full-overlay-sidebar-content');
326
  var $parent = $(this).parents( '.accordion-section-content' );
327
  var href = $.attr(this, 'href');
328
 
@@ -333,6 +334,16 @@
333
  }
334
  });
335
  })();
 
 
 
 
 
 
 
 
 
 
336
  });
337
 
338
  /**
@@ -579,6 +590,19 @@
579
 
580
  family_select.trigger('change');
581
 
 
 
 
 
 
 
 
 
 
 
 
 
 
582
  } else {
583
  setting.set(value);
584
  }
@@ -967,6 +991,7 @@
967
  type = $(new_option).data('type');
968
 
969
  update_weight_field(new_option, wraper);
 
970
  update_subset_field(new_option, wraper);
971
 
972
  // serialize stuff and refresh
@@ -1065,10 +1090,17 @@
1065
  var setting_id = $(value_holder).data('customize-setting-link');
1066
  var setting = wpapi(setting_id);
1067
  setting.set(encodeValues(current_value));
1068
- // setting.trigger('change');
1069
  wpapi.previewer.send( 'font-changed' );
1070
  });
1071
  }
 
 
 
 
 
 
 
1072
  }
1073
 
1074
  /**
@@ -1229,7 +1261,12 @@
1229
  return encodeURIComponent(JSON.stringify(obj));
1230
  }
1231
 
 
 
 
 
1232
  return {
 
1233
  init: init,
1234
  update_font_value: update_font_value
1235
  };
193
  });
194
  }
195
 
196
+ $(document).on('change keyup', '.customize-control-range input.range-value', function () {
197
  var range = $(this).siblings('input[type="range"]');
198
  range.val($(this).val());
199
+ range.trigger('change');
200
  });
201
 
202
  $(document).on('change', '.customify_typography_font_subsets', function ( ev ) {
323
  $('.js-section-navigation a').on( 'click', function(e) {
324
  e.preventDefault();
325
 
326
+ var $sidebar = $( this ).parents( '.customize-pane-child' );
327
  var $parent = $(this).parents( '.accordion-section-content' );
328
  var href = $.attr(this, 'href');
329
 
334
  }
335
  });
336
  })();
337
+
338
+ (function() {
339
+ // Close a font field when clicking on another field
340
+ $( '.customify_font_tooltip' ).on( 'click', function() {
341
+ if ( $( this ).prop( 'checked' ) === true ) {
342
+ $( '.customify_font_tooltip' ).prop( 'checked', false );
343
+ $( this ).prop( 'checked', true );
344
+ }
345
+ });
346
+ })();
347
  });
348
 
349
  /**
590
 
591
  family_select.trigger('change');
592
 
593
+ } else if( !_.isUndefined(field_class) && field_class === 'font-options__wrapper' ) {
594
+
595
+ // if the values is a simple string it should be the font family
596
+ if ( _.isString( value ) ) {
597
+
598
+ var option = field.parent().find('option[value="' + value + '"]');
599
+
600
+ option.attr('selected', 'selected');
601
+ // option.parents('select').trigger('change');
602
+ } else if ( _.isObject(value) ) {
603
+ // @todo process each font property
604
+ }
605
+
606
  } else {
607
  setting.set(value);
608
  }
991
  type = $(new_option).data('type');
992
 
993
  update_weight_field(new_option, wraper);
994
+
995
  update_subset_field(new_option, wraper);
996
 
997
  // serialize stuff and refresh
1090
  var setting_id = $(value_holder).data('customize-setting-link');
1091
  var setting = wpapi(setting_id);
1092
  setting.set(encodeValues(current_value));
1093
+
1094
  wpapi.previewer.send( 'font-changed' );
1095
  });
1096
  }
1097
+
1098
+ var self = this;
1099
+ wpapi.previewer.bind('synced', function ( e ) {
1100
+ // setTimeout( function () {
1101
+ self.render_fonts();
1102
+ // },100);
1103
+ })
1104
  }
1105
 
1106
  /**
1261
  return encodeURIComponent(JSON.stringify(obj));
1262
  }
1263
 
1264
+ function render_fonts() {
1265
+ $( '.customify_font_family').select2().trigger('change')
1266
+ }
1267
+
1268
  return {
1269
+ render_fonts: render_fonts,
1270
  init: init,
1271
  update_font_value: update_font_value
1272
  };
js/customizer_preview.js CHANGED
@@ -1,38 +1,40 @@
1
- ;(function ( $, window, document, undefined ) {
2
- $(document).ready(function(){
 
 
 
3
  var api = parent.wp.customize,
4
  wp_settings = api.settings.settings;
5
 
6
  load_webfont_once();
7
 
8
- $.each( customify_settings.settings, function( key, el){
9
 
10
- if ( el.type === "font" ) {
11
  var sliced_id = key.slice(0, -1);
12
  sliced_id = sliced_id.replace(customify_settings.options_name + '[', '');
13
 
14
- api( key, function (setting) {
15
  setting.bind(function (to) {
16
- var $values = maybeJsonParse( to );
17
 
18
- if ( typeof $values.font_family !== "undefined" ) {
19
  maybeLoadFontFamily($values);
20
  }
21
 
22
- var vls = get_CSS_values( this.id, $values );
23
- var CSS = get_CSS_code( this.id, vls );
24
-
25
  var field_style = $('#customify_font_output_for_' + sliced_id);
26
 
27
- field_style.html( CSS );
28
  });
29
  });
30
- } else if ( typeof wp_settings[key] !== "undefined" && typeof el.css !== "undefined" && typeof el.live !== 'undefined' && el.live === true ) {
31
 
32
  var sliced_id = key.slice(0, -1);
33
  sliced_id = sliced_id.replace(customify_settings.options_name + '[', '');
34
 
35
- api( key, function (setting) {
36
 
37
  setting.bind(function (to) {
38
  var properties = [];
@@ -40,9 +42,8 @@
40
  $.each(el.css, function (counter, property_config) {
41
 
42
  properties[property_config.property] = property_config.selector;
43
- if ( typeof property_config.callback_filter !== "undefined" ) {
44
  properties['callback'] = property_config.callback_filter;
45
- // console.log(property_config);
46
  }
47
 
48
  var css_update_args = {
@@ -50,47 +51,49 @@
50
  propertyValue: to
51
  };
52
 
53
- if ( typeof this.unit !== 'undefined' ) {
54
  css_update_args.unit = this.unit;
55
  }
56
 
57
  var req_Exp_for_multiple_replace = new RegExp('-', 'g');
58
- $( '#dynamic_setting_' + sliced_id + '_property_' + property_config.property.replace(req_Exp_for_multiple_replace, '_') ).cssUpdate( css_update_args );
59
  });
60
 
61
  });
62
  });
63
- } else if ( typeof el.live === "object" && el.live.length > 0 ) {
64
  // if the live parameter is an object it means that is a list of css classes
65
  // these classes should be affected by the change of the text fields
66
  var field_class = el.live.join();
67
 
68
  // if this field is allowed to modify text then we'll edit this live
69
- if ( $.inArray( el.type, ['text', 'textarea', 'ace_editor']) > -1 ) {
70
- wp.customize( key, function( value ) {
71
- value.bind( function( text ) {
72
- $( field_class ).text( text );
73
- } );
74
- } );
 
 
75
  }
76
  }
77
  });
78
 
79
  /** Bind Custom Events **/
80
 
81
- api.previewer.bind('highlight',function(e){
82
- $('.customizerHighlight').removeClass('customizerHighlight');
83
-
84
- if ( $(e).length > 0 ) {
85
- $(e).each(function(){
86
- $(this).addClass('customizerHighlight');
87
- });
88
- }
89
- });
90
-
91
- api( 'live_css_edit', function (setting) {
92
  setting.bind(function (new_text) {
93
- $('#customify_css_editor_output' ).text(new_text);
94
  });
95
  });
96
 
@@ -98,80 +101,84 @@
98
  /*** HELPERS **/
99
 
100
  function load_webfont_once() {
101
- if ( typeof WebFont === "undefined" ) {
102
- var tk = document.createElement( 'script' );
103
  tk.src = '//ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
104
  tk.type = 'text/javascript';
105
- var s = document.getElementsByTagName( 'script' )[0];
106
- s.parentNode.insertBefore( tk, s );
107
  }
108
  }
109
 
110
- var get_CSS_values = function ( ID, $values ) {
111
 
112
  var store = {};
113
 
114
- if ( typeof $values.font_family !== "undefined" ) {
115
  store['font-family'] = $values.font_family;
116
  }
117
 
118
- if ( typeof $values.selected_variants !== "undefined" ) {
119
 
120
  var variants = null;
121
 
122
- if ( typeof $values.selected_variants !== "undefined" && $values.selected_variants !== null ) {
123
  variants = $values.selected_variants;
124
- } else if ( typeof $values.variants !== "undefined" && typeof $values.variants[0] !== "undefined" ) {
125
  variants = $values.variants[0];
126
  }
127
 
128
  // google fonts also have the italic string inside, split that
129
- if ( variants !== null && variants.indexOf('italic') !== -1 ) {
130
  store['font-style'] = 'italic';
131
- variants.replace('italic', '');
132
  }
133
 
134
- if ( variants !== "" ) {
 
 
 
 
135
  store['font-weight'] = variants;
136
  }
137
  }
138
 
139
- if ( typeof $values.font_size !== "undefined" ) {
140
- store['font-size'] = $values.font_size + get_field_unit( ID, 'font-size' );
141
  }
142
 
143
- if ( typeof $values.letter_spacing !== "undefined" ) {
144
- store['letter-spacing'] = $values.letter_spacing + get_field_unit( ID, 'letter-spacing' );
145
  }
146
 
147
- if ( typeof $values.line_height !== "undefined" ) {
148
- store['line-height'] = $values.line_height + get_field_unit( ID, 'line-height' );
149
  }
150
 
151
- if ( typeof $values.text_align !== "undefined" ) {
152
  store['text-align'] = $values.text_align;
153
  }
154
 
155
- if ( typeof $values.text_transform !== "undefined" ) {
156
  store['text-transform'] = $values.text_transform;
157
  }
158
- if ( typeof $values.text_decoration !== "undefined" ) {
159
  store['text-decoration'] = $values.text_decoration;
160
  }
161
 
162
  return store;
163
  };
164
 
165
- var get_CSS_code = function ( ID, $values ) {
166
 
167
  var field = customify_settings.settings[ID];
168
  var output = '';
169
 
170
- if ( typeof window !== "undefined" && typeof field.callback !== "undefined" && typeof window[field.callback] === "function" ) {
171
- output = window[field.callback]( $values, field );
172
  } else {
173
  output = field.selector + "{\n";
174
- $.each($values,function ( k,v ) {
175
  output += k + ': ' + v + ";\n";
176
  })
177
  output += "}\n";
@@ -180,85 +187,106 @@
180
  return output;
181
  };
182
 
183
- var get_field_unit = function ( ID, field ) {
184
  var unit = 'px';
185
- if ( typeof customify_settings.settings[ID] === "undefined" || typeof customify_settings.settings[ID].fields[field] === "undefined") {
186
  return unit;
187
  }
188
 
189
- if ( typeof customify_settings.settings[ID].fields[field].unit !=="undefined" ) {
190
  return customify_settings.settings[ID].fields[field].unit;
191
- } else if( typeof customify_settings.settings[ID].fields[field][3] !== "undefined" ) {
192
  // in case of an associative array
193
  return customify_settings.settings[ID].fields[field][3];
194
  }
195
  }
196
 
197
- var maybeLoadFontFamily = function( font ) {
198
 
199
- if ( typeof WebFont === "undefined" ) {
200
- var tk = document.createElement( 'script' );
201
  tk.src = '//ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
202
  tk.type = 'text/javascript';
203
- var s = document.getElementsByTagName( 'script' )[0];
204
- s.parentNode.insertBefore( tk, s );
205
  }
206
 
207
- if ( font.type === 'theme_font' ) {
208
- WebFont.load( {
209
  custom: {
210
- families: [ font.font_family ],
211
- urls: [ font.src ]
212
  }
213
  });
214
- } else if ( font.type === 'google' ) {
215
  var family = font.font_family,
216
- variants = null,
217
  subsets = null;
218
 
219
- if ( typeof font.variants !== "undefined" ) {
220
- variants = maybeJsonParse( font.variants );
221
 
222
- family = family + ':';
 
 
 
 
223
 
224
- $.each(variants,function ( k,v ) {
225
  family = family + v;
226
- if ( Object.keys(variants).length > (parseInt(k) + 1) ) {
 
227
  family = family + ',';
228
  }
229
  });
230
  }
231
 
232
- if ( typeof font.selected_subsets !== "undefined" ) {
233
- subsets = maybeJsonParse( font.selected_subsets );
234
 
235
- family = family + ':';
 
 
 
 
236
 
237
- $.each(subsets,function ( k,v ) {
238
  family = family + v;
239
- if ( Object.keys(subsets).length > (parseInt(k) + 1) ) {
 
240
  family = family + ',';
241
  }
242
  });
243
  }
244
 
245
- WebFont.load( {
246
- google: {families: [family]},
247
- classes: false,
248
- events: false
249
- } );
 
 
 
 
 
 
 
 
 
 
 
 
 
250
  } else {
251
  // else what?
252
  }
253
  }
254
 
255
- var maybeJsonParse = function ( value ) {
256
  var parsed;
257
 
258
  //try and parse it, with decodeURIComponent
259
  try {
260
  parsed = JSON.parse(decodeURIComponent(value));
261
- } catch ( e ) {
262
 
263
  // in case of an error, treat is as a string
264
  parsed = value;
@@ -267,4 +295,4 @@
267
  return parsed;
268
  };
269
  });
270
- })( jQuery, window, document );
1
+ ;(function ($, window, document, undefined) {
2
+
3
+ var fonts_cache = [];
4
+
5
+ $(document).ready(function () {
6
  var api = parent.wp.customize,
7
  wp_settings = api.settings.settings;
8
 
9
  load_webfont_once();
10
 
11
+ $.each(customify_settings.settings, function (key, el) {
12
 
13
+ if (el.type === "font") {
14
  var sliced_id = key.slice(0, -1);
15
  sliced_id = sliced_id.replace(customify_settings.options_name + '[', '');
16
 
17
+ api(key, function (setting) {
18
  setting.bind(function (to) {
19
+ var $values = maybeJsonParse(to);
20
 
21
+ if (typeof $values.font_family !== "undefined") {
22
  maybeLoadFontFamily($values);
23
  }
24
 
25
+ var vls = get_CSS_values(this.id, $values);
26
+ var CSS = get_CSS_code(this.id, vls);
 
27
  var field_style = $('#customify_font_output_for_' + sliced_id);
28
 
29
+ field_style.html(CSS);
30
  });
31
  });
32
+ } else if (typeof wp_settings[key] !== "undefined" && typeof el.css !== "undefined" && typeof el.live !== 'undefined' && el.live === true) {
33
 
34
  var sliced_id = key.slice(0, -1);
35
  sliced_id = sliced_id.replace(customify_settings.options_name + '[', '');
36
 
37
+ api(key, function (setting) {
38
 
39
  setting.bind(function (to) {
40
  var properties = [];
42
  $.each(el.css, function (counter, property_config) {
43
 
44
  properties[property_config.property] = property_config.selector;
45
+ if (typeof property_config.callback_filter !== "undefined") {
46
  properties['callback'] = property_config.callback_filter;
 
47
  }
48
 
49
  var css_update_args = {
51
  propertyValue: to
52
  };
53
 
54
+ if (typeof this.unit !== 'undefined') {
55
  css_update_args.unit = this.unit;
56
  }
57
 
58
  var req_Exp_for_multiple_replace = new RegExp('-', 'g');
59
+ $('#dynamic_setting_' + sliced_id + '_property_' + property_config.property.replace(req_Exp_for_multiple_replace, '_')).cssUpdate(css_update_args);
60
  });
61
 
62
  });
63
  });
64
+ } else if (typeof el.live === "object" && el.live.length > 0) {
65
  // if the live parameter is an object it means that is a list of css classes
66
  // these classes should be affected by the change of the text fields
67
  var field_class = el.live.join();
68
 
69
  // if this field is allowed to modify text then we'll edit this live
70
+ if ($.inArray(el.type, ['text', 'textarea', 'ace_editor']) > -1) {
71
+ wp.customize(key, function (value) {
72
+ value.bind(function (text) {
73
+ var sanitizer = document.createElement('div');
74
+ sanitizer.innerHTML = text;
75
+ $(field_class).html(text);
76
+ });
77
+ });
78
  }
79
  }
80
  });
81
 
82
  /** Bind Custom Events **/
83
 
84
+ // api.previewer.bind('highlight',function(e){
85
+ // $('.customizerHighlight').removeClass('customizerHighlight');
86
+ //
87
+ // if ( $(e).length > 0 ) {
88
+ // $(e).each(function(){
89
+ // $(this).addClass('customizerHighlight');
90
+ // });
91
+ // }
92
+ // });
93
+
94
+ api('live_css_edit', function (setting) {
95
  setting.bind(function (new_text) {
96
+ $('#customify_css_editor_output').text(new_text);
97
  });
98
  });
99
 
101
  /*** HELPERS **/
102
 
103
  function load_webfont_once() {
104
+ if (typeof WebFont === "undefined") {
105
+ var tk = document.createElement('script');
106
  tk.src = '//ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
107
  tk.type = 'text/javascript';
108
+ var s = document.getElementsByTagName('script')[0];
109
+ s.parentNode.insertBefore(tk, s);
110
  }
111
  }
112
 
113
+ var get_CSS_values = function (ID, $values) {
114
 
115
  var store = {};
116
 
117
+ if (typeof $values.font_family !== "undefined") {
118
  store['font-family'] = $values.font_family;
119
  }
120
 
121
+ if (typeof $values.selected_variants !== "undefined") {
122
 
123
  var variants = null;
124
 
125
+ if (typeof $values.selected_variants !== "undefined" && $values.selected_variants !== null) {
126
  variants = $values.selected_variants;
127
+ } else if (typeof $values.variants !== "undefined" && typeof $values.variants[0] !== "undefined") {
128
  variants = $values.variants[0];
129
  }
130
 
131
  // google fonts also have the italic string inside, split that
132
+ if (variants !== null && variants.indexOf('italic') !== -1) {
133
  store['font-style'] = 'italic';
134
+ variants = variants.replace('italic', '');
135
  }
136
 
137
+ if (variants !== "") {
138
+ if (variants === 'regular') {
139
+ variants = 'normal';
140
+ }
141
+
142
  store['font-weight'] = variants;
143
  }
144
  }
145
 
146
+ if (typeof $values.font_size !== "undefined") {
147
+ store['font-size'] = $values.font_size + get_field_unit(ID, 'font-size');
148
  }
149
 
150
+ if (typeof $values.letter_spacing !== "undefined") {
151
+ store['letter-spacing'] = $values.letter_spacing + get_field_unit(ID, 'letter-spacing');
152
  }
153
 
154
+ if (typeof $values.line_height !== "undefined") {
155
+ store['line-height'] = $values.line_height + get_field_unit(ID, 'line-height');
156
  }
157
 
158
+ if (typeof $values.text_align !== "undefined") {
159
  store['text-align'] = $values.text_align;
160
  }
161
 
162
+ if (typeof $values.text_transform !== "undefined") {
163
  store['text-transform'] = $values.text_transform;
164
  }
165
+ if (typeof $values.text_decoration !== "undefined") {
166
  store['text-decoration'] = $values.text_decoration;
167
  }
168
 
169
  return store;
170
  };
171
 
172
+ var get_CSS_code = function (ID, $values) {
173
 
174
  var field = customify_settings.settings[ID];
175
  var output = '';
176
 
177
+ if (typeof window !== "undefined" && typeof field.callback !== "undefined" && typeof window[field.callback] === "function") {
178
+ output = window[field.callback]($values, field);
179
  } else {
180
  output = field.selector + "{\n";
181
+ $.each($values, function (k, v) {
182
  output += k + ': ' + v + ";\n";
183
  })
184
  output += "}\n";
187
  return output;
188
  };
189
 
190
+ var get_field_unit = function (ID, field) {
191
  var unit = 'px';
192
+ if (typeof customify_settings.settings[ID] === "undefined" || typeof customify_settings.settings[ID].fields[field] === "undefined") {
193
  return unit;
194
  }
195
 
196
+ if (typeof customify_settings.settings[ID].fields[field].unit !== "undefined") {
197
  return customify_settings.settings[ID].fields[field].unit;
198
+ } else if (typeof customify_settings.settings[ID].fields[field][3] !== "undefined") {
199
  // in case of an associative array
200
  return customify_settings.settings[ID].fields[field][3];
201
  }
202
  }
203
 
204
+ var maybeLoadFontFamily = function (font) {
205
 
206
+ if (typeof WebFont === "undefined") {
207
+ var tk = document.createElement('script');
208
  tk.src = '//ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
209
  tk.type = 'text/javascript';
210
+ var s = document.getElementsByTagName('script')[0];
211
+ s.parentNode.insertBefore(tk, s);
212
  }
213
 
214
+ if (font.type === 'theme_font') {
215
+ WebFont.load({
216
  custom: {
217
+ families: [font.font_family],
218
+ urls: [font.src]
219
  }
220
  });
221
+ } else if (font.type === 'google') {
222
  var family = font.font_family,
223
+ variants = null,
224
  subsets = null;
225
 
226
+ if (typeof font.variants !== "undefined") {
227
+ variants = maybeJsonParse(font.variants);
228
 
229
+ $.each(variants, function (k, v) {
230
+
231
+ if (k === "0") {
232
+ family = family + ':';
233
+ }
234
 
 
235
  family = family + v;
236
+
237
+ if (Object.keys(variants).length > (parseInt(k) + 1)) {
238
  family = family + ',';
239
  }
240
  });
241
  }
242
 
243
+ if (typeof font.selected_subsets !== "undefined") {
244
+ subsets = maybeJsonParse(font.selected_subsets);
245
 
246
+ $.each(subsets, function (k, v) {
247
+
248
+ if (k === "0") {
249
+ family = family + ':';
250
+ }
251
 
 
252
  family = family + v;
253
+
254
+ if (Object.keys(subsets).length > (parseInt(k) + 1)) {
255
  family = family + ',';
256
  }
257
  });
258
  }
259
 
260
+ if (fonts_cache.indexOf(family) === -1) {
261
+ setTimeout(function(){
262
+ WebFont.load({
263
+ google: {families: [family]},
264
+ classes: false,
265
+ events: false,
266
+ error: function (e) {
267
+ console.log(e);
268
+ },
269
+ active: function () {
270
+ sessionStorage.fonts = true;
271
+ }
272
+ });
273
+ },10);
274
+
275
+ fonts_cache.push(family);
276
+ }
277
+
278
  } else {
279
  // else what?
280
  }
281
  }
282
 
283
+ var maybeJsonParse = function (value) {
284
  var parsed;
285
 
286
  //try and parse it, with decodeURIComponent
287
  try {
288
  parsed = JSON.parse(decodeURIComponent(value));
289
+ } catch (e) {
290
 
291
  // in case of an error, treat is as a string
292
  parsed = value;
295
  return parsed;
296
  };
297
  });
298
+ })(jQuery, window, document);
languages/customify.pot CHANGED
@@ -2,7 +2,7 @@
2
  # This file is distributed under the same license as the Customify package.
3
  msgid ""
4
  msgstr ""
5
- "Project-Id-Version: Customify 1.4.1\n"
6
  "Report-Msgid-Bugs-To: https://wordpress.org/support/plugin/customify\n"
7
  "POT-Creation-Date: 2017-02-13 13:29:14+00:00\n"
8
  "MIME-Version: 1.0\n"
2
  # This file is distributed under the same license as the Customify package.
3
  msgid ""
4
  msgstr ""
5
+ "Project-Id-Version: Customify 1.4.2\n"
6
  "Report-Msgid-Bugs-To: https://wordpress.org/support/plugin/customify\n"
7
  "POT-Creation-Date: 2017-02-13 13:29:14+00:00\n"
8
  "MIME-Version: 1.0\n"
readme.txt CHANGED
@@ -3,7 +3,7 @@ Contributors: pixelgrade, euthelup, babbardel, vlad.olaru, cristianfrumusanu, ra
3
  Tags: customizer, css, editor, live, preview, customise
4
  Requires at least: 4.5.0
5
  Tested up to: 4.7.2
6
- Stable tag: 1.4.1
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
@@ -37,6 +37,14 @@ With [Customify](https://github.com/pixelgrade/customify), developers can easily
37
 
38
  == Changelog ==
39
 
 
 
 
 
 
 
 
 
40
  = 1.4.1 =
41
  * Fixed Multiple local fonts
42
 
3
  Tags: customizer, css, editor, live, preview, customise
4
  Requires at least: 4.5.0
5
  Tested up to: 4.7.2
6
+ Stable tag: 1.4.2
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
37
 
38
  == Changelog ==
39
 
40
+ = 1.4.2 =
41
+ * Improved Font style output in front-end. Now is just one style element with all the fonts inside.
42
+ * Improved Fonts panels, now only one can be opened to avoid confusion
43
+ * Fixed Presets with fonts
44
+ * Fixed Google Fonts with italic weights
45
+ * Fixed Range input field
46
+ * Small Fixes
47
+
48
  = 1.4.1 =
49
  * Fixed Multiple local fonts
50