Initial commit with Symfony 2.1+Vendors

Signed-off-by: Gergely POLONKAI (W00d5t0ck) <polesz@w00d5t0ck.info>
This commit is contained in:
Polonkai Gergely
2012-07-01 09:52:20 +02:00
commit 082a0130c2
5381 changed files with 416709 additions and 0 deletions

View File

@@ -0,0 +1,32 @@
Building and Dumping Assets
---------------------------
The is the simplest approach to using Assetic. It involves two steps:
1. Create a PHP script in your web directory that uses the Assetic OOP API to
create and output an asset.
2. Reference that file from your template.
For example, you could create a file in your web directory at
`assets/javascripts.php` with the following code:
use Assetic\Asset\AssetCollection;
use Assetic\Asset\FileAsset;
use Assetic\Filter\Yui\JsCompressorFilter as YuiCompressorFilter;
$js = new AssetCollection(array(
new FileAsset(__DIR__.'/jquery.js'),
new FileAsset(__DIR__.'/application.js'),
), array(
new YuiCompressorFilter('/path/to/yuicompressor.jar'),
));
header('Content-Type: application/js');
echo $js->dump();
In your HTML template you would include this generated Javascript using a
simple `<script>` tag:
<script src="/assets/javascripts.php"></script>
Next: [Basic Concepts](concepts.md)

View File

@@ -0,0 +1,129 @@
In order to use the Assetic OOP API you must first understand the two central
concepts of Assetic: assets and filters.
### What is an Asset?
As asset is an object that has content and metadata which can be loaded and
dumped. Your assets will probably fall into three categories: Javascripts,
stylesheets and images. Most assets will be loaded from files in your
filesystem, but they can also be loaded via HTTP, a database, from a string,
or virtually anything else. All that an asset has to do is fulfill Assetic's
basic asset interface.
### What is a Filter?
A filter is an object that acts upon an asset's content when that asset is
loaded and/or dumped. Similar to assets, a filter can do virtually anything,
as long as it implements Assetic's filter interface.
Here is a list of some of the tools that can be applied to assets using a
filter:
* CoffeeScript
* CssEmbed
* CssMin
* Google Closure Compiler
* jpegoptim
* jpegtran
* Less
* LessPHP
* optipng
* Packager
* pngout
* SASS
* Sprockets (version 1)
* Stylus
* YUI Compressor
### Using Assets and Filters
You need to start by creating an asset object. This will probably mean
instantiating a `FileAsset` instance, which takes a filesystem path as its
first argument:
$asset = new Assetic\Asset\FileAsset('/path/to/main.css');
Once you have an asset you can begin adding filters to it by calling
`ensureFilter()`. For example, you can add a filter that applies the YUI
Compressor to the contents of the asset:
$yui = new Assetic\Filter\Yui\CssCompressorFilter('/path/to/yui.jar');
$asset->ensureFilter($yui);
Once you've added as many filters as you'd like you can output the finished
asset to the browser:
header('Content-Type: text/css');
echo $asset->dump();
### Asset Collections
It is a good idea to combine assets of the same type into a single file to
avoid unnecessary HTTP requests. You can do this in Assetic using the
`AssetCollection` class. This class is just like any other asset in Assetic's
eyes as it implements the asset interface, but under the hood it allows you to
combine multiple assets into one.
use Assetic\Asset\AssetCollection;
$asset = new AssetCollection(array(
new FileAsset('/path/to/js/jquery.js'),
new FileAsset('/path/to/js/jquery.plugin.js'),
new FileAsset('/path/to/js/application.js'),
));
### Nested Asset Collections
The collection class implements the asset interface and all assets passed into
a collection must implement the same interface, which means you can easily
nest collections within one another:
use Assetic\Asset\AssetCollection;
use Assetic\Asset\GlobAsset;
use Assetic\Asset\HttpAsset;
$asset = new AssetCollection(array(
new HttpAsset('http://example.com/jquery.min.js'),
new GlobAsset('/path/to/js/*'),
));
The `HttpAsset` class is a special asset class that loads a file over HTTP;
`GlobAsset` is a special asset collection class that loads files based on a
filesystem glob -- both implement the asset interface.
This concept of nesting asset collection become even more powerful when you
start applying different sets of filters to each collection. Imagine some of
your application's stylesheets are written in SASS, while some are written in
vanilla CSS. You can combine all of these into one seamless CSS asset:
use Assetic\Asset\AssetCollection;
use Assetic\Asset\GlobAsset;
use Assetic\Filter\SassFilter;
use Assetic\Filter\Yui\CssCompressorFilter;
$css = new AssetCollection(array(
new GlobAsset('/path/to/sass/*.sass', array(new SassFilter())),
new GlobAsset('/path/to/css/*.css'),
), array(
new YuiCompressorFilter('/path/to/yuicompressor.jar'),
));
You'll notice I've also applied the YUI compressor filter to the combined
asset so all CSS will be minified.
### Iterating over an Asset Collection
Once you have an asset collection you can iterate over it like you would a
plain old PHP array:
echo "Source paths:\n";
foreach ($collection as $asset) {
echo ' - '.$asset->getSourcePath()."\n";
}
The asset collection iterates recursively, which means you will only see the
"leaf" assets during iteration. Iteration also includes a smart filter which
ensures you only see each asset once, even if the same asset has been included
multiple times.
Next: [Defining Assets "On The Fly"](define.md)

View File

