index.js
function(transitions) {

    this.defTransitions = Array.isArray(transitions) ? transitions : Array.prototype.slice.apply(arguments);

    return this;
  }
function(transitions) {

    this.defTransitions = Array.isArray(transitions) ? transitions : Array.prototype.slice.apply(arguments);

    return this;
  }
function ( transitions ) { this . defTransitions = Array . isArray ( transitions ) ? transitions : Array . prototype . slice . apply ( arguments ) ; return this ; }
defines how this `f1` instance can move between states.

For instance if we had two states out and idle you could define your transitions
like this:

```javascript
var ui = require('f1')();

ui.transitions( [
'out', 'idle', // defines that you can go from the out state to the idle state
'idle', 'out' // defines that you can go from the idle state to the out state
]);
```

Note that transitions are not bi-directional.

If you simply just defined state names a default animation would be applied between
states. This default transition will have a duration of 0.5 seconds and use no ease.

If you want to modify the animation duration and ease you can define your transitions
like this:

```javascript
var eases = require('eases');
var ui = require('f1')();

ui.transitions( [
'out', 'idle', { duration: 1, ease: eases.expoOut },
'idle', 'out', { duration: 0.5, ease: eases.expoIn }
]);
```

Defining your transitions using the above syntax will cause all properties to animate
using the duration and ease defined.

Ease functions should take a time property between 0-1 and return a modified value between
0-1.

You can also animate properties individually. Here passing a delay maybe sometimes
userful:

```javascript
var eases = require('eases');
var ui = require('f1')();

ui.transitions( [
'out', 'idle', {
duration: 1, ease: eases.expoOut,

position: { duration: 0.5, delay: 0.5, ease: eases.quadOut },
alpha: { duration: 0.5 }
},
'idle', 'out', { duration: 0.5, ease: eases.expoIn }
]);
```

In that example every property besides `position` and `alpha` will have a duration of one second
using the `eases.quadOut` ease equation. `position` will have a duration of 0.5 seconds and will
be delayed 0.5 seconds and will use the `eases.quadOut` easing function. `alpha` will simply have
a duration of 0.5 seconds.

For advanced transitions you can pass in a function instead like so:
```javascript

ui.transitions( [
'out', 'idle', {
duration: 1, ease: eases.expoOut,

position: { duration: 0.5, delay: 0.5, ease: eases.quadOut },

alpha: function(time, start, end) {

return (end - start) * time + start;
}
},
'idle', 'out', { duration: 0.5, ease: eases.expoIn }
]);
```

There the animation is the same as in the previous example however `alpha` will be calculated using
a custom transition function.

@param  {Array} transitions An array which descriptes transitions
@chainable
defines how this f1 instance can move between states .