This commit is contained in:
Benjamin Bädorf 2019-06-14 21:42:49 +02:00
parent 70a21d274f
commit 192feb41f8
3 changed files with 12 additions and 16 deletions

View file

@ -10,7 +10,7 @@ export default class HorizontalLinesAnimation {
spectrumPointHeight = 20;
maxLines = 10;
line;
data;
fresh = false;
averageSpectrum;
@ -52,7 +52,7 @@ export default class HorizontalLinesAnimation {
const data = getSpectrumData(spectrum);
this.worker.postMessage(data);
this.line = data;
this.data = data;
this.fresh = true;
}
@ -77,13 +77,13 @@ export default class HorizontalLinesAnimation {
sketch.curveVertex(this.BASE_WIDTH, -10);
sketch.curveVertex(this.BASE_WIDTH, -10);
sketch.curveVertex(this.BASE_WIDTH, 0);
for (let i = 1; i < this.line.spectrum.length - 1; i++) {
for (let i = 1; i < this.data.spectrum.length - 1; i++) {
let point;
if (this.averageSpectrum) {
point = Math.max(this.line.spectrum[i] - (this.averageSpectrum[i] * 0.8), 0);
// point = 5 * (this.line.spectrum[i] / this.averageSpectrum[i]);
point = Math.max(this.data.spectrum[i] - (this.averageSpectrum[i] * 0.8), 0);
// point = 5 * (this.data.spectrum[i] / this.averageSpectrum[i]);
} else {
point = this.line.spectrum[i];
point = this.data.spectrum[i];
}
sketch.curveVertex(this.BASE_WIDTH + point, i * this.spectrumPointHeight);
}

View file

@ -33,7 +33,7 @@ async function main() {
function activate(animation) {
activeAnimation = animation;
input.disconnect();
input.connect(animation.analyser);
input.connect(activeAnimation.analyser);
animation.setup(sketch);
}
@ -54,10 +54,6 @@ async function main() {
sketch.draw = () => {
activeAnimation.draw(sketch);
};
setTimeout(() => {
// activactiveAnimation =
}, 1 * 60 * 1000);
});
}

View file

@ -17,7 +17,7 @@ export default class SquaresAnimation {
minPitch = 360;
maxPitch = 0;
circle;
data;
fresh = false;
constructor(audioCtx) {
@ -72,7 +72,7 @@ export default class SquaresAnimation {
this.minPitch = pitch;
}
this.circle = data;
this.data = data;
this.fresh = true;
}
@ -82,10 +82,10 @@ export default class SquaresAnimation {
return;
}
const color = ((this.circle.pitch - this.minPitch) / (this.maxPitch - this.minPitch)) * 360;
const brightness = ((this.circle.volume - this.minVolume) / (this.maxVolume - this.minVolume));
const color = ((this.data.pitch - this.minPitch) / (this.maxPitch - this.minPitch)) * 360;
const brightness = ((this.data.volume - this.minVolume) / (this.maxVolume - this.minVolume));
sketch.stroke(color, 100, 100, brightness);
for (let i = 0; i < spectrum.length + 2; i++) {
for (let i = 0; i < this.data.spectrum.length + 2; i++) {
const x = getRandomBetween(0, Math.floor(window.innerWidth / this.GRID_SIZE)) * this.GRID_SIZE;
const y = getRandomBetween(0, Math.floor(window.innerHeight / this.GRID_SIZE)) * this.GRID_SIZE;
sketch.fill(color, 100, 100, brightness * 0.5);