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 this.markAsLaidOut(); | 6 this.markAsLaidOut(); |
7 if (width == null) | 7 if (width == null) |
8 width = this.getIntrinsicWidth().value; | 8 width = this.getIntrinsicWidth().value; |
9 let autoHeight = false; | 9 let autoHeight = false; |
10 if (height == null) { | 10 if (height == null) { |
(...skipping 51 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
62 return super(height); // does the equivalent of getIntrinsicWidth() above,
applying min-height etc | 62 return super(height); // does the equivalent of getIntrinsicWidth() above,
applying min-height etc |
63 } | 63 } |
64 function paintChildren(canvas) { | 64 function paintChildren(canvas) { |
65 let width = this.node.width; | 65 let width = this.node.width; |
66 let cellCount = this.node.getProperty('beehive-count'); | 66 let cellCount = this.node.getProperty('beehive-count'); |
67 let cellDim = width / cellCount; | 67 let cellDim = width / cellCount; |
68 let children = this.walkChildren(); | 68 let children = this.walkChildren(); |
69 let loop = children.next(); | 69 let loop = children.next(); |
70 while (!loop.done) { | 70 while (!loop.done) { |
71 let child = loop.value; | 71 let child = loop.value; |
72 if (child.needsPaint || child.descendantNeedsPaint) { | 72 canvas.save(); |
73 canvas.save(); | 73 try { |
74 try { | 74 canvas.beginPath(); |
75 canvas.beginPath(); | 75 canvas.moveTo(child.x, child.y + cellDim/4); |
76 canvas.moveTo(child.x, child.y + cellDim/4); | 76 canvas.lineTo(child.x + cellDim/2, child.y); |
77 canvas.lineTo(child.x + cellDim/2, child.y); | 77 canvas.lineTo(child.x + cellDim, child.y + cellDim/4); |
78 canvas.lineTo(child.x + cellDim, child.y + cellDim/4); | 78 canvas.lineTo(child.x + cellDim, child.y + 3*cellDim/4); |
79 canvas.lineTo(child.x + cellDim, child.y + 3*cellDim/4); | 79 canvas.lineTo(child.x + cellDim/2, child.y + cellDim); |
80 canvas.lineTo(child.x + cellDim/2, child.y + cellDim); | 80 canvas.moveTo(child.x, child.y + 3*cellDim/4); |
81 canvas.moveTo(child.x, child.y + 3*cellDim/4); | 81 canvas.closePath(); |
82 canvas.closePath(); | 82 canvas.clip(); |
83 canvas.clip(); | 83 canvas.paintChild(child); |
84 this.paintChild(child); | 84 } finally { |
85 } finally { | 85 canvas.restore(); |
86 canvas.restore(); | |
87 } | |
88 } | 86 } |
89 loop = children.next(); | 87 loop = children.next(); |
90 } | 88 } |
91 } | 89 } |
92 function inHex(topLeftX, topLeftY, width, height, hitX, hitY) { | 90 function inHex(topLeftX, topLeftY, width, height, hitX, hitY) { |
93 let centerX = topLeftX - width/2; | 91 let centerX = topLeftX - width/2; |
94 let absCenteredHitX = Math.abs(hitX - centerX); | 92 let absCenteredHitX = Math.abs(hitX - centerX); |
95 if (absCenteredHitX > width/2) | 93 if (absCenteredHitX > width/2) |
96 return false; | 94 return false; |
97 let centerY = topLeftY - height/2; | 95 let centerY = topLeftY - height/2; |
(...skipping 46 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
144 div { display: beehive; beehive-count: 3; } | 142 div { display: beehive; beehive-count: 3; } |
145 </style> | 143 </style> |
146 <div> | 144 <div> |
147 <t>Hello</t> | 145 <t>Hello</t> |
148 <t>World</t> | 146 <t>World</t> |
149 <t>How</t> | 147 <t>How</t> |
150 <t>Are</t> | 148 <t>Are</t> |
151 <t>You</t> | 149 <t>You</t> |
152 <t>Today?</t> | 150 <t>Today?</t> |
153 </div> | 151 </div> |
OLD | NEW |