Mirrors/webamp
1
0
Fork 0
mirror of https://github.com/captbaritone/webamp.git synced 2026-08-02 15:03:53 +00:00
Code Issues Projects Releases Wiki Activity

Pull out bufferLength

Browse source
This commit is contained in:
Jordan Eldredge 2020-04-07 22:28:26 -07:00
parent 0b04211398
commit e623761411
2 changed files with 20 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

20
js/components/Visualizer.tsx
View file

@ -4,6 +4,7 @@ import * as Actions from "../actionCreators";
import * as Selectors from "../selectors";
import { useTypedSelector, useActionCreator } from "../hooks";
import VisualizerInner from "./VisualizerInner";
import { VISUALIZERS } from "../constants";
const PIXEL_DENSITY = 2;
const BAR_WIDTH = 3 * PIXEL_DENSITY;
@ -115,6 +116,16 @@ function Visualizer(props: Props) {
const width = renderWidth * PIXEL_DENSITY;
const height = renderHeight * PIXEL_DENSITY;
const bufferLength = useMemo(() => {
switch (style) {
case VISUALIZERS.OSCILLOSCOPE:
return props.analyser.fftSize;
case VISUALIZERS.BAR:
return props.analyser.frequencyBinCount;
default:
return 0;
}
}, [props.analyser.fftSize, props.analyser.frequencyBinCount, style]);
const bgCanvas = useMemo(() => {
return preRenderBg(
@ -159,11 +170,7 @@ function Visualizer(props: Props) {
);
const paintOscilloscopeFrame = useCallback(
(
canvasCtx: CanvasRenderingContext2D,
bufferLength: number,
dataArray: Uint8Array
) => {
(canvasCtx: CanvasRenderingContext2D, dataArray: Uint8Array) => {
props.analyser.getByteTimeDomainData(dataArray);
canvasCtx.lineWidth = PIXEL_DENSITY;
@ -201,7 +208,7 @@ function Visualizer(props: Props) {
}
canvasCtx.stroke();
},
[colors, height, props.analyser, renderWidth, width]
[bufferLength, colors, height, props.analyser, renderWidth, width]
);
const innerProps = {
@ -217,6 +224,7 @@ function Visualizer(props: Props) {
barCanvas,
printBar,
paintOscilloscopeFrame,
bufferLength,
};
return <VisualizerInner {...innerProps} {...props} />;
}

16
js/components/VisualizerInner.js
View file

@ -89,14 +89,14 @@ class VisualizerInner extends React.Component {
// update.
this.props.analyser.fftSize = 2048;
if (this.props.style === VISUALIZERS.OSCILLOSCOPE) {
this.bufferLength = this.props.analyser.fftSize;
this.dataArray = new Uint8Array(this.bufferLength);
this.dataArray = new Uint8Array(this.props.bufferLength);
} else if (this.props.style === VISUALIZERS.BAR) {
this.bufferLength = this.props.analyser.frequencyBinCount;
this.dataArray = new Uint8Array(this.bufferLength);
this.dataArray = new Uint8Array(this.props.bufferLength);
if (!this.octaveBuckets) {
this.octaveBuckets = octaveBucketsForBufferLength(this.bufferLength);
this.octaveBuckets = octaveBucketsForBufferLength(
this.props.bufferLength
);
}
}
}
@ -105,11 +105,7 @@ class VisualizerInner extends React.Component {
switch (this.props.style) {
case VISUALIZERS.OSCILLOSCOPE:
this.canvasCtx.drawImage(this.props.bgCanvas, 0, 0);
this.props.paintOscilloscopeFrame(
this.canvasCtx,
this.bufferLength,
this.dataArray
);
this.props.paintOscilloscopeFrame(this.canvasCtx, this.dataArray);
break;
case VISUALIZERS.BAR:
this.canvasCtx.drawImage(this.props.bgCanvas, 0, 0);