diff --git a/js/common/WaveInterferenceQueryParameters.js b/js/common/WaveInterferenceQueryParameters.js index fcb02824..d68a6feb 100644 --- a/js/common/WaveInterferenceQueryParameters.js +++ b/js/common/WaveInterferenceQueryParameters.js @@ -22,7 +22,10 @@ define( require => { // screen is included in a published version, this query parameter will be deleted. includeDiffractionScreen: { type: 'flag' }, - latticeSize: { type: 'number', defaultValue: 151 } + latticeSize: { type: 'number', defaultValue: 151 }, + + // TODO: temporary flag until the new sim repo exists, see https://github.com/phetsims/wave-interference/issues/357 + mediumScreens: { type: 'flag' } } ); waveInterference.register( 'WaveInterferenceQueryParameters', WaveInterferenceQueryParameters ); diff --git a/js/common/view/WaveInterferenceControlPanel.js b/js/common/view/WaveInterferenceControlPanel.js index 596eb2a4..a3c3e219 100644 --- a/js/common/view/WaveInterferenceControlPanel.js +++ b/js/common/view/WaveInterferenceControlPanel.js @@ -46,7 +46,8 @@ define( require => { showIntensityCheckbox: true, maxWidth: WaveInterferenceConstants.PANEL_MAX_WIDTH, - yMargin: 4 + yMargin: 4, + showSceneRadioButtons: true }, options ); const frequencyControl = new FrequencyControl( model ); @@ -91,24 +92,24 @@ define( require => { intensityCheckbox.mouseArea = intensityCheckbox.localBounds.dilated( 2 ).withX( separator.right ); intensityCheckbox.touchArea = intensityCheckbox.mouseArea; - const sceneRadioButtonGroup = new SceneRadioButtonGroup( + const sceneRadioButtonGroup = options.showSceneRadioButtons ? new SceneRadioButtonGroup( model.waterScene, model.soundScene, model.lightScene, model.sceneProperty - ); + ) : null; // Horizontal layout const centerX = frequencyControl.centerX; frequencyControl.centerX = centerX; amplitudeControl.centerX = centerX; if ( options.additionalControl ) {options.additionalControl.centerX = centerX;} - sceneRadioButtonGroup.centerX = centerX; + if ( sceneRadioButtonGroup ) { sceneRadioButtonGroup.centerX = centerX; } separator.centerX = centerX; const minX = _.min( [ frequencyControl.left, amplitudeControl.left, - sceneRadioButtonGroup.left + ...( sceneRadioButtonGroup ? [ sceneRadioButtonGroup.left ] : [] ) ] ); // Align controls to the left @@ -126,14 +127,18 @@ define( require => { // The Separation NumberControl is an additionalControl if ( options.additionalControl ) { options.additionalControl.top = y + 8; - sceneRadioButtonGroup.top = options.additionalControl.bottom + 8 + 8; + if ( sceneRadioButtonGroup ) { + sceneRadioButtonGroup.top = options.additionalControl.bottom + 8 + 8; + } } else { - sceneRadioButtonGroup.top = y + 8; + if ( sceneRadioButtonGroup ) { + sceneRadioButtonGroup.top = y + 8; + } } const HORIZONTAL_SEPARATOR_MARGIN = 7; const CHECKBOX_SPACING = 6; - separator.top = sceneRadioButtonGroup.bottom + 8; + separator.top = sceneRadioButtonGroup ? ( sceneRadioButtonGroup.bottom + 8 ) : y; graphCheckbox.top = separator.bottom + HORIZONTAL_SEPARATOR_MARGIN; soundViewTypeRadioButtonGroup.top = graphCheckbox.bottom + CHECKBOX_SPACING + 2; screenCheckbox.top = graphCheckbox.bottom + CHECKBOX_SPACING; @@ -151,7 +156,7 @@ define( require => { amplitudeControl, ...( options.additionalControl ? [ options.additionalControl ] : [] ), - sceneRadioButtonGroup, + ...( sceneRadioButtonGroup ? [ sceneRadioButtonGroup ] : [] ), separator, graphCheckbox, diff --git a/js/medium/MediumScreen.js b/js/medium/MediumScreen.js new file mode 100644 index 00000000..ab92e9b0 --- /dev/null +++ b/js/medium/MediumScreen.js @@ -0,0 +1,57 @@ +// Copyright 2017-2019, University of Colorado Boulder + +/** + * Screen that just shown the specified medium. Very similar to WavesScreen. It creates model and view elements + * for all scenes, but only shows for the specified scene. + * + * @author Sam Reid (PhET Interactive Simulations) + */ +define( require => { + 'use strict'; + + // modules + const Image = require( 'SCENERY/nodes/Image' ); + const Property = require( 'AXON/Property' ); + const Screen = require( 'JOIST/Screen' ); + const waveInterference = require( 'WAVE_INTERFERENCE/waveInterference' ); + const WavesModel = require( 'WAVE_INTERFERENCE/waves/model/WavesModel' ); + const WavesScreenView = require( 'WAVE_INTERFERENCE/waves/view/WavesScreenView' ); + + // images + const wavesScreenIcon = require( 'image!WAVE_INTERFERENCE/waves_screen_icon.png' ); + + class MediumScreen extends Screen { + + /** + * @param {string} medium - the medium to display + * @param {string} name - the name of the screen + * @param {AlignGroup} alignGroup - for aligning the control panels on the right side of the lattice + */ + constructor( medium, name, alignGroup ) { + const options = { + backgroundColorProperty: new Property( 'white' ), + name: name, + homeScreenIcon: new Image( wavesScreenIcon ), + showUnselectedHomeScreenIconFrame: true, + showScreenIconFrameForNavigationBarFill: 'black' + }; + super( + () => new WavesModel( { initialScene: medium } ), + model => new WavesScreenView( model, alignGroup, { + showViewpointRadioButtonGroup: true, + + lightScreenNodeBrightness: 1.85, + + // The intensity checkbox is not available in the waves screen because it distracts from the learning goals of the screen + controlPanelOptions: { + showIntensityCheckbox: false, + showSceneRadioButtons: false + } + } ), + options + ); + } + } + + return waveInterference.register( 'MediumScreen', MediumScreen ); +} ); \ No newline at end of file diff --git a/js/wave-interference-main.js b/js/wave-interference-main.js index 77a12f80..a58609ab 100644 --- a/js/wave-interference-main.js +++ b/js/wave-interference-main.js @@ -12,9 +12,11 @@ define( require => { const AlignGroup = require( 'SCENERY/nodes/AlignGroup' ); const DiffractionScreen = require( 'WAVE_INTERFERENCE/diffraction/DiffractionScreen' ); const InterferenceScreen = require( 'WAVE_INTERFERENCE/interference/InterferenceScreen' ); + const MediumScreen = require( 'WAVE_INTERFERENCE/medium/MediumScreen' ); const Sim = require( 'JOIST/Sim' ); const SimLauncher = require( 'JOIST/SimLauncher' ); const SlitsScreen = require( 'WAVE_INTERFERENCE/slits/SlitsScreen' ); + const WaveInterferenceQueryParameters = require( 'WAVE_INTERFERENCE/common/WaveInterferenceQueryParameters' ); const WavesScreen = require( 'WAVE_INTERFERENCE/waves/WavesScreen' ); // strings @@ -41,12 +43,18 @@ define( require => { matchVertical: false } ); - const sim = new Sim( waveInterferenceTitleString, [ + // TODO: Remove this when we have a repo, see https://github.com/phetsims/wave-interference/issues/357 + const screens = WaveInterferenceQueryParameters.mediumScreens ? [ + new MediumScreen( 'waterScene', 'Water', alignGroup ), + new MediumScreen( 'soundScene', 'Sound', alignGroup ), + new MediumScreen( 'lightScene', 'Light', alignGroup ) + ] : [ new WavesScreen( alignGroup ), new InterferenceScreen( alignGroup ), new SlitsScreen( alignGroup ), new DiffractionScreen() - ], simOptions ); + ]; + const sim = new Sim( waveInterferenceTitleString, screens, simOptions ); sim.start(); } ); } ); diff --git a/js/waves/model/WavesModel.js b/js/waves/model/WavesModel.js index f9756023..134bfb2b 100644 --- a/js/waves/model/WavesModel.js +++ b/js/waves/model/WavesModel.js @@ -80,7 +80,10 @@ define( require => { // True if SoundParticles should be created and displayed, and if the user can select to view them showSoundParticles: true, - waveSpatialType: Scene.WaveSpatialType.POINT + waveSpatialType: Scene.WaveSpatialType.POINT, + + // The property name of the initial scene to display + initialScene: 'waterScene' }, options ); assert && assert( WaveInterferenceConstants.AMPLITUDE_RANGE.contains( options.initialAmplitude ), @@ -240,7 +243,7 @@ define( require => { ); // @public {Property.} - selected scene - this.sceneProperty = new Property( this.waterScene, { + this.sceneProperty = new Property( this[ options.initialScene ], { validValues: this.scenes } );