A quick & ugly way to join multiple css or js file.

[eluser]gops[/eluser]
Following is the controller I created to join multiple cs or jss
file in to one, and hence making fewer server request to speed up the things little bit.

Just add following in to your controllers. save as file.php Set the path of your
js and css files accordingly.

Code:

<?php
class File extends Controller
{
    function File()
    {
        parent::Controller();
                /*Set your own path here*/
        $this->_path = "./public/";    
    }
    function index()
    {
        echo "";
    }
    function js()
    {
        $segs = $this->uri->segment_array();
        foreach ($segs as $segment)
        {
            $filepath = $this->_path.$segment.'.js';
            if(file_exists($filepath))
            {
                readfile($filepath);
            }
        }
    }
    function css()
    {
        $segs = $this->uri->segment_array();
        foreach ($segs as $segment)
        {
            $filepath = $this->_path.$segment.'.css';
            if(file_exists($filepath))
            {
                readfile($filepath);
            }
        }
    }
}
?>

Now you can add any number of files with just single line of code,and with single
request.
For e.g. If you want to include two css file , foo.css and bar.css , the code is ,

Code:

<link rel='stylesheet' type='text/css' media='all' href='<?php echo site_url("file/css/foo/bar");?>' />

And same way for javascript , just replace js with css.


I would like to know, is there better &/or easy way to do same ?
is this a good idea ?

[eluser]nmweb[/eluser]
I came up with a similar solution only I got a script from somewhere that gzips the css/js, caches the compilation of the files etc. Since I generally use jQuery I my controller also has the function jQuery. I can now do

Code:

<?PHP echo site_url(asset/jquery); ?>

This redirects to a similar function as you have but a bit shorter.

[eluser]xwero[/eluser]
Why would you want to join the files using a request? Why can't you make just one file from start? or do something in your css like

Code:

@import 'foo.css';
@import 'bar.css';

[eluser]Unknown[/eluser]
I don't know much, but I believe the point is to join all css/jss in those cases where you have several smaller css/jss files (usually more than 4 or 5 files), in order to minimize server requests.

Personnely, it's not my kind of thing, and I've never seen the need for such a thing. I think that with better planning, a strong and efficient css/jss can be written, and that should be enough.

But this is just me. I don't know that much.

[eluser]xwero[/eluser]
I can understand designers don't have a lot of knowledge of css so it can happen that you end up with separate stylesheets but if you have for example a frontend.css and a backend.css where they can include their css file using the method above there will not not to much trouble.
Of course debugging designs if you have different css files can be harder than having one file.

For javascript i have to agree with urbgimtam. There is no reason to add code to one big file if you want all your javascript code to be loaded throughout the site.

[eluser]WeeJames[/eluser]
I have a similar controller called 'AssetManager' in my CMS which handles much the same thing. I'd recommend updating your controller so that it out puts the correct mime types for whats being returned.

The advantage of having them combined into a single file it reduces the number of HTTP requests your web client has to do. In addition i use it to run some regexs on the js and css which allows me to insert data into them dynamically should i need to.