Skip to content

Commit

Permalink
Ability to use custom script processor node (katspaugh#1389)
Browse files Browse the repository at this point in the history 
* update dev dependencies
* fix prettier lint errors (fixes katspaugh#1384)
* add audioScriptProcessor option
* update changelog
  • Loading branch information
@thijstriemstra
thijstriemstra committed Jun 12, 2018
1 parent dcdf3aa commit 9c1588d
Show file tree
Hide file tree
Showing 9 changed files with 44 additions and 38 deletions.
1 change: 1 addition & 0 deletions CHANGES.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ wavesurfer.js changelog
------------------

- Build library using webpack 4 (#1376)
- Add `audioScriptProcessor` option to use custom script processor node (#1389)
- Added `mute` and `volume` events (#1345)

2.0.5 (26.02.2018)
Expand Down
6 changes: 3 additions & 3 deletions example/stretcher/soundtouch.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -664,7 +664,7 @@
var newOvl;

// TODO assert(overlapInMsec >= 0);
newOvl = this.sampleRate * overlapInMsec / 1000;
newOvl = (this.sampleRate * overlapInMsec) / 1000;
if (newOvl < 16) newOvl = 16;

// must be divisible by 8
Expand Down Expand Up @@ -700,10 +700,10 @@

// Update seek window lengths
this.seekWindowLength = Math.floor(
this.sampleRate * this.sequenceMs / 1000
(this.sampleRate * this.sequenceMs) / 1000
);
this.seekLength = Math.floor(
this.sampleRate * this.seekWindowMs / 1000
(this.sampleRate * this.seekWindowMs) / 1000
);
},

Expand Down
6 changes: 3 additions & 3 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,13 +70,13 @@
"karma-jasmine-matchers": "3.7.0",
"karma-verbose-reporter": "0.0.6",
"karma-webpack": "^3.0.0",
"lint-staged": "^7.1.2",
"lint-staged": "^7.1.3",
"load-script": "^1.0.0",
"pre-commit": "^1.2.2",
"prettier": "^1.12.1",
"prettier": "^1.13.5",
"uglifyjs-webpack-plugin": "^1.2.5",
"webpack": "4",
"webpack-cli": "^2.1.3",
"webpack-cli": "^3.0.3",
"webpack-dev-server": "3",
"webpack-merge": "^4.1.2"
},
Expand Down
4 changes: 2 additions & 2 deletions src/drawer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,8 +98,8 @@ export default class Drawer extends util.Observer {

if (!this.params.fillParent && nominalWidth < parentWidth) {
progress =
(clientX - bbox.left) * this.params.pixelRatio / nominalWidth ||
0;
(clientX - bbox.left) *
(this.params.pixelRatio / nominalWidth) || 0;

if (progress > 1) {
progress = 1;
Expand Down
6 changes: 3 additions & 3 deletions src/drawer.multicanvas.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -291,7 +291,7 @@ export default class MultiCanvas extends Drawer {
for (i = first; i < last; i += step) {
const peak =
peaks[Math.floor(i * scale * peakIndexScale)] || 0;
const h = Math.round(peak / absmax * halfH);
const h = Math.round((peak / absmax) * halfH);
this.fillRect(
i + this.halfPixel,
halfH - h + offsetY,
Expand Down Expand Up @@ -435,7 +435,7 @@ export default class MultiCanvas extends Drawer {

for (i = canvasStart; i < canvasEnd; i++) {
const peak = peaks[2 * i] || 0;
const h = Math.round(peak / absmax * halfH);
const h = Math.round((peak / absmax) * halfH);
ctx.lineTo(
(i - first) * scale + this.halfPixel,
halfH - h + offsetY
Expand All @@ -446,7 +446,7 @@ export default class MultiCanvas extends Drawer {
// closed hull to fill.
for (j = canvasEnd - 1; j >= canvasStart; j--) {
const peak = peaks[2 * j + 1] || 0;
const h = Math.round(peak / absmax * halfH);
const h = Math.round((peak / absmax) * halfH);
ctx.lineTo(
(j - first) * scale + this.halfPixel,
halfH - h + offsetY
Expand Down
6 changes: 3 additions & 3 deletions src/plugin/regions.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ class Region {
params.end == null
? // small marker-like region
this.start +
4 / this.wrapper.scrollWidth * this.wavesurfer.getDuration()
(4 / this.wrapper.scrollWidth) * this.wavesurfer.getDuration()
: Number(params.end);
this.resize =
params.resize === undefined ? true : Boolean(params.resize);
Expand Down Expand Up @@ -200,8 +200,8 @@ class Region {
if (this.element != null) {
// Calculate the left and width values of the region such that
// no gaps appear between regions.
const left = Math.round(this.start / dur * width);
const regionWidth = Math.round(this.end / dur * width) - left;
const left = Math.round((this.start / dur) * width);
const regionWidth = Math.round((this.end / dur) * width) - left;

this.style(this.element, {
left: left + 'px',
Expand Down
32 changes: 16 additions & 16 deletions src/plugin/spectrogram.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
const FFT = function(bufferSize, sampleRate, windowFunc, alpha) {
this.bufferSize = bufferSize;
this.sampleRate = sampleRate;
this.bandwidth = 2 / bufferSize * sampleRate / 2;
this.bandwidth = (2 / bufferSize) * (sampleRate / 2);

this.sinTable = new Float32Array(bufferSize);
this.cosTable = new Float32Array(bufferSize);
Expand All @@ -19,8 +19,7 @@ const FFT = function(bufferSize, sampleRate, windowFunc, alpha) {
case 'bartlett':
for (var i = 0; i < bufferSize; i++) {
this.windowValues[i] =
2 /
(bufferSize - 1) *
(2 / (bufferSize - 1)) *
((bufferSize - 1) / 2 - Math.abs(i - (bufferSize - 1) / 2));
}
break;
Expand All @@ -29,22 +28,23 @@ const FFT = function(bufferSize, sampleRate, windowFunc, alpha) {
this.windowValues[i] =
0.62 -
0.48 * Math.abs(i / (bufferSize - 1) - 0.5) -
0.38 * Math.cos(Math.PI * 2 * i / (bufferSize - 1));
0.38 * Math.cos((Math.PI * 2 * i) / (bufferSize - 1));
}
break;
case 'blackman':
alpha = alpha || 0.16;
for (var i = 0; i < bufferSize; i++) {
this.windowValues[i] =
(1 - alpha) / 2 -
0.5 * Math.cos(Math.PI * 2 * i / (bufferSize - 1)) +
alpha / 2 * Math.cos(4 * Math.PI * i / (bufferSize - 1));
0.5 * Math.cos((Math.PI * 2 * i) / (bufferSize - 1)) +
(alpha / 2) *
Math.cos((4 * Math.PI * i) / (bufferSize - 1));
}
break;
case 'cosine':
for (var i = 0; i < bufferSize; i++) {
this.windowValues[i] = Math.cos(
Math.PI * i / (bufferSize - 1) - Math.PI / 2
(Math.PI * i) / (bufferSize - 1) - Math.PI / 2
);
}
break;
Expand All @@ -56,7 +56,7 @@ const FFT = function(bufferSize, sampleRate, windowFunc, alpha) {
-0.5 *
Math.pow(
(i - (bufferSize - 1) / 2) /
(alpha * (bufferSize - 1) / 2),
((alpha * (bufferSize - 1)) / 2),
2
)
);
Expand All @@ -65,21 +65,22 @@ const FFT = function(bufferSize, sampleRate, windowFunc, alpha) {
case 'hamming':
for (var i = 0; i < bufferSize; i++) {
this.windowValues[i] =
0.54 - 0.46 * Math.cos(Math.PI * 2 * i / (bufferSize - 1));
(0.54 - 0.46) *
Math.cos((Math.PI * 2 * i) / (bufferSize - 1));
}
break;
case 'hann':
case undefined:
for (var i = 0; i < bufferSize; i++) {
this.windowValues[i] =
0.5 * (1 - Math.cos(Math.PI * 2 * i / (bufferSize - 1)));
0.5 * (1 - Math.cos((Math.PI * 2 * i) / (bufferSize - 1)));
}
break;
case 'lanczoz':
for (var i = 0; i < bufferSize; i++) {
this.windowValues[i] =
Math.sin(Math.PI * (2 * i / (bufferSize - 1) - 1)) /
(Math.PI * (2 * i / (bufferSize - 1) - 1));
Math.sin(Math.PI * ((2 * i) / (bufferSize - 1) - 1)) /
(Math.PI * ((2 * i) / (bufferSize - 1) - 1));
}
break;
case 'rectangular':
Expand All @@ -90,8 +91,7 @@ const FFT = function(bufferSize, sampleRate, windowFunc, alpha) {
case 'triangular':
for (var i = 0; i < bufferSize; i++) {
this.windowValues[i] =
2 /
bufferSize *
(2 / bufferSize) *
(bufferSize / 2 - Math.abs(i - (bufferSize - 1) / 2));
}
break;
Expand Down Expand Up @@ -569,7 +569,7 @@ export default class SpectrogramPlugin {

const freq = freqStart + step * i;
const index = Math.round(
freq / (this.sampleRate / 2) * this.fftSamples
(freq / (this.sampleRate / 2)) * this.fftSamples
);
const label = this.freqType(freq);
const units = this.unitType(freq);
Expand Down Expand Up @@ -636,7 +636,7 @@ export default class SpectrogramPlugin {
if (column[k] == null) {
column[k] = 0;
}
column[k] += overlap / newPiece * oldMatrix[j][k];
column[k] += (overlap / newPiece) * oldMatrix[j][k];
}
}
/* eslint-enable max-depth */
Expand Down
2 changes: 2 additions & 0 deletions src/wavesurfer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,8 @@ import PeakCache from './peakcache';
* initialized AudioContext or leave blank.
* @property {number} audioRate=1 Speed at which to play audio. Lower number is
* slower.
* @property {ScriptProcessorNode} audioScriptProcessor=null Use your own previously
* initialized ScriptProcessorNode or leave blank.
* @property {boolean} autoCenter=true If a scrollbar is present, center the
* waveform around the progress
* @property {string} backend='WebAudio' `'WebAudio'|'MediaElement'` In most cases
Expand Down
19 changes: 11 additions & 8 deletions src/webaudio.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -219,16 +219,19 @@ export default class WebAudio extends util.Observer {

/** @private */
createScriptNode() {
if (this.ac.createScriptProcessor) {
this.scriptNode = this.ac.createScriptProcessor(
WebAudio.scriptBufferSize
);
if (this.params.audioScriptProcessor) {
this.scriptNode = this.params.audioScriptProcessor;
} else {
this.scriptNode = this.ac.createJavaScriptNode(
WebAudio.scriptBufferSize
);
if (this.ac.createScriptProcessor) {
this.scriptNode = this.ac.createScriptProcessor(
WebAudio.scriptBufferSize
);
} else {
this.scriptNode = this.ac.createJavaScriptNode(
WebAudio.scriptBufferSize
);
}
}

this.scriptNode.connect(this.ac.destination);
}

Expand Down

0 comments on commit 9c1588d

Please sign in to comment.