SmartSurface for Sizing correct for Sequential Layout
Size of a surface without a set size and added to the sequential layout
by Mabuti
HTML
<script src="http://famousco.de/fiddle/famousBox.js"></script>
JavaScript
/* This is not working correctly */
define('main', function (require, exports, module) {
var Engine = require('famous/core/Engine');
var SequentialLayout = require('famous/views/SequentialLayout');
var SmartSurface = require('SmartSurface');
var PorkUnLaten = require('PorkUnLaten');
var mainContext = Engine.createContext();
var smarty = new SmartSurface({
size: [undefined, true],
content: PorkUnLaten.random(),
properties: {
backgroundColor: 'rgba(0,122,55,0.5)'
}
});
var smartytwo = new SmartSurface({
size: [undefined, true],
content: PorkUnLaten.random(),
properties: {
backgroundColor: 'rgba(99,0,0,0.5)'
}
});
var surfaces = [];
surfaces.push(smarty);
surfaces.push(smartytwo);
mainContext.add(smarty.state).add(smarty);
var seqLayout = new SequentialLayout();
seqLayout.sequenceFrom(surfaces);
Engine.on('click', function () {
surfaces = [];
smarty.setContent(PorkUnLaten.random());
smartytwo.setContent(PorkUnLaten.random());
surfaces.push(smarty);
surfaces.push(smartytwo);
});
mainContext.add(seqLayout);
});
define('SmartSurface', function (require, exports, module) {
var Surface = require('famous/core/Surface');
var StateModifier = require('famous/modifiers/StateModifier');
function SmartSurface(options) {
Surface.apply(this, arguments);
this._superDeploy = Surface.prototype.deploy;
this._dynamicSize = this.options.size;
}
SmartSurface.prototype = Object.create(Surface.prototype);
SmartSurface.prototype.constructor = SmartSurface;
SmartSurface.prototype.deploy = function deploy(target) {
this._superDeploy(target);
var size = this.getSize();
var width =(size && size[0]===undefined) ? undefined : ((!size || size[0] === true) ? target.offsetWidth : size[0]);
var...