add missing dependency for positioning accordion boxes, #304

phetsims · Mar 23, 2023 · 5637f4b · 5637f4b
1 parent e2456a7
commit 5637f4b
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 10 deletions.
diff --git a/js/derivative/view/DerivativeScreenView.ts b/js/derivative/view/DerivativeScreenView.ts
@@ -15,6 +15,7 @@ import DerivativeModel from '../model/DerivativeModel.js';
 import SlopeOfTangentAccordionBox from '../../common/view/SlopeOfTangentAccordionBox.js';
 import PickRequired from '../../../../phet-core/js/types/PickRequired.js';
 import TangentCheckbox from '../../common/view/TangentCheckbox.js';
+import Multilink from '../../../../axon/js/Multilink.js';
 
 type SelfOptions = EmptySelfOptions;
 
@@ -46,11 +47,12 @@ export default class DerivativeScreenView extends CalculusGrapherScreenView {
     this.screenViewRootNode.addChild( slopeOfTangentAccordionBox );
 
     // Center slopeOfTangentAccordionBox in the negative space to the left of graphNode, top-aligned with graphNode.y.
-    slopeOfTangentAccordionBox.top = this.graphsNode.y + this.graphsNode.originalGraphNode.y;
-    this.graphsNode.boundsProperty.link( () => {
-      const eyeToggleButtonLeft = this.graphsNode.x + this.graphsNode.getEyeToggleButtonXOffset();
-      slopeOfTangentAccordionBox.centerX = this.layoutBounds.left + ( eyeToggleButtonLeft - this.layoutBounds.left ) / 2;
-    } );
+    Multilink.multilink( [ this.graphsNode.boundsProperty, slopeOfTangentAccordionBox.boundsProperty ],
+      () => {
+        const eyeToggleButtonLeft = this.graphsNode.x + this.graphsNode.getEyeToggleButtonXOffset();
+        slopeOfTangentAccordionBox.centerX = this.layoutBounds.left + ( eyeToggleButtonLeft - this.layoutBounds.left ) / 2;
+        slopeOfTangentAccordionBox.top = this.graphsNode.y + this.graphsNode.originalGraphNode.y;
+      } );
 
     // Add 'Tangent' checkbox to the top of the checkbox group.
     const tangentCheckbox = new TangentCheckbox( model.tangentScrubber.visibleProperty, model.predictEnabledProperty,

diff --git a/js/integral/view/IntegralScreenView.ts b/js/integral/view/IntegralScreenView.ts
@@ -15,6 +15,7 @@ import IntegralModel from '../model/IntegralModel.js';
 import NetSignedAreaAccordionBox from '../../common/view/NetSignedAreaAccordionBox.js';
 import PickRequired from '../../../../phet-core/js/types/PickRequired.js';
 import AreaUnderCurveCheckbox from '../../common/view/AreaUnderCurveCheckbox.js';
+import Multilink from '../../../../axon/js/Multilink.js';
 
 type SelfOptions = EmptySelfOptions;
 
@@ -47,11 +48,12 @@ export default class IntegralScreenView extends CalculusGrapherScreenView {
     this.screenViewRootNode.addChild( netSignedAreaAccordionBox );
 
     // Center netSignedAreaAccordionBox in the negative space to the left of graphNode, top-aligned with graphNode.y.
-    netSignedAreaAccordionBox.top = this.graphsNode.y + this.graphsNode.originalGraphNode.y;
-    this.graphsNode.boundsProperty.link( () => {
-      const eyeToggleButtonLeft = this.graphsNode.x + this.graphsNode.getEyeToggleButtonXOffset();
-      netSignedAreaAccordionBox.centerX = this.layoutBounds.left + ( eyeToggleButtonLeft - this.layoutBounds.left ) / 2;
-    } );
+    Multilink.multilink( [ this.graphsNode.boundsProperty, netSignedAreaAccordionBox.boundsProperty ],
+      () => {
+        const eyeToggleButtonLeft = this.graphsNode.x + this.graphsNode.getEyeToggleButtonXOffset();
+        netSignedAreaAccordionBox.centerX = this.layoutBounds.left + ( eyeToggleButtonLeft - this.layoutBounds.left ) / 2;
+        netSignedAreaAccordionBox.top = this.graphsNode.y + this.graphsNode.originalGraphNode.y;
+      } );
 
     // Add 'Area Under Curve' checkbox to the top of the checkbox group.
     const areaUnderCurveCheckbox = new AreaUnderCurveCheckbox( model.areaUnderCurveScrubber.visibleProperty,