ES6 module migration, see phetsims/chipper#875

balancing-chemical-equations_en.html

@@ -17,6 +17,35 @@
 
 <script type="text/javascript">
 
+  window.phet = window.phet || {};
+  window.phet.chipper = window.phet.chipper || {};
+  window.phet.chipper.packageObject = {
+    "name": "balancing-chemical-equations",
+    "version": "1.3.0-dev.0",
+    "license": "GPL-3.0",
+    "repository": { "type": "git", "url": "https://github.com/phetsims/balancing-chemical-equations.git" },
+    "devDependencies": { "grunt": "~1.0.0" },
+    "phet": {
+      "requirejsNamespace": "BALANCING_CHEMICAL_EQUATIONS",
+      "phetLibs": [ "nitroglycerin", "vegas" ],
+      "runnable": true,
+      "supportedBrands": [ "phet", "adapted-from-phet" ],
+      "supportsSound": true,
+      "simulation": true
+    },
+    "eslintConfig": { "extends": "../chipper/eslint/sim_eslintrc.js" }
+  };
+  window.phet.chipper.stringRepos = [ {
+    "repo": "balancing-chemical-equations",
+    "requirejsNamespace": "BALANCING_CHEMICAL_EQUATIONS"
+  }, { "repo": "joist", "requirejsNamespace": "JOIST" }, {
+    "repo": "scenery-phet",
+    "requirejsNamespace": "SCENERY_PHET"
+  }, { "repo": "sun", "requirejsNamespace": "SUN" }, {
+    "repo": "tambo",
+    "requirejsNamespace": "TAMBO"
+  }, { "repo": "vegas", "requirejsNamespace": "VEGAS" } ];
+
   // Identify the brand (assume generated brand if not provided with query parameters)
   const brandMatch = location.search.match( /brand=([^&]+)/ );
   const brand = brandMatch ? decodeURIComponent( brandMatch[ 1 ] ) : 'adapted-from-phet';
@@ -28,6 +57,7 @@
   // Preloads, with more included for phet-io brand
   let preloads = [
     '../sherpa/lib/mdn-array-from-polyfill.js',
+    '../sherpa/lib/es6-promise-1e68dc.auto.min.js',
     '../joist/js/splash.js',
     '../sherpa/lib/jquery-2.1.0.js',
     '../sherpa/lib/lodash-4.17.4.js',
@@ -55,25 +85,28 @@
     ] );
   }
 
+  // TODO: es6 modules won't need a "main" param in this function
   // Loads a synchronously-executed asynchronously-downloaded script tag, with optional data-main parameter.
   // See http://www.html5rocks.com/en/tutorials/speed/script-loading/ for more about script loading. It helps to
   // load all of the scripts with this method, so they are treated the same (and placed in the correct execution
   // order).
