phetsims / build-an-atom Goto Github PK

build-an-atom.css (and its reference) should be removed, those settings are handled in Joist now.

Very slow performance when moving electrons, protons, and neutrons. Response is fine but objects move across the screen with a significant lag.

Name: Build an Atom

URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html

Version: 1.1.0-rc.1

Features missing: flexbox

Flags: pixelRatioScaling

User Agent: Mozilla/5.0 (Windows NT 6.2; WOW64; rv:24.0) Gecko/20100101 Firefox/24.0

Language: en-US

Window: 1280x595

Pixel Ratio: 1.5/1

On my iPad 2, the game feedback sounds sound as though they are playing at 1/2 speed or something.

Why is this missing from BAA? Is this sim not localized?

When dragging particles into the atom model, there is a pause before the sim seems to 'register' where the particle belongs and to update the readouts. Essentially, in the time it takes the sim to register the addition of a new proton (for example) in the nucleus, I can move my hand all the way out of the way and be trying to grab another.

Upon dragging particles out, it "feels" like I drag my finger across the nucleus and down, and the particle appears under my finger half way to the bucket. This does not occur on dragging particles in, i can see the particle the whole time when i'm dragging in.

I'm assuming these are related, hence the one issue.

These aren't deal breakers, but it's definitely not ideal (particularly the slow registering of the addition of a particle).

Here's the sim info:
Name: Build an Atom
URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc/2/build-an-atom_en.html
Version: 1.1.0-rc.1
Features missing: fullscreen
Flags: pixelRatioScaling
User Agent: Mozilla/5.0 (iPad; CPU OS 7_0_2 lik Mac OS X) AppleWebKit/537.51.1 (KHTML, like Gecko) Version/7.0 Mobile/11A501 Safari/9537.53
Language: en-us
Window: 1024x672
Pixel Ratio: 2/1

Instead of

function A(){}
inherit (B,A);
return A;

I would recommend to use the return value of inherit like so:

function A(){}
return inherit(B,A);

There is a freezing issue/buggy behavior on Win 8 with FF, IE, and Chrome. Chrome is the best performer, but can still freeze with particles in odd places, and FF is the worst. Seems related to touch events.

Should that happen, or is there a reason for not displaying that?

Drag a neutron out of its bucket and drop it somewhere on the right side of the screen. Before it makes it back to its bucket, click "Reset All".

Expected: It goes back to the bucket
Actual: It continues animating to its place in the bucket

When i open the about dialog on iPad 3, iOS7, the window is bigger than the screen. Picture below:

Atom screen is accessible from the home screen, but clicking on the Atom screen icon in the Nav Bar doesn't do anything.

Observed in WinXP Chrome only.
Tested in WinXP Firefox, Mac OSX Firefox & Chrome, and the Nav Bar "Atom" screen shortcut works in all of them.
The Symbol and Games Nav Bar icons work fine on all platforms mentioned; only the Atoms screen icon doesn't work.

Name: Build an Atom
URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html
Version: 1.1.0-rc.1
Features missing: csstransforms3d, touch
User Agent: Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.101 Safari/537.36
Language: en-US
Window: 899x534
Pixel Ratio: 1/1

The electron particles looking offset from the orbital diagram.

Sim Info:
Name: Build an Atom
URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html
Version 1.1.0-rc.1
Feature missing: touch, webgl, fullscreen
Flags: msPointerEnabled
User Agent: Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; WOW64; Trident/6.0; Touch; .NET4.0E; .NET4.0C; .NET CLR 3.5.30729; .NET CLR 2.050727; .NET CLR 3.0.30729; Tablet PC 2.0; ASU2JS)
Window: 2277x1122
Pixel Ratio: 1/1

Current code uses inherit for inheritance but not to add to the prototype, see Particle.js

  inherit( PropertySet, Particle );

  Particle.prototype.moveImmediatelyToDestination = function() {
    this.position = this.destination;
  };

  Particle.prototype.setPositionAndDestination = function( newPosition ) {
    this.destination = newPosition;
    this.moveImmediatelyToDestination();
  };

  return Particle;

instead this could be

return inherit(PropertySet,Particle,{...});

It feels very slow when dragging up protons, neutrons, and electrons. Takes longer than it seems like it should after dropping the item for it to move into place.

Windows 7 Home, 64bit, SP1

Troubleshooting information
Name: Build an Atom
URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html
Version: 1.1.0-rc.1
Features missing: flexbox, touch
User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:24.0) Gecko/20100101 Firefox/24.0
Language: en-US
Window: 1280x862
Pixel Ratio: 1/1

I am seeing about 28 files that don't follow the PhetStyle.xml format.

Probably just needs to be included at a higher resolution, as first impressions are powerful.

