var Toolbar = function ( editor ) { var signals = editor.signals; var container = new UI.Panel(); var buttons = new UI.Panel(); container.add( buttons ); // translate / rotate / scale var translate = new UI.Button( 'translate' ).onClick( function () { signals.transformModeChanged.dispatch( 'translate' ); } ); buttons.add( translate ); var rotate = new UI.Button( 'rotate' ).onClick( function () { signals.transformModeChanged.dispatch( 'rotate' ); } ); buttons.add( rotate ); var scale = new UI.Button( 'scale' ).onClick( function () { signals.transformModeChanged.dispatch( 'scale' ); } ); buttons.add( scale ); // grid var grid = new UI.Number( 25 ).onChange( update ); grid.dom.style.width = '42px'; buttons.add( new UI.Text( 'Grid: ' ) ); buttons.add( grid ); var snap = new UI.Checkbox( false ).onChange( update ); buttons.add( snap ); buttons.add( new UI.Text( 'snap' ) ); var local = new UI.Checkbox( false ).onChange( update ); buttons.add( local ); buttons.add( new UI.Text( 'local' ) ); function update() { signals.snapChanged.dispatch( snap.getValue() === true ? grid.getValue() : null ); signals.spaceChanged.dispatch( local.getValue() === true ? "local" : "world" ); } update(); return container; }