From efc756a50b7b43f0c63bdc9732b096be1da961dc Mon Sep 17 00:00:00 2001
From: zepumph <michael.kauzmann@colorado.edu>
Date: Tue, 14 Apr 2020 08:43:54 -0800
Subject: [PATCH] add pickup and drop sounds, add
 isBeingInteractedWithProperty,
 https://github.com/phetsims/proportion/issues/9
 https://github.com/phetsims/proportion/issues/13

---
 js/free-objects/view/DraggableMarker.js | 33 +++++++++++++++++++++++--
 1 file changed, 31 insertions(+), 2 deletions(-)

diff --git a/js/free-objects/view/DraggableMarker.js b/js/free-objects/view/DraggableMarker.js
index 92e03ca7..4f238f76 100644
--- a/js/free-objects/view/DraggableMarker.js
+++ b/js/free-objects/view/DraggableMarker.js
@@ -4,6 +4,7 @@
  * @author Michael Kauzmann
  */
 
+import BooleanProperty from '../../../../axon/js/BooleanProperty.js';
 import Property from '../../../../axon/js/Property.js';
 import Dimension2 from '../../../../dot/js/Dimension2.js';
 import Vector2 from '../../../../dot/js/Vector2.js';
@@ -13,10 +14,14 @@ import DragListener from '../../../../scenery/js/listeners/DragListener.js';
 import KeyboardDragListener from '../../../../scenery/js/listeners/KeyboardDragListener.js';
 import Circle from '../../../../scenery/js/nodes/Circle.js';
 import Rectangle from '../../../../scenery/js/nodes/Rectangle.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 proportion from '../../proportion.js';
 import MarkerDisplay from '../model/MarkerDisplay.js';
 import Node from '../../../../scenery/js/nodes/Node.js';
+import commonGrabSoundInfo from '../../../../tambo/sounds/grab_mp3.js';
+import commonReleaseSoundInfo from '../../../../tambo/sounds/release_mp3.js';
 
 class DraggableMarker extends Node {
 
@@ -41,6 +46,9 @@ class DraggableMarker extends Node {
       focusable: true
     } );
 
+    // @public (read-only)
+    this.isBeingInteractedWithProperty = new BooleanProperty( false );
+
     const content = new Node();
 
     const circle = new Circle( 20, {
@@ -71,16 +79,37 @@ class DraggableMarker extends Node {
       this.translation = modelViewTransform.modelToViewPosition( position );
     } );
 
+    const commonGrabSoundClip = new SoundClip( commonGrabSoundInfo, { initialOutput: .7 } );
+    const commonReleaseSoundClip = new SoundClip( commonReleaseSoundInfo, { initialOutput: .7 } );
+    soundManager.addSoundGenerator( commonGrabSoundClip );
+    soundManager.addSoundGenerator( commonReleaseSoundClip );
+
     this.addInputListener( new DragListener( {
       positionProperty: positionProperty,
       transform: modelViewTransform,
       dragBoundsProperty: new Property( modelViewTransform.viewToModelBounds( dragBounds ) ),
-      tandem: options.tandem.createTandem( 'dragListener' )
+      tandem: options.tandem.createTandem( 'dragListener' ),
+      start: () => {
+        commonGrabSoundClip.play();
+        this.isBeingInteractedWithProperty.value = true;
+      },
+      end: () => {
+        commonReleaseSoundClip.play();
+        this.isBeingInteractedWithProperty.value = false;
+      }
     } ) );
 
     this.addInputListener( new KeyboardDragListener( {
       positionProperty: positionProperty,
-      transform: modelViewTransform
+      transform: modelViewTransform,
+      start: () => {
+        commonGrabSoundClip.play();
+        this.isBeingInteractedWithProperty.value = true;
+      },
+      end: () => {
+        commonReleaseSoundClip.play();
+        this.isBeingInteractedWithProperty.value = false;
+      }
     } ) );
 
     // TODO: cue arrows