DiffusionParticleCanvasProperty extends ParticleCanvasProperty, #231

phetsims · May 3, 2024 · 9aa02a7 · 9aa02a7
1 parent 804e460
commit 9aa02a7
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 51 deletions.
diff --git a/js/common/view/ParticleCanvasProperty.ts b/js/common/view/ParticleCanvasProperty.ts
@@ -7,31 +7,19 @@
  * @author Chris Malley (PixelZoom, Inc.)
  */
 
-import { DerivedProperty1, DerivedPropertyOptions } from '../../../../axon/js/DerivedProperty.js';
+import { DerivedProperty1 } from '../../../../axon/js/DerivedProperty.js';
 import Multilink from '../../../../axon/js/Multilink.js';
 import Property from '../../../../axon/js/Property.js';
-import optionize, { EmptySelfOptions } from '../../../../phet-core/js/optionize.js';
 import ModelViewTransform2 from '../../../../phetcommon/js/view/ModelViewTransform2.js';
 import gasProperties from '../../gasProperties.js';
 import Particle from '../model/Particle.js';
 import ParticlesNode from './ParticlesNode.js';
 
-type SelfOptions = EmptySelfOptions;
-
-type ParticleCanvasPropertyOptions = SelfOptions;
-
 export default class ParticleCanvasProperty extends DerivedProperty1<HTMLCanvasElement, HTMLCanvasElement | null> {
 
-  public constructor( particle: Particle,
-                      modelViewTransform: ModelViewTransform2,
-                      providedOptions?: ParticleCanvasPropertyOptions ) {
+  protected readonly particleCanvasProperty: Property<HTMLCanvasElement | null>;
 
-    const options = optionize<ParticleCanvasPropertyOptions, SelfOptions, DerivedPropertyOptions<HTMLCanvasElement>>()( {
-
-      // DerivedPropertyOptions
-      isDisposable: false,
-      valueType: [ HTMLCanvasElement ]
-    }, providedOptions );
+  public constructor( particle: Particle, modelViewTransform: ModelViewTransform2 ) {
 
     // Node.toCanvas takes a callback that doesn't return a value, so use an intermediate Property to
     // derive the value and act as a proxy for the DerivedProperty dependencies.
@@ -47,7 +35,12 @@ export default class ParticleCanvasProperty extends DerivedProperty1<HTMLCanvasE
         assert && assert( canvasElement );
         return canvasElement;
       },
-      options );
+      {
+        isDisposable: false,
+        valueType: [ HTMLCanvasElement ]
+      } );
+
+    this.particleCanvasProperty = particleCanvasProperty;
   }
 }
 

diff --git a/js/diffusion/view/DiffusionParticleCanvasProperty.ts b/js/diffusion/view/DiffusionParticleCanvasProperty.ts
@@ -2,56 +2,31 @@
 
 /**
  * DiffusionParticleCanvasProperty derives the HTMLCanvasElement for a DiffusionParticle, used to render particles with
- * CanvasNode. This image needs to be regenerated when there is a change to the radius or colors for a particle species.
+ * CanvasNode. In the Diffusion screen, particle radius is settable.  So this extends ParticleCanvasProperty by updating
+ * the HTMLCanvasElement when radius changes.
  *
  * @author Chris Malley (PixelZoom, Inc.)
  */
 
-import { DerivedProperty1, DerivedPropertyOptions } from '../../../../axon/js/DerivedProperty.js';
-import Multilink from '../../../../axon/js/Multilink.js';
-import Property from '../../../../axon/js/Property.js';
 import TReadOnlyProperty from '../../../../axon/js/TReadOnlyProperty.js';
-import optionize, { EmptySelfOptions } from '../../../../phet-core/js/optionize.js';
 import ModelViewTransform2 from '../../../../phetcommon/js/view/ModelViewTransform2.js';
 import gasProperties from '../../gasProperties.js';
 import DiffusionParticle from '../model/DiffusionParticle.js';
 import ParticlesNode from '../../common/view/ParticlesNode.js';
+import ParticleCanvasProperty from '../../common/view/ParticleCanvasProperty.js';
 
-type SelfOptions = EmptySelfOptions;
-
-type DiffusionParticleCanvasPropertyOptions = SelfOptions;
-
-export default class DiffusionParticleCanvasProperty extends DerivedProperty1<HTMLCanvasElement, HTMLCanvasElement | null> {
+export default class DiffusionParticleCanvasProperty extends ParticleCanvasProperty {
 
   public constructor( particle: DiffusionParticle,
                       modelViewTransform: ModelViewTransform2,
-                      radiusProperty: TReadOnlyProperty<number>,
-                      providedOptions?: DiffusionParticleCanvasPropertyOptions ) {
-
-    const options = optionize<DiffusionParticleCanvasPropertyOptions, SelfOptions, DerivedPropertyOptions<HTMLCanvasElement>>()( {
-
-      // DerivedPropertyOptions
-      isDisposable: false,
-      valueType: [ HTMLCanvasElement ]
-    }, providedOptions );
+                      radiusProperty: TReadOnlyProperty<number> ) {
 
-    // Node.toCanvas takes a callback that doesn't return a value, so use an intermediate Property to
-    // derive the value and act as a proxy for the DerivedProperty dependencies.
-    const particleCanvasProperty = new Property<HTMLCanvasElement | null>( null );
-    Multilink.multilink( [ radiusProperty, particle.colorProperty, particle.highlightColorProperty ],
-      ( radius, color, highlightColor ) => {
-        particle.setRadius( radius );
-        ParticlesNode.particleToCanvas( particle, modelViewTransform, particleCanvasProperty );
-      } );
+    super( particle, modelViewTransform );
 
-    super(
-      [ particleCanvasProperty ],
-      ( value: HTMLCanvasElement | null ) => {
-        const canvasElement = value!;
-        assert && assert( canvasElement );
-        return canvasElement;
-      },
-      options );
+    radiusProperty.link( radius => {
+      particle.setRadius( radius );
+      ParticlesNode.particleToCanvas( particle, modelViewTransform, this.particleCanvasProperty );
+    } );
   }
 }