react-hifi
Version:
A set of react components wich provides simple abstraption to manipulate HTML5 AudioContext API (Equalizer, visualisation, stereo, basic controls)
65 lines • 2.84 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var plugin_factory_1 = require("../_lib/plugin-factory");
var type_1 = require("../_lib/type");
var OsciloscopePlugin = /** @class */ (function () {
function OsciloscopePlugin() {
this.createNode = this.createNode.bind(this);
this.handleVisualizationChange = this.handleVisualizationChange.bind(this);
this.updateNode = this.updateNode.bind(this);
}
OsciloscopePlugin.prototype.handleVisualizationChange = function () {
this.animationFrame = requestAnimationFrame(this.handleVisualizationChange);
this.node.getByteTimeDomainData(this.dataArray);
var sliceWidth = (this.width * 1.0) / this.node.frequencyBinCount;
var x = 0;
var data = [];
for (var i = 0; i < this.node.frequencyBinCount; i++) {
var v = this.dataArray[i] / 128.0;
var y = (v * this.height) / 2;
data.push([x, y]);
x += sliceWidth;
}
this.onData(data);
};
OsciloscopePlugin.prototype.shouldNotUpdate = function (prevProps, nextProps) {
return !!nextProps.audioContext && nextProps.audioContext.state !== type_1.ContextState.RUNNING;
};
OsciloscopePlugin.prototype.createNode = function (audioContext, _a) {
var height = _a.height, width = _a.width, onVisualisationData = _a.onVisualisationData;
this.node = audioContext.createAnalyser();
this.node.fftSize = 2048;
this.dataArray = new Uint8Array(this.node.frequencyBinCount);
this.width = width;
this.height = height;
this.onData = onVisualisationData;
return this.node;
};
OsciloscopePlugin.prototype.updateNode = function (node, _a, audioContext) {
var height = _a.height, width = _a.width;
if (this.height !== height) {
this.height = height;
}
if (this.width !== width) {
this.width = width;
}
if (this.previousContextState !== audioContext.state) {
this.previousContextState = audioContext.state;
switch (audioContext.state) {
case type_1.ContextState.SUSPENDED:
this.animationFrame && cancelAnimationFrame(this.animationFrame);
break;
case type_1.ContextState.CLOSED:
this.animationFrame && cancelAnimationFrame(this.animationFrame);
break;
case type_1.ContextState.RUNNING:
this.handleVisualizationChange();
break;
}
}
};
return OsciloscopePlugin;
}());
exports.OsciloscopePlugin = OsciloscopePlugin;
exports.default = plugin_factory_1.pluginFactory(new OsciloscopePlugin());
//# sourceMappingURL=index.js.map