-  const loadURL = ( preloadURL, main ) => {
+  const loadURL = ( preloadURL, type = 'text/javascript' ) => {
     const script = document.createElement( 'script' );
-    if ( typeof main === 'string' ) {
-      script.setAttribute( 'data-main', main );
-    }
-    script.type = 'text/javascript';
+    script.type = type;
     script.src = preloadURL + queryAppend;
     script.async = false;
     document.head.appendChild( script );
   };
 
+  // Kick off string loading immediately
+  loadURL( '../chipper/js/load-runtime-strings.js' );
+
   // Queue all of the preloads to be loaded.
-  preloads.forEach( loadURL );
+  preloads.forEach( preload => loadURL( preload ) );
 
-  loadURL( '../sherpa/lib/require-2.3.6.js', 'js/balancing-chemical-equations-config.js' );
+  // Module loading in compilation-free (development) mode will be kicked off once strings are loaded.
+  // This is done in load-runtime-strings.js
+  window.phet.chipper.loadModules = () => loadURL( 'js/balancing-chemical-equations-main.js', 'module' );
 </script>
 </body>
 </html>

js/balancing-chemical-equations-main.js

@@ -3,34 +3,30 @@
 /**
  * Main entry point for the 'Balancing Chemical Equations' sim.
  */
-define( require => {
-  'use strict';
 
-  // modules
-  const GameScreen = require( 'BALANCING_CHEMICAL_EQUATIONS/game/GameScreen' );
-  const IntroductionScreen = require( 'BALANCING_CHEMICAL_EQUATIONS/introduction/IntroductionScreen' );
-  const Sim = require( 'JOIST/Sim' );
-  const SimLauncher = require( 'JOIST/SimLauncher' );
+import Sim from '../../joist/js/Sim.js';
+import SimLauncher from '../../joist/js/SimLauncher.js';
+import balancingChemicalEquationsStrings from './balancing-chemical-equations-strings.js';
+import GameScreen from './game/GameScreen.js';
+import IntroductionScreen from './introduction/IntroductionScreen.js';
 
-  // strings
-  const balancingChemicalEquationsTitleString = require( 'string!BALANCING_CHEMICAL_EQUATIONS/balancing-chemical-equations.title' );
+const balancingChemicalEquationsTitleString = balancingChemicalEquationsStrings[ 'balancing-chemical-equations' ].title;
 
-  const simOptions = {
-    credits: {
-      leadDesign: 'Kelly Lancaster (Java), Yuen-ying Carpenter (HTML5)',
-      softwareDevelopment: 'Chris Malley (PixelZoom, Inc.)',
-      team: 'Julia Chamberlain, Patricia Loeblein, Emily B. Moore, Robert Parson, Ariel Paul, Kathy Perkins, Amy Rouinfar',
-      qualityAssurance: 'Steele Dalton, Bryce Griebenow, Elise Morgan, Liam Mulhall, Oliver Orejola, Laura Rae, Benjamin Roberts, Jacob Romero, Kathryn Woessner, Kelly Wurtz, Bryan Yoelin',
-      thanks: '\u2022 Conversion of this simulation to HTML5 was funded in part by the American Association of Chemistry Teachers (AACT).<br>' +
-              '\u2022 Thanks to Mobile Learner Labs for working with the PhET development team to convert this simulation to HTML5.'
-    }
-  };
+const simOptions = {
+  credits: {
+    leadDesign: 'Kelly Lancaster (Java), Yuen-ying Carpenter (HTML5)',
+    softwareDevelopment: 'Chris Malley (PixelZoom, Inc.)',
+    team: 'Julia Chamberlain, Patricia Loeblein, Emily B. Moore, Robert Parson, Ariel Paul, Kathy Perkins, Amy Rouinfar',
+    qualityAssurance: 'Steele Dalton, Bryce Griebenow, Elise Morgan, Liam Mulhall, Oliver Orejola, Laura Rae, Benjamin Roberts, Jacob Romero, Kathryn Woessner, Kelly Wurtz, Bryan Yoelin',
+    thanks: '\u2022 Conversion of this simulation to HTML5 was funded in part by the American Association of Chemistry Teachers (AACT).<br>' +
+            '\u2022 Thanks to Mobile Learner Labs for working with the PhET development team to convert this simulation to HTML5.'
+  }
+};
 
-  SimLauncher.launch( () => {
-    const screens = [
-      new IntroductionScreen(),
-      new GameScreen()
-    ];
-    new Sim( balancingChemicalEquationsTitleString, screens, simOptions ).start();
-  } );
+SimLauncher.launch( () => {
+  const screens = [
+    new IntroductionScreen(),
+    new GameScreen()
+  ];
+  new Sim( balancingChemicalEquationsTitleString, screens, simOptions ).start();
 } );

js/balancing-chemical-equations-strings.js

@@ -0,0 +1,14 @@
+// Copyright 2020, University of Colorado Boulder
+
+/**
+ * Auto-generated from modulify, DO NOT manually modify.
+ */
+
+import getStringModule from '../../chipper/js/getStringModule.js';
+import balancingChemicalEquations from './balancingChemicalEquations.js';
+
+const balancingChemicalEquationsStrings = getStringModule( 'BALANCING_CHEMICAL_EQUATIONS' );
+
+balancingChemicalEquations.register( 'balancingChemicalEquationsStrings', balancingChemicalEquationsStrings );
+
+export default balancingChemicalEquationsStrings;

js/balancingChemicalEquations.js

@@ -5,11 +5,7 @@
  *
  * @author Chris Malley (PixelZoom, Inc.)
  */
-define( require => {
-  'use strict';
 
-  // modules
-  const Namespace = require( 'PHET_CORE/Namespace' );
+import Namespace from '../../phet-core/js/Namespace.js';
 
-  return new Namespace( 'balancingChemicalEquations' );
-} );
+export default new Namespace( 'balancingChemicalEquations' );

js/common/BCEConstants.js

@@ -6,23 +6,20 @@
  *
  * @author Vasily Shakhov (mlearner.com)
  */
-define( require => {
-  'use strict';
 
-  // modules
-  const balancingChemicalEquations = require( 'BALANCING_CHEMICAL_EQUATIONS/balancingChemicalEquations' );
-  const Bounds2 = require( 'DOT/Bounds2' );
+import Bounds2 from '../../../dot/js/Bounds2.js';
+import balancingChemicalEquations from '../balancingChemicalEquations.js';
 
-  const BCEConstants = Object.freeze( {
-    SCREEN_VIEW_OPTIONS: { layoutBounds: new Bounds2( 0, 0, 768, 504 ) },
-    UNBALANCED_COLOR: 'rgb(46,107,178)',
-    BALANCED_HIGHLIGHT_COLOR: 'yellow',
-    INTRODUCTION_CANVAS_BACKGROUND: '#d9ebff',
-    GAME_CANVAS_BACKGROUND: '#ffffe4',
-    BOX_COLOR: 'white',
-    ATOM_OPTIONS: { stroke: 'black', lineWidth: 0.5 },
-    MOLECULE_SCALE_FACTOR: 0.74 // scale all molecules by scaleFactor to fit design
-  } );
+const BCEConstants = Object.freeze( {
+  SCREEN_VIEW_OPTIONS: { layoutBounds: new Bounds2( 0, 0, 768, 504 ) },
+  UNBALANCED_COLOR: 'rgb(46,107,178)',
+  BALANCED_HIGHLIGHT_COLOR: 'yellow',
+  INTRODUCTION_CANVAS_BACKGROUND: '#d9ebff',
+  GAME_CANVAS_BACKGROUND: '#ffffe4',
+  BOX_COLOR: 'white',
+  ATOM_OPTIONS: { stroke: 'black', lineWidth: 0.5 },
+  MOLECULE_SCALE_FACTOR: 0.74 // scale all molecules by scaleFactor to fit design
+} );
 
-  return balancingChemicalEquations.register( 'BCEConstants', BCEConstants );
-} );
+balancingChemicalEquations.register( 'BCEConstants', BCEConstants );
+export default BCEConstants;

js/common/BCEQueryParameters.js

@@ -5,25 +5,21 @@
  *
  * @author Chris Malley (PixelZoom, Inc.)
  */
-define( require => {
-  'use strict';
 
-  // modules
-  const balancingChemicalEquations = require( 'BALANCING_CHEMICAL_EQUATIONS/balancingChemicalEquations' );
+import balancingChemicalEquations from '../balancingChemicalEquations.js';
 
-  const BCEQueryParameters = QueryStringMachine.getAll( {
+const BCEQueryParameters = QueryStringMachine.getAll( {
 
-    // play all challenges for each level of the game, to get 100% test coverage
-    playAll: { type: 'flag' },
+  // play all challenges for each level of the game, to get 100% test coverage
+  playAll: { type: 'flag' },
 
-    // show the game reward regardless of score
-    showReward: { type: 'flag' }
-  } );
+  // show the game reward regardless of score
+  showReward: { type: 'flag' }
+} );
 
-  balancingChemicalEquations.register( 'BCEQueryParameters', BCEQueryParameters );
+balancingChemicalEquations.register( 'BCEQueryParameters', BCEQueryParameters );
 
-  // log the values of all sim-specific query parameters
-  phet.log && phet.log( 'query parameters: ' + JSON.stringify( BCEQueryParameters, null, 2 ) );
+// log the values of all sim-specific query parameters
+phet.log && phet.log( 'query parameters: ' + JSON.stringify( BCEQueryParameters, null, 2 ) );
 
-  return BCEQueryParameters;
-} );
+export default BCEQueryParameters;