Asset Manager Extended To Combine Different CSS Files

Today I extended my Asset Manager to combine several css into one. As i understand, YSLOW Says there should be as less http requests as possible. So i decided to add this optional feature. For now this is controlled through MY_config file located at config folder.

This is how addition config setting looks:

CODE:

1-
2-<?php
3-//do you want to combine your css file into one
4-//default is false
5-$config['cf']['combine_css'] = false;
6-
7-
8-/*
9- * Cache directory
10- * No trailing or leading slashes (/)
11- */
12-$config['cf']['cache_dir'] = 'cache';
13-?>
14-

And on my Assets Manager I added this:

CODE:

1-
2-<?php
3-var $combine_css = false;
4-var $cache_dir = '';
5-
6-
7-//process css
8-function echo_css($css_array = array(), $media = 'all')
9-{
10-echo“\n<!-- START: CSS for media type $media -->“;
11-if($this->combine_css == true) {
12-$css_array = $this->combine($css_array, 'css', $media);
13- }
14- else {
15-foreach($css_array as $c) {
16-$c = $this->get_path_url($c);
17-if(isset($c['url']))
18-echo“\n“ . '';
19- }
20- }
21-echo“\n<!-- END: CSS -->\n“;
22-}
23-
24-//combine assets | Currently support for css only
25-function combine($css_array = array(), $type = 'css', $media='all')
26-{
27-$file_name = 'cf';
28-$combined_code = '';
29-foreach($css_array as $k => $c) {
30-$file_name .= $c;
31-$p = $this->get_path_url($c);
32-if(isset($p['path'])) $combined_code .= file_get_contents($p['path']);
33- }
34-
35-//clean filename
36-$file_name = preg_replace('/[^0-9a-z]+/','',strtolower($file_name));
37-
38-//destination dir where combined file will be written
39-$destination_dir = $this->base_path.$this->assets_dir.$this->cache_dir.'/';
40-
41-//if destination dir does not exists, create one
42-if(!is_dir($destination_dir)) mkdir($destination_dir);
43-
44-//if the file already exists, delete it first
45-if(is_file($destination_dir.$file_name.'.'.$type)) unlink($destination_dir.$file_name.'.'.$type);
46-
47-//create file and write contents.
48-$oFile = fopen($destination_dir.$file_name.'.'.$type, 'w');
49- if (flock($oFile, LOCK_EX)) {
50-fwrite($oFile, $combined_code);
51-flock($oFile, LOCK_UN);
52- }
53-fclose($oFile);
54-
55-//if successfully created combined file, display|echo this file
56-if(is_file($destination_dir.$file_name.'.'.$type))
57-echo“\n“ . '<link rel=“stylesheet“ href=“' . $this->base_url.$this->assets_dir.$this->cache_dir.'/'.$file_name.'.'.$type . '“ type=“text/css“ media=“' . $media . '“ />';
58-}
59-?>
60-

ISSUES:

if the css is in different folder i.e. assets/admin/css, assets/common/css etc and they have image url defined relative to these folder ie. assets/admin/img images then it will break because cache dir will be created at assets folder and img folders are one folder down of admin, common etc... But if i create cache dir in admin,common,... so that it doesn't break images then this will be less useful as i can't combine css from different folders because result will be same, image break for css from different folder. There is no issue if there are no images defined or images defined relative to cache folder.

TO DO:

• Check cache file time modification and create only after certain period
• Find a better way and flexibility for above issue.
• Combine JS as well
• Minify JS and CSS
• Support for images [i.e. $this->assets->get_image('logo');]
• and so on...

COMMENTS: ( Approved Comments | Pending Comments )

 

Name*:
Email
(not published)*:

 

URL*:
Comment*:
Enter Total*:
How much is 0 + 4? Write on the above field.

Javascript must be enabled to post comments!