diff --git a/spec/LayoutSpec.js b/spec/LayoutSpec.js index b685d47b..e9dde4f3 100755 --- a/spec/LayoutSpec.js +++ b/spec/LayoutSpec.js @@ -88,10 +88,25 @@ describe('Layout', function() { testLayout({ style: {width: 100, height: 200} }, { - width: 100, - height: 200, - left: 0, - top: 0 + width: 100, height: 200, left: 0, top: 0 + }); + }); + + it('should layout node with children', function() { + testLayout({ + style: {width: 1000, height: 1000}, + children: [ + {style: {width: 500, height: 500}}, + {style: {width: 250, height: 250}}, + {style: {width: 125, height: 125}} + ] + }, { + width: 1000, height: 1000, left: 0, top: 0, + children: [ + {width: 500, height: 500, top: 0, left: 0}, + {width: 250, height: 250, top: 500, left: 0}, + {width: 125, height: 125, top: 750, left: 0} + ] }); }); }); diff --git a/src/Layout.js b/src/Layout.js index 6b897be0..0f19ff20 100755 --- a/src/Layout.js +++ b/src/Layout.js @@ -1,10 +1,28 @@ function computeLayout(node) { - return { + var top = 0; + var children = []; + (node.children || []).forEach(function(child) { + console.log(child); + children.push({ + top: top, + left: 0, + width: child.style.width, + height: child.style.height + }); + top += child.style.height; + }); + + var result = { top: 0, left: 0, width: node.style.width, height: node.style.height }; + + if (children.length > 0) { + result.children = children; + } + return result; }