diff --git a/src/horizontal-lines.js b/src/horizontal-lines.js index d519fa0..e2b1354 100644 --- a/src/horizontal-lines.js +++ b/src/horizontal-lines.js @@ -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); } diff --git a/src/index.js b/src/index.js index b7795ad..1c524cc 100644 --- a/src/index.js +++ b/src/index.js @@ -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); }); } diff --git a/src/squares.js b/src/squares.js index b74c689..6d44d2b 100644 --- a/src/squares.js +++ b/src/squares.js @@ -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);