OLD | NEW |
1 #!mojo mojo:sky | 1 #!mojo mojo:sky |
2 <import src="sky:core" as="sky"/> | 2 <import src="sky:core" as="sky"/> |
3 <script> | 3 <script> |
4 class BeehiveLayoutManager extends sky.LayoutManager { | 4 class BeehiveLayoutManager extends sky.LayoutManager { |
5 function layout(width, height) { | 5 function layout(width, height) { |
6 if (width == null) | 6 if (width == null) |
7 width = this.getIntrinsicWidth().value; | 7 width = this.getIntrinsicWidth().value; |
8 let autoHeight = false; | 8 let autoHeight = false; |
9 if (height == null) { | 9 if (height == null) { |
10 height = 0; | 10 height = 0; |
(...skipping 66 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
77 childCount += 1; | 77 childCount += 1; |
78 loop.next(); | 78 loop.next(); |
79 } | 79 } |
80 if (childCount > 0) | 80 if (childCount > 0) |
81 height = cellDim * (1/4 + Math.ceil(childCount / cellCount) * 3/4); | 81 height = cellDim * (1/4 + Math.ceil(childCount / cellCount) * 3/4); |
82 else | 82 else |
83 height = 0; | 83 height = 0; |
84 } | 84 } |
85 return super(height); // does the equivalent of getIntrinsicWidth() above,
applying min-height etc | 85 return super(height); // does the equivalent of getIntrinsicWidth() above,
applying min-height etc |
86 } | 86 } |
87 function paintChildren(RenderingSurface canvas) { | 87 function paintChildren(canvas) { |
88 let width = this.node.width; | 88 let width = this.node.width; |
89 let cellCount = this.node.getProperty('beehive-count'); | 89 let cellCount = this.node.getProperty('beehive-count'); |
90 let cellDim = width / cellCount; | 90 let cellDim = width / cellCount; |
91 let children = this.walkChildren(); | 91 let children = this.walkChildren(); |
92 let loop = children.next(); | 92 let loop = children.next(); |
93 while (!loop.done) { | 93 while (!loop.done) { |
94 let child = loop.value; | 94 let child = loop.value; |
95 if (child.needsPaint) { | 95 if (child.needsPaint) { |
96 canvas.save(); | 96 canvas.save(); |
97 try { | 97 try { |
(...skipping 70 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
168 div { display: beehive; beehive-count: 3; } | 168 div { display: beehive; beehive-count: 3; } |
169 </style> | 169 </style> |
170 <div> | 170 <div> |
171 <t>Hello</t> | 171 <t>Hello</t> |
172 <t>World</t> | 172 <t>World</t> |
173 <t>How</t> | 173 <t>How</t> |
174 <t>Are</t> | 174 <t>Are</t> |
175 <t>You</t> | 175 <t>You</t> |
176 <t>Today?</t> | 176 <t>Today?</t> |
177 </div> | 177 </div> |
OLD | NEW |