| 1 |
<?php |
| 2 |
|
| 3 |
class Customify_CSS_Live_Editor { |
| 4 |
|
| 5 |
/** |
| 6 |
* Instance of this class. |
| 7 |
* @since 1.0.0 |
| 8 |
* @var object |
| 9 |
*/ |
| 10 |
protected static $instance = null; |
| 11 |
|
| 12 |
protected function __construct() { |
| 13 |
|
| 14 |
add_action( 'customify_create_custom_control', array( $this,'cle_create_custom_control'), 10, 1 ); |
| 15 |
|
| 16 |
add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_admin_customizer_styles' ), 10); |
| 17 |
|
| 18 |
$load_location = PixCustomifyPlugin::get_plugin_option( 'style_resources_location', 'wp_head' ); |
| 19 |
add_action( $load_location, array( $this, 'output_dynamic_style' ), 999999999 ); |
| 20 |
|
| 21 |
//Check the WordPress version and if there are known problems disable it |
| 22 |
add_filter( 'customify_css_live_editor_enabled', array( $this, 'disable_if_wp_incompatible' ), 10, 1 ); |
| 23 |
} |
| 24 |
|
| 25 |
/** |
| 26 |
* Return an instance of this class. |
| 27 |
* @since 1.0.0 |
| 28 |
* @return object A single instance of this class. |
| 29 |
*/ |
| 30 |
public static function get_instance() { |
| 31 |
|
| 32 |
// If the single instance hasn't been set, set it now. |
| 33 |
if ( null == self::$instance ) { |
| 34 |
self::$instance = new self; |
| 35 |
} |
| 36 |
|
| 37 |
return self::$instance; |
| 38 |
} |
| 39 |
|
| 40 |
function enqueue_admin_customizer_styles(){ |
| 41 |
$dir = plugin_dir_url( __FILE__ ); |
| 42 |
|
| 43 |
$dir = rtrim( $dir, 'features/' ); |
| 44 |
|
| 45 |
wp_register_script('customify-ace-editor', $dir . '/js/ace/ace.js', array('jquery'), false, true); |
| 46 |
wp_enqueue_script('live-css-editor', $dir . '/js/live_css_editor.js', array('customify-ace-editor'), false, true); |
| 47 |
|
| 48 |
} |
| 49 |
|
| 50 |
function cle_create_custom_control( $wp_customize ) { |
| 51 |
// Allow others to short-circuit us |
| 52 |
if ( ! apply_filters( 'customify_css_live_editor_enabled', true ) ) { |
| 53 |
return; |
| 54 |
} |
| 55 |
|
| 56 |
$wp_customize->add_section( 'live_css_edit_section', array( |
| 57 |
'priority' => 11, |
| 58 |
'capability' => 'edit_theme_options', |
| 59 |
'title' => __('CSS Editor', 'customify_txtd'), |
| 60 |
) ); |
| 61 |
|
| 62 |
$saving_type = PixCustomifyPlugin::get_plugin_option( 'values_store_mod', 'option' ); |
| 63 |
|
| 64 |
$wp_customize->add_setting( 'live_css_edit', array( |
| 65 |
'type' => $saving_type, |
| 66 |
'label' => __('CSS Editor', 'customify_txtd'), |
| 67 |
'capability' => 'edit_theme_options', |
| 68 |
'transport' => 'postMessage', |
| 69 |
'default' => __("/* |
| 70 |
* Welcome to the Custom CSS Editor |
| 71 |
* |
| 72 |
* CSS (Cascading Style Sheets) is a language that helps |
| 73 |
* the browser render your website. You may remove these |
| 74 |
* lines and get started with your own customizations. |
| 75 |
* |
| 76 |
* The generated code will be placed after the theme |
| 77 |
* stylesheets, which means that your rules can take |
| 78 |
* precedence and override the theme CSS rules. Just |
| 79 |
* write here what you want to change, you don't need |
| 80 |
* to copy all your theme's stylesheet content. |
| 81 |
* |
| 82 |
* Getting started with CSS (tutorial): |
| 83 |
* http://bit.ly/css-getting-started |
| 84 |
*/ |
| 85 |
|
| 86 |
/* An example of a Custom CSS Snippet */ |
| 87 |
selector { |
| 88 |
color: green; |
| 89 |
}", 'customify_txtd') |
| 90 |
) ); |
| 91 |
|
| 92 |
$this_control = new Pix_Customize_CSS_Editor_Control( |
| 93 |
$wp_customize, |
| 94 |
'live_css_edit_control', |
| 95 |
array( |
| 96 |
'label' => __('Edit Live Css', 'customify_txtd'), |
| 97 |
'section' => 'live_css_edit_section', |
| 98 |
'settings' => 'live_css_edit', |
| 99 |
) |
| 100 |
); |
| 101 |
$wp_customize->add_control( $this_control ); |
| 102 |
} |
| 103 |
|
| 104 |
function output_dynamic_style() { |
| 105 |
// Allow others to short-circuit us |
| 106 |
if ( ! apply_filters( 'customify_css_live_editor_enabled', true ) ) { |
| 107 |
return; |
| 108 |
} |
| 109 |
|
| 110 |
$store_type = PixCustomifyPlugin::get_plugin_option( 'values_store_mod', 'option' ); |
| 111 |
if ( $store_type === 'option' ) { |
| 112 |
$output = get_option( 'live_css_edit' ); |
| 113 |
} elseif ( $store_type === 'theme_mod' ) { |
| 114 |
$output = get_theme_mod( 'live_css_edit' ); |
| 115 |
} |
| 116 |
|
| 117 |
if ( empty( $output ) ) { |
| 118 |
return; |
| 119 |
} ?> |
| 120 |
<style id="customify_css_editor_output"> |
| 121 |
<?php echo $output; ?> |
| 122 |
</style> |
| 123 |
<?php |
| 124 |
} |
| 125 |
|
| 126 |
function disable_if_wp_incompatible( $enabled ) { |
| 127 |
global $wp_version; |
| 128 |
|
| 129 |
// WordPress 4.7 introduced a Customizer CSS editor that conflicts with our own |
| 130 |
// It's best to leave only the one in core |
| 131 |
// So only load our CSS editor for WP version smaller than 4.7 |
| 132 |
// We use 4.6.9 to catch the release candidates also |
| 133 |
if ( version_compare( $wp_version, '4.6.9', '>=' ) ) { |
| 134 |
return false; |
| 135 |
} |
| 136 |
|
| 137 |
return $enabled; |
| 138 |
} |
| 139 |
} |
| 140 |
|
| 141 |
$customify_CSS_Editor = Customify_CSS_Live_Editor::get_instance(); |
| 142 |
|
| 143 |
|
| 144 |
|
| 145 |
|
