Simple Assets Library

A simple assets library that has the ability to combine and minify your JavaScript and CSS assets. Additionally there's a LessCSS compiler and a CoffeeScript compiler.

Third Party Libraries

The libraries JSMin, CSSMin, LessPHP and CoffeeScript-PHP are all created by third parties, but they're included in this package for convenience.

Requirements

1. PHP 5.3+
2. CodeIgniter 2.1
3. Directory structure for the assets files, with a writeable cache directory

Documentation

Set all your preferences in the config file (assets directories, options to minify and combine). Now you can use the helper methods in your views like this:

<?php Assets::css(array('bootstrap.less', 'init.css', 'style.css')); ?>
<?php Assets::js(array('libs/jquery.js', 'script.js', 'bean.coffee')); ?>

There's also a method for clearing all cached files:

<?php Assets::clear_cache(); ?>

The default configuration assumes your assets directory is in the root of your project. Be sure to set the permissions for the cache directory so it can be writeable.

LESS / CoffeeScript

Files with extensions .less and .coffee will automatically be processed through appropriate libraries.

Groups

There's also a possibility to define groups of assets. This can be useful when for e.g. you want separate scripts in you page header, and others in the footer. This can be accomplished like this:

<?php Assets::js_group('head',   array('libs/modernizr.js')); ?>
<?php Assets::js_group('footer', array('plugins.js', 'script.js')); ?>

The same thing will work with CSS files. You can use this to show groups of CSS files for specific pages:

<?php Assets::css_group('global', array('style.css')); ?>
<?php Assets::css_group('login',  array('login.css')); ?>

Importing CSS files (@import)

Including files via @import should work just fine, just be sure to use proper paths. Example of a stylesheet would be something like this:

@import "bootstrap/bootstrap.less";
@import "libs/fancybox.css";

body { background: #f2f2f2; }

…

Just keep in mind when using @import that those files are not scanned for changes and the cache wont be cleared in case you change a file that is included via @import.

Images

A helper is also provided to display images from the directory setup in the config.

<?php echo Assets::img('logo.png'); ?>

You can also generate the img tag directly using a similar syntax as in the CodeIgniter HTML helper.

<?php echo Assets::img('logo.png', true, array('title' => 'Logo')); ?>

Frameworks / Libraries

The library has been tested with Twitter Bootstrap 2.0.1 and HTML5 Boilerplate 3.0. It wont work with the latest Bootstrap 2.0.2 because of a problem in LessPHP. I hope this will be fixed soon. And if you happen to use the library with a different framework (bootstrap), give me a shout and I'll put it on this list. So here it is:

• Twitter Bootstrap 2.0.1 (2.0.2 not working yet) LESS
• HTML5 Boilerplate 3.0

Directory structure example

/application
/assets
    /cache
    /css
    /images
    /js
/sparks
/system