Prototype for verbose interaction mode of the self voicing feature, see

#196

js/GFLBA11yStrings.js

@@ -108,6 +108,11 @@ const GFLBA11yStrings = {
   },
   blueColor: {
     value: 'Blue'
+  },
+
+  // mass changes
+  massChangeInteractionPattern: {
+    value: '{{valueText}}. {{massAlert}}'
   }
 };
 

js/view/GFLBAlertManager.js

@@ -7,6 +7,8 @@
  */
 
 import GravityForceLabAlertManager from '../../../gravity-force-lab/js/view/GravityForceLabAlertManager.js';
+import ISLCQueryParameters from '../../../inverse-square-law-common/js/ISLCQueryParameters.js';
+import webSpeaker from '../../../inverse-square-law-common/js/view/webSpeaker.js';
 import ActivationUtterance from '../../../utterance-queue/js/ActivationUtterance.js';
 import GFLBA11yStrings from '../GFLBA11yStrings.js';
 import gravityForceLabBasics from '../gravityForceLabBasics.js';
@@ -38,16 +40,42 @@ class GFLBAlertManager extends GravityForceLabAlertManager {
     model.showDistanceProperty.lazyLink( showDistance => {
       this.alertDistanceVisible( showDistance );
     } );
+
+    // PROTOTYPE SELF VOICING FEATURE - when these Properties change, alert change to the user
+    if ( ISLCQueryParameters.selfVoicing ) {
+      model.showForceValuesProperty.lazyLink( showForceValues => {
+        webSpeaker.speak( this.getShowForceValuesAlert( showForceValues ) );
+      } );
+
+      model.showDistanceProperty.lazyLink( showDistance => {
+        webSpeaker.speak( this.getDistanceVisibleAlert( showDistance ) );
+      } );
+
+      model.constantRadiusProperty.link( constantRadius => {
+        webSpeaker.speak( this.getConstantRadiusAlert( constantRadius ) );
+      } );
+    }
   }
 
   /**
    * @private
    * @param {boolean} showDistance
    */
   alertDistanceVisible( showDistance ) {
-    this.distanceVisibleUtterance.alert = showDistance ? distanceArrowVisibleString : distanceArrowRemovedString;
+    this.distanceVisibleUtterance.alert = this.getDistanceVisibleAlert( showDistance );
     phet.joist.sim.utteranceQueue.addToBack( this.distanceVisibleUtterance );
   }
+
+  /**
+   * Get an alert that describes the changing visibility of the distance value.
+   * @public
+   *
+   * @param {boolean} showDistance
+   * @return {string}
+   */
+  getDistanceVisibleAlert( showDistance ) {
+    return showDistance ? distanceArrowVisibleString : distanceArrowRemovedString;
+  }
 }
 
 gravityForceLabBasics.register( 'GFLBAlertManager', GFLBAlertManager );

js/view/GFLBMassControl.js

@@ -16,6 +16,7 @@ import Text from '../../../scenery/js/nodes/Text.js';
 import VBox from '../../../scenery/js/nodes/VBox.js';
 import Color from '../../../scenery/js/util/Color.js';
 import Panel from '../../../sun/js/Panel.js';
+import GFLBA11yStrings from '../GFLBA11yStrings.js';
 import GFLBConstants from '../GFLBConstants.js';
 import gravityForceLabBasicsStrings from '../gravity-force-lab-basics-strings.js';
 import gravityForceLabBasics from '../gravityForceLabBasics.js';
@@ -24,6 +25,9 @@ import StringUtils from '../../../phetcommon/js/util/StringUtils.js';
 
 const billionKgString = gravityForceLabBasicsStrings.billionKg;
 
+// a11y strings
+const massChangeInteractionPatternString = GFLBA11yStrings.massChangeInteractionPattern.value;
+
 // constants
 const MIN_PANEL_WIDTH = 150;
 const MAX_TEXT_WIDTH = 120; // i18n
