From 6925047764a698831b6e3e0a837dad937d63e712 Mon Sep 17 00:00:00 2001 From: Ethan Halsall Date: Sat, 21 Oct 2023 10:30:49 -0500 Subject: [PATCH 1/2] chore: update dependencies --- README.md | 22 +- build.js | 4 +- demo/index.html | 158 ++-- demo/synaudio.js | 51 +- demo/synaudio.min.js | 2 +- demo/synaudio.min.js.map | 2 +- dist/synaudio.js | 51 +- dist/synaudio.min.js | 2 +- dist/synaudio.min.js.map | 2 +- index.d.ts | 6 +- package-lock.json | 1855 +++++++++++++++++++++++--------------- package.json | 26 +- src/SynAudio.js | 46 +- test/SynAudio.test.js | 266 +++--- 14 files changed, 1441 insertions(+), 1052 deletions(-) diff --git a/README.md b/README.md index b07e02f..42f5a52 100644 --- a/README.md +++ b/README.md @@ -15,6 +15,7 @@ * [Options](#options) * [Methods](#methods) * [Types](#types) +* [Developing](#developing) ## Installing @@ -304,4 +305,23 @@ declare interface MultipleClipMatch { * Correlation coefficient between the previous clip and this cli * Ranging from -1 (worst) to 1 (best) * `sampleOffset` - * Number of samples relative to the root clip (first clip in the match) \ No newline at end of file + * Number of samples relative to the root clip (first clip in the match) + + +## Developing + +### Prerequisites +1. Install Emscripten by following these [instructions](https://kripken.github.io/emscripten-site/docs/getting_started/downloads.html#installation-instructions). + * This repository has been tested with Emscripten 3.1.46. + +### Building +1. Make sure to `source` the Emscripten path in the terminal you want build in. + * i.e. `$ source path/to/emsdk/emsdk_env.sh` +1. Run `npm i` to install the dependencies. +1. Run `make clean` and `make` to build the libraries. + * You can run `make -j8` where `8` is the number of CPU cores on your system to speed up the build. +1. The builds will be located in the `dist` folder: + +### Testing +1. Run `npm i` to install the build tool and test dependencies. +1. Run `npm run test` to run the test suite. \ No newline at end of file diff --git a/build.js b/build.js index ba27fec..304629a 100644 --- a/build.js +++ b/build.js @@ -50,7 +50,7 @@ const build = async (simdPath, scalarPath) => { scalarWasm, scalarContent.groups.end, synAudio.substring(scalarEnd), - ].map(Buffer.from) + ].map(Buffer.from), ); await fs.writeFile(synAudioPath, finalString, { encoding: "binary" }); @@ -76,7 +76,7 @@ const build = async (simdPath, scalarPath) => { // terser const minified = await minify( { [bundleOutput.fileName]: bundleOutput.code }, - terserConfig + terserConfig, ); // write output files diff --git a/demo/index.html b/demo/index.html index feb723f..d5e230b 100644 --- a/demo/index.html +++ b/demo/index.html @@ -1,4 +1,4 @@ - + @@ -18,11 +18,8 @@ text-size-adjust: none; } body { - background: linear-gradient( - 217deg, - rgba(255, 0, 0, 0.3), - rgba(255, 0, 0, 0) 70.71% - ) + background: + linear-gradient(217deg, rgba(255, 0, 0, 0.3), rgba(255, 0, 0, 0) 70.71%) fixed, linear-gradient(127deg, rgba(0, 255, 0, 0.3), rgba(0, 255, 0, 0) 70.71%) fixed, @@ -549,7 +546,7 @@

Sync Multiple Clips

const audioCtxErrorHandler = (e) => { console.error( "Failed to start the AudioContext. WebAudio playback will not be possible.", - e + e, ); }; @@ -611,7 +608,7 @@

Sync Multiple Clips

(audioCtx.currentTime * PROGRESS_FACTOR - this.start); this._progressBarEl.value = currentTime; this._timeEl.innerHTML = this.getTime( - currentTime / PROGRESS_FACTOR + currentTime / PROGRESS_FACTOR, ); } }, 2); @@ -710,11 +707,11 @@

Sync Multiple Clips

// stop progress bar and clear event listeners this._progressBarEl.removeEventListener( "pointerup", - this.startProgress + this.startProgress, ); this._progressBarEl.removeEventListener( "pointerdown", - this.stopProgress + this.stopProgress, ); this.stopProgress(); @@ -775,16 +772,23 @@

Sync Multiple Clips

...this._audioBufferData.get(buffer), })) .sort((a, b) => a.offset - b.offset) - .reduce((finalBuffer, buffer) => { - for (let i = 0; i < this.channelCount; i++) { - finalBuffer.copyToChannel( - buffer.buffer.getChannelData(i), - i, - buffer.offset - ); - } - return finalBuffer; - }, audioCtx.createBuffer(this.channelCount, this.length, this.sampleRate)); + .reduce( + (finalBuffer, buffer) => { + for (let i = 0; i < this.channelCount; i++) { + finalBuffer.copyToChannel( + buffer.buffer.getChannelData(i), + i, + buffer.offset, + ); + } + return finalBuffer; + }, + audioCtx.createBuffer( + this.channelCount, + this.length, + this.sampleRate, + ), + ); } get audioBuffers() { @@ -808,7 +812,7 @@

Sync Multiple Clips

acc > audioBuffer.numberOfChannels ? acc : audioBuffer.numberOfChannels, - 0 + 0, ); } @@ -853,7 +857,7 @@