@@ -0,0 +1,145 @@
Defining Assets "On The Fly"
----------------------------
The second approach to using Assetic involves defining your application's
assets "on the fly" in your templates, instead of in an isolated PHP file.
Using this approach, your PHP template would look something like this:
<script src="<?php echo assetic_javascripts('js/*', 'yui_js') ?>"></script>
This call to `assetic_javascripts()` serves a dual purpose. It will be read by
the Assetic "formula loader" which will extract an asset "formula" that can be
used to build, dump and output the asset. It will also be executed when the
template is rendered, at which time the path to the output asset is output.
Assetic includes the following templating helper functions:
* `assetic_image()`
* `assetic_javascripts()`
* `assetic_stylesheets()`
Defining assets on the fly is a much more sophisticated technique and
therefore relies on services to do the heavy lifting. The main one being the
asset factory.
### Asset Factory
The asset factory knows how to create asset objects using only arrays and
scalar values as input. This is the same string syntax used by the `assetic_*`
template helper functions.
use Assetic\Factory\AssetFactory;
$factory = new AssetFactory('/path/to/web');
$js = $factory->createAsset(array(
'js/jquery.js',
'js/jquery.plugin.js',
'js/application.js',
));
### Filter Manager
You can also apply filters to asset created by the factory. To do this you
must setup a `FilterManager`, which organizes filters by a name.
use Assetic\FilterManager;
use Assetic\Filter\GoogleClosure\ApiFilter as ClosureFilter;
$fm = new FilterManager();
$fm->set('closure', new ClosureFilter());
$factory->setFilterManager($fm);
$js = $factory->createAsset('js/*', 'closure');
This code creates an instance of the Google Closure Compiler filter and
assigns it the name `closure` using a filter manager. This filter manager is
then injected into the asset factory, making the filter available as `closure`
when creating assets.
### Debug Mode
The asset factory also introduces the concept of a debug mode. This mode
allows you to omit certain filters from assets the factory creates depending
on whether it is enabled or not.
For example, the YUI Compressor is awesome, but it is only appropriate in a
production environment as it is very difficult to debug minified Javascript.
use Asset\Factory\AssetFactory;
$factory = new AssetFactory('/path/to/web', true); // debug mode is on
$factory->setFilterManager($fm);
$js = $factory->createAsset('js/*', '?closure');
By prefixing the `closure` filter's name with a question mark, we are telling
the factory this filter is optional and should only be applied with debug mode
is off.
### Asset Manager and Asset References
The asset factory provides another special string syntax that allows you to
reference assets you defined elsewhere. These are called "asset references"
and involve an asset manager which, similar to the filter manager, organizes
assets by name.
use Assetic\AssetManager;
use Assetic\Asset\FileAsset;
use Assetic\Factory\AssetFactory;
$am = new AssetManager();
$am->set('jquery', new FileAsset('/path/to/jquery.js'));
$factory = new AssetFactory('/path/to/web');
$factory->setAssetManager($am);
$js = $factory->createAsset(array(
'@jquery',
'js/application.js',
));
### Extracting Assets from Templates
Once you've defined a set of assets in your templates you must use the
"formula loader" service to extract these asset definitions.
use Assetic\Factory\Loader\FunctionCallsFormulaLoader;
use Assetic\Factory\Resource\FileResource;
$loader = new FunctionCallsFormulaLoader($factory);
$formulae = $loader->load(new FileResource('/path/to/template.php'));
These asset formulae aren't much use by themselves. They each include just
enough information for the asset factory to create the intended asset object.
In order for these to be useful they must be wrapped in the special
`LazyAssetManager`.
### The Lazy Asset Manager
This service is a composition of the asset factory and one or more formula
loaders. It acts as the glue between these services behind the scenes, but can
be used just like a normal asset manager on the surface.
use Assetic\Asset\FileAsset;
use Assetic\Factory\LazyAssetManager;
use Assetic\Factory\Loader\FunctionCallsFormulaLoader;
use Assetic\Factory\Resource\DirectoryResource;
$am = new LazyAssetManager($factory);
$am->set('jquery', new FileAsset('/path/to/jquery.js'));
$am->setLoader('php', new FunctionCallsFormulaLoader($factory));
$am->addResource(new DirectoryResource('/path/to/templates', '/\.php$/'), 'php');
### Asset Writer
Finally, once you've create an asset manager that knows about every asset
you've defined in your templates, you must use an asset writer to actually
create the files your templates are going to be referencing.
use Assetic\AssetWriter;
$writer = new AssetWriter('/path/to/web');
$writer->writeManagerAssets($am);
After running this script, all of the assets in your asset manager will be
loaded into memory, filtered with their configured filters and dumped to your
web directory as static files, ready to be served.

View File

@@ -0,0 +1,7 @@
Table Of Contents
-----------------
1. [Introduction](introduction.md)
2. [Building and Dumping Assets](build.md)
3. [Basic Concepts](concepts.md)
4. [Defining Assets "On The Fly"](define.md)

View File

@@ -0,0 +1,21 @@
What is Assetic?
----------------
Assetic is an asset management framework for PHP 5.3. Assetic enables you to
use a variety of third party tools that will help bring order to your
application's Javascripts, stylesheets and images.
How Do I Use Assetic?
---------------------
There are two distinct approaches you can take when using Assetic:
1. Build, dump and output assets in PHP files that you reference directly
from your templates
2. Defining assets in your templates ("on the fly") and use a loader to
extract, dump and output them
The first approach is simpler, but the second, with all its moving parts,
offers more flexibility and opportunity for optimization.
Next: [Building and Dumping Assets](build.md)