33
44import etch from 'etch' ;
55import { prewalk , postwalk , prefor } from './tree.js' ;
6- import { Etch , Tip , Button , toView } from '../util/etch.js' ;
6+ import { Etch , Button , toView } from '../util/etch.js' ;
77
88function clamp ( x , min , max ) {
99 return Math . min ( Math . max ( x , min ) , max )
@@ -26,12 +26,12 @@ function dims(tree) {
2626 left += ch . width ;
2727 } ) ;
2828 // Centre align children
29- chwidth = parent . children . map ( ( { width} ) => width ) . reduce ( ( a , b ) => a + b , 0 ) ;
29+ const chwidth = parent . children . map ( ( { width} ) => width ) . reduce ( ( a , b ) => a + b , 0 ) ;
3030 parent . children . forEach ( ch => ch . left += ( parent . width - chwidth ) / 2 ) ;
3131 return parent ;
3232 } ) ;
3333 // Scale total height to 100%
34- let max = postwalk ( tree , ( { height, children} ) =>
34+ const max = postwalk ( tree , ( { height, children} ) =>
3535 Math . max ( height , ...children . map ( x => x + height ) ) ) ;
3636 prewalk ( tree , ( node ) => {
3737 node . top /= max ;
@@ -170,7 +170,7 @@ export class Pannable extends Etch {
170170 this . toolbar = this . toolbar . concat ( this . item . toolbar )
171171 }
172172
173- let style = { position :'relative' , height :'inherit' , width :'inherit' , transformOrigin : '0px 0px' }
173+ const style = { position :'relative' , height :'inherit' , width :'inherit' , transformOrigin : '0px 0px' }
174174
175175 if ( this . zoomstrategy == 'width' ) {
176176 style . transform = 'translate(' + this . left + 'px,' + this . top + 'px)'
@@ -211,22 +211,27 @@ export class Pannable extends Etch {
211211
212212class NodeView extends Etch {
213213 render ( ) {
214- let { height, width, top, left, onclick, onmouseover, onmouseout} = this . props ;
215- return < Clickable onclick = { onclick } > < div className = 'node' { ...{ onmouseover, onmouseout} } style = { {
216- height : 100 * height + '%' ,
217- width : 100 * width + '%' ,
218- top : 100 * top + '%' ,
219- left : 100 * left + '%'
220- } } >
221- < div > < div > </ div > </ div >
222- </ div > </ Clickable > ;
214+ const { height, width, top, left, onclick, onmouseover, onmouseout } = this . props ;
215+ return < Clickable onclick = { onclick } >
216+ < div className = 'node' { ...{ onmouseover, onmouseout} } style = { {
217+ height : 100 * height + '%' ,
218+ width : 100 * width + '%' ,
219+ top : 100 * top + '%' ,
220+ left : 100 * left + '%'
221+ } } >
222+ < div >
223+ < div >
224+ </ div >
225+ </ div >
226+ </ div >
227+ </ Clickable > ;
223228 }
224229}
225230
226231export default class Canopy extends Etch {
227- update ( { data} ) { }
232+ update ( { data } ) { }
228233 render ( ) {
229- let nodes = [ ] ;
234+ const nodes = [ ] ;
230235 prefor ( dims ( this . props . data ) , node => nodes . push ( < NodeView { ...node } /> ) ) ;
231236 return < div className = "ink-canopy" >
232237 { nodes }
0 commit comments