Mean absolute value of [-1,+1] samples for visualizers

[jsalsman]

The visualizer vaveform averages of float samples in [-1, 1] look terrible, because their absolute value was not used in computing the mean. You might also consider sending the cube root of these means, because the typical value is so small. I.e., [EDIT: there's a much better adjustment in my comment below.]

gain: this.visualSign * Math.pow(this.sampleSum / this.framesSinceLastPublish, 0.333),

this.visualSign is used to show each agregate with alternating signs so the visualization looks like an actual sound pressure wave instead of just the top half of one.

[google-cla]

Thanks for your pull request! It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

View this failed invocation of the CLA check for more information.

For the most up to date status, view the checks section at the bottom of the pull request.

[jsalsman]

you'll need to sign a Contributor License Agreement (CLA).

Done as indicated in the updated check at https://github.com/GoogleChromeLabs/web-audio-samples/pull/350/checks?check_run_id=18952386342

[jsalsman]

This works great for remapping the mean absolute samples. Don't ask me how, ChatGPT came up with it.

          } else if (event.data.message === 'UPDATE_VISUALIZERS') {
            let expKx = Math.exp(15 * event.data.gain);
            document.getElementById('level').value = 
              ((expKx - 1) / (expKx + Math.E)).toFixed(2);
          }

You can experiment with different values of 15 until you get the range you like.

[mjwilson-google]

Thanks for working on this! I am planning to do a full review, but for an initial comment: the types of waveform visualization I've usually seen are either envelope (which would be max/min over a range) or RMS (which is always non-negative, perhaps what this is going for). I'll look into how this is being used and may have some suggestions.