Run code inspection, see: #258

js/common/MeanShareAndBalanceConstants.ts

@@ -84,7 +84,16 @@ const MeanShareAndBalanceConstants = {
   MAX_NUMBER_OF_SNACKS_PER_PLATE: 10,
   MIN_NUMBER_OF_SNACKS_PER_PLATE: 0,
   NOTEPAD_PAPER_CENTER_Y: 220,
-  NOTEPAD_LINE_PATTERN: new Pattern( graphiteTexture_png ).setTransformMatrix( Matrix3.affine( 0.15, 0, 0, 0, 0.15, 0.975 ) ),
+  HORIZONTAL_SKETCH_LINE_PATTERN: new Pattern( graphiteTexture_png ).setTransformMatrix( Matrix3.affine( 0.15, 0, 0, 0, 0.15, 0.975 ) ),
+  VERTICAL_SKETCH_LINE_PATTERN: new Pattern( graphiteTexture_png ).setTransformMatrix(
+    Matrix3.affine(
+      0.15 * Math.cos( Math.PI / 2 ),
+      -0.15 * Math.sin( Math.PI / 2 ),
+      0.975,
+      0.15 * Math.sin( Math.PI / 2 ),
+      0.15 * Math.cos( Math.PI / 2 ),
+      0
+    ) ),
   NOTEPAD_LINE_PATTERN_WIDTH: 1.95,
 
   SOCCER_BALL_RANGE: new Range( 0, 10 ),

js/common/view/MeanPredictionSlider.ts

@@ -52,7 +52,7 @@ export default class MeanPredictionSlider extends AccessibleSlider( Node, 0 ) {
 
     const predictMeanLine = new Line( new Vector2( 0, 0 ), new Vector2( MeanShareAndBalanceConstants.CUP_WIDTH, 0 ), {
       lineWidth: MeanShareAndBalanceConstants.NOTEPAD_LINE_PATTERN_WIDTH,
-      stroke: MeanShareAndBalanceConstants.NOTEPAD_LINE_PATTERN,
+      stroke: MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN,
       lineDash: [ 5, 3 ]
     } );
 

js/distribute/view/DistributeScreenView.ts

@@ -201,7 +201,7 @@ export default class DistributeScreenView extends SharingScreenView<CandyBar> {
           // the default pattern, and return early.
           if ( !successIndicatorsOperating ) {
             successRectangle.visible = false;
-            predictMeanLine.stroke = MeanShareAndBalanceConstants.NOTEPAD_LINE_PATTERN;
+            predictMeanLine.stroke = MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN;
             return;
           }
           const successRectangleWasVisible = successRectangle.visible;
@@ -215,11 +215,11 @@ export default class DistributeScreenView extends SharingScreenView<CandyBar> {
 
             predictMeanLine.stroke = roundedPrediction === roundedMean ?
                                      MeanShareAndBalanceColors.meanColorProperty :
-                                     MeanShareAndBalanceConstants.NOTEPAD_LINE_PATTERN;
+                                     MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN;
             successRectangle.visible = roundedPrediction !== roundedMean && closeToMean;
           }
           else {
-            predictMeanLine.stroke = MeanShareAndBalanceConstants.NOTEPAD_LINE_PATTERN;
+            predictMeanLine.stroke = MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN;
             successRectangle.visible = false;
           }
 

js/distribute/view/NotepadCandyBarNode.ts

@@ -9,7 +9,7 @@
  */
 
 import meanShareAndBalance from '../../meanShareAndBalance.js';
-import { DragListener, Image, InteractiveHighlighting, Line, Node, NodeOptions, Pattern, Rectangle, Text } from '../../../../scenery/js/imports.js';
+import { DragListener, Image, InteractiveHighlighting, Line, Node, NodeOptions, Rectangle, Text } from '../../../../scenery/js/imports.js';
 import optionize, { EmptySelfOptions } from '../../../../phet-core/js/optionize.js';
 import Bounds2 from '../../../../dot/js/Bounds2.js';
 import TReadOnlyProperty from '../../../../axon/js/TReadOnlyProperty.js';
@@ -19,8 +19,6 @@ import WithRequired from '../../../../phet-core/js/types/WithRequired.js';
 import CandyBar from '../model/CandyBar.js';
 import Vector2 from '../../../../dot/js/Vector2.js';
 import ModelViewTransform2 from '../../../../phetcommon/js/view/ModelViewTransform2.js';
-import graphiteTexture_png from '../../../images/graphiteTexture_png.js';
-import Matrix3 from '../../../../dot/js/Matrix3.js';
 import Multilink from '../../../../axon/js/Multilink.js';
 import RichPointerDragListener from '../../../../scenery-phet/js/RichPointerDragListener.js';
 import grabCandyBarV2_mp3 from '../../../sounds/grabCandyBarV2_mp3.js';
@@ -130,54 +128,32 @@ export default class NotepadCandyBarNode extends InteractiveHighlighting( Node )
    * A pattern is used for the outline of the candy bar. Because of this, the pattern must be rotated and translated to
    * match the bounds of the rectangle. This method returns the nodes that make up the outline of the candy bar.
    */
-  public static getSketchOutline( candyBarWidth = MeanShareAndBalanceConstants.CANDY_BAR_WIDTH ): Node[ ] {
-
-    const rightYTranslation = 0.975;
-    const horizontalStrokePattern = new Pattern( graphiteTexture_png ).setTransformMatrix(
-      Matrix3.affine( 0.15, 0, 0, 0, 0.15, 0.9 )
-    );
-    const leftStrokePattern = new Pattern( graphiteTexture_png ).setTransformMatrix(
-      Matrix3.affine(
-        0.15 * Math.cos( Math.PI / 2 ),
-        -0.15 * Math.sin( Math.PI / 2 ),
-        0.975,
-        0.15 * Math.sin( Math.PI / 2 ),
-        0.15 * Math.cos( Math.PI / 2 ),
-        0
-      ) );
-    const rightStrokePattern = new Pattern( graphiteTexture_png ).setTransformMatrix(
-      Matrix3.affine(
-        0.15 * Math.cos( Math.PI / 2 ),
-        -0.15 * Math.sin( Math.PI / 2 ),
-        rightYTranslation,
-        0.15 * Math.sin( Math.PI / 2 ),
-        0.15 * Math.cos( Math.PI / 2 ),
-        0
-      ) );
-
+  public static getSketchOutline(): Node[ ] {
+    const candyBarWidth = MeanShareAndBalanceConstants.CANDY_BAR_WIDTH;
+    const candyBarHeight = MeanShareAndBalanceConstants.CANDY_BAR_HEIGHT;
     const candyBarStrokeLeft = new Line(
-      0, 0, 0, MeanShareAndBalanceConstants.CANDY_BAR_HEIGHT,
+      0, 0, 0, candyBarHeight,
       {
         lineWidth: 1.95,
-        stroke: leftStrokePattern
+        stroke: MeanShareAndBalanceConstants.VERTICAL_SKETCH_LINE_PATTERN
       } );
     const candyBarStrokeRight = new Line(
-      candyBarWidth, 0, candyBarWidth, MeanShareAndBalanceConstants.CANDY_BAR_HEIGHT,
+      candyBarWidth, 0, candyBarWidth, candyBarHeight,
       {
         lineWidth: 1.95,
-        stroke: rightStrokePattern
+        stroke: MeanShareAndBalanceConstants.VERTICAL_SKETCH_LINE_PATTERN
       } );
     const candyBarStrokeTop = new Line(
       0, 0, candyBarWidth, 0,
       {
         lineWidth: 1.95,
-        stroke: horizontalStrokePattern
+        stroke: MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN
       } );
     const candyBarStrokeBottom = new Line(
-      0, MeanShareAndBalanceConstants.CANDY_BAR_HEIGHT, candyBarWidth, MeanShareAndBalanceConstants.CANDY_BAR_HEIGHT,
+      0, candyBarHeight, candyBarWidth, candyBarHeight,
       {
         lineWidth: 1.95,
-        stroke: horizontalStrokePattern
+        stroke: MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN
       } );
 
     return [ candyBarStrokeLeft, candyBarStrokeRight, candyBarStrokeTop, candyBarStrokeBottom ];

js/fair-share/view/AllocationModeSoundGenerator.ts

@@ -71,8 +71,8 @@ class AllocationModeSoundGenerator extends SoundGenerator {
     shareCompleteLargeAmountSoundClip.connect( this.mainGainNode );
     const shareCompleteMediumAmountSoundClip = new SoundClip( shareCompleteMediumAmount_mp3 );
     shareCompleteMediumAmountSoundClip.connect( this.mainGainNode );
-    const shareCompleteSmallAmoungSoundClip = new SoundClip( shareCompleteSmallAmount_mp3 );
-    shareCompleteSmallAmoungSoundClip.connect( this.mainGainNode );
+    const shareCompleteSmallAmountSoundClip = new SoundClip( shareCompleteSmallAmount_mp3 );
+    shareCompleteSmallAmountSoundClip.connect( this.mainGainNode );
     const shareFractionalizeSoundClip = new SoundClip( shareFractionalizeSound_mp3 );
     shareFractionalizeSoundClip.connect( this.mainGainNode );
 
@@ -84,7 +84,7 @@ class AllocationModeSoundGenerator extends SoundGenerator {
 
 
       if ( totalApplesProperty.value < MAX_APPLES / 3 ) {
-        shareCompleteSmallAmoungSoundClip.play();
+        shareCompleteSmallAmountSoundClip.play();
       }
       else if ( totalApplesProperty.value < 2 * MAX_APPLES / 3 ) {
         shareCompleteMediumAmountSoundClip.play();

js/level-out/view/LevelOutScreenView.ts

@@ -75,7 +75,7 @@ export default class LevelOutScreenView extends MeanShareAndBalanceScreenView {
           // the default pattern, and return early.
           if ( !successIndicatorsOperating ) {
             successRectangle.visible = false;
-            predictMeanLine.stroke = MeanShareAndBalanceConstants.NOTEPAD_LINE_PATTERN;
+            predictMeanLine.stroke = MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN;
             return;
           }
           const meanTolerance = 0.05;
@@ -91,7 +91,7 @@ export default class LevelOutScreenView extends MeanShareAndBalanceScreenView {
           }
           else {
             successRectangle.visible = pipesOpen && doWaterLevelsMatchMean && closeToMean;
-            predictMeanLine.stroke = MeanShareAndBalanceConstants.NOTEPAD_LINE_PATTERN;
+            predictMeanLine.stroke = MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN;
           }
 
           // If one of the success indicators was just activated, play the "successful prediction" sound.

js/level-out/view/NotepadCupNode.ts

@@ -44,20 +44,19 @@ export default class NotepadCupNode extends Node {
     // 0 is empty, 1 is full
     const y = Utils.linear( 0, 1, MeanShareAndBalanceConstants.CUP_HEIGHT, 0, notepadCup.waterLevelProperty.value );
 
-    const topStrokePattern = new Pattern( graphiteTexture_png ).setTransformMatrix( Matrix3.affine( 0.15, 0, 0, 0, 0.15, 0.9 ) );
+    // Create the outline of the notepad cup with a pattern.
     const bottomStrokePattern = new Pattern( graphiteTexture_png ).setTransformMatrix( Matrix3.affine( 0.15, 0, 0, 0, 0.15, 0 ) );
-    const verticalStrokePattern = new Pattern( graphiteTexture_png )
-      .setTransformMatrix( Matrix3.affine( 0.15 * Math.cos( Math.PI / 2 ), -0.15 * Math.sin( Math.PI / 2 ), 0.975,
-      0.15 * Math.sin( Math.PI / 2 ), 0.15 * Math.cos( Math.PI / 2 ), 0 ) );
-
-    const cupStrokeLeft = new Line( 0, 0, 0, MeanShareAndBalanceConstants.CUP_HEIGHT, { lineWidth: 1.95, stroke: verticalStrokePattern } );
+    const cupStrokeLeft = new Line( 0, 0, 0, MeanShareAndBalanceConstants.CUP_HEIGHT, {
+      lineWidth: 1.95,
+      stroke: MeanShareAndBalanceConstants.VERTICAL_SKETCH_LINE_PATTERN
+    } );
     const cupStrokeRight = new Line( MeanShareAndBalanceConstants.CUP_WIDTH, 0, MeanShareAndBalanceConstants.CUP_WIDTH, MeanShareAndBalanceConstants.CUP_HEIGHT, {
       lineWidth: 1.95,
-      stroke: verticalStrokePattern
+      stroke: MeanShareAndBalanceConstants.VERTICAL_SKETCH_LINE_PATTERN
     } );
     const cupStrokeTop = new Line( 0, 0, MeanShareAndBalanceConstants.CUP_WIDTH, 0, {
       lineWidth: 1.95,
-      stroke: topStrokePattern
+      stroke: MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN
     } );
     const cupStrokeBottom = new Line( 0, MeanShareAndBalanceConstants.CUP_HEIGHT, MeanShareAndBalanceConstants.CUP_WIDTH, MeanShareAndBalanceConstants.CUP_HEIGHT, {
       lineWidth: 1.95,

js/level-out/view/PipeNode.ts

@@ -10,7 +10,7 @@
 import Vector2 from '../../../../dot/js/Vector2.js';
 import ModelViewTransform2 from '../../../../phetcommon/js/view/ModelViewTransform2.js';
 import optionize, { combineOptions, EmptySelfOptions } from '../../../../phet-core/js/optionize.js';
-import { FireListener, InteractiveHighlighting, Line, Node, NodeOptions, Pattern, Rectangle } from '../../../../scenery/js/imports.js';
+import { FireListener, InteractiveHighlighting, Line, Node, NodeOptions, Rectangle } from '../../../../scenery/js/imports.js';
 import meanShareAndBalance from '../../meanShareAndBalance.js';
 import Pipe from '../model/Pipe.js';
 import MeanShareAndBalanceConstants from '../../common/MeanShareAndBalanceConstants.js';
@@ -20,8 +20,6 @@ import StrictOmit from '../../../../phet-core/js/types/StrictOmit.js';
 import ValveNode from './ValveNode.js';
 import Property from '../../../../axon/js/Property.js';
 import PickRequired from '../../../../phet-core/js/types/PickRequired.js';
-import graphiteTexture_png from '../../../images/graphiteTexture_png.js';
-import Matrix3 from '../../../../dot/js/Matrix3.js';
 
 type SelfOptions = EmptySelfOptions;
 type PipeNodeOptions = SelfOptions & StrictOmit<NodeOptions, 'phetioDynamicElement' | 'children' | 'visibleProperty'> & PickRequired<NodeOptions, 'tandem'>;
@@ -43,27 +41,23 @@ export default class PipeNode extends InteractiveHighlighting( Node ) {
     const pipeRectangle = new Rectangle( 0, 0, MeanShareAndBalanceConstants.PIPE_LENGTH, MeanShareAndBalanceConstants.PIPE_WIDTH,
       { fill: MeanShareAndBalanceConstants.PIPE_GRADIENT } );
 
-    const horizontalStrokePattern = new Pattern( graphiteTexture_png )
-      .setTransformMatrix( Matrix3.affine( 0.15, 0, 0, 0, 0.15, 0.9 ) );
-    const leftStrokePattern = new Pattern( graphiteTexture_png )
-      .setTransformMatrix( Matrix3.affine( 0.15 * Math.cos( Math.PI / 2 ), -0.15 * Math.sin( Math.PI / 2 ), 0.975,
-      0.15 * Math.sin( Math.PI / 2 ), 0.15 * Math.cos( Math.PI / 2 ), 0 ) );
-    const rightStrokePattern = new Pattern( graphiteTexture_png )
-      .setTransformMatrix( Matrix3.affine( 0.15 * Math.cos( Math.PI / 2 ), -0.15 * Math.sin( Math.PI / 2 ), 0,
-      0.15 * Math.sin( Math.PI / 2 ), 0.15 * Math.cos( Math.PI / 2 ), 0 ) );
-
-    const pipeStrokeLeft = new Line( 0, 0, 0, MeanShareAndBalanceConstants.PIPE_WIDTH, { lineWidth: 1.95, stroke: leftStrokePattern } );
-    const pipeStrokeRight = new Line( MeanShareAndBalanceConstants.PIPE_LENGTH, 0, MeanShareAndBalanceConstants.PIPE_LENGTH, MeanShareAndBalanceConstants.PIPE_WIDTH, {
+    const pipeStrokeLeft = new Line( 0, 0, 0, MeanShareAndBalanceConstants.PIPE_WIDTH, {
       lineWidth: 1.95,
-      stroke: rightStrokePattern
+      stroke: MeanShareAndBalanceConstants.VERTICAL_SKETCH_LINE_PATTERN
+    } );
+    const pipeStrokeRight = new Line( MeanShareAndBalanceConstants.PIPE_LENGTH, 0,
+      MeanShareAndBalanceConstants.PIPE_LENGTH, MeanShareAndBalanceConstants.PIPE_WIDTH, {
+      lineWidth: 1.95,
+      stroke: MeanShareAndBalanceConstants.VERTICAL_SKETCH_LINE_PATTERN
     } );
     const pipeStrokeTop = new Line( 0, 0, MeanShareAndBalanceConstants.PIPE_LENGTH, 0, {
       lineWidth: 1.95,
-      stroke: horizontalStrokePattern
+      stroke: MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN
     } );
-    const pipeStrokeBottom = new Line( 0, MeanShareAndBalanceConstants.PIPE_WIDTH, MeanShareAndBalanceConstants.PIPE_LENGTH, MeanShareAndBalanceConstants.PIPE_WIDTH, {
+    const pipeStrokeBottom = new Line( 0, MeanShareAndBalanceConstants.PIPE_WIDTH,
+      MeanShareAndBalanceConstants.PIPE_LENGTH, MeanShareAndBalanceConstants.PIPE_WIDTH, {
       lineWidth: 1.95,
-      stroke: horizontalStrokePattern
+      stroke: MeanShareAndBalanceConstants.HORIZONTAL_SKETCH_LINE_PATTERN
     } );
 
 

js/level-out/view/WaterBalanceSoundGenerator.ts

@@ -2,7 +2,7 @@
 
 /**
  * Sound generator for the water cup levels. The pitch of the tone is scaled based on the mean value of all the cups,
- * and a lowpass filter is applied that passes more frequencies as the cups get closer to the mean value and less as
+ * and a low pass filter is applied that passes more frequencies as the cups get closer to the mean value and less as
  * they get further away.
  *
  * @author John Blanco (PhET Interactive Simulations)
@@ -169,7 +169,7 @@ class WaterBalanceSoundGenerator extends SoundClip {
     meanProperty.link( updateMaxPossibleDeviation );
 
     // Create a closure function that maps the current max deviation from the mean for the notepad cups to a cutoff
-    // frequency for the lowpass filter.  This uses a piecewise function defined by two points in a unit square.  It's
+    // frequency for the low pass filter.  This uses a piecewise function defined by two points in a unit square.  It's
     // hard to describe in a comment, so please see
     // https://github.com/phetsims/mean-share-and-balance/issues/171#issuecomment-2099127519, which includes a diagram.
     const getFrequencyFromMaxDeviationFromMean = ( deviationFromMean: number ) => {
@@ -236,7 +236,7 @@ class WaterBalanceSoundGenerator extends SoundClip {
             this.startOrContinueSoundProduction();
           }
 
-          // Set the cutoff frequency of the lowpass filter based on the max deviation from the mean.  The intent here
+          // Set the cutoff frequency of the low pass filter based on the max deviation from the mean.  The intent here
           // is to produce a more filtered sound when far from the mean and less filtered when all cups are close to it.
           const filterFrequency = getFrequencyFromMaxDeviationFromMean( maxDeviationFromMean );
           lowPassFilter.frequency.cancelScheduledValues( 0 );

js/mean-share-and-balance-main.ts

@@ -29,7 +29,7 @@ const simOptions: SimOptions = {
   }
 };
 
-// launch the sim - beware that scenery Image nodes created outside of simLauncher.launch() will have zero bounds
+// launch the sim - beware that scenery Image nodes created outside simLauncher.launch() will have zero bounds
 // until the images are fully loaded, see https://github.com/phetsims/coulombs-law/issues/70
 simLauncher.launch( () => {
   const sim = new Sim( MeanShareAndBalanceStrings[ 'mean-share-and-balance' ].titleStringProperty, [