added ability to experiment with some proposed sound for level select…

…ion and back buttons, see #89 and phetsims/scenery-phet#677

js/LevelSelectionButton.js

@@ -18,7 +18,13 @@ import Node from '../../scenery/js/nodes/Node.js';
 import Rectangle from '../../scenery/js/nodes/Rectangle.js';
 import Text from '../../scenery/js/nodes/Text.js';
 import RectangularPushButton from '../../sun/js/buttons/RectangularPushButton.js';
+import SoundClip from '../../tambo/js/sound-generators/SoundClip.js';
+import soundManager from '../../tambo/js/soundManager.js';
 import Tandem from '../../tandem/js/Tandem.js';
+import gameButtonSound001 from '../sounds/game-button-001_mp3.js';
+import gameButtonSound002 from '../sounds/game-button-002_mp3.js';
+import gameButtonSound003 from '../sounds/game-button-003_mp3.js';
+import gameButtonSound004 from '../sounds/game-button-004_mp3.js';
 import GameTimer from './GameTimer.js';
 import ScoreDisplayLabeledNumber from './ScoreDisplayLabeledNumber.js';
 import ScoreDisplayLabeledStars from './ScoreDisplayLabeledStars.js';
@@ -33,6 +39,7 @@ const VALID_SCORE_DISPLAY_CONSTRUCTORS = [
   // All constructors must have the same signature!
   ScoreDisplayLabeledNumber, ScoreDisplayLabeledStars, ScoreDisplayStars, ScoreDisplayNumberAndStar
 ];
+const SOUNDS = [ gameButtonSound001, gameButtonSound002, gameButtonSound003, gameButtonSound004 ];
 
 class LevelSelectionButton extends RectangularPushButton {
 
@@ -72,15 +79,24 @@ class LevelSelectionButton extends RectangularPushButton {
       bestTimeFont: new PhetFont( 24 ),
       bestTimeYSpacing: 10,  // vertical space between drop shadow and best time
 
+      // sound generation
+      soundPlayer: null, // will be created if null using the index
+      soundPlayerIndex: 0, // a value that is used to configure the sound player, ignored if a sound player is specified
+
       // Tandem
       tandem: Tandem.REQUIRED
     }, options );
 
     assert && assert( _.includes( VALID_SCORE_DISPLAY_CONSTRUCTORS, options.scoreDisplayConstructor,
       `invalid scoreDisplayConstructor: ${options.scoreDisplayConstructor}` ) );
-    assert && assert( options.scoreDisplayProportion > 0 && options.scoreDisplayProportion <= 0.5,
+    assert && assert(
+    options.scoreDisplayProportion > 0 && options.scoreDisplayProportion <= 0.5,
       'scoreDisplayProportion value out of range'
     );
+    assert && assert(
+      options.soundPlayer === null || options.soundPlayerIndex === 0,
+      'a sound player and an index should not both be specified'
+    );
 
     const maxContentWidth = options.buttonWidth - 2 * options.xMargin;
 
@@ -118,6 +134,24 @@ class LevelSelectionButton extends RectangularPushButton {
       children: [ adjustedIcon, scoreDisplayBackground, scoreDisplay ]
     } );
 
+    // sound generation
+    // TODO: This code is temporary while we experiment with some sound options, see https://github.com/phetsims/vegas/issues/89
+    if ( !options.soundPlayer ) {
+      const soundClips = [];
+      SOUNDS.forEach( sound => {
+        const soundClip = new SoundClip( sound, { rateChangesAffectPlayingSounds: false } );
+        soundManager.addSoundGenerator( soundClip );
+        soundClips.push( soundClip );
+      } );
+      options.soundPlayer = {
+        play() {
+          const soundClip = soundClips[ phet.vegas.soundIndexForLevelSelectionButtonsProperty.value ];
+          soundClip.setPlaybackRate( Math.pow( Math.pow( 2, 1 / 12 ), options.soundPlayerIndex ), 0 );
+          soundClip.play();
+        }
+      };
+    }
+
     super( options );
 
     // Variables that are set if options.bestTimeProperty is specified.

js/demo/LevelSelectionScreenView.js

@@ -75,19 +75,22 @@ class LevelSelectionScreenView extends ScreenView {
         numberOfStars: NUM_STARS,
         perfectScore: SCORE_RANGE.max
       },
