Add keyboard help content for BalancePointScreen, see: #266

phetsims · Jun 18, 2024 · 06dd2b8 · 06dd2b8
1 parent fd292b7
commit 06dd2b8
Show file tree

Hide file tree

Showing 6 changed files with 200 additions and 2 deletions.
diff --git a/js/MeanShareAndBalanceStrings.ts b/js/MeanShareAndBalanceStrings.ts
@@ -45,6 +45,37 @@ type StringsType = {
   'kickStringProperty': LocalizedStringProperty;
   'remainderPatternStringProperty': LocalizedStringProperty;
   'totalStringProperty': LocalizedStringProperty;
+  'keyboardHelpDialog': {
+    'balancePointScreen': {
+      'sliderControlHeadingStringProperty': LocalizedStringProperty;
+      'sliderVerbStringProperty': LocalizedStringProperty;
+      'sliderNounStringProperty': LocalizedStringProperty;
+      'grabOrReleaseItemHeadingStringProperty': LocalizedStringProperty;
+      'grabOrReleaseItemStringProperty': LocalizedStringProperty;
+      'moveHeadingStringProperty': LocalizedStringProperty;
+      'moveDescriptionStringProperty': LocalizedStringProperty;
+      'numberSpinnerHeadingStringProperty': LocalizedStringProperty;
+    };
+    'numberSpinnerVerbStringProperty': LocalizedStringProperty;
+    'numberSpinnerNounStringProperty': LocalizedStringProperty;
+    'fairShareScreen': {
+      'numberSpinnerHeadingStringProperty': LocalizedStringProperty;
+    };
+    'distributeScreen': {
+      'numberSpinnerHeadingStringProperty': LocalizedStringProperty;
+      'sliderControlHeadingStringProperty': LocalizedStringProperty;
+      'sliderControlNounStringProperty': LocalizedStringProperty;
+      'grabOrReleaseItemHeadingStringProperty': LocalizedStringProperty;
+      'grabOrReleaseItemStringProperty': LocalizedStringProperty;
+      'moveHeadingStringProperty': LocalizedStringProperty;
+      'moveDescriptionStringProperty': LocalizedStringProperty;
+    };
+    'levelOutScreen': {
+      'numberSpinnerHeadingStringProperty': LocalizedStringProperty;
+      'sliderControlHeadingStringProperty': LocalizedStringProperty;
+      'sliderControlNounStringProperty': LocalizedStringProperty;
+    }
+  }
 };
 
 const MeanShareAndBalanceStrings = getStringModule( 'MEAN_SHARE_AND_BALANCE' ) as StringsType;

diff --git a/js/balance-point/BalancePointScreen.ts b/js/balance-point/BalancePointScreen.ts
@@ -15,11 +15,11 @@ import MeanShareAndBalanceColors from '../common/MeanShareAndBalanceColors.js';
 import BalancePointScreenView from './view/BalancePointScreenView.js';
 import meanShareAndBalance from '../meanShareAndBalance.js';
 import BalancePointModel from './model/BalancePointModel.js';
-import BasicActionsKeyboardHelpSection from '../../../scenery-phet/js/keyboard/help/BasicActionsKeyboardHelpSection.js';
 import { Image } from '../../../scenery/js/imports.js';
 import ScreenIcon from '../../../joist/js/ScreenIcon.js';
 import balancePointHomeScreenIcon_svg from '../../images/balancePointHomeScreenIcon_svg.js';
 import balancePointNavBarIcon_svg from '../../images/balancePointNavBarIcon_svg.js';
+import BalancePointKeyboardHelpNode from './view/BalancePointKeyboardHelpNode.js';
 
 type SelfOptions = EmptySelfOptions;
 
@@ -38,7 +38,7 @@ export default class BalancePointScreen extends Screen<BalancePointModel, Balanc
         maxIconHeightProportion: 1
       } ),
       backgroundColorProperty: MeanShareAndBalanceColors.balancePointScreenColorProperty,
