phetsims / fourier-making-waves

"Fourier: Making Waves" is an educational simulation in HTML5, by PhET Interactive Simulations.
GNU General Public License v3.0
6 stars 3 forks source link

'Emphasize harmonics' feature does not work with keyboard navigation. #201

Closed pixelzoom closed 2 years ago

pixelzoom commented 2 years ago

For phetsims/qa#711 ...

While investigating https://github.com/phetsims/fourier-making-waves/issues/200, I noticed that the "emphasize harmonics" feature does not work for keyboard navigation.

For example, if you grab an amplitude slider with a pointer, the associated harmonic is emphasized in the Harmonics chart, and the others are grayed out. For example, here's what it looks like when I grab A1 with my mouse:

screenshot_1303

If I use the keyboard to navigate to one of the amplitude sliders, there is no such emphasis. Again with A1, noting the focus highlight on A1's thumb:

screenshot_1304

I have not investigated yet, so I don't know how difficult this will be to support.

I will say that it's disappointing that so many "input" related things need to be duplicated for keyboard support, instead of being handled uniformly/transparently by scenery. The programmer doesn't need to worry about whether the pointer is a mouse or touch - why do we need to care that it's a keyboard? See https://github.com/phetsims/scenery/issues/1238.

@arouinfar should this feature work for keyboard navigation?

arouinfar commented 2 years ago

Good find @pixelzoom.

I think it is worth some investigation to see if harmonics can be emphasized when the corresponding slider has focus. I think it improves usability, so I would prefer that the feature works for keyboard navigation.

pixelzoom commented 2 years ago

Keyboard support for "emphasized harmonics" has been added to master and 1.0 in the above commits. Emphasis occurs when an amplitude slider or measurement tool has focus. Mutliple harmonics may be emphasized simultaneously, to support multitouch, and to support the case where a pointer is over a slider (or tool) while some other slider (or tool) has keyboard focus.

Ready for testing in the next RC. To verify:

  1. Run the sim, go to the "Discrete" screen.
  2. Set "Waveform" combo box to "custom", so that you have a bunch of harmonics to work with.
  3. Navigate through the amplitiude sliders using the keyboard. Verify that when a slider has focus, its associated harmonic is emphasized in the Harmonics chart. (The harmonic is plotted with a thicker line, and other harmonics are grayed out.)
  4. While n amplitude slider has keyboard focus, move the mouse over other sliders. Verify that 2 harmonics are emphasized in the Harmonics chart: one for the keyboard focus, one for the mouse.
Nancy-Salpepi commented 2 years ago

Step 3 has the expected outcome--when an amplitude slider is moved with keyboard, its harmonic is emphasized. Step 4 also has the expected outcome--keyboard focus remains when mouse moves over sliders. Two harmonics will be emphasized when the mouse moves over slider (when amplitude value is not zero).

Once I use the mouse to move the amplitude slider, keyboard focus disappears and thus only one harmonic is emphasized in the Harmonics Chart. If I do the opposite both harmonics are emphasized on the Harmonics Chart.

  1. Move the amplitude slider with mouse and keep mouse focus on slider
  2. Then tab to another slider and move it with keyboard

Is this acceptable behavior? emphasize harmonics

arouinfar commented 2 years ago

Nice observation @Nancy-Salpepi. I think this behavior is acceptable, so I will go ahead and close.

Once I use the mouse to move the amplitude slider, keyboard focus disappears and thus only one harmonic is emphasized in the Harmonics Chart

This is to be expected. Clicking the mouse will dismiss the focus highlight so there isn't a keyboard-emphasized harmonic.

If I do the opposite both harmonics are emphasized on the Harmonics Chart.

I don't think there's a mechanism to ignore the mouse cursor location when using the keyboard, nor am I sure that there needs to be one. Leaving the mouse hovered over the amplitude slider would leave that harmonic emphasized, which is why there can be two emphasized harmonics. I think this is somewhat analogous to multi-touch, where you can manipulate/interact with two (or more) harmonics simultaneously and all will be emphasized.