use actual (scaled) width of Image to compute clipArea, #283

phetsims · Jan 11, 2022 · 7eaa7d7 · 7eaa7d7
1 parent a0411eb
commit 7eaa7d7
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 8 deletions.
diff --git a/js/common/view/GOScreenView.ts b/js/common/view/GOScreenView.ts
@@ -262,6 +262,12 @@ class GOScreenView extends ScreenView {
         visibleProperty: visibleProperties.secondPointVisibleProperty
       } );
 
+    // create the target image
+    const targetNode = new TargetNode( model.representationProperty, model.firstTarget, model.optic,
+      visibleProperties.virtualImageVisibleProperty, visibleProperties.rayTracingVisibleProperty, modelViewTransform, {
+        tandem: options.tandem.createTandem( 'targetNode' )
+      } );
+
     // The complete optical axis, to be put in the background
     const opticalAxisNode = new OpticalAxisNode( model.optic.positionProperty, modelBoundsProperty, modelViewTransform, {
       visibleProperty: model.optic.opticalAxisVisibleProperty
@@ -271,7 +277,8 @@ class GOScreenView extends ScreenView {
     // the axis is going through the source object, real/virtual image, etc.
     const opticalAxisForegroundNode = new OpticalAxisForegroundNode( model.optic.positionProperty,
       model.representationProperty, model.sourceObject.positionProperty, model.firstTarget.positionProperty,
-      model.firstTarget.isVirtualProperty, model.barrier, modelBoundsProperty, modelViewTransform, {
+      model.firstTarget.isVirtualProperty, model.barrier, modelBoundsProperty, modelViewTransform,
+      targetNode.boundsProperty, {
         visibleProperty: model.optic.opticalAxisVisibleProperty
       } );
 
@@ -304,12 +311,6 @@ class GOScreenView extends ScreenView {
       visibleProperties.virtualImageVisibleProperty, modelViewTransform, this.visibleBoundsProperty,
       model.optic.positionProperty, model.firstTarget.positionProperty, model.firstTarget.isVirtualProperty, lightRays2Options );
 
-    // create the target image
-    const targetNode = new TargetNode( model.representationProperty, model.firstTarget, model.optic,
-      visibleProperties.virtualImageVisibleProperty, visibleProperties.rayTracingVisibleProperty, modelViewTransform, {
-        tandem: options.tandem.createTandem( 'targetNode' )
-      } );
-
     // focal points (F)
     const focalPointsNode = new Node( {
       children: [

diff --git a/js/common/view/OpticalAxisForegroundNode.ts b/js/common/view/OpticalAxisForegroundNode.ts
@@ -33,6 +33,7 @@ class OpticalAxisForegroundNode extends OpticalAxisNode {
    * @param barrier
    * @param modelBoundsProperty
    * @param modelViewTransform
+   * @param targetNodeBoundsProperty
    * @param providedOptions
    */
   constructor( opticPositionProperty: IReadOnlyProperty<Vector2>,
@@ -43,6 +44,7 @@ class OpticalAxisForegroundNode extends OpticalAxisNode {
                barrier: Barrier | null,
                modelBoundsProperty: IReadOnlyProperty<Bounds2>,
                modelViewTransform: ModelViewTransform2,
+               targetNodeBoundsProperty: IReadOnlyProperty<Bounds2>,
                providedOptions: OpticalAxisNodeOptions ) {
 
     const options = merge( {}, providedOptions ) as OpticalAxisNodeOptions;
@@ -98,7 +100,7 @@ class OpticalAxisForegroundNode extends OpticalAxisNode {
 
             // The second rectangle is between the thing on the left and the left edge of the picture frame on the right.
             const x2 = modelViewTransform.modelToViewX( leftPosition.x );
-            const halfFrameWidth = 34; //TODO get this from sourceObject.boundsProperty, or from sourceObjectNode
+            const halfFrameWidth = targetNodeBoundsProperty.value.width / 2;
             const clipWidth2 = modelViewTransform.modelToViewX( rightPosition.x ) - halfFrameWidth - x2;
 
             clipArea = new Shape()