Screenshot:

http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html

When all of the neutrons are in use, the box containing the tally of particles (top left) nearly overlaps the "Neutral Atom" label. Suggest moving the label an extra 5px or so to the right.

I don't think it makes sense for the number entry boxes to go negative for questions where number of particles of each type is being asked (example below). How could you have a negative number of protons (or any particles?) Charge is the only case where this makes sense.

We do have this constraint on other questions in the game (example below). I think it would be good to apply this constraint consistently.

I was dragging particles on the 2nd tab (Symbol), and one particle moved approximately to the upper-left and then the sim experienced weird freeze-like behavior (but still rotated properly when the iPad was rotated to/from portrait).

Opening up the developer console revealed:
TypeError: 'undefined' is not a function (evaluating 'this.position.distance(this.destination)')

Already mentioned to @jbphet , documenting here.

Noticed that all values reset for this question when answered incorrectly on the first try.

In the "build it with particles" style of problem, the answer does not reset, which is less annoying. Also, helpful to think about editing your incorrect answer rather than having to start from scratch.

In BucketDragHandler, this local variable is redundant:

var particle = bucket.extractClosestParticle( positionInModelSpace );
activeParticle = particle;

The reward screen waterfall of element and smileys is not very smooth in Firefox. Chrome is much smoother and looks good; Firefox is choppy and less appealing.

Name: Build an Atom
URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html
Version: 1.1.0-rc.1
Features missing: flexbox, touch
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:24.0) Gecko/20100101 Firefox/24.0
Language: en-US
Window: 1081x593
Pixel Ratio: 1/1

I've created this issue to track Scenery's performance in this particular simulation.

I've made a number of performance enhancements to the 'performance' branch, experimental for now, but may be merge-able for our deadlines. The most significant performance change is making the draggable particles use CSS transforms (approximately doubles FPS on iPad3/Nexus7 with 28->54 and 12->30 FPS respectively).

The current downside of this is that it slows down reordering of particles (it has to create an entire SVG layer), and thus whenever a nucleon is dropped in or removed from the nucleus. For that operation (dropping a nucleon in the middle), I'm showing approximately 41% time in AtomTabView.relayerNucleus' addChild/removeChild.

If there's any way to avoid having to reorder things (slow for Scenery right now, since it maintains a consistent layer state in-between each add/remove operation), that would give the best sim-wide performance.

It appears that chipper is not stripping Scenery's assertions, so we may see a stitching speedup in general if that is done.

Additionally, I've noticed in general some "jerkiness" of animation. This is almost certainly due to garbage collection, and I'll be looking at how to minimize the number of objects that Scenery creates.

Even though you can drag things by mouse-down on buckets + drag. Probably should have that changed, but maybe it is there for a reason?

We decided to use clearly specified namespaces instead of assumed ones for include directives, and Build an Atom isn't doing this.

This was requested initially by Ariel P, and is already implemented, but it's probably good to track it.

Interviewers have reported that the indicator that depicts the stability of the atomic nucleus coupled with the 'jitter' animation of the unstable nucleus tends to draw a lot of the students' attention. Students seem to focus in on what exactly makes the nucleus stable, which isn't bad in itself, but it is definitely not a major learning goal, and it's also hard to figure out. The suggestion was made that the indicator and animation be turned off by default, and that the animation only happens when the indicator is also on.

This has been implemented, and can be seen in this version: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/0.0.0-17/build-an-atom.html.

Letters in the element name are partially obscured by the particles in the nucleus. Oxygen (at the g) and Neon (at the o) have this most; other elements are OK.

The link "http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html" still says rc.1 in the both the window title and the about dialog.

Not a big deal, but since imports cannot be collapsed, it would be good to prune them a bit. For instance ParticleAtom.js has this unused import:

var Particle = require( 'common/model/Particle' );

About dialog does not fit on the screen. Credits line too long.

OS: Win 8.1 preview
Test device: laptop
Browser: Firefox 24
Troubleshooting Information (from About dialog):
Name: Build an Atom
URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.3/build-an-atom_en.html
Version: 1.1.0-rc.3
Features missing: flexbox
User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:24.0) Gecko/20100101 Firefox/24.0
Language: en-US
Window: 1600x772
Pixel Ratio: 1/1

Description: I dragged a proton to behind the element box on the atom screen and released it. I then proceeded to open and close the element box and as the proton was behind it, I occasionally saw a strange error - shown in the screen shots. This only lasts for about 1 second and then is cleared.

Severity: Minor
Screenshots:

Also, the performance on Firefox is a bit choppy.

Here is a screenshot of the same thing happening on the symbol tab when there is nothing on the atom framework.

Comment #1 - This is a test ticket.

