Built-in Popup Modal - famo.us

Question

Is there any built-in support for modals in Famous?
I completed the Famous University and looked through the documentation but didn't see anything.
I am about to roll my own, but I figured I should ask first.

Answer 1

You are going to want to use the Lightbox object. Lightbox is like a RenderController that has state. This means you can define, how views come in an out of view both by transition and transform. Here is a very basic example of the modal type you see often in iOS..
Hope it helps!
var Engine = require('famous/core/Engine');
var Surface = require('famous/core/Surface');
var Transform = require('famous/core/Transform');
var Modifier = require('famous/core/Modifier');
var Lightbox = require('famous/views/Lightbox');
var Easing = require('famous/transitions/Easing');
var context = Engine.createContext();
var surface = new Surface({
size:[200,200],
properties:{
backgroundColor:'green',
color:'white',
lineHeight:'200px',
textAlign:'center'
}
});
surface.on('click',function(){ openModal() });
context.add(new Modifier({origin:[0.5,0.5]})).add(surface);
var modal = new Surface({
size:[500,500],
properties:{
backgroundColor:'red'
}
})
modal.on('click',function(){ hideModal() });
modal.lightbox = new Lightbox({
inTransform: Transform.translate(0,500,0),
outTransform: Transform.translate(0,500,0),
inTransition: {duration:1000, curve:Easing.outElastic},
outTransition: {duration:200, curve:Easing.inOutQuad},
});
context.add(new Modifier({origin:[0.5,0.5]})).add(modal.lightbox);
function openModal(){
modal.lightbox.show(modal);
}
function hideModal(){
modal.lightbox.hide();
}