Sync Multiple Clips

return fftInterval === "auto" ? FFTCanvas.FFT_INTERVAL_OPTIONS.reduceRight((acc, val) => - maxWidth > this._displayLength / val ? val : acc + maxWidth > this._displayLength / val ? val : acc, ) : parseInt(fftInterval); } @@ -864,7 +868,7 @@

Sync Multiple Clips

return fftBins === "auto" ? FFTCanvas.FFT_BIN_OPTIONS.reduceRight((acc, val) => - maxHeight < val ? val : acc + maxHeight < val ? val : acc, ) : parseInt(fftBins); } @@ -914,7 +918,7 @@

Sync Multiple Clips

x, y, width, - height + height, ); }; @@ -940,8 +944,8 @@

Sync Multiple Clips

logTables[binOption].push( Math.round( ((Math.log10(i) * (binOption - 1)) / sampleRateLog) * - logGap - ) + logGap, + ), ); } @@ -957,7 +961,7 @@

Sync Multiple Clips

0, 0, patternCanvas.width, - patternCanvas.height + patternCanvas.height, ); /*patternCanvasCtx.beginPath(); patternCanvasCtx.moveTo(0, 0); @@ -998,13 +1002,13 @@

Sync Multiple Clips

for (let binIdx = 0; binIdx < bins.length; binIdx++) { const r = Math.round( - (payload.color[0] * bins[binIdx]) / 255 + (payload.color[0] * bins[binIdx]) / 255, ); const g = Math.round( - (payload.color[1] * bins[binIdx]) / 255 + (payload.color[1] * bins[binIdx]) / 255, ); const b = Math.round( - (payload.color[2] * bins[binIdx]) / 255 + (payload.color[2] * bins[binIdx]) / 255, ); canvasCtx.fillStyle = `rgb(${r},${g},${b})`; @@ -1019,7 +1023,7 @@

Sync Multiple Clips

(payload.offset / fftInterval + fftXCursor) * widthScale, bins.length - fftYCursor, widthScale + widthScale / 2, - fftYCursor - fftYPrevious + fftYCursor - fftYPrevious, ); } @@ -1033,14 +1037,14 @@

Sync Multiple Clips

0, 0, canvas.width, - canvas.height + canvas.height, ); fillPattern(0, 0, canvas.width, canvas.height); canvasCtx.putImageData( image, (payload / fftInterval) * widthScale, - 0 + 0, ); break; } @@ -1057,8 +1061,8 @@

Sync Multiple Clips

URL.createObjectURL( new Blob([`"use strict";(${source.toString()})()`], { type: "text/javascript", - }) - ) + }), + ), ); this._messageId = Number.MIN_SAFE_INTEGER; @@ -1084,7 +1088,7 @@

Sync Multiple Clips

fftBinOptions: FFTCanvas.FFT_BIN_OPTIONS, patternCanvas: offscreenPatternCanvas, }, - [offscreenPatternCanvas] + [offscreenPatternCanvas], ); } @@ -1095,7 +1099,7 @@

Sync Multiple Clips

this._pendingMessages.set(messageId, resolve); this._canvasWorker.postMessage( { name, payload, messageId }, - transferList + transferList, ); }); } @@ -1108,7 +1112,7 @@

Sync Multiple Clips

const offscreenCanvas = this._canvas.transferControlToOffscreen(); this._canvasContainer = document.getElementById( - this._audioKey + "-fft" + this._audioKey + "-fft", ); this._playerEl.style.width = @@ -1154,7 +1158,7 @@

Sync Multiple Clips

await this._postToWorker( "translateXSamples", - this._translatedSamples - audioData.offset + this._translatedSamples - audioData.offset, ); audioData.offset = this._translatedSamples; @@ -1190,7 +1194,7 @@

Sync Multiple Clips

"full", audioBufferData.fft[audioBufferData.currentFFT], audioBufferData.color, - audioBufferData.offset + audioBufferData.offset, ); } else { const offlineAudioCtx = new OfflineAudioContext(audioBuffer); @@ -1205,7 +1209,7 @@

Sync Multiple Clips

const processor = offlineAudioCtx.createScriptProcessor( fftInterval, audioBuffer.numberOfChannels, - audioBuffer.numberOfChannels + audioBuffer.numberOfChannels, ); let fft = [], @@ -1225,7 +1229,7 @@

Sync Multiple Clips

"partial", fftChunk, audioBufferData.color, - audioBufferData.offset + audioBufferData.offset, ); fftChunk = []; } @@ -1242,7 +1246,7 @@

Sync Multiple Clips

"last-partial", fftChunk, audioBufferData.color, - audioBufferData.offset + audioBufferData.offset, ); audioBufferData.fft[audioBufferData.currentFFT] = fft; @@ -1255,15 +1259,15 @@

Sync Multiple Clips