support dynamic locale for NumberControl subclasses, #441

phetsims · Aug 30, 2022 · 824bbb8 · 824bbb8
1 parent ab154ff
commit 824bbb8
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 25 deletions.
diff --git a/js/common/view/DiameterControl.ts b/js/common/view/DiameterControl.ts
@@ -30,6 +30,9 @@ export default class DiameterControl extends NumberControl {
     // Assemble the defaults for NumberControl, because optionize doesn't support defaults in multiple objects.
     const numberControlDefaults = combineOptions<NumberControlOptions>( {}, GOConstants.NUMBER_CONTROL_OPTIONS, {
       delta: GOConstants.DIAMETER_SPINNER_STEP,
+      titleNodeOptions: {
+        phetioVisiblePropertyInstrumented: false
+      },
       sliderOptions: {
         constrainValue: ( value: number ) => Utils.roundToInterval( value, GOConstants.DIAMETER_SLIDER_STEP ),
         keyboardStep: GOConstants.DIAMETER_KEYBOARD_STEP, // used by all alternative-input devices
@@ -38,15 +41,15 @@ export default class DiameterControl extends NumberControl {
       },
       numberDisplayOptions: {
         decimalPlaces: GOConstants.DIAMETER_DECIMAL_PLACES,
-        valuePattern: geometricOpticsStrings.valueCentimetersPattern
+        valuePattern: geometricOpticsStrings.valueCentimetersPatternStringProperty
       }
     } );
 
     // Now add providedOptions to the defaults.
     const options = optionize<DiameterControlOptions, SelfOptions, NumberControlOptions>()(
       numberControlDefaults, providedOptions );
 
-    super( geometricOpticsStrings.diameter, diameterProperty, range, options );
+    super( geometricOpticsStrings.diameterStringProperty, diameterProperty, range, options );
 
     this.addLinkedElement( diameterProperty, {
       tandem: options.tandem.createTandem( diameterProperty.tandem.name )

diff --git a/js/common/view/FocalLengthControl.ts b/js/common/view/FocalLengthControl.ts
@@ -13,11 +13,12 @@ import geometricOpticsStrings from '../../geometricOpticsStrings.js';
 import GOConstants from '../GOConstants.js';
 import Utils from '../../../../dot/js/Utils.js';
 import NumberProperty from '../../../../axon/js/NumberProperty.js';
-import StringProperty from '../../../../axon/js/StringProperty.js';
 import TReadOnlyProperty from '../../../../axon/js/TReadOnlyProperty.js';
 import { NodeOptions } from '../../../../scenery/js/imports.js';
 import PickRequired from '../../../../phet-core/js/types/PickRequired.js';
 import optionize, { combineOptions, EmptySelfOptions } from '../../../../phet-core/js/optionize.js';
+import DerivedProperty from '../../../../axon/js/DerivedProperty.js';
+import StringIO from '../../../../tandem/js/types/StringIO.js';
 
 type SelfOptions = EmptySelfOptions;
 
@@ -37,25 +38,26 @@ export default class FocalLengthControl extends NumberControl {
     assert && assert( focalLengthMagnitudeProperty.range ); // {Range|null}
     const range = focalLengthMagnitudeProperty.range!;
 
-    // Preferable to derive from focalLengthProperty, but scenery.Text requires textProperty to be settable.
-    const textProperty = new StringProperty( '', {
-      tandem: providedOptions.tandem.createTandem( 'textProperty' ),
-      phetioReadOnly: true
-    } );
-    focalLengthProperty.link( ( focalLength: number ) => {
-      textProperty.value = ( focalLength >= 0 ) ? geometricOpticsStrings.focalLengthPositive
-                                                : geometricOpticsStrings.focalLengthNegative;
+    //TODO https://github.com/phetsims/sun/issues cannot make this a child of focalLengthControl.titleNode
+    const titleStringProperty = new DerivedProperty( [
+      focalLengthProperty,
+      geometricOpticsStrings.focalLengthPositiveStringProperty,
+      geometricOpticsStrings.focalLengthNegativeStringProperty
+    ], ( focalLength: number, focalLengthPositiveString: string, focalLengthNegativeString: string ) =>
+      ( focalLength >= 0 ) ? focalLengthPositiveString : focalLengthNegativeString, {
+      tandem: providedOptions.tandem.createTandem( 'titleStringProperty' ),
+      phetioValueType: StringIO
     } );
 
     // Assemble the defaults for NumberControl, because optionize doesn't support defaults in multiple objects.
     const numberControlDefaults = combineOptions<NumberControlOptions>( {}, GOConstants.NUMBER_CONTROL_OPTIONS, {
       delta: GOConstants.FOCAL_LENGTH_SPINNER_STEP,
       titleNodeOptions: {
-        textProperty: textProperty
+        phetioVisiblePropertyInstrumented: false
       },
       numberDisplayOptions: {
         decimalPlaces: GOConstants.FOCAL_LENGTH_DECIMAL_PLACES,
-        valuePattern: geometricOpticsStrings.valueCentimetersPattern
+        valuePattern: geometricOpticsStrings.valueCentimetersPatternStringProperty
       },
       sliderOptions: {
         constrainValue: ( value: number ) => Utils.roundToInterval( value, GOConstants.FOCAL_LENGTH_SLIDER_STEP ),
@@ -69,7 +71,7 @@ export default class FocalLengthControl extends NumberControl {
     const options = optionize<FocalLengthControlOptions, SelfOptions, NumberControlOptions>()(
       numberControlDefaults, providedOptions );
 
-    super( textProperty.value, focalLengthMagnitudeProperty, range, options );
+    super( titleStringProperty, focalLengthMagnitudeProperty, range, options );
 
     this.addLinkedElement( focalLengthMagnitudeProperty, {
       tandem: options.tandem.createTandem( focalLengthMagnitudeProperty.tandem.name )

diff --git a/js/common/view/RadiusOfCurvatureControl.ts b/js/common/view/RadiusOfCurvatureControl.ts
@@ -13,10 +13,11 @@ import geometricOpticsStrings from '../../geometricOpticsStrings.js';
 import GOConstants from '../GOConstants.js';
 import Utils from '../../../../dot/js/Utils.js';
 import NumberProperty from '../../../../axon/js/NumberProperty.js';
-import StringProperty from '../../../../axon/js/StringProperty.js';
 import TReadOnlyProperty from '../../../../axon/js/TReadOnlyProperty.js';
 import PickRequired from '../../../../phet-core/js/types/PickRequired.js';
 import optionize, { combineOptions, EmptySelfOptions } from '../../../../phet-core/js/optionize.js';
+import StringIO from '../../../../tandem/js/types/StringIO.js';
+import DerivedProperty from '../../../../axon/js/DerivedProperty.js';
 
 type SelfOptions = EmptySelfOptions;
 
@@ -36,21 +37,22 @@ export default class RadiusOfCurvatureControl extends NumberControl {
     assert && assert( radiusOfCurvatureMagnitudeProperty.range ); // {Range|null}
     const range = radiusOfCurvatureMagnitudeProperty.range!;
 
-    // Preferable to derive from radiusOfCurvatureProperty, but scenery.Text requires textProperty to be settable.
-    const textProperty = new StringProperty( '', {
-      tandem: providedOptions.tandem.createTandem( 'textProperty' ),
-      phetioReadOnly: true
-    } );
-    radiusOfCurvatureProperty.link( ( radiusOfCurvature: number ) => {
-      textProperty.value = ( radiusOfCurvature >= 0 ) ? geometricOpticsStrings.radiusOfCurvaturePositive
-                                                      : geometricOpticsStrings.radiusOfCurvatureNegative;
+    //TODO https://github.com/phetsims/sun/issues cannot make this a child of radiusOfCurvatureControl.titleNode
+    const titleStringProperty = new DerivedProperty( [
+      radiusOfCurvatureProperty,
+      geometricOpticsStrings.radiusOfCurvaturePositiveStringProperty,
+      geometricOpticsStrings.radiusOfCurvatureNegativeStringProperty
+    ], ( radiusOfCurvature: number, radiusOfCurvaturePositiveString: string, radiusOfCurvatureNegativeString: string ) =>
+      ( radiusOfCurvature >= 0 ) ? radiusOfCurvaturePositiveString : radiusOfCurvatureNegativeString, {
+      tandem: providedOptions.tandem.createTandem( 'titleStringProperty' ),
+      phetioValueType: StringIO
     } );
 
     // Assemble the defaults for NumberControl, because optionize doesn't support defaults in multiple objects.
     const numberControlDefaults = combineOptions<NumberControlOptions>( {}, GOConstants.NUMBER_CONTROL_OPTIONS, {
       delta: GOConstants.RADIUS_OF_CURVATURE_SPINNER_STEP,
       titleNodeOptions: {
-        textProperty: textProperty
+        phetioVisiblePropertyInstrumented: false
       },
       numberDisplayOptions: {
         decimalPlaces: GOConstants.RADIUS_OF_CURVATURE_DECIMAL_PLACES,
@@ -68,7 +70,7 @@ export default class RadiusOfCurvatureControl extends NumberControl {
     const options = optionize<RadiusOfCurvatureControlOptions, SelfOptions, NumberControlOptions>()(
       numberControlDefaults, providedOptions );
 
-    super( textProperty.value, radiusOfCurvatureMagnitudeProperty, range, options );
+    super( titleStringProperty, radiusOfCurvatureMagnitudeProperty, range, options );
 
     this.addLinkedElement( radiusOfCurvatureMagnitudeProperty, {
       tandem: options.tandem.createTandem( radiusOfCurvatureMagnitudeProperty.tandem.name )