From 9abb73f6d407a1ff3f38a11518019b29b0df9596 Mon Sep 17 00:00:00 2001 From: denz1994 Date: Wed, 8 Aug 2018 10:57:25 -0400 Subject: [PATCH] Adjusting size of ToolboxPanel to match width of optionsPanel on each screen. #293 --- js/common/view/SpringScreenView.js | 12 ------------ js/energy/view/EnergyScreenView.js | 14 +++++++++++++- js/intro/view/IntroScreenView.js | 14 +++++++++++++- js/lab/view/LabScreenView.js | 14 +++++++++++++- js/vectors/view/VectorsScreenView.js | 14 +++++++++++++- 5 files changed, 52 insertions(+), 16 deletions(-) diff --git a/js/common/view/SpringScreenView.js b/js/common/view/SpringScreenView.js index 39489bee..bd9a2a5d 100644 --- a/js/common/view/SpringScreenView.js +++ b/js/common/view/SpringScreenView.js @@ -35,7 +35,6 @@ define( function( require ) { var StopperButtonNode = require( 'MASSES_AND_SPRINGS/common/view/StopperButtonNode' ); var StringUtils = require( 'PHETCOMMON/util/StringUtils' ); var TimeControlNode = require( 'SCENERY_PHET/TimeControlNode' ); - var ToolboxPanel = require( 'MASSES_AND_SPRINGS/common/view/ToolboxPanel' ); var Util = require( 'DOT/Util' ); var Vector2 = require( 'DOT/Vector2' ); @@ -228,17 +227,6 @@ define( function( require ) { tandem: tandem.createTandem( 'timeControlNode' ) } ); - // @public {ToolboxPanel} Toolbox Panel - this.toolboxPanel = new ToolboxPanel( - this.visibleBoundsProperty.get(), - this.rulerNode, this.timerNode, - model.rulerVisibleProperty, - model.timerVisibleProperty, - tandem.createTandem( 'toolboxPanel' ), { - minWidth: MassesAndSpringsConstants.PANEL_MIN_WIDTH + 21 - } - ); - // Buttons controlling the speed of the sim, play/pause button, and the reset button this.simControlHBox = new HBox( { spacing: this.spacing * 6, diff --git a/js/energy/view/EnergyScreenView.js b/js/energy/view/EnergyScreenView.js index 79d18ecb..5ecfe096 100644 --- a/js/energy/view/EnergyScreenView.js +++ b/js/energy/view/EnergyScreenView.js @@ -13,6 +13,7 @@ define( function( require ) { var inherit = require( 'PHET_CORE/inherit' ); var massesAndSprings = require( 'MASSES_AND_SPRINGS/massesAndSprings' ); var MassesAndSpringsConstants = require( 'MASSES_AND_SPRINGS/common/MassesAndSpringsConstants' ); + var ToolboxPanel = require( 'MASSES_AND_SPRINGS/common/view/ToolboxPanel' ); var VBox = require( 'SCENERY/nodes/VBox' ); var Vector2 = require( 'DOT/Vector2' ); var OneSpringScreenView = require( 'MASSES_AND_SPRINGS/common/view/OneSpringScreenView' ); @@ -47,8 +48,19 @@ define( function( require ) { // Panel that will display all the toggleable options. var optionsPanel = this.createOptionsPanel( optionsVBox, tandem ); + // @private {ToolboxPanel} Toolbox Panel + var toolboxPanel = new ToolboxPanel( + this.visibleBoundsProperty.get(), + this.rulerNode, this.timerNode, + model.rulerVisibleProperty, + model.timerVisibleProperty, + tandem.createTandem( 'toolboxPanel' ), { + minWidth: optionsPanel.width + } + ); + // Contains all of the options for the reference lines, gravity, damping, and toolBox - var rightPanelsVBox = new VBox( { children: [ optionsPanel, self.toolboxPanel ], spacing: this.spacing * 0.9 } ); + var rightPanelsVBox = new VBox( { children: [ optionsPanel, toolboxPanel ], spacing: this.spacing * 0.9 } ); this.addChild( rightPanelsVBox ); rightPanelsVBox.moveToBack(); diff --git a/js/intro/view/IntroScreenView.js b/js/intro/view/IntroScreenView.js index 99820efd..e034151e 100644 --- a/js/intro/view/IntroScreenView.js +++ b/js/intro/view/IntroScreenView.js @@ -26,6 +26,7 @@ define( function( require ) { var SpringControlPanel = require( 'MASSES_AND_SPRINGS/common/view/SpringControlPanel' ); var StringUtils = require( 'PHETCOMMON/util/StringUtils' ); var Text = require( 'SCENERY/nodes/Text' ); + var ToolboxPanel = require( 'MASSES_AND_SPRINGS/common/view/ToolboxPanel' ); var TwoSpringScreenView = require( 'MASSES_AND_SPRINGS/common/view/TwoSpringScreenView' ); var Util = require( 'DOT/Util' ); var VBox = require( 'SCENERY/nodes/VBox' ); @@ -234,9 +235,20 @@ define( function( require ) { // Panel that will display all the toggleable options. var optionsPanel = this.createOptionsPanel( optionsVBox, tandem ); + // @private {ToolboxPanel} Toolbox Panel + var toolboxPanel = new ToolboxPanel( + this.visibleBoundsProperty.get(), + this.rulerNode, this.timerNode, + model.rulerVisibleProperty, + model.timerVisibleProperty, + tandem.createTandem( 'toolboxPanel' ), { + minWidth: optionsPanel.width + } + ); + // Contains all of the options for the reference lines, gravity, damping, and toolBox var rightPanelsVBox = new VBox( { - children: [ optionsPanel, self.toolboxPanel, sceneRadioButtonGroup ], + children: [ optionsPanel, toolboxPanel, sceneRadioButtonGroup ], spacing: this.spacing * 0.9 } ); this.addChild( rightPanelsVBox ); diff --git a/js/lab/view/LabScreenView.js b/js/lab/view/LabScreenView.js index 4f46ea6a..cbba7e04 100644 --- a/js/lab/view/LabScreenView.js +++ b/js/lab/view/LabScreenView.js @@ -15,6 +15,7 @@ define( function( require ) { var massesAndSprings = require( 'MASSES_AND_SPRINGS/massesAndSprings' ); var MassesAndSpringsConstants = require( 'MASSES_AND_SPRINGS/common/MassesAndSpringsConstants' ); var OneSpringScreenView = require( 'MASSES_AND_SPRINGS/common/view/OneSpringScreenView' ); + var ToolboxPanel = require( 'MASSES_AND_SPRINGS/common/view/ToolboxPanel' ); var VectorVisibilityControlNode = require( 'MASSES_AND_SPRINGS/vectors/view/VectorVisibilityControlNode' ); var VBox = require( 'SCENERY/nodes/VBox' ); var Vector2 = require( 'DOT/Vector2' ); @@ -66,8 +67,19 @@ define( function( require ) { // Panel that will display all the toggleable options. var optionsPanel = this.createOptionsPanel( optionsVBox, tandem ); + // @private {ToolboxPanel} Toolbox Panel + var toolboxPanel = new ToolboxPanel( + this.visibleBoundsProperty.get(), + this.rulerNode, this.timerNode, + model.rulerVisibleProperty, + model.timerVisibleProperty, + tandem.createTandem( 'toolboxPanel' ), { + minWidth: optionsPanel.width + } + ); + // Contains all of the options for the reference lines, gravity, damping, and toolBox - var rightPanelsVBox = new VBox( { children: [ optionsPanel, self.toolboxPanel ], spacing: this.spacing * 0.9 } ); + var rightPanelsVBox = new VBox( { children: [ optionsPanel, toolboxPanel ], spacing: this.spacing * 0.9 } ); this.addChild( rightPanelsVBox ); rightPanelsVBox.moveToBack(); diff --git a/js/vectors/view/VectorsScreenView.js b/js/vectors/view/VectorsScreenView.js index 425f75fc..3f72a6ee 100644 --- a/js/vectors/view/VectorsScreenView.js +++ b/js/vectors/view/VectorsScreenView.js @@ -14,6 +14,7 @@ define( function( require ) { var inherit = require( 'PHET_CORE/inherit' ); var massesAndSprings = require( 'MASSES_AND_SPRINGS/massesAndSprings' ); var MassesAndSpringsConstants = require( 'MASSES_AND_SPRINGS/common/MassesAndSpringsConstants' ); + var ToolboxPanel = require( 'MASSES_AND_SPRINGS/common/view/ToolboxPanel' ); var TwoSpringScreenView = require( 'MASSES_AND_SPRINGS/common/view/TwoSpringScreenView' ); var ReferenceLineNode = require( 'MASSES_AND_SPRINGS/common/view/ReferenceLineNode' ); var VBox = require( 'SCENERY/nodes/VBox' ); @@ -121,8 +122,19 @@ define( function( require ) { // Panel that will display all the toggleable options. var optionsPanel = this.createOptionsPanel( optionsVBox, tandem ); + // @private {ToolboxPanel} Toolbox Panel + var toolboxPanel = new ToolboxPanel( + this.visibleBoundsProperty.get(), + this.rulerNode, this.timerNode, + model.rulerVisibleProperty, + model.timerVisibleProperty, + tandem.createTandem( 'toolboxPanel' ), { + minWidth: optionsPanel.width + } + ); + // Contains all of the options for the reference lines, gravity, damping, and toolBox - var rightPanelsVBox = new VBox( { children: [ optionsPanel, self.toolboxPanel ], spacing: this.spacing * 0.9 } ); + var rightPanelsVBox = new VBox( { children: [ optionsPanel, toolboxPanel ], spacing: this.spacing * 0.9 } ); this.addChild( rightPanelsVBox ); rightPanelsVBox.moveToBack();