Skip to content

Commit 89ce801

Browse files
author
Askupa Software
committed
Added support for loading the compiled css as an external stylesheet
1 parent a114583 commit 89ce801

File tree

5 files changed

+153
-67
lines changed

5 files changed

+153
-67
lines changed

‎README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
**Contributors:** ykadosh
77
**Tags:** theme, mods, wordpress, dynamic, css, stylesheet
88
**Tested up to:** 4.4.2
9-
**Stable tag:** 1.0.0
9+
**Stable tag:** 1.0.1
1010
**License:** GPLv3 or later
1111
**License URI:** http://www.gnu.org/licenses/gpl-3.0.html
1212

‎bootstrap.php‎

Lines changed: 11 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -13,47 +13,22 @@
1313
* Plugin Name: WordPress Dynamic CSS
1414
* Plugin URI: https://github.com/askupasoftware/wp-dynamic-css
1515
* Description: Dynamic CSS compiler for WordPress
16-
* Version: 1.0.0
16+
* Version: 1.0.1
1717
* Author: Askupa Software
1818
* Author URI: http://www.askupasoftware.com
1919
* Text Domain: wp-dynamic-css
2020
* Domain Path: /languages
2121
*/
2222

2323
require_once 'compiler.php';
24+
require_once 'functions.php';
2425

25-
if( !function_exists('wp_dynamic_css_enqueue') )
26-
{
27-
/**
28-
* Enqueue a dynamic stylesheet
29-
*
30-
* This will print the compiled version of the stylesheet to the document's
31-
* <head> section.
32-
*
33-
* @param string $path The absolute path to the dynamic CSS file
34-
*/
35-
function wp_dynamic_css_enqueue( $path )
36-
{
37-
$dcss = DynamicCSSCompiler::get_instance();
38-
$dcss->enqueue_style( $path );
39-
}
40-
}
41-
42-
if( !function_exists('wp_dynamic_css_set_callback') )
43-
{
44-
/**
45-
* Set the value retrieval callback function
46-
*
47-
* Set a callback function that will be used to get the values of the
48-
* variables when the dynamic CSS file is compiled. The function accepts 1
49-
* parameter which is the name of the variable, without the $ sign
50-
*
51-
* @param string|array $callback A callback (or "callable" as of PHP 5.4)
52-
* can either be a reference to a function name or method within an
53-
* class/object.
54-
*/
55-
function wp_dynamic_css_set_callback( $callback )
56-
{
57-
add_filter( 'wp_dynamic_css_get_variable_value', $callback );
58-
}
59-
}
26+
/**
27+
* The following actions are used for printing or loading the compiled
28+
* stylesheets externally.
29+
*/
30+
$dcss = DynamicCSSCompiler::get_instance();
31+
add_action( 'wp_print_styles', array( $dcss, 'compile_printed_styles' ) );
32+
add_action( 'wp_enqueue_scripts', array( $dcss, 'wp_enqueue_style' ) );
33+
add_action( 'wp_ajax_wp_dynamic_css', array( $dcss, 'compile_external_styles' ) );
34+
add_action( 'wp_ajax_nopriv_wp_dynamic_css', array( $dcss, 'compile_external_styles' ) );

‎compiler.php‎

Lines changed: 91 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<?php
22
/**
33
* @package WordPress Dynamic CSS
4-
* @version 1.0.0
4+
* @version 1.0.1
55
* @author Askupa Software <[email protected]>
66
* @link https://github.com/askupasoftware/wp-dynamic-css
77
* @copyright 2016 Askupa Software
@@ -17,9 +17,9 @@
1717
* body {color: $body_color;}
1818
* </pre>
1919
* In the above example, the variable $body_color is replaced by a value
20-
* that is retrieved by the filter wp_dynamic_css_get_variable_value. The filter
21-
* is passed the variable name without the dollar sign, which can be used with
22-
* get_option() or get_theme_mod() etc.
20+
* retrieved by the value callback function. The function is passed the variable
21+
* name without the dollar sign, which can be used with get_option() or
22+
* get_theme_mod() etc.
2323
*/
2424
class DynamicCSSCompiler
2525
{
@@ -43,24 +43,71 @@ public static function get_instance()
4343
if (null === static::$instance)
4444
{
4545
static::$instance = new static();
46-
static::$instance->init();
4746
}
48-
4947
return static::$instance;
5048
}
5149

5250
/**
53-
* Initiate the compiler by hooking to wp_print_styles
51+
* Enqueue the PHP script used for compiling dynamic stylesheets that are
52+
* loaded externally
5453
*/
55-
public function init()
54+
public function wp_enqueue_style()
5655
{
57-
add_action( 'wp_print_styles', array( $this, 'print_compiled_style' ) );
56+
// Only enqueue if there is at least one dynamic stylesheet that is
57+
// set to be loaded externally
58+
if( 0 < count( array_filter($this->stylesheets, array( $this, 'filter_external' ) ) ) )
59+
{
60+
wp_enqueue_style( 'wp-dynamic-css', admin_url( 'admin-ajax.php?action=wp_dynamic_css' ) );
61+
}
62+
}
63+
64+
/**
65+
* Parse all styles in $this->stylesheets and print them if the flag 'print'
66+
* is set to true. Used for printing styles to the document head.
67+
*/
68+
public function compile_printed_styles()
69+
{
70+
$precompiled_css = '';
71+
$styles = array_filter($this->stylesheets, array( $this, 'filter_print' ) );
72+
73+
// Bail if there are no styles to be printed
74+
if( count( $styles ) === 0 ) return;
75+
76+
foreach( $styles as $style )
77+
{
78+
$precompiled_css .= $this->get_file_contents( $style['path'] )."\n";
79+
}
80+
$css = $this->compile_css( $precompiled_css );
81+
echo "<style id=\"wp-dynamic-css\">\n";
82+
include 'style.phtml';
83+
echo "</style>";
84+
}
85+
86+
/**
87+
* Parse all styles in $this->stylesheets and print them if the flag 'print'
88+
* is not set to true. Used for loading styles externally via an http request.
89+
*/
90+
public function compile_external_styles()
91+
{
92+
header( "Content-type: text/css; charset: UTF-8" );
93+
$precompiled_css = '';
94+
$styles = array_filter($this->stylesheets, array( $this, 'filter_external' ) );
95+
96+
foreach( $styles as $style )
97+
{
98+
$precompiled_css .= $this->get_file_contents( $style['path'] )."\n";
99+
}
100+
$css = $this->compile_css( $precompiled_css );
101+
include 'style.phtml';
102+
wp_die();
58103
}
59104