-      listener: () => console.log( 'level start' )
+      listener: () => console.log( 'level start' ),
+      soundPlayerIndex: 1
     } );
 
     const buttonWithNumberAndStar = new LevelSelectionButton( buttonIcon, scoreProperty, {
       scoreDisplayConstructor: ScoreDisplayNumberAndStar,
-      listener: () => console.log( 'level start' )
+      listener: () => console.log( 'level start' ),
+      soundPlayerIndex: 2
     } );
 
     const buttonWithTextAndNumber = new LevelSelectionButton( buttonIcon, scoreProperty, {
       scoreDisplayConstructor: ScoreDisplayLabeledNumber,
       listener: () => console.log( 'level start' ),
       bestTimeProperty: bestTimeProperty,
-      bestTimeVisibleProperty: bestTimeVisibleProperty
+      bestTimeVisibleProperty: bestTimeVisibleProperty,
+      soundPlayerIndex: 3
     } );
 
     const levelSelectionButtons = new HBox( {

js/demo/VegasSoundOptionsDialogContent.js

@@ -0,0 +1,59 @@
+// Copyright 2020, University of Colorado Boulder
+
+import NumberProperty from '../../../axon/js/NumberProperty.js';
+import Property from '../../../axon/js/Property.js';
+import Range from '../../../dot/js/Range.js';
+import NumberPicker from '../../../scenery-phet/js/NumberPicker.js';
+import PhetFont from '../../../scenery-phet/js/PhetFont.js';
+import HBox from '../../../scenery/js/nodes/HBox.js';
+import Text from '../../../scenery/js/nodes/Text.js';
+import VBox from '../../../scenery/js/nodes/VBox.js';
+import vegas from '../vegas.js';
+
+// constants
+const TEXT_OPTIONS = { font: new PhetFont( 24 ) };
+
+/**
+ * VegasSoundOptionsDialogContent is used to set values for global variables which in turn are used to control sound
+ * generation in some common UI components.
+ *
+ * TODO: This is here temporarily while we work on sound design for a couple of items, see https://github.com/phetsims/scenery-phet/issues/677
+ * and https://github.com/phetsims/vegas/issues/89.
+ */
+class VegasSoundOptionsDialogContent extends VBox {
+
+  constructor() {
+
+    // global property that specifies which sound to use for the back button
+    phet.vegas.soundIndexForBackButtonProperty = new NumberProperty( 0 );
+
+    // label and number picker for back button sounds
+    const backButtonSoundSelector = new HBox( {
+      children: [
+        new Text( 'Back button sound: ', TEXT_OPTIONS ),
+        new NumberPicker( phet.vegas.soundIndexForBackButtonProperty, new Property( new Range( 0, 2 ) ) )
+      ],
+      spacing: 5
+    } );
+
+    // global property that specifies which base sound to use for the level selection buttons
+    phet.vegas.soundIndexForLevelSelectionButtonsProperty = new NumberProperty( 0 );
+
+    // label and number picker for back button sounds
+    const levelSelectionButtonsSoundSelector = new HBox( {
+      children: [
+        new Text( 'Level selection buttons base sound: ', TEXT_OPTIONS ),
+        new NumberPicker( phet.vegas.soundIndexForLevelSelectionButtonsProperty, new Property( new Range( 0, 3 ) ) )
+      ],
+      spacing: 5
+    } );
+
+    super( {
+      children: [ backButtonSoundSelector, levelSelectionButtonsSoundSelector ],
+      spacing: 20
+    } );
+  }
+}
+
+vegas.register( 'VegasSoundOptionsDialogContent', VegasSoundOptionsDialogContent );
+export default VegasSoundOptionsDialogContent;

js/vegas-main.js

@@ -14,14 +14,18 @@ import FiniteChallengesScreenView from './demo/FiniteChallengesScreenView.js';
 import InfiniteChallengesScreenView from './demo/InfiniteChallengesScreenView.js';
 import LevelSelectionScreenView from './demo/LevelSelectionScreenView.js';
 import RewardScreenView from './demo/RewardScreenView.js';
+import VegasSoundOptionsDialogContent from './demo/VegasSoundOptionsDialogContent.js';
 import vegasStrings from './vegasStrings.js';
 
+// constants
 const vegasTitleString = vegasStrings.vegas.title;
+const SOUND_OPTIONS_DIALOG_CONTENT = new VegasSoundOptionsDialogContent();
 
 const simOptions = {
   credits: {
     leadDesign: 'PhET'
-  }
+  },
+  createOptionsDialogContent: () => SOUND_OPTIONS_DIALOG_CONTENT
 };
 
 simLauncher.launch( () => {

js/vegasStrings.js

@@ -1,4 +1,4 @@
-// Copyright 2020-2021, University of Colorado Boulder
+// Copyright 2021, University of Colorado Boulder
 
 /**
  * Auto-generated from modulify, DO NOT manually modify.