Customify – A Theme Customizer Booster - Version 1.7.2

Version Description

  • Fixed issue with Color Palettes working only after choosing one variation
  • Fixed bug preventing some options to live update the Customizer preview
Download this release

Release Info

Developer pixelgrade
Plugin Icon Customify – A Theme Customizer Booster
Version 1.7.2
Comparing to
See all releases

Code changes from version 1.7.1 to 1.7.2

Files changed (9) hide show
  1. class-pixcustomify.php +1 -1
  2. customify.php +2 -2
  3. includes/class-customify-style-manager.php +12 -8
  4. js/customizer.js +1 -1
  5. js/customizer/customify-palette-variations.js +48 -48
  6. js/customizer/customify-palettes.js +16 -4
  7. js/customizer_preview.js +3 -2
  8. js/jquery.cssUpdate.js +4 -25
  9. readme.txt +5 -1
class-pixcustomify.php CHANGED
@@ -573,7 +573,7 @@ class PixCustomifyPlugin {
573
  // We need to use a class because we may have multiple <style>s with the same "ID" for example
574
  // when targeting the same property but with different selectors.
575
  ?>
576
- <style class="dynamic_setting_<?php echo sanitize_html_class( $option_id ) . '_property_' . str_replace( '-', '_', $properties_set['property'] ); ?>"
577
  type="text/css"><?php
578
 
579
  if ( isset( $properties_set['media'] ) && ! empty( $properties_set['media'] ) ) {
573
  // We need to use a class because we may have multiple <style>s with the same "ID" for example
574
  // when targeting the same property but with different selectors.
575
  ?>
576
+ <style class="dynamic_setting_<?php echo sanitize_html_class( $option_id ) . '_property_' . str_replace( '-', '_', $properties_set['property'] ) . '_' . $key; ?>"
577
  type="text/css"><?php
578
 
579
  if ( isset( $properties_set['media'] ) && ! empty( $properties_set['media'] ) ) {
customify.php CHANGED
@@ -3,7 +3,7 @@
3
  Plugin Name: Customify
4
  Plugin URI: https://wordpress.org/plugins/customify/
5
  Description: A Theme Customizer Booster
6
- Version: 1.7.1
7
  Author: Pixelgrade
8
  Author URI: https://pixelgrade.com
9
  Author Email: contact@pixelgrade.com
@@ -61,7 +61,7 @@ function PixCustomifyPlugin() {
61
  */
62
  require_once( plugin_dir_path( __FILE__ ) . 'class-pixcustomify.php' );
63
 
64
- $instance = PixCustomifyPlugin::instance( __FILE__, '1.7.0' );
65
 
66
  return $instance;
67
  }
3
  Plugin Name: Customify
4
  Plugin URI: https://wordpress.org/plugins/customify/
5
  Description: A Theme Customizer Booster
6
+ Version: 1.7.2
7
  Author: Pixelgrade
8
  Author URI: https://pixelgrade.com
9
  Author Email: contact@pixelgrade.com
61
  */
62
  require_once( plugin_dir_path( __FILE__ ) . 'class-pixcustomify.php' );
63
 
64
+ $instance = PixCustomifyPlugin::instance( __FILE__, '1.7.2' );
65
 
66
  return $instance;
67
  }
includes/class-customify-style-manager.php CHANGED
@@ -362,13 +362,11 @@ class Customify_Style_Manager {
362
  foreach ( $current_palette_sets as $set ) {
363
  $current_palette .= '<div class="colors ' . $set . '">';
364
  foreach ( $master_color_controls_ids as $setting_id ) {
365
- if ( ! empty( $config['sections']['style_manager_section']['options'][ $setting_id ]['connected_fields'] ) ) {
366
- $current_palette .=
367
- '<div class="color ' . $setting_id . '" data-setting="' . $setting_id . '">' . PHP_EOL .
368
- '<div class="fill"></div>' . PHP_EOL .
369
- '<div class="picker"><i></i></div>' . PHP_EOL .
370
- '</div>' . PHP_EOL;
371
- }
372
  }
373
  $current_palette .= '</div>';
374
  }
@@ -1023,6 +1021,12 @@ class Customify_Style_Manager {
1023
  'custom' => $this->is_using_custom_color_palette(),
1024
  );
1025
 
 
 
 
 
 
 
1026
  return apply_filters( 'customify_style_manager_get_site_data', $site_data );
1027
  }
1028
 
@@ -1045,7 +1049,7 @@ class Customify_Style_Manager {
1045
  * @return string|false
1046
  */
1047
  protected function get_current_color_palette_variation() {
1048
- return get_option( 'sm_color_palette_variation', false );
1049
  }
1050
 
1051
  /**
362
  foreach ( $current_palette_sets as $set ) {
363
  $current_palette .= '<div class="colors ' . $set . '">';
364
  foreach ( $master_color_controls_ids as $setting_id ) {
365
+ $current_palette .=
366
+ '<div class="color ' . $setting_id . '" data-setting="' . $setting_id . '">' . PHP_EOL .
367
+ '<div class="fill"></div>' . PHP_EOL .
368
+ '<div class="picker"><i></i></div>' . PHP_EOL .
369
+ '</div>' . PHP_EOL;
 
 
370
  }
371
  $current_palette .= '</div>';
372
  }
1021
  'custom' => $this->is_using_custom_color_palette(),
1022
  );
1023
 
1024
+ // If there isn't a color palette selected, there is not point in having variation or custom.
1025
+ if ( empty( $site_data['color_palettes']['current'] ) ) {
1026
+ $site_data['color_palettes']['variation'] = false;
1027
+ $site_data['color_palettes']['custom'] = false;
1028
+ }
1029
+
1030
  return apply_filters( 'customify_style_manager_get_site_data', $site_data );
1031
  }
1032
 
1049
  * @return string|false
1050
  */
1051
  protected function get_current_color_palette_variation() {
1052
+ return get_option( 'sm_color_palette_variation', 'light' );
1053
  }
1054
 
1055
  /**
js/customizer.js CHANGED
@@ -1324,7 +1324,7 @@
1324
 
1325
  subsets = maybeJsonParse( subsets );
1326
 
1327
- if ( Object.keys( subsets ).length < 2 ) {
1328
  font_subsets.parent().hide();
1329
  } else {
1330
  font_subsets.parent().show();
1324
 
1325
  subsets = maybeJsonParse( subsets );
1326
 
1327
+ if ( typeof subsets != 'undefined' && Object.keys( subsets ).length < 2 ) {
1328
  font_subsets.parent().hide();
1329
  } else {
1330
  font_subsets.parent().show();
js/customizer/customify-palette-variations.js CHANGED
@@ -1,30 +1,30 @@
1
  window.variations = {
2
  'light': {
3
- 'sm_color_primary': 'sm_color_primary',
4
- 'sm_color_secondary': 'sm_color_secondary',
5
- 'sm_color_tertiary': 'sm_color_tertiary',
6
- 'sm_dark_primary': 'sm_dark_primary',
7
- 'sm_dark_secondary': 'sm_dark_secondary',
8
- 'sm_dark_tertiary': 'sm_dark_tertiary',
9
- 'sm_light_primary': 'sm_light_primary',
10
- 'sm_light_secondary': 'sm_light_secondary',
11
- 'sm_light_tertiary': 'sm_light_tertiary',
12
  },
13
  'dark': {
14
- 'sm_color_primary': 'sm_color_primary',
15
- 'sm_color_secondary': 'sm_color_secondary',
16
- 'sm_color_tertiary': 'sm_color_tertiary',
17
- 'sm_dark_primary': 'sm_light_primary',
18
- 'sm_dark_secondary': 'sm_light_secondary',
19
- 'sm_dark_tertiary': 'sm_light_tertiary',
20
- 'sm_light_primary': 'sm_dark_primary',
21
- 'sm_light_secondary': 'sm_dark_secondary',
22
- 'sm_light_tertiary': 'sm_dark_tertiary',
23
  },
24
  'colorful': {
25
- 'sm_color_primary': 'sm_light_primary',
26
- 'sm_color_secondary': 'sm_light_secondary',
27
- 'sm_color_tertiary': 'sm_light_tertiary',
28
  'sm_dark_primary': [],
29
  'sm_dark_secondary': [],
30
  'sm_dark_tertiary': [],
@@ -33,36 +33,36 @@ window.variations = {
33
  'sm_light_tertiary': ['sm_color_tertiary', 'sm_dark_tertiary'],
34
  },
35
  'dark_alt': {
36
- 'sm_color_primary': 'sm_light_primary',
37
- 'sm_color_secondary': 'sm_light_secondary',
38
- 'sm_color_tertiary': 'sm_light_tertiary',
39
- 'sm_dark_primary': 'sm_color_primary',
40
- 'sm_dark_secondary': 'sm_color_secondary',
41
- 'sm_dark_tertiary': 'sm_color_tertiary',
42
- 'sm_light_primary': 'sm_dark_primary',
43
- 'sm_light_secondary': 'sm_dark_secondary',
44
- 'sm_light_tertiary': 'sm_dark_tertiary',
45
  },
46
  'colorful_alt': {
47
- 'sm_color_primary': 'sm_dark_primary',
48
- 'sm_color_secondary': 'sm_dark_secondary',
49
- 'sm_color_tertiary': 'sm_dark_tertiary',
50
- 'sm_dark_primary': 'sm_light_primary',
51
- 'sm_dark_secondary': 'sm_light_secondary',
52
- 'sm_dark_tertiary': 'sm_light_tertiary',
53
- 'sm_light_primary': 'sm_color_primary',
54
- 'sm_light_secondary': 'sm_color_secondary',
55
- 'sm_light_tertiary': 'sm_color_tertiary',
56
  },
57
  'light_alt': {
58
- 'sm_color_primary': 'sm_dark_primary',
59
- 'sm_color_secondary': 'sm_dark_secondary',
60
- 'sm_color_tertiary': 'sm_dark_tertiary',
61
- 'sm_dark_primary': 'sm_color_primary',
62
- 'sm_dark_secondary': 'sm_color_secondary',
63
- 'sm_dark_tertiary': 'sm_color_tertiary',
64
- 'sm_light_primary': 'sm_light_primary',
65
- 'sm_light_secondary': 'sm_light_secondary',
66
- 'sm_light_tertiary': 'sm_light_tertiary',
67
  },
68
  };
1
  window.variations = {
2
  'light': {
3
+ 'sm_color_primary': ['sm_color_primary'],
4
+ 'sm_color_secondary': ['sm_color_secondary'],
5
+ 'sm_color_tertiary': ['sm_color_tertiary'],
6
+ 'sm_dark_primary': ['sm_dark_primary'],
7
+ 'sm_dark_secondary': ['sm_dark_secondary'],
8
+ 'sm_dark_tertiary': ['sm_dark_tertiary'],
9
+ 'sm_light_primary': ['sm_light_primary'],
10
+ 'sm_light_secondary': ['sm_light_secondary'],
11
+ 'sm_light_tertiary': ['sm_light_tertiary'],
12
  },
13
  'dark': {
14
+ 'sm_color_primary': ['sm_color_primary'],
15
+ 'sm_color_secondary': ['sm_color_secondary'],
16
+ 'sm_color_tertiary': ['sm_color_tertiary'],
17
+ 'sm_dark_primary': ['sm_light_primary'],
18
+ 'sm_dark_secondary': ['sm_light_secondary'],
19
+ 'sm_dark_tertiary': ['sm_light_tertiary'],
20
+ 'sm_light_primary': ['sm_dark_primary'],
21
+ 'sm_light_secondary': ['sm_dark_secondary'],
22
+ 'sm_light_tertiary': ['sm_dark_tertiary'],
23
  },
24
  'colorful': {
25
+ 'sm_color_primary': ['sm_light_primary'],
26
+ 'sm_color_secondary': ['sm_light_secondary'],
27
+ 'sm_color_tertiary': ['sm_light_tertiary'],
28
  'sm_dark_primary': [],
29
  'sm_dark_secondary': [],
30
  'sm_dark_tertiary': [],
33
  'sm_light_tertiary': ['sm_color_tertiary', 'sm_dark_tertiary'],
34
  },
35
  'dark_alt': {
36
+ 'sm_color_primary': ['sm_light_primary'],
37
+ 'sm_color_secondary': ['sm_light_secondary'],
38
+ 'sm_color_tertiary': ['sm_light_tertiary'],
39
+ 'sm_dark_primary': ['sm_color_primary'],
40
+ 'sm_dark_secondary': ['sm_color_secondary'],
41
+ 'sm_dark_tertiary': ['sm_color_tertiary'],
42
+ 'sm_light_primary': ['sm_dark_primary'],
43
+ 'sm_light_secondary': ['sm_dark_secondary'],
44
+ 'sm_light_tertiary': ['sm_dark_tertiary'],
45
  },
46
  'colorful_alt': {
47
+ 'sm_color_primary': ['sm_dark_primary'],
48
+ 'sm_color_secondary': ['sm_dark_secondary'],
49
+ 'sm_color_tertiary': ['sm_dark_tertiary'],
50
+ 'sm_dark_primary': ['sm_light_primary'],
51
+ 'sm_dark_secondary': ['sm_light_secondary'],
52
+ 'sm_dark_tertiary': ['sm_light_tertiary'],
53
+ 'sm_light_primary': ['sm_color_primary'],
54
+ 'sm_light_secondary': ['sm_color_secondary'],
55
+ 'sm_light_tertiary': ['sm_color_tertiary'],
56
  },
57
  'light_alt': {
58
+ 'sm_color_primary': ['sm_dark_primary'],
59
+ 'sm_color_secondary': ['sm_dark_secondary'],
60
+ 'sm_color_tertiary': ['sm_dark_tertiary'],
61
+ 'sm_dark_primary': ['sm_color_primary'],
62
+ 'sm_dark_secondary': ['sm_color_secondary'],
63
+ 'sm_dark_tertiary': ['sm_color_tertiary'],
64
+ 'sm_light_primary': ['sm_light_primary'],
65
+ 'sm_light_secondary': ['sm_light_secondary'],
66
+ 'sm_light_tertiary': ['sm_light_tertiary'],
67
  },
68
  };
js/customizer/customify-palettes.js CHANGED
@@ -82,10 +82,12 @@
82
  };
83
 
84
  const alterConnectedFields = swapMap => {
 
85
  _.each( swapMap, function( fromArray, to ) {
86
  if ( typeof wp.customize.settings.settings[to] !== "undefined" ) {
87
  let newConnectedFields = [];
88
  if ( fromArray instanceof Array ) {
 
89
  _.each( fromArray, function( from ) {
90
  if ( typeof window.settingsClone[from] !== "undefined" ) {
91
  let oldConnectedFields;
@@ -99,12 +101,18 @@
99
  newConnectedFields = Object.keys( newConnectedFields ).map( function(key) {
100
  return newConnectedFields[key];
101
  });
102
- } else {
103
- newConnectedFields = window.settingsClone[fromArray]['connected_fields'];
104
  }
105
  wp.customize.settings.settings[to]['connected_fields'] = newConnectedFields;
 
 
 
 
 
106
  }
107
  } );
 
 
 
108
  };
109
 
110
  const resetSettings = settings => {
@@ -171,7 +179,6 @@
171
  unbindConnectedFields();
172
  alterConnectedFields( variations[variation] );
173
  bindConnectedFields();
174
- resetSettings( settings );
175
  };
176
 
177
  const createCurrentPaletteControls = () => {
@@ -254,11 +261,16 @@
254
  const handleColorPalettes = () => {
255
  initializeColorPalettes();
256
  createCurrentPaletteControls();
 
257
  updateCurrentPalette();
258
  bindVariationChange();
259
 
260
  // when variation is changed reload connected fields from cached version of customizer settings config
261
- $( document ).on( 'change', '[name="_customize-radio-sm_color_palette_variation_control"]', reloadConnectedFields );
 
 
 
 
262
  $( document ).on( 'click', '.customify_preset.color_palette input', onPaletteChange );
263
  };
264
 
82
  };
83
 
84
  const alterConnectedFields = swapMap => {
85
+ let optionsToShow = [];
86
  _.each( swapMap, function( fromArray, to ) {
87
  if ( typeof wp.customize.settings.settings[to] !== "undefined" ) {
88
  let newConnectedFields = [];
89
  if ( fromArray instanceof Array ) {
90
+
91
  _.each( fromArray, function( from ) {
92
  if ( typeof window.settingsClone[from] !== "undefined" ) {
93
  let oldConnectedFields;
101
  newConnectedFields = Object.keys( newConnectedFields ).map( function(key) {
102
  return newConnectedFields[key];
103
  });
 
 
104
  }
105
  wp.customize.settings.settings[to]['connected_fields'] = newConnectedFields;
106
+
107
+
108
+ if ( fromArray instanceof Array && fromArray.length && newConnectedFields.length ) {
109
+ optionsToShow.push( to );
110
+ }
111
  }
112
  } );
113
+
114
+ let optionsSelector = '.' + optionsToShow.join( ', .' );
115
+ $( '.c-palette .color' ).addClass( 'hidden' ).filter( optionsSelector ).removeClass( 'hidden' );
116
  };
117
 
118
  const resetSettings = settings => {
179
  unbindConnectedFields();
180
  alterConnectedFields( variations[variation] );
181
  bindConnectedFields();
 
182
  };
183
 
184
  const createCurrentPaletteControls = () => {
261
  const handleColorPalettes = () => {
262
  initializeColorPalettes();
263
  createCurrentPaletteControls();
264
+ reloadConnectedFields();
265
  updateCurrentPalette();
266
  bindVariationChange();
267
 
268
  // when variation is changed reload connected fields from cached version of customizer settings config
269
+ $( document ).on( 'change', '[name="_customize-radio-sm_color_palette_variation_control"]', function() {
270
+ reloadConnectedFields();
271
+ resetSettings( settings );
272
+ });
273
+
274
  $( document ).on( 'click', '.customify_preset.color_palette input', onPaletteChange );
275
  };
276
 
js/customizer_preview.js CHANGED
@@ -42,7 +42,8 @@
42
 
43
  let css_update_args = {
44
  properties: properties,
45
- propertyValue: to
 
46
  };
47
 
48
  if (typeof this.unit !== 'undefined') {
@@ -51,7 +52,7 @@
51
 
52
  // Replace all dashes with underscores thus making the CSS property safe to us in a HTML ID.
53
  let regex_for_multiple_replace = new RegExp('-', 'g'),
54
- cssStyleSelector = '.dynamic_setting_' + el.html_safe_option_id + '_property_' + property_config.property.replace(regex_for_multiple_replace, '_');
55
 
56
  $(cssStyleSelector).cssUpdate(css_update_args);
57
  });
42
 
43
  let css_update_args = {
44
  properties: properties,
45
+ propertyValue: to,
46
+ negative_value: property_config.hasOwnProperty( 'negative_value' ) ? property_config['negative_value'] : false
47
  };
48
 
49
  if (typeof this.unit !== 'undefined') {
52
 
53
  // Replace all dashes with underscores thus making the CSS property safe to us in a HTML ID.
54
  let regex_for_multiple_replace = new RegExp('-', 'g'),
55
+ cssStyleSelector = '.dynamic_setting_' + el.html_safe_option_id + '_property_' + property_config.property.replace(regex_for_multiple_replace, '_') + '_' + counter;
56
 
57
  $(cssStyleSelector).cssUpdate(css_update_args);
58
  });
js/jquery.cssUpdate.js CHANGED
@@ -81,8 +81,8 @@
81
  var self = this,
82
  properties = settings.properties,
83
  new_value = settings.propertyValue,
84
- // if there is a negative property ... keep it negative
85
- is_negative = self.is_negative_property(property_name, properties, selectorText);
86
 
87
  var unit = '';
88
 
@@ -96,32 +96,11 @@
96
 
97
  if ( typeof window[settings.properties.callback] === "function" ) {
98
  window[settings.properties.callback](new_value, selectorText, property_name, unit);
 
99
  }
100
 
101
- return is_negative + new_value + unit;
102
  },
103
-
104
- /**
105
- * Check is the current property has a negative selector in our config
106
- * if this is true return the sign "-" which will be put in front of the value
107
- * @param property
108
- * @param current_properties
109
- * @param selectorText
110
- * @returns {string}
111
- */
112
- is_negative_property: function(property, current_properties, selectorText){
113
- if ( current_properties.hasOwnProperty(property) ) {
114
-
115
- if ( current_properties[property].hasOwnProperty('negative_selector') ) {
116
-
117
- if (current_properties[property].negative_selector == selectorText) {
118
- return '-';
119
- }
120
- }
121
- }
122
-
123
- return '';
124
- }
125
  };
126
 
127
  // Plugin wrapper
81
  var self = this,
82
  properties = settings.properties,
83
  new_value = settings.propertyValue,
84
+ // if there is a negative property ... keep it negative
85
+ sign = settings['negative_value'] ? '-' : '';
86
 
87
  var unit = '';
88
 
96
 
97
  if ( typeof window[settings.properties.callback] === "function" ) {
98
  window[settings.properties.callback](new_value, selectorText, property_name, unit);
99
+ return '';
100
  }
101
 
102
+ return sign + new_value + unit;
103
  },
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
104
  };
105
 
106
  // Plugin wrapper
readme.txt CHANGED
@@ -3,7 +3,7 @@ Contributors: pixelgrade, euthelup, babbardel, vlad.olaru, cristianfrumusanu, ra
3
  Tags: customizer, css, editor, live, preview, customizer
4
  Requires at least: 4.7.0
5
  Tested up to: 4.9.5
6
- Stable tag: 1.7.1
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
@@ -45,6 +45,10 @@ With [Customify](https://github.com/pixelgrade/customify), developers can easily
45
 
46
  == Changelog ==
47
 
 
 
 
 
48
  = 1.7.1 =
49
  * Fixed issue with **Color Palettes** overwriting custom colors in Live Preview
50
 
3
  Tags: customizer, css, editor, live, preview, customizer
4
  Requires at least: 4.7.0
5
  Tested up to: 4.9.5
6
+ Stable tag: 1.7.2
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
45
 
46
  == Changelog ==
47
 
48
+ = 1.7.2 =
49
+ * Fixed issue with **Color Palettes** working only after choosing one variation
50
+ * Fixed bug preventing some options to live update the Customizer preview
51
+
52
  = 1.7.1 =
53
  * Fixed issue with **Color Palettes** overwriting custom colors in Live Preview
54