60105
/**
61106
* Add a style path to the pool of styles to be compiled
62107
*
63-
* @param type $path The absolute path to the dynamic style
108+
* @param string $path The absolute path to the dynamic style
109+
* @param boolean $print Whether to print the compiled CSS to the document
110+
* head, or include it as an external CSS file
64111
*/
65112
public function enqueue_style( $path, $print )
66113
{
@@ -71,22 +118,40 @@ public function enqueue_style( $path, $print )
71118
}
72119

73120
/**
74-
* Parse all styles in $this->stylesheets and print them if the flag 'print'
75-
* is set to true
121+
* This filter is used to return only the styles that are set to be printed
122+
* in the document head
123+
*
124+
* @param array $style
125+
* @return boolean
126+
*/
127+
protected function filter_print( $style )
128+
{
129+
return true === $style['print'];
130+
}
131+
132+
/**
133+
* This filter is used to return only the styles that are set to be loaded
134+
* externally
135+
*
136+
* @param array $style
137+
* @return boolean
138+
*/
139+
protected function filter_external( $style )
140+
{
141+
return true !== $style['print'];
142+
}
143+
144+
/**
145+
* Get the contents of a given file
146+
*
147+
* @param string $path The absolute path to the file
148+
* @return string The file contents
76149
*/
77-
public function print_compiled_style()
150+
protected function get_file_contents( $path )
78151
{
79152
ob_start();
80-
foreach( $this->stylesheets as $style )
81-
{
82-
if( true === $style['print'] )
83-
{
84-
include $style;
85-
echo "\n";
86-
}
87-
}
88-
$css = $this->parse_css( ob_get_clean() );
89-
include 'style.phtml';
153+
include $path;
154+
return ob_get_clean();
90155
}
91156

92157
/**
@@ -100,10 +165,10 @@ public function print_compiled_style()
100165
* @return string The compiled CSS after converting the variables to their
101166
* corresponding values
102167
*/
103-
public function parse_css( $css )
168+
protected function compile_css( $css )
104169
{
105-
return preg_replace_callback('#\$([\w]+)#', function($matches) {
106-
return apply_filters( 'wp_dynamic_css_get_variable_value', $matches[1]);
170+
return preg_replace_callback( '#\$([\w]+)#', function( $matches ) {
171+
return apply_filters( 'wp_dynamic_css_get_variable_value', $matches[1] );
107172
}, $css);
108173
}
109174
}

‎functions.php‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
<?php
2+
/**
3+
* @package WordPress Dynamic CSS
4+
* @version 1.0.1
5+
* @author Askupa Software <[email protected]>
6+
* @link https://github.com/askupasoftware/wp-dynamic-css
7+
* @copyright 2016 Askupa Software
8+
*/
9+
10+
if( !function_exists('wp_dynamic_css_enqueue') )
11+
{
12+
/**
13+
* Enqueue a dynamic stylesheet
14+
*
15+
* This will either print the compiled version of the stylesheet to the
16+
* document's <head> section, or load it as an external stylesheet if the
17+
* second parameter is set to false
18+
*
19+
* @param string $path The absolute path to the dynamic CSS file
20+
* @paran boolean $print Whether to print the compiled CSS to the document
21+
* head, or include it as an external CSS file
22+
*/
23+
function wp_dynamic_css_enqueue( $path, $print = true )
24+
{
25+
$dcss = DynamicCSSCompiler::get_instance();
26+
$dcss->enqueue_style( $path, $print );
27+
}
28+
}
29+
30+
if( !function_exists('wp_dynamic_css_set_callback') )
31+
{
32+
/**
33+
* Set the value retrieval callback function
34+
*
35+
* Set a callback function that will be used to get the values of the
36+
* variables when the dynamic CSS file is compiled. The function accepts 1
37+
* parameter which is the name of the variable, without the $ sign
38+
*
39+
* @param string|array $callback A callback (or "callable" as of PHP 5.4)
40+
* can either be a reference to a function name or method within an
41+
* class/object.
42+
*/
43+
function wp_dynamic_css_set_callback( $callback )
44+
{
45+
add_filter( 'wp_dynamic_css_get_variable_value', $callback );
46+
}
47+
}

‎style.phtml‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
<style id="wp-dynamic-css">
21
/**
3-
* Rendered using wp-dynamic-css
2+
* Compiled using wp-dynamic-css
43
* https://github.com/askupasoftware/wp-dynamic-css
54
*/
6-
<?php echo $css; ?>
7-
</style>
5+
6+
<?php echo $css; ?>

0 commit comments

Comments
 (0)