@@ -127,6 +131,7 @@ class GFLBMassControl extends Panel {
 
     // PROTOTYPE a11y code, for the self-voicing feature set
     if ( options.shapeHitDetector ) {
+      // explore mode, speak information about the control
       options.shapeHitDetector.addNode( panelVBox );
       options.shapeHitDetector.hitShapeEmitter.addListener( hitTarget => {
         if ( hitTarget === panelVBox ) {
@@ -136,6 +141,17 @@ class GFLBMassControl extends Panel {
           } ) );
         }
       } );
+
+      // interaction mode, speak information about the change due to input
+      valueProperty.lazyLink( value => {
+        const massChangedUtterance = alertManager.getMassValueChangedAlert( thisObjectEnum );
+        const valueText = numberPicker.ariaValueText;
+
+        webSpeaker.speak( StringUtils.fillIn( massChangeInteractionPatternString, {
+          valueText: valueText,
+          massAlert: massChangedUtterance.alert
+        } ) );
+      } );
     }
   }
 }

js/view/GFLBScreenView.js

@@ -24,6 +24,7 @@ import DefaultDirection from '../../../inverse-square-law-common/js/view/Default
 import ISLCDragBoundsNode from '../../../inverse-square-law-common/js/view/ISLCDragBoundsNode.js';
 import ISLCGridNode from '../../../inverse-square-law-common/js/view/ISLCGridNode.js';
 import ISLCObjectEnum from '../../../inverse-square-law-common/js/view/ISLCObjectEnum.js';
+import webSpeaker from '../../../inverse-square-law-common/js/view/webSpeaker.js';
 import ScreenView from '../../../joist/js/ScreenView.js';
 import ModelViewTransform2 from '../../../phetcommon/js/view/ModelViewTransform2.js';
 import ResetAllButton from '../../../scenery-phet/js/buttons/ResetAllButton.js';
@@ -71,8 +72,8 @@ const screenSummarySecondaryDescriptionString = GFLBA11yStrings.screenSummarySec
 const basicsSimStateLabelString = GFLBA11yStrings.basicsSimStateLabel.value;
 const verboseCheckedForceValuesCheckboxInteractionHintString = GFLBA11yStrings.verboseCheckedForceValuesCheckboxInteractionHint.value;
 const verboseUncheckedForceValuesCheckboxInteractionHintString = GFLBA11yStrings.verboseUncheckedForceValuesCheckboxInteractionHint.value;
-const verboseUncheckedDistanceCheckboxInteractionHintString =  GFLBA11yStrings.verboseUncheckedDistanceCheckboxInteractionHint.value;
-const verboseCheckedDistanceCheckboxInteractionHintString =  GFLBA11yStrings.verboseCheckedDistanceCheckboxInteractionHint.value;
+const verboseUncheckedDistanceCheckboxInteractionHintString = GFLBA11yStrings.verboseUncheckedDistanceCheckboxInteractionHint.value;
+const verboseCheckedDistanceCheckboxInteractionHintString = GFLBA11yStrings.verboseCheckedDistanceCheckboxInteractionHint.value;
 const verboseCheckedConstantSizeCheckboxInteractionHintString = GFLBA11yStrings.verboseCheckedConstantSizeCheckboxInteractionHint.value;
 const verboseUncheckedConstantSizeCheckboxInteractionHintString = GFLBA11yStrings.verboseUncheckedConstantSizeCheckboxInteractionHint.value;
 const redColorString = GFLBA11yStrings.redColor.value;
@@ -308,10 +309,16 @@ class GFLBScreenView extends ScreenView {
     // Reset All button
     const resetAllButton = new ResetAllButton( {
       listener: () => {
+
+        // as the simulation resets, do no not speak about changes
+        webSpeaker.enabled = false;
+
         model.reset();
         mass1Node.reset();
         mass2Node.reset();
         this.forceSoundGenerator.reset();
+
+        webSpeaker.enabled = false;
       },
       right: this.layoutBounds.maxX - 10,
       bottom: this.layoutBounds.maxY - 10,
@@ -359,7 +366,7 @@ class GFLBScreenView extends ScreenView {
       this.addChild( gridNode );
     }
 
-    if ( SELF_VOICING )  {
+    if ( SELF_VOICING ) {
 
       // show the areas that would trigger speech output for the self-voicing prototype
       const hitPaths = this.shapeHitDetector.getDebugPaths();