Moved parameters out of main options, see phetsims/tasks#730

phetsims · Nov 16, 2016 · ea6cd3f · ea6cd3f
1 parent 7a79425
commit ea6cd3f
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 40 deletions.
diff --git a/js/NumberControl3.js b/js/NumberControl3.js
@@ -42,49 +42,26 @@ define( function( require ) {
     options = _.extend( {
 
       createTitleNode: function( title, options ) {
-        return new TandemText( title, {
-          font: options.titleFont,
-          maxWidth: options.titleMaxWidth,
-          tandem: options.tandem && options.tandem.createTandem( 'titleNode' )
-        } );
+        return new TandemText( title, options );
       },
 
       createNumberDisplay: function( numberProperty, numberRange, options ) {
-        return new NumberDisplay( numberProperty, numberRange, _.extend( {
-          valuePattern: options.valuePattern,
-          font: options.valueFont,
-          decimalPlaces: options.decimalPlaces,
-          xMargin: options.valueXMargin,
-          yMargin: options.valueYMargin,
-          backgroundStroke: options.valueBackgroundStroke,
-          backgroundLineWidth: options.valueBackgroundLineWidth,
-          maxWidth: options.valueMaxWidth,
-          tandem: options.tandem && options.tandem.createTandem( 'numberDisplay' )
-        }, options ) );
+        return new NumberDisplay( numberProperty, numberRange, options );
+      },
+
+      createArrowButton: function( direction, callback, options ) {
+        return new ArrowButton( direction, callback, options );
+      },
+
+      createHSlider: function( valueProperty, range, options ) {
+        return new HSlider( valueProperty, range, options );
       },
 
       startCallback: function() {}, // called when interaction begins
       endCallback: function() {}, // called when interaction ends
       enabledProperty: new Property( true ), // {Property.<boolean>} is this control enabled?
       disabledOpacity: 0.5, // {number} opacity used to make the control look disabled
 
-      // title
-      titleFont: new PhetFont( 12 ),
-      titleMaxWidth: null, // {null|string} maxWidth to use for title, to constrain width for i18n
-
-      // value
-      valueFont: new PhetFont( 12 ),
-      valueMaxWidth: null, // {null|string} maxWidth to use for value display, to constrain width for i18n
-      valueXMargin: 8,
-      valueYMargin: 2,
-      valueBackgroundStroke: 'lightGray',
-      valueBackgroundLineWidth: 1,
-      decimalPlaces: 0,
-
-      // {string} Pattern used to format the value. Must contain '{0}'.
-      // If you want units or other verbiage, add them to the pattern, e.g. '{0} L'
-      valuePattern: '{0}',
-
       // arrow buttons
       delta: 1,
 
@@ -134,10 +111,27 @@ define( function( require ) {
 
     var delta = options.delta; // to improve readability
 
-    var titleNode = options.createTitleNode( title, options );
+    var titleNode = options.createTitleNode( title, {
+      font: new PhetFont( 12 ),
+      maxWidth: null, // {null|string} maxWidth to use for title, to constrain width for i18n
+      tandem: options.tandem && options.tandem.createTandem( 'titleNode' )
+    } );
     assert && assert( titleNode instanceof TandemText );
 
-    var numberDisplay = options.createNumberDisplay( numberProperty, numberRange, options );
+    var numberDisplay = options.createNumberDisplay( numberProperty, numberRange, _.extend( {
+      font: new PhetFont( 12 ),
+      maxWidth: null, // {null|string} maxWidth to use for value display, to constrain width for i18n
+      xMargin: 8,
+      yMargin: 2,
+      backgroundStroke: 'lightGray',
+      backgroundLineWidth: 1,
+      decimalPlaces: 0,
+
+      // {string} Pattern used to format the value. Must contain '{0}'.
+      // If you want units or other verbiage, add them to the pattern, e.g. '{0} L'
+      valuePattern: '{0}',
+      tandem: options.tandem && options.tandem.createTandem( 'numberDisplay' )
+    }, options ) );
     assert && assert( numberDisplay instanceof NumberDisplay );
 
     var arrowButtonOptions = {
@@ -147,31 +141,33 @@ define( function( require ) {
       scale: options.arrowButtonScale
     };
 
-    var leftArrowButton = new ArrowButton( 'left', function() {
+    var leftArrowButton = options.createArrowButton( 'left', function() {
       var value = numberProperty.get() - delta;
       value = Util.roundSymmetric( value / delta ) * delta; // constrain to delta
       value = Math.max( value, numberRange.min ); // constrain to range
       numberProperty.set( value );
     }, _.extend( {
       tandem: options.tandem && options.tandem.createTandem( 'leftArrowButton' )
     }, arrowButtonOptions ) );
+    assert && assert( leftArrowButton instanceof ArrowButton );
 
-    var rightArrowButton = new ArrowButton( 'right', function() {
+    var rightArrowButton = options.createArrowButton( 'right', function() {
       var value = numberProperty.get() + delta;
       value = Util.roundSymmetric( value / delta ) * delta; // constrain to delta
       value = Math.min( value, numberRange.max ); // constrain to range
       numberProperty.set( value );
     }, _.extend( {
       tandem: options.tandem && options.tandem.createTandem( 'rightArrowButton' )
     }, arrowButtonOptions ) );
+    assert && assert( rightArrowButton instanceof ArrowButton );
 
     var arrowEnabledListener = function( value ) {
       leftArrowButton.enabled = ( value > numberRange.min );
       rightArrowButton.enabled = ( value < numberRange.max );
     };
     numberProperty.link( arrowEnabledListener );
 
-    var slider = new HSlider( numberProperty, numberRange, _.extend(
+    var slider = options.createHSlider( numberProperty, numberRange, _.extend(
       // prevent supertype options from being passed, see https://github.com/phetsims/scenery-phet/issues/255
       _.omit( options, Node.prototype._mutatorKeys ),
       {
@@ -181,6 +177,7 @@ define( function( require ) {
         endDrag: options.endCallback,
         tandem: options.tandem && options.tandem.createTandem( 'slider' )
       } ) );
+    assert && assert( slider instanceof HSlider );
 
     // major ticks
     var majorTicks = options.majorTicks;

diff --git a/js/demo/SlidersView.js b/js/demo/SlidersView.js
@@ -81,9 +81,9 @@ define( function( require ) {
         return new TandemText( title, _.extend( { fontSize: 32 }, options ) );
       },
       createNumberDisplay: function( numberProperty, numberRange, options ) {
-        return new NumberDisplay( numberProperty, numberRange, _.extend( {
+        return new NumberDisplay( numberProperty, numberRange, _.extend( options, {
           backgroundStroke: 'black'
-        }, options ) );
+        } ) );
       },
       slider: new HSlider( weightProperty, weightRange, { thumbFillEnabled: 'green' } ),
       leftArrowButton: new TextPushButton( 'REDUCE', {