http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-dev.2/build-an-atom_en.html

If you are in the cloud view on Win 7 - IE, Firefox, Chrome and grab an electron to remove. the electron stays in the play area. you can grab the electron after it is out side the cloud and return it to the bucket , move it near the bucket and it will jump into bucket, or you can move it near the cloud and it will join the cloud.

In the Atom section; If you add 7 or more protons to the atom with the stable/unstable box unchecked you cannot remove the last proton. The last proton does not respond to touch.

Name: Build an Atom

URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html

Version: 1.1.0-rc.1

User Agent: Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.62 Safari/537.36

Language: en-US

Window: 1280x622

Pixel Ratio: 1/1

Since BuildAnAtomModel declares 4 Property instances, it is a good candidate for using PropertySet instead. This will unify & simplify access, make sure they reset together, and match style in other code in this project (and in other sims).

No sound produced for game feedback for WinXP Firefox.
Sound works on same laptop in Chrome.

Name: Build an Atom
URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html
Version: 1.1.0-rc.1
Features missing: flexbox, touch
User Agent: Mozilla/5.0 (Windows NT 5.1; rv:24.0) Gecko/20100101 Firefox/24.0
Language: en-US
Window: 826x513
Pixel Ratio: 1/1

About dialog box is larger than the window I have open. Noticed when I went to get platform info for #34 , but it's not exclusive to when the reward screen is up.

Name: Build an Atom
URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html
Version: 1.1.0-rc.1
Features missing: flexbox, touch
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:24.0) Gecko/20100101 Firefox/24.0
Language: en-US
Window: 1081x593
Pixel Ratio: 1/1

Just wondering why TouchSnag is commented out in ParticleView.

The build process is failing. Here is a transcript that shows that build.sh works for Forces and Motion basics but not for Build an Atom:

Sam@LENOVO-W510 ~/Documents/GitHub/forces-and-motion-basics (master)
$ build.sh
= Building forces-and-motion-basics 0.0.0-40
= Cleaning ./build
= Creating minified script
Running "jshint:simFiles" (jshint) task
>> 32 files lint free.

Running "jshint:commonFiles" (jshint) task
>> 159 files lint free.

Running "requirejs:build" (requirejs) task
>> RequireJS optimizer finished
Uncompressed size: 1138563 bytes.
Compressed size: 133312 bytes gzipped. (530185 bytes minified)

Done, without errors.
= Copying 3rd-party libs
= Copying CSS files
= Copying changes.txt
= Copying resource directories:
images
audio
= Copying include files:
../phetcommon/js/util/check-assertions.js
../phetcommon/js/util/check-accessibility.js
../phetcommon/js/util/query-parameters.js
../phetcommon/js/util/update-locale.js
../tween.js/src/Tween.js
= Generating shas.txt
= Modifying HTML file
= Done.
Sam@LENOVO-W510 ~/Documents/GitHub/forces-and-motion-basics (master)
$ cd ..
Sam@LENOVO-W510 ~/Documents/GitHub
$ cd build-an-atom/
Sam@LENOVO-W510 ~/Documents/GitHub/build-an-atom (master)
$ build.sh
= Building build-an-atom 0.0.0-13
= Cleaning ./build
= Creating minified script

path.js:116
        throw new TypeError('Arguments to path.resolve must be strings');
              ^
TypeError: Arguments to path.resolve must be strings
    at Object.exports.resolve (path.js:116:15)
    at module.exports (c:\Users\Sam\AppData\Roaming\npm\node_modules\grunt-cli\n
ode_modules\findup-sync\lib\findup-sync.js:26:26)
    at ChildProcess.<anonymous> (c:\Users\Sam\AppData\Roaming\npm\node_modules\g
runt-cli\bin\grunt:35:17)
    at ChildProcess.EventEmitter.emit (events.js:98:17)
    at Process.ChildProcess._handle.onexit (child_process.js:784:12)
grunt failed

There is an extra Gruntfile.js at the top level which is unnecessary and should be removed.

I totally thought i had messed up and was testing the wrong sim. The label is just wrong - i hope. :)

This enhancement was requested by Emily M. Currently, when a user touches a nucleus that they've built, the nucleus reconfigures itself as though the particle was removed. This can be distracting, particularly on a touch-based interface, since students tend to poke at everything. It would be better if the user had to move the particle a little ways before the nucleus was reconfigured.

@jbphet will indicate when it's ready for review.
@pixelzoom will do it.
@jonathanolson will review for scenery performance.

When trying to grab a particle from a bucket, there are the empty spaces between three spheres that don't respond. It's technically correct, but it makes it seem like you "grabbed" a particle and it didn't drag (espsecially on touch platforms).

See the areas here:

