diff --git a/js/coins/view/CoinExperimentMeasurementArea.ts b/js/coins/view/CoinExperimentMeasurementArea.ts index c8d55ec..f49c4db 100644 --- a/js/coins/view/CoinExperimentMeasurementArea.ts +++ b/js/coins/view/CoinExperimentMeasurementArea.ts @@ -142,6 +142,7 @@ export default class CoinExperimentMeasurementArea extends VBox { const measuredCoinsPixelRepresentation = new CoinSetPixelRepresentation( sceneModel.systemType, sceneModel.coinSet.measurementStateProperty, + coinSetInTestBoxProperty, { visibleProperty: new DerivedProperty( [ sceneModel.coinSet.numberOfActiveSystemsProperty, diff --git a/js/coins/view/CoinSetPixelRepresentation.ts b/js/coins/view/CoinSetPixelRepresentation.ts index 653738f..9bc0149 100644 --- a/js/coins/view/CoinSetPixelRepresentation.ts +++ b/js/coins/view/CoinSetPixelRepresentation.ts @@ -8,6 +8,7 @@ * */ +import TProperty from '../../../../axon/js/TProperty.js'; import TReadOnlyProperty from '../../../../axon/js/TReadOnlyProperty.js'; import dotRandom from '../../../../dot/js/dotRandom.js'; import { CanvasNode, CanvasNodeOptions } from '../../../../scenery/js/imports.js'; @@ -28,6 +29,7 @@ export default class CoinSetPixelRepresentation extends CanvasNode { public constructor( private readonly systemType: 'classical' | 'quantum', private readonly experimentStateProperty: TReadOnlyProperty, + private readonly coinSetInTestBoxProperty: TProperty, providedOptions?: CanvasNodeOptions ) { super( providedOptions ); @@ -90,6 +92,7 @@ export default class CoinSetPixelRepresentation extends CanvasNode { this.populatingAnimation.finishEmitter.addListener( () => { this.setAllPixels( 1 ); this.currentFrame = 0; + this.coinSetInTestBoxProperty.value = true; } ); this.flippingAnimation.finishEmitter.addListener( () => { @@ -173,14 +176,18 @@ export default class CoinSetPixelRepresentation extends CanvasNode { } public startPopulatingAnimation(): void { - // Set all pixels to 0 - this.setAllPixels( 0 ); + if ( this.visible ) { + // Set all pixels to 0 + this.setAllPixels( 0 ); - this.populatingAnimation.start(); + this.populatingAnimation.start(); + } } public startFlippingAnimation(): void { - this.flippingAnimation.start(); + if ( this.visible ) { + this.flippingAnimation.start(); + } } /** @@ -191,6 +198,9 @@ export default class CoinSetPixelRepresentation extends CanvasNode { this.populatingAnimation.stop(); this.currentFrame = 0; this.setAllPixels( pixelState ); + + // Set the flag to indicate that the coins aren't in the box. + this.coinSetInTestBoxProperty.value = false; } public setAllPixels( value: number ): void { diff --git a/js/coins/view/MultipleCoinAnimations.ts b/js/coins/view/MultipleCoinAnimations.ts index 39b7cba..b5817e7 100644 --- a/js/coins/view/MultipleCoinAnimations.ts +++ b/js/coins/view/MultipleCoinAnimations.ts @@ -39,7 +39,10 @@ public readonly startIngressAnimationForCoinSet: ( forReprepare: boolean ) => vo // Create the nodes that will be used to animate coin motion for the multiple coin experiments. These are sized // differently based on the quantity being animated. const movingCoinNodes = new Map(); - MULTI_COIN_EXPERIMENT_QUANTITIES.forEach( quantity => { + + // The 10000 coins case will be animated separately + const ANIMATION_QUANTITIES = MULTI_COIN_EXPERIMENT_QUANTITIES.filter( quantity => quantity !== 10000 ); + ANIMATION_QUANTITIES.forEach( quantity => { const quantityToCreate = Math.min( quantity, QuantumMeasurementConstants.HOLLYWOODED_MAX_COINS ); const radius = MultiCoinTestBox.getRadiusFromCoinQuantity( quantity ); const coinNodes: SmallCoinNode[] = []; @@ -65,6 +68,10 @@ public readonly startIngressAnimationForCoinSet: ( forReprepare: boolean ) => vo animationsToEdgeOfMultiCoinTestBox.forEach( animation => animation.stop() ); animationsFromEdgeOfMultiCoinBoxToInside.forEach( animation => animation.stop() ); + // Remove the animations from the list of active ones. + animationsToEdgeOfMultiCoinTestBox.length = 0; + animationsFromEdgeOfMultiCoinBoxToInside.length = 0; + // Clear out any coins that made it to the test box. multipleCoinTestBox.clearContents(); @@ -73,12 +80,16 @@ public readonly startIngressAnimationForCoinSet: ( forReprepare: boolean ) => vo sceneGraphParent.removeChild( smallCoinNode ); } ); - // Set the flag to indicate that the coins are not in the box. + // Set the flag to indicate that the coins aren't in the box. coinSetInTestBoxProperty.value = false; }; this.startIngressAnimationForCoinSet = ( forReprepare: boolean ) => { + if ( sceneModel.coinSet.numberOfActiveSystemsProperty.value === 10000 ) { + return; + } + // Create a typed reference to the parent node, since we'll need to invoke some methods on it. assert && assert( measurementArea.getParent() instanceof CoinsExperimentSceneView ); const sceneGraphParent = measurementArea.getParent() as CoinsExperimentSceneView; @@ -86,9 +97,6 @@ public readonly startIngressAnimationForCoinSet: ( forReprepare: boolean ) => vo // Make sure the test box is empty. multipleCoinTestBox.clearContents(); - // Set the flag to indicate that the coins aren't in the box. - coinSetInTestBoxProperty.value = false; - assert && assert( movingCoinNodes.has( sceneModel.coinSet.numberOfActiveSystemsProperty.value ), 'No coin nodes exist for the needed quantity.'