RenderController inAlignFrom and outAlignFrom test.

gistfile1.js

define(function(require, exports, module) {
    var Engine           = require('famous/core/Engine');
    var Modifier         = require('famous/core/Modifier');
    var Surface          = require('famous/core/Surface');
    var RenderController = require('famous/views/RenderController');

    var context = Engine.createContext();

    var rc     = new RenderController();

    // Set in and out align functions
    rc.inAlignFrom( function(progress){ return [0, 1 - progress] });
    rc.outAlignFrom(function(progress){ return [0, -1 + progress] });

    // Push 30 renderables to array
    var renderables = [];
    for (var i = 0; i < 30; i++) {
        renderables.push(new Surface({
            content: i.toString(),
            properties: {
                backgroundColor: 'pink',
                fontSize: '40px',
                color: 'white'
            }
        }));
    }

    // On spacebar show next renderable
    var showIndex = 0;
    Engine.on('keypress', function(e){
        if(e.which === 32) {
            rc.show(renderables[++showIndex]);
        }
    });

    // Show first renderable
    rc.show(renderables[0]);

    // Create centering modifier
    var centerMod = new Modifier({
        origin: [0.5, 0.5],
        align: [0.5, 0.5],
        size: [100, 100]
    });

    context.add(centerMod).add(rc);
});