I'm not sure of the best way of handling this, but I think it would be nice from a usability point.

Chrome version
28.0.1500.95

Google_Snow.2695.117.0

The AtomNode constructor is currently declared like so:

  var AtomNode = function AtomNode( particleAtom, mvt, options ) {

    options = _.extend(
      {
        showCenterX: true,
        showElementName: new Property( true ),
        showNeutralOrIon: new Property( true ),
        showStableOrUnstable: new Property( true ),
        electronShellDepiction: new Property( 'orbits' )
      },
      options
    );

It seems odd that:

• the options contain Property instances instead of primitives
• the function is declared as a var instead of a function (requires duplicating the name)
• the property instances are options instead of required parameters (all usage sites currently provide most of the values)
• the values are not stored as fields but rather just through the options object

Not sure why the code in ParticleNode is using switch here instead of ternary ? operator:

    switch( particleType ) {
      case 'proton':
        baseColor = 'red';
        break;
      case 'neutron':
        baseColor = 'gray';
        break;
      case 'electron':
        baseColor = 'blue';
        break;
      default:
        console.error( 'Unrecognized particle type.' );
        baseColor = 'black';
        break;
    }

Here is ternary style:

    var baseColor = particleType === 'proton' ? 'red' :
                    particleType === 'neutron' ? 'gray' :
                    particleType === 'electron' ? 'blue' :
                    'black';
    if ( baseColor === 'black' ) {
      console.error( 'Unrecognized particle type.' );
    }

Or, even better, just a map of the colors (I didn't test this):

    var colors = {proton:'red',neutron:'gray',electron:'blue'};
    var baseColor = colors[particleType];
    if (baseColor===undefined){
      console.error( 'Unrecognized particle type.' );
    }

Sound comes out choppy / has a stutter.
WinXP Chrome.

Name: Build an Atom
URL: http://www.colorado.edu/physics/phet/dev/html/build-an-atom/1.1.0-rc.2/build-an-atom_en.html
Version: 1.1.0-rc.1
Features missing: csstransforms3d, touch
User Agent: Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.101 Safari/537.36
Language: en-US
Window: 899x534
Pixel Ratio: 1/1

There are 10+ issues identified by jshint:

Sam@LENOVO-W510 ~/Documents/GitHub/build-an-atom (master)
$ build.sh
= Building build-an-atom 0.0.0-40
= Cleaning ./build
= Creating minified script
Running "jshint:simFiles" (jshint) task
Linting js/common/model/ParticleAtom.js...ERROR
[L83:C10] W033: Missing semicolon.
      } )
Linting js/common/model/ParticleAtom.js...ERROR
[L95:C6] W033: Missing semicolon.
    }
Linting js/common/view/AtomTabView.js...ERROR
[L117:C6] W033: Missing semicolon.
    }
Linting js/common/view/ChargeMeter.js...ERROR
[L22:C17] W004: 'Rectangle' is already defined.
  var Rectangle = require( 'SCENERY/nodes/Rectangle' );
Linting js/common/view/ElectronCloudView.js...ERROR
[L38:C43] W033: Missing semicolon.
        electronCloud.fill = 'transparent'
Linting js/common/view/ElectronShellView.js...ERROR
[L16:C22] W004: 'RadialGradient' is already defined.
  var RadialGradient = require( 'SCENERY/util/RadialGradient' );
Linting js/game/view/CountsToElementProblemView.js...ERROR
[L141:C73] W116: Expected '===' and instead saw '=='.
               this.neutralOrIon.value = this.problem.answerAtom.charge == 0 ? '
neutral' : 'ion';
Linting js/game/view/ProblemView.js...ERROR
[L57:C80] W033: Missing semicolon.
                                             function(){ thisNode.checkAnswer()
},
Linting js/game/view/ProblemView.js...ERROR
[L63:C65] W033: Missing semicolon.
                                      function() {problem.next()},
Linting js/game/view/ProblemView.js...ERROR
[L69:C74] W033: Missing semicolon.
                                          function() { problem.tryAgain()},
Linting js/game/view/ProblemView.js...ERROR
[L75:C98] W033: Missing semicolon.
                                                      function() { problem.displ
ayCorrectAnswer() },
Linting js/game/view/ProblemView.js...ERROR
[L84:C10] W033: Missing semicolon.
      } )
Linting js/game/view/ProblemView.js...ERROR
[L86:C6] W033: Missing semicolon.
    }
Linting js/game/view/ProblemView.js...ERROR
[L94:C6] W033: Missing semicolon.
    }
Linting js/game/view/ProblemView.js...ERROR
[L167:C19] W033: Missing semicolon.
               } )

Warning: Task "jshint:simFiles" failed. Use --force to continue.

Aborted due to warnings.
grunt failed