Assets library & path handler

Hi everybody!

I have been working on an assets library. This library collects JavaScript and CSS files that are required for any page your website/project might have. From any thinkable location you can request an assets file. When you render you final output you only have to ask the library to return the js_output() and css_output(). The returned output is optimized for fast browser rendering. For example, any required JavaScript files are only downloaded when the window onload event is triggered. CSS can be added as regular CSS or as above the fold CSS. Above the fold CSS is returned as minified in-line CSS that can be placed in the head of your HTML.
When the output is requested, a unique JavaScript or CSS file for that page is compiled. The compiling only takes place if the output file does not exist or if any source file or number of source files has changed. After compiling the output file is minified.

Using the library

PHP Code:

/**
 * Load the library or have it auto loaded in your auto load config file
 * Set the assets config file to suit your needs
 */
$this->load->library('assets');

/**
 * Requesting a CSS file
 * The first argument is the required file
 * The second argument the location in your assets directory
 */
$this->assets->_load_css('default.css', 'website');

// You can pass in an array as the first argument
$assets_css = array();
$assets_css['bootstrap.css'] = 'shared';
$assets_css['default.css'] = 'website';
$this->assets->_load_css($assets_css);

// Loading above the fold CSS
$this->assets->_load_css('above_the_fold.css', 'website', 'css_fold');

// For JavaScript
$this->assets->_load_javascript('default.js', 'website');

// Get the output
// returns an array containing 2 elements, one for the CSSfile and one for above the fold CSS
$css_output = $this->assets->output_css();
// Get the JavaScript output
$js_output = $this->output_js(); 


The Assets path handler
All asset files, including images and the compiled output files, are mapped in a JSON file. Each available file is mapped to it's absolute path. This JSON file is then used by both the assets library and the assets path handler.
Why do this? When working on projects, it can become quite impossible to remember each path of all your available assets. This is where this JSON file comes in handy.
I store my assets in a directory named assets which is placed in the root of my project. This directory contains a number of sub-directories. These sub-directories are the available locations where an asset can be found. When requesting a file I only need to know in which sub-directory the file is stored. Any sub-directory can contain endless number of files and or sub-directories. But no need to remember the exact location
The JSON mapping file is auto generated by the assets library and auto updated when a new file is compiled. The mapping can also be generated manually. This is handy when files have been uploaded via a form. After a succesful upload you regenerate the mapping file so the newly added file(s) can be located for use. The JSON mapping can also be regenerated via a browser request. I use the url /assetsmapping for this. When manually adding files you will need to regenerate the JSON file.

How it works
The Assets path handler is placed in the root of my project. Using a htaccess any request uri starting with files is redirected to the handler. This way, a file request does not need to go through CI.
See the following request:

Code:

http://www.mydomain.com/files/website/default.css

The first segment is files, so the request is directed to the handler. The second segment is the location where the handler should start looking. It makes use of the JSON file that is created with the assets library.

Any request uri starting with assetsmapping is redirected to the mapping generator.

The htacces rules

Code:

RewriteCond %{REQUEST_URI} ^/files.*$ [NC]
RewriteRule ^(.*)$ /webfiles/handle.php/$1?handle=1 [QSA,L]

RewriteCond %{REQUEST_URI} ^/assetsmapping.*$ [NC]
RewriteRule ^(.*)$ /webfiles/mapping.php/$1 [QSA,L]

Download and checkout the attached files for more information. When I have some more time I will add documentation for the use of the library and the assets path handler.

I hope it is clear what this does. I find it a great help in my projects. Any feedback is welcome

- Martin

Attached Files

  assets_library.zip (Size: 20.99 KB / Downloads: 110)