Add blank space and assertions. See #80.

phetsims · Jul 11, 2023 · e90abcf · e90abcf
1 parent c194f47
commit e90abcf
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 36 deletions.
diff --git a/build-a-nucleus-strings_en.json b/build-a-nucleus-strings_en.json
@@ -20,6 +20,9 @@
   "unknown": {
     "value": "Unknown"
   },
+  "unknownSpacePattern": {
+    "value": "unknown{{space}}"
+  },
   "s": {
     "value": "s"
   },

diff --git a/js/BuildANucleusStrings.ts b/js/BuildANucleusStrings.ts
@@ -25,6 +25,8 @@ type StringsType = {
   'halfLifeColonStringProperty': LocalizedStringProperty;
   'unknown': string;
   'unknownStringProperty': LocalizedStringProperty;
+  'unknownSpacePattern': string;
+  'unknownSpacePatternStringProperty': LocalizedStringProperty;
   's': string;
   'sStringProperty': LocalizedStringProperty;
   'lessStable': string;

diff --git a/js/chart-intro/view/DecayEquationNode.ts b/js/chart-intro/view/DecayEquationNode.ts
@@ -11,53 +11,56 @@ import buildANucleus from '../../buildANucleus.js';
 import DecayEquationModel from '../model/DecayEquationModel.js';
 import BuildANucleusStrings from '../../BuildANucleusStrings.js';
 import StringUtils from '../../../../phetcommon/js/util/StringUtils.js';
-import { HBox, Node, Text, VBox } from '../../../../scenery/js/imports.js';
+import { HBox, Text, VBox } from '../../../../scenery/js/imports.js';
 import ArrowNode from '../../../../scenery-phet/js/ArrowNode.js';
 import DecaySymbolNode from './DecaySymbolNode.js';
 import IconFactory from '../../decay/view/IconFactory.js';
+import PatternStringProperty from '../../../../axon/js/PatternStringProperty.js';
+
+const unknownSpacePatternStringProperty = new PatternStringProperty( BuildANucleusStrings.unknownSpacePatternStringProperty, { space: ' ' } );
+
+const EQUATION_HBOX_MIN_CONTENT_HEIGHT = 30;
+const TEXT_OPTIONS = {
+  fontSize: 20
+};
 
 class DecayEquationNode extends VBox {
 
   public constructor( decayEquationModel: DecayEquationModel ) {
 
     super( {
-      spacing: 5
-    } );
+      spacing: 5,
 
-    decayEquationModel.currentCellModelProperty.link( currentCellModel => {
-
-      console.log( currentCellModel );
+      // leave equationHBox space visible despite being blank sometimes
+      excludeInvisibleChildrenFromBounds: false
+    } );
 
-      console.log( 'finalMass ' + decayEquationModel.finalMassNumberProperty.value );
-      console.log( 'finalProton ' + decayEquationModel.finalProtonNumberProperty.value );
+    const stableString = new Text( BuildANucleusStrings.stable, TEXT_OPTIONS );
+    const decayArrow = new ArrowNode( 0, 0, 20, 0, { fill: null } );
+    const mostLikelyDecayString = new Text( BuildANucleusStrings.mostLikelyDecay, { fontSize: 13 } );
+    const mostLikelyDecayHBox = new HBox( { spacing: 5, layoutOptions: { align: 'left' } } );
+    const equationHBox = new HBox( {
+      spacing: 10,
+      minContentHeight: EQUATION_HBOX_MIN_CONTENT_HEIGHT
+    } );
+    assert && assert( stableString.height < EQUATION_HBOX_MIN_CONTENT_HEIGHT, `Min content height must be a max so the space is consistent across all equation forms. Stable string height is ${stableString.height}` );
 
-      const decayArrow = new ArrowNode( 0, 0, 20, 0, { fill: null } );
-      const mostLikelyDecayString = new Text( BuildANucleusStrings.mostLikelyDecay, { fontSize: 13 } );
-      let decayLikelihoodPercentString: Node;
-      const mostLikelyDecayHBox = new HBox( { spacing: 5 } );
-      const equationHBox = new HBox( {
-        spacing: 10, layoutOptions: {
-          minContentHeight: 45.2
-        }
-      } );
+    decayEquationModel.currentCellModelProperty.link( currentCellModel => {
+      equationHBox.visible = true;
       if ( currentCellModel ) {
-        decayLikelihoodPercentString = new Text( StringUtils.fillIn( BuildANucleusStrings.percentageInParenthesesPattern, {
-            decayLikelihoodPercent: currentCellModel.decayTypeLikelihoodPercent || BuildANucleusStrings.unknown.toLowerCase() + ' ' // TODO: i18n, https://github.com/phetsims/build-a-nucleus/issues/80
-          } ),
-          {
-            fontSize: 13
-          } );
-        decayLikelihoodPercentString.visible = true;
-
-        const currentNuclideSymbol = new DecaySymbolNode( currentCellModel.protonNumber, currentCellModel.protonNumber + currentCellModel.neutronNumber, {
-          scale: 0.15
+        const decayLikelihoodPercentString = new Text( StringUtils.fillIn( BuildANucleusStrings.percentageInParenthesesPattern, {
+          decayLikelihoodPercent: currentCellModel.decayTypeLikelihoodPercent || unknownSpacePatternStringProperty
+        } ), {
+          fontSize: 13
         } );
 
+        const currentNuclideSymbol = new DecaySymbolNode( currentCellModel.protonNumber, currentCellModel.protonNumber + currentCellModel.neutronNumber );
+        assert && assert( currentNuclideSymbol.height < EQUATION_HBOX_MIN_CONTENT_HEIGHT,
+          `Min content height must be a max so the space is consistent across all equation forms. Current nuclide symbol height is ${currentNuclideSymbol.height}` );
+
         const decayEquationArrow = IconFactory.createDecayArrowNode();
 
-        const newNuclideSymbol = new DecaySymbolNode( decayEquationModel.finalProtonNumberProperty.value, decayEquationModel.finalMassNumberProperty.value, {
-          scale: 0.15
-        } );
+        const newNuclideSymbol = new DecaySymbolNode( decayEquationModel.finalProtonNumberProperty.value, decayEquationModel.finalMassNumberProperty.value );
 
         const plusNode = IconFactory.createPlusNode();
 
@@ -66,19 +69,16 @@ class DecayEquationNode extends VBox {
           const decaySymbol = new DecaySymbolNode(
             currentCellModel.decayType.protonNumber,
             currentCellModel.decayType.massNumber, {
-              symbolString: currentCellModel.decayType.decaySymbol,
-              scale: 0.15
+              symbolString: currentCellModel.decayType.decaySymbol
             } );
           equationHBox.setChildren( [ currentNuclideSymbol, decayEquationArrow, newNuclideSymbol, plusNode, decaySymbol ] );
         }
         else if ( currentCellModel.isStable ) {
-
-          const stableString = new Text( BuildANucleusStrings.stable, { fontSize: 22 } );
           equationHBox.setChildren( [ stableString ] );
           decayLikelihoodPercentString.visible = false;
         }
         else {
-          const unknownString = new Text( BuildANucleusStrings.unknown, { fontSize: 22 } );
+          const unknownString = new Text( BuildANucleusStrings.unknown, TEXT_OPTIONS );
           equationHBox.setChildren( [ currentNuclideSymbol, decayEquationArrow, unknownString ] );
           decayLikelihoodPercentString.visible = false;
         }
@@ -87,6 +87,8 @@ class DecayEquationNode extends VBox {
       }
       else {
 
+        equationHBox.setChildren( [ stableString ] );
+        equationHBox.visible = false;
         mostLikelyDecayHBox.setChildren( [ decayArrow, mostLikelyDecayString ] );
       }
       this.children = [

diff --git a/js/chart-intro/view/DecaySymbolNode.ts b/js/chart-intro/view/DecaySymbolNode.ts
@@ -30,7 +30,8 @@ class DecaySymbolNode extends Node {
                       providedOptions?: DecaySymbolNodeOptions ) {
 
     const options = optionize<DecaySymbolNodeOptions, SelfOptions, NodeOptions>()( {
-      symbolString: protonCount > 0 ? AtomIdentifier.getSymbol( protonCount ) : '-'
+      symbolString: protonCount > 0 ? AtomIdentifier.getSymbol( protonCount ) : '-',
+      scale: 0.15
     }, providedOptions );
 
     super( options );