-      createKeyboardHelpNode: () => new BasicActionsKeyboardHelpSection()
+      createKeyboardHelpNode: () => new BalancePointKeyboardHelpNode()
     }, providedOptions );
     super(
       () => new BalancePointModel( { tandem: options.tandem.createTandem( 'model' ) } ),

diff --git a/js/balance-point/view/BalancePointKeyboardHelpNode.ts b/js/balance-point/view/BalancePointKeyboardHelpNode.ts
@@ -0,0 +1,44 @@
+// Copyright 2023, University of Colorado Boulder
+
+/**
+ * The keyboard help content for the Balance Point screen includes slider controls, grab or release, and item movement
+ * keyboard help.
+ *
+ * @author Marla Schulz (PhET Interactive Simulations)
+ *
+ */
+
+import MeanShareAndBalanceKeyboardHelpNode from '../../common/view/MeanShareAndBalanceKeyboardHelpNode.js';
+import meanShareAndBalance from '../../meanShareAndBalance.js';
+import SliderControlsKeyboardHelpSection from '../../../../scenery-phet/js/keyboard/help/SliderControlsKeyboardHelpSection.js';
+import MeanShareAndBalanceStrings from '../../MeanShareAndBalanceStrings.js';
+import GrabReleaseKeyboardHelpSection from '../../../../scenery-phet/js/keyboard/help/GrabReleaseKeyboardHelpSection.js';
+import MoveKeyboardHelpSection from '../../common/view/MoveKeyboardHelpSection.js';
+import SpinnerControlsKeyboardHelpSection from '../../../../scenery-phet/js/keyboard/help/SpinnerControlsKeyboardHelpSection.js';
+
+export default class BalancePointKeyboardHelpNode extends MeanShareAndBalanceKeyboardHelpNode {
+
+  public constructor() {
+    super( [
+        new SliderControlsKeyboardHelpSection( {
+          headingStringProperty: MeanShareAndBalanceStrings.keyboardHelpDialog.balancePointScreen.sliderControlHeadingStringProperty,
+          verbStringProperty: MeanShareAndBalanceStrings.keyboardHelpDialog.balancePointScreen.sliderVerbStringProperty,
+          sliderStringProperty: MeanShareAndBalanceStrings.keyboardHelpDialog.balancePointScreen.sliderNounStringProperty
+        } ),
+        new GrabReleaseKeyboardHelpSection( MeanShareAndBalanceStrings.keyboardHelpDialog.balancePointScreen.grabOrReleaseItemHeadingStringProperty,
+          MeanShareAndBalanceStrings.keyboardHelpDialog.balancePointScreen.grabOrReleaseItemStringProperty ),
+        new MoveKeyboardHelpSection( {
+          headingStringProperty: MeanShareAndBalanceStrings.keyboardHelpDialog.balancePointScreen.moveHeadingStringProperty,
+          moveDescriptionStringProperty: MeanShareAndBalanceStrings.keyboardHelpDialog.balancePointScreen.moveDescriptionStringProperty
+        } )
+      ],
+      new SpinnerControlsKeyboardHelpSection( {
+        headingStringProperty: MeanShareAndBalanceStrings.keyboardHelpDialog.balancePointScreen.numberSpinnerHeadingStringProperty,
+        verbStringProperty: MeanShareAndBalanceStrings.keyboardHelpDialog.numberSpinnerVerbStringProperty,
+        sliderStringProperty: MeanShareAndBalanceStrings.keyboardHelpDialog.numberSpinnerNounStringProperty,
+        includeSmallerStepsRow: false
+      } ) );
+  }
+}
+
+meanShareAndBalance.register( 'BalancePointKeyboardHelpNode', BalancePointKeyboardHelpNode );
diff --git a/js/common/view/MeanShareAndBalanceKeyboardHelpNode.ts b/js/common/view/MeanShareAndBalanceKeyboardHelpNode.ts
@@ -0,0 +1,22 @@
+// Copyright 2023, University of Colorado Boulder
+/**
+ * Creates the keyboard help content for all the screens. All screens will contain a BasicActionsKeyboardHelpSection.
+ *
+ * @author Marla Schulz (PhET Interactive Simulations)
+ *
+ */
+
+import TwoColumnKeyboardHelpContent from '../../../../scenery-phet/js/keyboard/help/TwoColumnKeyboardHelpContent.js';
+import meanShareAndBalance from '../../meanShareAndBalance.js';
+import KeyboardHelpSection from '../../../../scenery-phet/js/keyboard/help/KeyboardHelpSection.js';
+import BasicActionsKeyboardHelpSection from '../../../../scenery-phet/js/keyboard/help/BasicActionsKeyboardHelpSection.js';
+
+
+export default class MeanShareAndBalanceKeyboardHelpNode extends TwoColumnKeyboardHelpContent {
+
+  public constructor( leftContent: KeyboardHelpSection[], topRightContent?: KeyboardHelpSection ) {
+   super( leftContent, [ ...( topRightContent ? [ topRightContent ] : [] ), new BasicActionsKeyboardHelpSection() ] );
+  }
+}
+
+meanShareAndBalance.register( 'MeanShareAndBalanceKeyboardHelpNode', MeanShareAndBalanceKeyboardHelpNode );
diff --git a/js/common/view/MoveKeyboardHelpSection.ts b/js/common/view/MoveKeyboardHelpSection.ts
@@ -0,0 +1,38 @@
+// Copyright 2023, University of Colorado Boulder
+/**
+ * A keyboard help section for moving a grabbed item.
+ *
+ * @author Marla Schulz (PhET Interactive Simulations)
+ *
+ */
+
+import KeyboardHelpSection, { KeyboardHelpSectionOptions } from '../../../../scenery-phet/js/keyboard/help/KeyboardHelpSection.js';
+import meanShareAndBalance from '../../meanShareAndBalance.js';
+import LocalizedStringProperty from '../../../../chipper/js/LocalizedStringProperty.js';
+import KeyboardHelpSectionRow from '../../../../scenery-phet/js/keyboard/help/KeyboardHelpSectionRow.js';
+import MeanShareAndBalanceStrings from '../../MeanShareAndBalanceStrings.js';
+import KeyboardHelpIconFactory from '../../../../scenery-phet/js/keyboard/help/KeyboardHelpIconFactory.js';
+import LetterKeyNode from '../../../../scenery-phet/js/keyboard/LetterKeyNode.js';
+
+type SelfOptions = {
+  headingStringProperty: LocalizedStringProperty;
+  moveDescriptionStringProperty: LocalizedStringProperty;
+};
+
+type MoveKeyboardHelpSectionOptions = SelfOptions & KeyboardHelpSectionOptions;
+export default class MoveKeyboardHelpSection extends KeyboardHelpSection {
+
+  public constructor( providedOptions: MoveKeyboardHelpSectionOptions ) {
+    const sectionRow = KeyboardHelpSectionRow.labelWithIconList(
+      MeanShareAndBalanceStrings.keyboardHelpDialog.balancePointScreen.moveDescriptionStringProperty, [
+        KeyboardHelpIconFactory.iconOrIcon(
+          KeyboardHelpIconFactory.leftRightArrowKeysRowIcon(),
+          KeyboardHelpIconFactory.iconRow( [ LetterKeyNode.a(), LetterKeyNode.d() ], { spacing: 1.3 } ) ),
+        KeyboardHelpIconFactory.iconOrIcon(
+          KeyboardHelpIconFactory.upDownArrowKeysRowIcon(),
+          KeyboardHelpIconFactory.iconRow( [ LetterKeyNode.w(), LetterKeyNode.s() ], { spacing: 1.3 } ) ) ] );
+   super( providedOptions.headingStringProperty, [ sectionRow ] );
+  }
+}
+
+meanShareAndBalance.register( 'MoveKeyboardHelpSection', MoveKeyboardHelpSection );
diff --git a/mean-share-and-balance-strings_en.json b/mean-share-and-balance-strings_en.json
@@ -94,5 +94,68 @@
   },
   "total": {
     "value": "Total"
+  },
+  "keyboardHelpDialog.balancePointScreen.sliderControlHeading": {
+    "value": "Fulcrum Balance Point"
+  },
+  "keyboardHelpDialog.balancePointScreen.sliderVerb": {
+    "value": "Move"
+  },
+  "keyboardHelpDialog.balancePointScreen.sliderNoun": {
+    "value": "fulcrum triangle"
+  },
+  "keyboardHelpDialog.balancePointScreen.grabOrReleaseItemHeading": {
+    "value": "Soccer Ball"
+  },
+  "keyboardHelpDialog.balancePointScreen.grabOrReleaseItem": {
+    "value": "soccer ball"
+  },
+  "keyboardHelpDialog.balancePointScreen.moveHeading": {
+    "value": "Move Soccer Ball"
+  },
+  "keyboardHelpDialog.balancePointScreen.moveDescription": {
+    "value": "Move grabbed soccer ball"
+  },
+  "keyboardHelpDialog.balancePointScreen.numberSpinnerHeading": {
+    "value": "Number of People"
+  },
+  "keyboardHelpDialog.numberSpinnerVerb": {
+    "value": "Change"
+  },
+  "keyboardHelpDialog.numberSpinnerNoun": {
+    "value": "number"
+  },
+  "keyboardHelpDialog.fairShareScreen.numberSpinnerHeading": {
+    "value": "Number of Apples or People"
+  },
+  "keyboardHelpDialog.distributeScreen.numberSpinnerHeading": {
+    "value": "Number of Candy Bars or People"
+  },
+  "keyboardHelpDialog.distributeScreen.sliderControlHeading": {
+    "value": "Predict Mean"
+  },
+  "keyboardHelpDialog.distributeScreen.sliderControlNoun": {
+    "value": "pencil"
+  },
+  "keyboardHelpDialog.distributeScreen.grabOrReleaseItemHeading": {
+    "value": "Notepad Bar"
+  },
+  "keyboardHelpDialog.distributeScreen.grabOrReleaseItem": {
+    "value": "candy bar"
+  },
+  "keyboardHelpDialog.distributeScreen.moveHeading": {
+    "value": "Move Notepad Bar"
+  },
+  "keyboardHelpDialog.distributeScreen.moveDescription": {
+    "value": "Move grabbed candy bar"
+  },
+  "keyboardHelpDialog.levelOutScreen.numberSpinnerHeading": {
+    "value": "Number of Cups"
+  },
+  "keyboardHelpDialog.levelOutScreen.sliderControlHeading": {
+    "value": "Change Water Level or Predict Mean"
+  },
+  "keyboardHelpDialog.levelOutScreen.sliderControlNoun": {
+    "value": "level or pencil"
   }
 }