make Home Screen gracefully handle larger numbers of screens

[pixelzoom]

With the addition of the Mystery screen (see phetsims/equality-explorer#34) Equality Explorer is likely to be PhET's first 5-screen sim. After adding a skeleton for this 5th screen, I noticed that the home screen then adds more space to the left and right of the home screen icons, shrinking them further than necessary. Compare screenshots below for 4-screen and 5-screen sims.

I looked at the implementation of HomeScreenView, and couldn't immediately determine how to fix this. I'm guessing that someone decided that a sim would never have > 4 screens, and therefore didn't make the implementation scale gracefully/consistently. Not surprisingly, HomeScreenView doesn't make use of scenery's maxWidth (since it's a newer feature), but that would be a good place to start. And HomeScreenView has several magic numbers - 60, 33, 170 - that should be derived from LAYOUT_BOUNDS.

If we're going to gracefully handle larger numbers of screens, then we might also look at what it would take to have more than 1 row of icons on the home screen.

I don't have time for this diversion right now. But it may need to be addressed before Equality Explorer 1.0.0 is published. Assigning to @ariel-phet to prioritize and assign.

[pixelzoom]

[pixelzoom]

Equality Explorer actually has a 6th screen that I use for debugging/testing. It's enabled with the ?xy query parameter. See screenshot below. This demonstrates that as the number of screens increases, the left/right margins increase.

[pixelzoom]

I started increasing the number of screens to see how gracefully the home screen handles things.

Things look sane up to 7 screens:

At 8 screens, things go terribly wrong:

There's no reason for this behavior, things should just scale gracefully.

[ariel-phet]

@jonathanolson said this would only be 4'ish hours of work plus time for testing. Assigning at medium priority.

@pixelzoom feel free to ping me on this issue in a couple of weeks if it is starting to become pressing. Probably won't be worked on for about 2 weeks.

[pixelzoom]

@ariel-phet ping. Equality Explorer is definitely a 5-screen sim, and this needs to be addressed before publishing.

[ariel-phet]

I have asked @jonathanolson to put this work at the top of his ToDo list for the start of April.

[jonathanolson]

Should things just scale down (keeping the relative padding)?
Should the padding also potentially be reduced between items?
How should the sizes of the selected vs unselected icons be?

@ariel-phet, should I wait on a decision potentially about this, or go with my best judgment? (I would prefer the padding to be proportional to the size of the icons, that the relative proportion between selected/unselected should stay the same, and things should just scale down based on that)

[pixelzoom]

It looks like there's been an attempt to keep the size of the selected icon constant, regardless of the number of screens. If that's the case... Then I would think that the size of the unselected icons and the amount of space between them would be scaled to fit the remaining horizontal space.

[ariel-phet]

@jonathanolson I think right now, up to 5 screen icons, the selected icon should stay the same size as now, and the other icons should shrink as needed.

After 5 screens (I will push very hard for PhET to never have more than 5 screens in a sim...) lets go with the plan you suggest in the preceding comment (things just scale down).

[jonathanolson]

Initial commit above. Before I refine things and pin numbers to proportions of the layout bounds, can you confirm that this is the desired (or at least acceptable) visual appearance?

[ariel-phet]

@jonathanolson, yes all look good in previous comment

[pixelzoom]

Labeling as "block-production". This issue must be closed before Equality Explorer can start RC testing, scheduled to begin 7/11/18.

[samreid]

@jonathanolson said this can be patched in before M&S RC. He volunteered to do the patch.

@ariel-phet said after this patch is ready, the sim is ready for RC.

[jonathanolson]

@Denz1994 I applied the patch to masses-and-springs' 1.0 branch.

[Denz1994]

Thanks for the patch @jonathanolson. This is resolved in masses-and-springs master branch aswell. Closing.