imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Rescale and smooth playback waveform to better match expectation

Browse source
This commit is contained in:
Travis Ralston 2021-05-07 21:06:07 -06:00
parent c2ae6c279b
commit b007ea81b2
3 changed files with 115 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

19
src/voice/Playback.ts
View file

@ -16,11 +16,10 @@ limitations under the License.
import EventEmitter from "events";
import {UPDATE_EVENT} from "../stores/AsyncStore";
import {arrayFastResample, arraySeed} from "../utils/arrays";
import {arrayRescale, arraySeed, arraySmoothingResample} from "../utils/arrays";
import {SimpleObservable} from "matrix-widget-api";
import {IDestroyable} from "../utils/IDestroyable";
import {PlaybackClock} from "./PlaybackClock";
import {clamp} from "../utils/numbers";
export enum PlaybackState {
Decoding = "decoding",
@ -32,6 +31,12 @@ export enum PlaybackState {
export const PLAYBACK_WAVEFORM_SAMPLES = 39;
const DEFAULT_WAVEFORM = arraySeed(0, PLAYBACK_WAVEFORM_SAMPLES);
function makePlaybackWaveform(input: number[]): number[] {
// We use a smoothing resample to keep the rough shape of the waveform the user will be seeing. We
// then rescale so the user can see the waveform properly (loud noises == 100%).
return arrayRescale(arraySmoothingResample(input, PLAYBACK_WAVEFORM_SAMPLES), 0, 1);
}
export class Playback extends EventEmitter implements IDestroyable {
private readonly context: AudioContext;
private source: AudioBufferSourceNode;
@ -50,11 +55,15 @@ export class Playback extends EventEmitter implements IDestroyable {
constructor(private buf: ArrayBuffer, seedWaveform = DEFAULT_WAVEFORM) {
super();
this.context = new AudioContext();
this.resampledWaveform = arrayFastResample(seedWaveform ?? DEFAULT_WAVEFORM, PLAYBACK_WAVEFORM_SAMPLES);
this.resampledWaveform = makePlaybackWaveform(seedWaveform ?? DEFAULT_WAVEFORM);
this.waveformObservable.update(this.resampledWaveform);
this.clock = new PlaybackClock(this.context);
}
/**
* Stable waveform for the playback. Values are guaranteed to be between
* zero and one, inclusive.
*/
public get waveform(): number[] {
return this.resampledWaveform;
}
@ -95,8 +104,8 @@ export class Playback extends EventEmitter implements IDestroyable {
// Update the waveform to the real waveform once we have channel data to use. We don't
// exactly trust the user-provided waveform to be accurate...
const waveform = Array.from(this.audioBuf.getChannelData(0)).map(v => clamp(v, 0, 1));
this.resampledWaveform = arrayFastResample(waveform, PLAYBACK_WAVEFORM_SAMPLES);
const waveform = Array.from(this.audioBuf.getChannelData(0));
this.resampledWaveform = makePlaybackWaveform(waveform);
this.waveformObservable.update(this.resampledWaveform);
this.emit(PlaybackState.Stopped); // signal that we're not decoding anymore