frameworkless-stage
v0.7.5
Published
Push views onto a stage, with optional view transitions.
Downloads
6
Readme
Frameworkless Stage 
Transition those views to the stage.
Use a Package Manager
bower:
bower install frameworkless-stage
# copy the stuff you want
cp bower_components/frameworkless-stage/dist/stage.js src/lib
cp bower_components/frameworkless-stage/dist/less/stage.less src/less/libnpm:
npm install frameworkless-stage
# copy the stuff you want
cp node_modules/frameworkless-stage/dist/stage.js src/lib
cp node_modules/frameworkless-stage/dist/less/stage.less src/less/libUse the Source
Get started right away, so you can disassemble and play around at your leisure.
# Clone frameworkless-stage
git clone [email protected]:synacorinc/frameworkless-stage.git
# Install development dependencies
npm install
# Build the library
npm run-script build # or just `grunt` if you have grunt-cli installed globally
# Check out the demo
PORT=8080 npm start # this just does `node server.js`Quick Repo Tour
/srcis where the source code lives/distis the built library/demois a simple demo, using requirejs
Usage
var stage = require('stage');
// stage views into <body>:
stage.init(document.body);
// A view can just be a DOM node:
var view = document.createElement('div');
view.innerHTML = '<h1>Hello, world!</h1>';
// Push the view onto the stage:
stage.show(view, {
animation : 'fade',
duration : 500
}, function() {
// add some content to the view after it has been shown:
var more = document.createElement('p');
more.textContent = 'I am visible now!';
view.appendChild(more);
});Usage with frameworkless-view
Setup:
define(['stage'], function(stage) {
stage.init(document.body);
});In a route:
define(['view', 'stage'], function(view, stage) {
return view({
template : '<h1>Hello, world!</h1>',
load : function() {
// push the view-presenter onto the stage:
stage.show(this);
}
});
});License
BSD