From 50569a6a858a7679d99899dca10261e872a6a4ed Mon Sep 17 00:00:00 2001
From: Enton Biba <entonbiba@users.noreply.github.com>
Date: Sun, 2 Jul 2017 14:48:53 -0400
Subject: [PATCH 01/16] fixes safari browser missing buffer when using webaudio
 (#1096)

* fixes safari browser missing buffer when using webaudio

* return correct buffer

* set samples to 4096

* add safari comment
---
 src/webaudio.js | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/src/webaudio.js b/src/webaudio.js
index 8879f187a..1fe3f4520 100755
--- a/src/webaudio.js
+++ b/src/webaudio.js
@@ -345,6 +345,18 @@ export default class WebAudio extends util.Observer {
 
         this.setLength(length);
 
+        /**
+         * The following snippet fixes a buffering data issue on the Safari
+         * browser which returned undefined It creates the missing buffer based
+         * on 1 channel, 4096 samples and the sampleRate from the current
+         * webaudio context 4096 samples seemed to be the best fit for rendering
+         * will review this code once a stable version of Safari TP is out
+         */
+        if (!this.buffer.length) {
+            const newBuffer = this.createBuffer(1, 4096, this.sampleRate);
+            this.buffer = newBuffer.buffer;
+        }
+
         const sampleSize = this.buffer.length / length;
         const sampleStep = ~~(sampleSize / 10) || 1;
         const channels = this.buffer.numberOfChannels;

From e44ee0296af1a538229575185676c102439f00d5 Mon Sep 17 00:00:00 2001
From: agamemnus <agamemnus@users.noreply.github.com>
Date: Sun, 2 Jul 2017 14:38:44 -0400
Subject: [PATCH 02/16] Join ends of peaks (#1142)

* Join ends of peaks

I'm not entirely sure that the peaks are joined at the ends. When I zoomed all the way in, it seemed that there were gaps...

* Update drawer.multicanvas.js

* Update drawer.multicanvas.js
---
 src/drawer.multicanvas.js | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/drawer.multicanvas.js b/src/drawer.multicanvas.js
index 54d50e15a..dbd3c18f4 100644
--- a/src/drawer.multicanvas.js
+++ b/src/drawer.multicanvas.js
@@ -366,14 +366,14 @@ export default class MultiCanvas extends Drawer {
         if (!ctx) { return; }
 
         const length = peaks.length / 2;
-
-        let scale = 1;
-        if (this.params.fillParent && this.width != length) {
-            scale = this.width / length;
-        }
+        const scale = (this.params.fillParent && this.width != length)
+          ? this.width / length
+          : 1;
 
         const first = Math.round(length * entry.start);
-        const last = Math.round(length * entry.end);
+        // Use one more peak value to make sure we join peaks at ends -- unless,
+        // of course, this is the last canvas.
+        const last = Math.round(length * entry.end) + 1;
         if (first > end || last < start) { return; }
         const canvasStart = Math.max(first, start);
         const canvasEnd = Math.min(last, end);

From 2e534318cab9cf87db01682c2909795f2003de75 Mon Sep 17 00:00:00 2001
From: Tim Fischbach <info@timfischbach.de>
Date: Sun, 2 Jul 2017 20:36:25 +0200
Subject: [PATCH 03/16] Ensure canvas elements are cleared before redrawing
 (#1144)

refs #1127

Before #909, calling `drawBuffer` to redraw the wave invoked
`drawer.drawPeaks` which in turn invoked `drawer.setWidth` which
always caused the canvas to be cleared as a side effect of
`drawer.updateSize`.

In #909 `setWidth` was changed to short circuit if the width did not
change. This now causes the waveform to be redrawn on top of the
previous rendition, making the edges of the wave appear less crisp.

This change makes `setWidth`/`setHeight` return a boolean to indicate
whether changes were needed. If not, `drawer.clearWave` is called
manually. So we make sure that the previous wave is always cleared,
but do not perform the possibly performance intensive task of clearing
the canvas twice if it already happened as a side effect of
`setWidth`.
---
 src/drawer.js | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/drawer.js b/src/drawer.js
index 464dc42c6..def62c3f8 100644
--- a/src/drawer.js
+++ b/src/drawer.js
@@ -142,7 +142,9 @@ export default class Drawer extends util.Observer {
      * rendered
      */
     drawPeaks(peaks, length, start, end) {
-        this.setWidth(length);
+        if (!this.setWidth(length)) {
+            this.clearWave();
+        }
 
         this.params.barWidth ?
             this.drawBars(peaks, 0, start, end) :
@@ -228,7 +230,7 @@ export default class Drawer extends util.Observer {
      */
     setWidth(width) {
         if (this.width == width) {
-            return;
+            return false;
         }
 
         this.width = width;
@@ -244,6 +246,7 @@ export default class Drawer extends util.Observer {
         }
 
         this.updateSize();
+        return true;
     }
 
     /**
@@ -252,12 +255,17 @@ export default class Drawer extends util.Observer {
      * @param {number} height
      */
     setHeight(height) {
-        if (height == this.height) { return; }
+        if (height == this.height) {
+            return false;
+        }
         this.height = height;
+
         this.style(this.wrapper, {
             height: ~~(this.height / this.params.pixelRatio) + 'px'
         });
+
         this.updateSize();
+        return true;
     }
 
     /**

From 19df35f5dfd53eed0f8d6648cac0ac64850f6210 Mon Sep 17 00:00:00 2001
From: Gleb Mazovetskiy <glex.spb@gmail.com>
Date: Sun, 2 Jul 2017 19:31:01 +0100
Subject: [PATCH 04/16] Remove variable redeclariotions from spectrogram
 (#1152)

Fixes #1138
---
 src/plugin/spectrogram.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/plugin/spectrogram.js b/src/plugin/spectrogram.js
index d2ef3b2ea..16a6deca6 100644
--- a/src/plugin/spectrogram.js
+++ b/src/plugin/spectrogram.js
@@ -483,8 +483,6 @@ export default class SpectrogramPlugin {
 
             const freq = freqStart + (step * i);
             const index = Math.round(freq / (this.sampleRate / 2) * this.fftSamples);
-            const percent = index / this.fftSamples / 2;
-            const y = (1 - percent) * this.height;
             const label = this.freqType(freq);
             const units = this.unitType(freq);
             const x = 16;

From af4317050d0dc1112b04b210f8a4d0d2ac60ca13 Mon Sep 17 00:00:00 2001
From: agamemnus <agamemnus@users.noreply.github.com>
Date: Wed, 31 May 2017 12:20:32 -0400
Subject: [PATCH 05/16] requestAnimationFrame addition to utils. (#1107)

* requestAnimationFrame addition to utils.

* Update util.js

* Update util.js

* Update util.js

* Update util.js

* Update util.js
---
 src/util/frame.js                   | 13 +++++++++++++
 src/util/index.js                   |  2 ++
 src/util/request-animation-frame.js | 14 ++++++++++++++
 3 files changed, 29 insertions(+)
 create mode 100644 src/util/frame.js
 create mode 100644 src/util/request-animation-frame.js

diff --git a/src/util/frame.js b/src/util/frame.js
new file mode 100644
index 000000000..8999b33ad
--- /dev/null
+++ b/src/util/frame.js
@@ -0,0 +1,13 @@
+import reqAnimationFrame from './request-animation-frame';
+
+/**
+ * Create a function which will be called at the next requestAnimationFrame
+ * cycle
+ *
+ * @param {function} func The function to call
+ *
+ * @return {func} The function wrapped within a requestAnimationFrame
+ */
+export default function frame (func) {
+    return (...args) => reqAnimationFrame(() => func(...args));
+}
diff --git a/src/util/index.js b/src/util/index.js
index 00cd265c9..4dc4a0bed 100644
--- a/src/util/index.js
+++ b/src/util/index.js
@@ -5,4 +5,6 @@ export { default as min } from './min';
 export { default as Observer } from './observer';
 export { default as extend } from './extend';
 export { default as style } from './style';
+export { default as requestAnimationFrame } from './request-animation-frame';
+export { default as frame } from './frame';
 export { default as debounce } from 'debounce';
diff --git a/src/util/request-animation-frame.js b/src/util/request-animation-frame.js
new file mode 100644
index 000000000..c696d3a8e
--- /dev/null
+++ b/src/util/request-animation-frame.js
@@ -0,0 +1,14 @@
+/**
+ * Returns the requestAnimationFrame function for the browser, or a shim with
+ * setTimeout if none is found
+ *
+ * @return {function}
+ */
+export default (
+    window.requestAnimationFrame ||
+    window.webkitRequestAnimationFrame ||
+    window.mozRequestAnimationFrame ||
+    window.oRequestAnimationFrame ||
+    window.msRequestAnimationFrame ||
+    ((callback, element) => setTimeout(callback, 1000 / 60))
+);

From e359b58ea59f5bef610bcc641e01fb608a0d31ca Mon Sep 17 00:00:00 2001
From: agamemnus <agamemnus@users.noreply.github.com>
Date: Sun, 11 Jun 2017 12:52:13 -0400
Subject: [PATCH 06/16] Wrap drawing in requestAnimationFrame (multicanvas).
 (#1106)

* Update drawer.multicanvas.js

* Update drawer.multicanvas.js

* Update drawer.multicanvas.js

* Update drawer.multicanvas.js

* I have no idea why this failed.

* Update drawer.multicanvas.js

* Update drawer.multicanvas.js

* Update drawer.multicanvas.js
---
 src/drawer.multicanvas.js | 147 ++++++++++++++++++++------------------
 1 file changed, 76 insertions(+), 71 deletions(-)

diff --git a/src/drawer.multicanvas.js b/src/drawer.multicanvas.js
index dbd3c18f4..547043786 100644
--- a/src/drawer.multicanvas.js
+++ b/src/drawer.multicanvas.js
@@ -227,48 +227,51 @@ export default class MultiCanvas extends Drawer {
      * rendered
      */
     drawBars(peaks, channelIndex, start, end) {
-        // Split channels
-        if (peaks[0] instanceof Array) {
-            const channels = peaks;
-            if (this.params.splitChannels) {
-                this.setHeight(channels.length * this.params.height * this.params.pixelRatio);
-                channels.forEach((channelPeaks, i) => this.drawBars(channelPeaks, i, start, end));
-                return;
+        util.frame((peaks, channelIndex, start, end) => {
+            // Split channels
+            if (peaks[0] instanceof Array) {
+                const channels = peaks;
+                if (this.params.splitChannels) {
+                    this.setHeight(channels.length * this.params.height * this.params.pixelRatio);
+                    channels.forEach((channelPeaks, i) => this.drawBars(channelPeaks, i, start, end));
+                    return;
+                }
+                peaks = channels[0];
             }
-            peaks = channels[0];
-        }
 
-        // Bar wave draws the bottom only as a reflection of the top,
-        // so we don't need negative values
-        const hasMinVals = [].some.call(peaks, val => val < 0);
-        // Skip every other value if there are negatives.
-        const peakIndexScale = hasMinVals ? 2 : 1;
-
-        // A half-pixel offset makes lines crisp
-        const width = this.width;
-        const height = this.params.height * this.params.pixelRatio;
-        const offsetY = height * channelIndex || 0;
-        const halfH = height / 2;
-        const length = peaks.length / peakIndexScale;
-        const bar = this.params.barWidth * this.params.pixelRatio;
-        const gap = Math.max(this.params.pixelRatio, ~~(bar / 2));
-        const step = bar + gap;
-
-        let absmax = 1;
-        if (this.params.normalize) {
-            const max = util.max(peaks);
-            const min = util.min(peaks);
-            absmax = -min > max ? -min : max;
-        }
+            // Bar wave draws the bottom only as a reflection of the top,
+            // so we don't need negative values
+            const hasMinVals = [].some.call(peaks, val => val < 0);
+            // Skip every other value if there are negatives.
+            const peakIndexScale = hasMinVals ? 2 : 1;
+
+            // A half-pixel offset makes lines crisp
+            const width = this.width;
+            const height = this.params.height * this.params.pixelRatio;
+            const offsetY = height * channelIndex || 0;
+            const halfH = height / 2;
+            const length = peaks.length / peakIndexScale;
+            const bar = this.params.barWidth * this.params.pixelRatio;
+            const gap = Math.max(this.params.pixelRatio, ~~(bar / 2));
+            const step = bar + gap;
+
+            let absmax = 1;
+            if (this.params.normalize) {
+                const max = util.max(peaks);
+                const min = util.min(peaks);
+                absmax = -min > max ? -min : max;
+            }
 
-        const scale = length / width;
-        let i;
+            const scale = length / width;
+            let i;
 
-        for (i = (start / scale); i < (end / scale); i += step) {
-            const peak = peaks[Math.floor(i * scale * peakIndexScale)] || 0;
-            const h = Math.round(peak / absmax * halfH);
-            this.fillRect(i + this.halfPixel, halfH - h + offsetY, bar + this.halfPixel, h * 2);
-        }
+            for (i = (start / scale); i < (end / scale); i += step) {
+                const peak = peaks[Math.floor(i * scale * peakIndexScale)] || 0;
+                const h = Math.round(peak / absmax * halfH);
+                this.fillRect(i + this.halfPixel, halfH - h + offsetY, bar + this.halfPixel, h * 2);
+            }
+
+        });
     }
 
     /**
@@ -284,46 +287,48 @@ export default class MultiCanvas extends Drawer {
      * rendered
      */
     drawWave(peaks, channelIndex, start, end) {
-        // Split channels
-        if (peaks[0] instanceof Array) {
-            const channels = peaks;
-            if (this.params.splitChannels) {
-                this.setHeight(channels.length * this.params.height * this.params.pixelRatio);
-                channels.forEach((channelPeaks, i) => this.drawWave(channelPeaks, i, start, end));
-                return;
+        util.frame((peaks, channelIndex, start, end) => {
+            // Split channels
+            if (peaks[0] instanceof Array) {
+                const channels = peaks;
+                if (this.params.splitChannels) {
+                    this.setHeight(channels.length * this.params.height * this.params.pixelRatio);
+                    channels.forEach((channelPeaks, i) => this.drawWave(channelPeaks, i, start, end));
+                    return;
+                }
+                peaks = channels[0];
             }
-            peaks = channels[0];
-        }
 
-        // Support arrays without negative peaks
-        const hasMinValues = [].some.call(peaks, val => val < 0);
-        if (!hasMinValues) {
-            const reflectedPeaks = [];
-            const len = peaks.length;
-            let i;
-            for (i = 0; i < len; i++) {
-                reflectedPeaks[2 * i] = peaks[i];
-                reflectedPeaks[2 * i + 1] = -peaks[i];
+            // Support arrays without negative peaks
+            const hasMinValues = [].some.call(peaks, val => val < 0);
+            if (!hasMinValues) {
+                const reflectedPeaks = [];
+                const len = peaks.length;
+                let i;
+                for (i = 0; i < len; i++) {
+                    reflectedPeaks[2 * i] = peaks[i];
+                    reflectedPeaks[2 * i + 1] = -peaks[i];
+                }
+                peaks = reflectedPeaks;
             }
-            peaks = reflectedPeaks;
-        }
 
-        // A half-pixel offset makes lines crisp
-        const height = this.params.height * this.params.pixelRatio;
-        const offsetY = height * channelIndex || 0;
-        const halfH = height / 2;
+            // A half-pixel offset makes lines crisp
+            const height = this.params.height * this.params.pixelRatio;
+            const offsetY = height * channelIndex || 0;
+            const halfH = height / 2;
 
-        let absmax = 1;
-        if (this.params.normalize) {
-            const max = util.max(peaks);
-            const min = util.min(peaks);
-            absmax = -min > max ? -min : max;
-        }
+            let absmax = 1;
+            if (this.params.normalize) {
+                const max = util.max(peaks);
+                const min = util.min(peaks);
+                absmax = -min > max ? -min : max;
+            }
 
-        this.drawLine(peaks, absmax, halfH, offsetY, start, end);
+            this.drawLine(peaks, absmax, halfH, offsetY, start, end);
 
-        // Always draw a median line
-        this.fillRect(0, halfH + offsetY - this.halfPixel, this.width, this.halfPixel);
+            // Always draw a median line
+            this.fillRect(0, halfH + offsetY - this.halfPixel, this.width, this.halfPixel);
+        });
     }
 
     /**

From 87a24bc218071a31dbed5288d11c34ad2b159f8f Mon Sep 17 00:00:00 2001
From: agamemnus <agamemnus@users.noreply.github.com>
Date: Sun, 11 Jun 2017 12:47:41 -0400
Subject: [PATCH 07/16] requestAnimationFrame should be bound on window...
 (#1120)

Apparently...

https://stackoverflow.com/questions/10743596/why-are-certain-function-calls-termed-illegal-invocations-in-javascript
---
 src/util/request-animation-frame.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/util/request-animation-frame.js b/src/util/request-animation-frame.js
index c696d3a8e..33a2feae0 100644
--- a/src/util/request-animation-frame.js
+++ b/src/util/request-animation-frame.js
@@ -11,4 +11,4 @@ export default (
     window.oRequestAnimationFrame ||
     window.msRequestAnimationFrame ||
     ((callback, element) => setTimeout(callback, 1000 / 60))
-);
+).bind(window);

From db07de0e1030b13b888747191873b0b0d8e8b5f1 Mon Sep 17 00:00:00 2001
From: agamemnus <agamemnus@users.noreply.github.com>
Date: Sun, 11 Jun 2017 10:23:14 -0400
Subject: [PATCH 08/16] Add pointerEvents: none to left/right sides. (#1112)

* Remove pointer events from the left and right sides of the wave and change `zIndex` to 2.

The reasoning behind this is to allow, for example, the region plugin to have a styling such that the regions are below the waves (so that the waves look clearer and not blended with the regions), while still allowing resize events on the regions. Otherwise, the left/right sections of the wave block the resize elements of the regions, since their `zIndex` needs to be necessarily higher to be drawn over the regions.
---
 src/drawer.multicanvas.js | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/drawer.multicanvas.js b/src/drawer.multicanvas.js
index 547043786..11c7c1ca6 100644
--- a/src/drawer.multicanvas.js
+++ b/src/drawer.multicanvas.js
@@ -82,7 +82,8 @@ export default class MultiCanvas extends Drawer {
                 boxSizing: 'border-box',
                 borderRightStyle: 'solid',
                 borderRightWidth: this.params.cursorWidth + 'px',
-                borderRightColor: this.params.cursorColor
+                borderRightColor: this.params.cursorColor,
+                pointerEvents: 'none'
             })
         );
 
@@ -129,10 +130,12 @@ export default class MultiCanvas extends Drawer {
         entry.wave = this.wrapper.appendChild(
             this.style(document.createElement('canvas'), {
                 position: 'absolute',
-                zIndex: 1,
+                zIndex: 2,
                 left: leftOffset + 'px',
                 top: 0,
-                bottom: 0
+                bottom: 0,
+                height: '100%',
+                pointerEvents: 'none'
             })
         );
         entry.waveCtx = entry.wave.getContext('2d');
@@ -143,7 +146,8 @@ export default class MultiCanvas extends Drawer {
                     position: 'absolute',
                     left: leftOffset + 'px',
                     top: 0,
-                    bottom: 0
+                    bottom: 0,
+                    height: '100%'
                 })
             );
             entry.progressCtx = entry.progress.getContext('2d');

From 6469e10dc6c8d902f3ed41487ff74d214faaca1a Mon Sep 17 00:00:00 2001
From: Nicholas Licitra <nickerous@gmail.com>
Date: Thu, 8 Jun 2017 10:19:01 -0400
Subject: [PATCH 09/16] Listen to and relay play and pause events on media
 element (#1104)

* Listen to and relay play and pause events on media element

* Corrected the 'pause' event label

* removed play and pause emits from respective functions
---
 src/mediaelement.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/mediaelement.js b/src/mediaelement.js
index c443bc455..3846e3abb 100755
--- a/src/mediaelement.js
+++ b/src/mediaelement.js
@@ -132,6 +132,16 @@ export default class MediaElement extends WebAudio {
             this.fireEvent('finish');
         });
 
+        // Listen to and relay play and pause events to enable
+        // playback control from the external media element
+        media.addEventListener('play', () => {
+            this.fireEvent('play');
+        });
+
+        media.addEventListener('pause', () => {
+            this.fireEvent('pause');
+        });
+
         this.media = media;
         this.peaks = peaks;
         this.onPlayEnd = null;
@@ -214,7 +224,6 @@ export default class MediaElement extends WebAudio {
         this.seekTo(start);
         this.media.play();
         end && this.setPlayEnd(end);
-        this.fireEvent('play');
     }
 
     /**
@@ -225,7 +234,6 @@ export default class MediaElement extends WebAudio {
     pause() {
         this.media && this.media.pause();
         this.clearPlayEnd();
-        this.fireEvent('pause');
     }
 
     /** @private */

From 165a7088b8a98d7b9197ecc7c7cee1005eba5326 Mon Sep 17 00:00:00 2001
From: Enton Biba <entonbiba@users.noreply.github.com>
Date: Fri, 19 May 2017 12:59:43 -0400
Subject: [PATCH 10/16] fix exportPCM to return json data (#1094)

---
 src/wavesurfer.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/wavesurfer.js b/src/wavesurfer.js
index a1bf4d76d..b1d19414d 100755
--- a/src/wavesurfer.js
+++ b/src/wavesurfer.js
@@ -1130,14 +1130,16 @@ export default class WaveSurfer extends util.Observer {
      * @param {number} accuracy=10000 (Integer)
      * @param {?boolean} noWindow Set to true to disable opening a new
      * window with the JSON
+     * @param {number} start
      * @todo Update exportPCM to work with new getPeaks signature
      * @return {JSON} JSON of peaks
      */
-    exportPCM(length, accuracy, noWindow) {
+    exportPCM(length, accuracy, noWindow, start) {
         length = length || 1024;
+        start = start || 0;
         accuracy = accuracy || 10000;
         noWindow = noWindow || false;
-        const peaks = this.backend.getPeaks(length, accuracy);
+        const peaks = this.backend.getPeaks(length, start);
         const arr = [].map.call(peaks, val => Math.round(val * accuracy) / accuracy);
         const json = JSON.stringify(arr);
         if (!noWindow) {

From 912b2d3077d1bc41b88a29815f276c94a6d8e160 Mon Sep 17 00:00:00 2001
From: Raymond Radet <X-Raym@users.noreply.github.com>
Date: Sun, 14 May 2017 04:32:49 +0200
Subject: [PATCH 11/16] Round to Milliseconds (#1087)

timeline plugin: Round to milliseconds
---
 src/plugin/timeline.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/plugin/timeline.js b/src/plugin/timeline.js
index 2ffc208c9..2b2b166da 100644
--- a/src/plugin/timeline.js
+++ b/src/plugin/timeline.js
@@ -90,7 +90,7 @@ export default class TimelinePlugin {
                     seconds = (seconds < 10) ? '0' + seconds : seconds;
                     return `${minutes}:${seconds}`;
                 }
-                return seconds;
+                return Math.round(seconds * 1000) / 1000;
             },
             timeInterval(pxPerSec) {
                 if (pxPerSec >= 25) {

From 53c15b727f26081a311dc73f087d79b23d677445 Mon Sep 17 00:00:00 2001
From: Enton Biba <entonbiba@users.noreply.github.com>
Date: Thu, 4 May 2017 04:31:33 -0400
Subject: [PATCH 12/16] add getPeaks background compatibility (#1072)

* add getPeaks background compatibility

* remove space

* add space
---
 src/webaudio.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/webaudio.js b/src/webaudio.js
index 1fe3f4520..ecd35bb11 100755
--- a/src/webaudio.js
+++ b/src/webaudio.js
@@ -343,6 +343,9 @@ export default class WebAudio extends util.Observer {
     getPeaks(length, first, last) {
         if (this.peaks) { return this.peaks; }
 
+        first = first || 0;
+        last = last || length - 1;
+
         this.setLength(length);
 
         /**

From e2dcbad96b1925ede934d88fdcd628ae9d4b6e56 Mon Sep 17 00:00:00 2001
From: Enton Biba <entonbiba@users.noreply.github.com>
Date: Tue, 18 Apr 2017 09:25:45 -0400
Subject: [PATCH 13/16] add method setCurrentTime (#1046)

* add method setCurrentTime
---
 src/wavesurfer.js | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/src/wavesurfer.js b/src/wavesurfer.js
index b1d19414d..bb093a41d 100755
--- a/src/wavesurfer.js
+++ b/src/wavesurfer.js
@@ -593,6 +593,20 @@ export default class WaveSurfer extends util.Observer {
         return this.backend.getCurrentTime();
     }
 
+    /**
+     * Set the current play time in seconds.
+     *
+     * @param {Number} seconds A positive number in seconds. E.g. 10 means 10
+     * seconds, 60 means 1 minute
+     */
+    setCurrentTime(seconds) {
+        if (this.getDuration() >= seconds) {
+            this.seekTo(1);
+        } else {
+            this.seekTo(seconds/this.getDuration());
+        }
+    }
+
     /**
      * Starts playback from the current position. Optional start and end
      * measured in seconds can be used to set the range of audio to play.

From 65e4f1f8595b72f74334f5f6a6a644b0c44176d4 Mon Sep 17 00:00:00 2001
From: Blake Murdock <blakemurdock24@gmail.com>
Date: Sat, 8 Apr 2017 18:32:15 -0500
Subject: [PATCH 14/16] Switch to bsd license (#1060)

* Create LICENSE

Adding the BSD license.

* Change all references to CC license to point to the new BSD license

* Extend the license through the examples directory
---
 LICENSE                                   |   29 +
 README.md                                 |    4 +-
 bower.json                                |    2 +-
 dist/plugin/wavesurfer.cursor.min.js      |    7 -
 dist/plugin/wavesurfer.elan.min.js        |    7 -
 dist/plugin/wavesurfer.microphone.min.js  |    7 -
 dist/plugin/wavesurfer.minimap.min.js     |    7 -
 dist/plugin/wavesurfer.regions.min.js     |    7 -
 dist/plugin/wavesurfer.spectrogram.min.js |    7 -
 dist/plugin/wavesurfer.timeline.min.js    |    7 -
 dist/wavesurfer-html-init.js              |  414 --
 dist/wavesurfer-html-init.min.js          |    7 -
 dist/wavesurfer.js                        | 4451 ---------------------
 dist/wavesurfer.min.js                    |    7 -
 dist/wavesurfer.min.js.map                |    1 -
 example/angular/index.html                |    2 +-
 example/annotation/index.html             |    4 +-
 example/audio-element/index.html          |    4 +-
 example/elan-wave-segment/index.html      |  194 +
 example/elan/index.html                   |    4 +-
 example/equalizer/index.html              |    4 +-
 example/media-session/index.html          |  168 +
 example/microphone/index.html             |    4 +-
 example/mute/index.html                   |    8 +-
 example/panner/index.html                 |    4 +-
 example/playlist/index.html               |    2 +-
 example/regions/index.html                |    4 +-
 example/spectrogram/index.html            |    4 +-
 example/split-channels/index.html         |    4 +-
 example/split-wave-point-plot/index.html  |  157 +
 example/timeline/index.html               |    4 +-
 example/video-element/index.html          |    4 +-
 example/zoom/index.html                   |    4 +-
 package.json                              |    2 +-
 src/wavesurfer.js                         |    4 +
 35 files changed, 586 insertions(+), 4963 deletions(-)
 create mode 100644 LICENSE
 delete mode 100644 dist/plugin/wavesurfer.cursor.min.js
 delete mode 100644 dist/plugin/wavesurfer.elan.min.js
 delete mode 100644 dist/plugin/wavesurfer.microphone.min.js
 delete mode 100644 dist/plugin/wavesurfer.minimap.min.js
 delete mode 100644 dist/plugin/wavesurfer.regions.min.js
 delete mode 100644 dist/plugin/wavesurfer.spectrogram.min.js
 delete mode 100644 dist/plugin/wavesurfer.timeline.min.js
 delete mode 100644 dist/wavesurfer-html-init.js
 delete mode 100644 dist/wavesurfer-html-init.min.js
 delete mode 100644 dist/wavesurfer.js
 delete mode 100644 dist/wavesurfer.min.js
 delete mode 100644 dist/wavesurfer.min.js.map
 create mode 100644 example/elan-wave-segment/index.html
 create mode 100644 example/media-session/index.html
 create mode 100644 example/split-wave-point-plot/index.html

diff --git a/LICENSE b/LICENSE
new file mode 100644
index 000000000..6749f6eab
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,29 @@
+BSD 3-Clause License
+
+Copyright (c) 2012-2017, katspaugh and contributors
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+* Redistributions of source code must retain the above copyright notice, this
+  list of conditions and the following disclaimer.
+
+* Redistributions in binary form must reproduce the above copyright notice,
+  this list of conditions and the following disclaimer in the documentation
+  and/or other materials provided with the distribution.
+
+* Neither the name of the copyright holder nor the names of its
+  contributors may be used to endorse or promote products derived from
+  this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
diff --git a/README.md b/README.md
index 5308388f7..581c8f93a 100644
--- a/README.md
+++ b/README.md
@@ -187,7 +187,7 @@ thanks to
 
 ## License
 
-![cc-by](https://i.creativecommons.org/l/by/3.0/88x31.png)
+[![License](https://img.shields.io/badge/License-BSD%203--Clause-blue.svg)](https://opensource.org/licenses/BSD-3-Clause)
 
 This work is licensed under a
-[Creative Commons Attribution 3.0 Unported License](https://creativecommons.org/licenses/by/3.0/deed.en_US).
+[BSD 3-Clause License](https://opensource.org/licenses/BSD-3-Clause).
diff --git a/bower.json b/bower.json
index 07e9a4e8e..3147adec2 100644
--- a/bower.json
+++ b/bower.json
@@ -10,5 +10,5 @@
   "keywords": [
     "waveform", "audio", "music", "player"
   ],
-  "license": "CC BY 3.0"
+  "license": "BSD-3-Clause"
 }
diff --git a/dist/plugin/wavesurfer.cursor.min.js b/dist/plugin/wavesurfer.cursor.min.js
deleted file mode 100644
index 8e189c4c9..000000000
--- a/dist/plugin/wavesurfer.cursor.min.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-!function(e,r){"object"==typeof exports&&"object"==typeof module?module.exports=r():"function"==typeof define&&define.amd?define("cursor",[],r):"object"==typeof exports?exports.cursor=r():(e.WaveSurfer=e.WaveSurfer||{},e.WaveSurfer.cursor=r())}(this,function(){return function(e){function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}var t={};return r.m=e,r.c=t,r.i=function(e){return e},r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:n})},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},r.p="localhost:8080/dist/plugin/",r(r.s=0)}([function(e,r,t){"use strict";function n(e,r){if(!(e instanceof r))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(r,"__esModule",{value:!0});var o=function(){function e(e,r){for(var t=0;t<r.length;t++){var n=r[t];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(r,t,n){return t&&e(r.prototype,t),n&&e(r,n),r}}(),s=function(){function e(r,t){var o=this;n(this,e),this.wavesurfer=t,this.style=t.util.style,this._onDrawerCreated=function(){o.drawer=o.wavesurfer.drawer,o.wrapper=o.wavesurfer.drawer.wrapper,o._onMousemove=function(e){return o.updateCursorPosition(o.drawer.handleEvent(e))},o.wrapper.addEventListener("mousemove",o._onMousemove),o._onMouseenter=function(){return o.showCursor()},o.wrapper.addEventListener("mouseenter",o._onMouseenter),o._onMouseleave=function(){return o.hideCursor()},o.wrapper.addEventListener("mouseleave",o._onMouseleave),o.cursor=o.wrapper.appendChild(o.style(document.createElement("wave"),{position:"absolute",zIndex:3,left:0,top:0,bottom:0,width:"0",display:"block",borderRightStyle:"solid",borderRightWidth:"1px",borderRightColor:"black",opacity:".25",pointerEvents:"none"}))}}return o(e,null,[{key:"create",value:function(r){return{name:"cursor",deferInit:!(!r||!r.deferInit)&&r.deferInit,params:r,staticProps:{enableCursor:function(){console.warn("Deprecated enableCursor!"),this.initPlugins("cursor")}},instance:e}}}]),o(e,[{key:"init",value:function(){this.wavesurfer.drawer&&this._onDrawerCreated(),this.wavesurfer.on("drawer-created",this._onDrawerCreated)}},{key:"destroy",value:function(){this.wavesurfer.un("drawer-created",this._onDrawerCreated),this.cursor&&this.cursor.parentNode.removeChild(this.cursor),this.drawer&&(this.wrapper.removeEventListener("mousemove",this._onMousemove),this.wrapper.removeEventListener("mouseenter",this._onMouseenter),this.wrapper.removeEventListener("mouseleave",this._onMouseleave))}},{key:"updateCursorPosition",value:function(e){var r=Math.round(this.drawer.width*e)/this.drawer.params.pixelRatio-1;this.style(this.cursor,{left:r+"px"})}},{key:"showCursor",value:function(){this.style(this.cursor,{display:"block"})}},{key:"hideCursor",value:function(){this.style(this.cursor,{display:"none"})}}]),e}();r.default=s,e.exports=r.default}])});
-//# sourceMappingURL=wavesurfer.cursor.min.js.map
\ No newline at end of file
diff --git a/dist/plugin/wavesurfer.elan.min.js b/dist/plugin/wavesurfer.elan.min.js
deleted file mode 100644
index dff45fa50..000000000
--- a/dist/plugin/wavesurfer.elan.min.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("elan",[],t):"object"==typeof exports?exports.elan=t():(e.WaveSurfer=e.WaveSurfer||{},e.WaveSurfer.elan=t())}(this,function(){return function(e){function t(r){if(n[r])return n[r].exports;var a=n[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="localhost:8080/dist/plugin/",t(t.s=1)}([,function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var a=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),i=function(){function e(t,n){if(r(this,e),this.Types={ALIGNABLE_ANNOTATION:"ALIGNABLE_ANNOTATION",REF_ANNOTATION:"REF_ANNOTATION"},this.data=null,this.params=t,this.container="string"==typeof t.container?document.querySelector(t.container):t.container,!this.container)throw Error("No container for ELAN")}return a(e,null,[{key:"create",value:function(t){return{name:"elan",deferInit:!(!t||!t.deferInit)&&t.deferInit,params:t,instance:e}}}]),a(e,[{key:"init",value:function(){this.bindClick(),this.params.url&&this.load(this.params.url)}},{key:"destroy",value:function(){this.container.removeEventListener("click",this._onClick),this.container.removeChild(this.table)}},{key:"load",value:function(e){var t=this;this.loadXML(e,function(e){t.data=t.parseElan(e),t.render(),t.fireEvent("ready",t.data)})}},{key:"loadXML",value:function(e,t){var n=new XMLHttpRequest;n.open("GET",e,!0),n.responseType="document",n.send(),n.addEventListener("load",function(e){t&&t(e.target.responseXML)})}},{key:"parseElan",value:function(e){var t=this,n=Array.prototype.forEach,r=Array.prototype.map,a={media:{},timeOrder:{},tiers:[],annotations:{},alignableAnnotations:[]},i=e.querySelector("HEADER"),o="milliseconds"==i.getAttribute("TIME_UNITS"),u=i.querySelector("MEDIA_DESCRIPTOR");a.media.url=u.getAttribute("MEDIA_URL"),a.media.type=u.getAttribute("MIME_TYPE");var l=e.querySelectorAll("TIME_ORDER TIME_SLOT"),s={};return n.call(l,function(e){var t=parseFloat(e.getAttribute("TIME_VALUE"));o&&(t=Math.round(100*t)/1e5),s[e.getAttribute("TIME_SLOT_ID")]=t}),a.tiers=r.call(e.querySelectorAll("TIER"),function(e){return{id:e.getAttribute("TIER_ID"),linguisticTypeRef:e.getAttribute("LINGUISTIC_TYPE_REF"),defaultLocale:e.getAttribute("DEFAULT_LOCALE"),annotations:r.call(e.querySelectorAll("REF_ANNOTATION, ALIGNABLE_ANNOTATION"),function(e){var n={type:e.nodeName,id:e.getAttribute("ANNOTATION_ID"),ref:e.getAttribute("ANNOTATION_REF"),value:e.querySelector("ANNOTATION_VALUE").textContent.trim()};return t.Types.ALIGNABLE_ANNOTATION==n.type&&(n.start=s[e.getAttribute("TIME_SLOT_REF1")],n.end=s[e.getAttribute("TIME_SLOT_REF2")],a.alignableAnnotations.push(n)),a.annotations[n.id]=n,n})}}),a.tiers.forEach(function(e){e.annotations.forEach(function(e){null!=e.ref&&(e.reference=a.annotations[e.ref])})}),a.alignableAnnotations.sort(function(e,t){var n=e.start-t.start;return 0==n&&(n=t.end-e.end),n}),a.length=a.alignableAnnotations.length,a}},{key:"render",value:function(){var e=this,t=this.data.tiers;this.params.tiers&&(t=t.filter(function(t){return t.id in e.params.tiers}));var n={},r={};t.forEach(function(t,a){t.annotations.forEach(function(t){t.reference&&t.reference.type==e.Types.ALIGNABLE_ANNOTATION&&(t.reference.id in n||(n[t.ref]={}),n[t.ref][a]=t,r[a]=!0)})}),r=Object.keys(r).sort(),this.renderedAlignable=this.data.alignableAnnotations.filter(function(e){return n[e.id]});var a=this.table=document.createElement("table");a.className="wavesurfer-annotations";var i=document.createElement("thead"),o=document.createElement("tr");i.appendChild(o),a.appendChild(i);var u=document.createElement("th");u.textContent="Time",u.className="wavesurfer-time",o.appendChild(u),r.forEach(function(n){var r=t[n],a=document.createElement("th");a.className="wavesurfer-tier-"+r.id,a.textContent=r.id,a.style.width=e.params.tiers[r.id],o.appendChild(a)});var l=document.createElement("tbody");a.appendChild(l),this.renderedAlignable.forEach(function(e){var a=document.createElement("tr");a.id="wavesurfer-alignable-"+e.id,l.appendChild(a);var i=document.createElement("td");i.className="wavesurfer-time",i.textContent=e.start.toFixed(1)+"–"+e.end.toFixed(1),a.appendChild(i);var o=n[e.id];r.forEach(function(n){var r=t[n],i=document.createElement("td"),u=o[n];u&&(i.id="wavesurfer-annotation-"+u.id,i.dataset.ref=e.id,i.dataset.start=e.start,i.dataset.end=e.end,i.textContent=u.value),i.className="wavesurfer-tier-"+r.id,a.appendChild(i)})}),this.container.innerHTML="",this.container.appendChild(a)}},{key:"bindClick",value:function(){var e=this;this._onClick=function(t){var n=t.target.dataset.ref;if(null!=n){var r=e.data.annotations[n];r&&e.fireEvent("select",r.start,r.end)}},this.container.addEventListener("click",this._onClick)}},{key:"getRenderedAnnotation",value:function(e){var t=void 0;return this.renderedAlignable.some(function(n){return n.start<=e&&n.end>=e&&(t=n,!0)}),t}},{key:"getAnnotationNode",value:function(e){return document.getElementById("wavesurfer-alignable-"+e.id)}}]),e}();t.default=i,e.exports=t.default}])});
-//# sourceMappingURL=wavesurfer.elan.min.js.map
\ No newline at end of file
diff --git a/dist/plugin/wavesurfer.microphone.min.js b/dist/plugin/wavesurfer.microphone.min.js
deleted file mode 100644
index 27f9301ba..000000000
--- a/dist/plugin/wavesurfer.microphone.min.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("microphone",[],t):"object"==typeof exports?exports.microphone=t():(e.WaveSurfer=e.WaveSurfer||{},e.WaveSurfer.microphone=t())}(this,function(){return function(e){function t(i){if(r[i])return r[i].exports;var n=r[i]={i:i,l:!1,exports:{}};return e[i].call(n.exports,n,n.exports,t),n.l=!0,n.exports}var r={};return t.m=e,t.c=r,t.i=function(e){return e},t.d=function(e,r,i){t.o(e,r)||Object.defineProperty(e,r,{configurable:!1,enumerable:!0,get:i})},t.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(r,"a",r),r},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="localhost:8080/dist/plugin/",t(t.s=2)}({2:function(e,t,r){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n=function(){function e(e,t){for(var r=0;r<t.length;r++){var i=t[r];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,r,i){return r&&e(t.prototype,r),i&&e(t,i),t}}(),o=function(){function e(t,r){var n=this;i(this,e),this.params=t,this.wavesurfer=r,this.active=!1,this.paused=!1,this.reloadBufferFunction=function(e){return n.reloadBuffer(e)};var o=function(e,t,r){var i=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.msGetUserMedia;return i?new Promise(function(t,r){i.call(navigator,e,t,r)}):Promise.reject(new Error("getUserMedia is not implemented in this browser"))};void 0===navigator.mediaDevices&&(navigator.mediaDevices={}),void 0===navigator.mediaDevices.getUserMedia&&(navigator.mediaDevices.getUserMedia=o),this.constraints=this.params.constraints||{video:!1,audio:!0},this.bufferSize=this.params.bufferSize||4096,this.numberOfInputChannels=this.params.numberOfInputChannels||1,this.numberOfOutputChannels=this.params.numberOfOutputChannels||1,this._onBackendCreated=function(){n.micContext=n.wavesurfer.backend.getAudioContext()}}return n(e,null,[{key:"create",value:function(t){return{name:"microphone",deferInit:!(!t||!t.deferInit)&&t.deferInit,params:t,instance:e}}}]),n(e,[{key:"init",value:function(){this.wavesurfer.on("backend-created",this._onBackendCreated),this.wavesurfer.backend&&this._onBackendCreated()}},{key:"destroy",value:function(){this.paused=!0,this.wavesurfer.un("backend-created",this._onBackendCreated),this.stop()}},{key:"start",value:function(){var e=this;navigator.mediaDevices.getUserMedia(this.constraints).then(function(t){return e.gotStream(t)}).catch(function(t){return e.deviceError(t)})}},{key:"togglePlay",value:function(){this.active?(this.paused=!this.paused,this.paused?this.pause():this.play()):this.start()}},{key:"play",value:function(){this.paused=!1,this.connect()}},{key:"pause",value:function(){this.paused=!0,this.disconnect()}},{key:"stop",value:function(){this.active&&(this.stopDevice(),this.wavesurfer.empty())}},{key:"stopDevice",value:function(){if(this.active=!1,this.disconnect(),this.stream){var e=this.detectBrowser();if(("chrome"===e.browser&&e.version>=45||"firefox"===e.browser&&e.version>=44||"edge"===e.browser)&&this.stream.getTracks)return void this.stream.getTracks().forEach(function(e){return e.stop()});this.stream.stop()}}},{key:"connect",value:function(){void 0!==this.stream&&(this.mediaStreamSource=this.micContext.createMediaStreamSource(this.stream),this.levelChecker=this.micContext.createScriptProcessor(this.bufferSize,this.numberOfInputChannels,this.numberOfOutputChannels),this.mediaStreamSource.connect(this.levelChecker),this.levelChecker.connect(this.micContext.destination),this.levelChecker.onaudioprocess=this.reloadBufferFunction)}},{key:"disconnect",value:function(){void 0!==this.mediaStreamSource&&this.mediaStreamSource.disconnect(),void 0!==this.levelChecker&&(this.levelChecker.disconnect(),this.levelChecker.onaudioprocess=void 0)}},{key:"reloadBuffer",value:function(e){this.paused||(this.wavesurfer.empty(),this.wavesurfer.loadDecodedBuffer(e.inputBuffer))}},{key:"gotStream",value:function(e){this.stream=e,this.active=!0,this.play(),this.fireEvent("deviceReady",e)}},{key:"deviceError",value:function(e){this.fireEvent("deviceError",e)}},{key:"extractVersion",value:function(e,t,r){var i=e.match(t);return i&&i.length>=r&&parseInt(i[r],10)}},{key:"detectBrowser",value:function(){var e={};return e.browser=null,e.version=null,e.minVersion=null,"undefined"!=typeof window&&window.navigator?navigator.mozGetUserMedia?(e.browser="firefox",e.version=this.extractVersion(navigator.userAgent,/Firefox\/([0-9]+)\./,1),e.minVersion=31,e):navigator.webkitGetUserMedia&&window.webkitRTCPeerConnection?(e.browser="chrome",e.version=this.extractVersion(navigator.userAgent,/Chrom(e|ium)\/([0-9]+)\./,2),e.minVersion=38,e):navigator.mediaDevices&&navigator.userAgent.match(/Edge\/(\d+).(\d+)$/)?(e.browser="edge",e.version=this.extractVersion(navigator.userAgent,/Edge\/(\d+).(\d+)$/,2),e.minVersion=10547,e):(e.browser="Not a supported browser.",e):(e.browser="Not a supported browser.",e)}}]),e}();t.default=o,e.exports=t.default}})});
-//# sourceMappingURL=wavesurfer.microphone.min.js.map
\ No newline at end of file
diff --git a/dist/plugin/wavesurfer.minimap.min.js b/dist/plugin/wavesurfer.minimap.min.js
deleted file mode 100644
index 3736803e9..000000000
--- a/dist/plugin/wavesurfer.minimap.min.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-!function(e,r){"object"==typeof exports&&"object"==typeof module?module.exports=r():"function"==typeof define&&define.amd?define("minimap",[],r):"object"==typeof exports?exports.minimap=r():(e.WaveSurfer=e.WaveSurfer||{},e.WaveSurfer.minimap=r())}(this,function(){return function(e){function r(t){if(i[t])return i[t].exports;var n=i[t]={i:t,l:!1,exports:{}};return e[t].call(n.exports,n,n.exports,r),n.l=!0,n.exports}var i={};return r.m=e,r.c=i,r.i=function(e){return e},r.d=function(e,i,t){r.o(e,i)||Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:t})},r.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(i,"a",i),i},r.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},r.p="localhost:8080/dist/plugin/",r(r.s=3)}({3:function(e,r,i){"use strict";function t(e,r){if(!(e instanceof r))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(r,"__esModule",{value:!0});var n=function(){function e(e,r){for(var i=0;i<r.length;i++){var t=r[i];t.enumerable=t.enumerable||!1,t.configurable=!0,"value"in t&&(t.writable=!0),Object.defineProperty(e,t.key,t)}}return function(r,i,t){return i&&e(r.prototype,i),t&&e(r,t),r}}(),o=function(){function e(r,i){var n=this;t(this,e),this.params=i.util.extend({},i.params,{showRegions:!1,showOverview:!1,overviewBorderColor:"green",overviewBorderSize:2,container:!1,height:Math.max(Math.round(i.params.height/4),20)},r,{scrollParent:!1,fillParent:!0}),r.container||(this.params.container=i.util.style(document.createElement("minimap"),{display:"block"})),this.drawer=new i.Drawer(this.params.container,this.params),this.wavesurfer=i,this.util=i.util,this.renderEvent="MediaElement"===i.params.backend?"waveform-ready":"ready",this.renderEvent="ready",this._onShouldRender=function(){document.body.contains(n.params.container)||i.container.insertBefore(n.params.container,null),n.drawer.createWrapper(),n.createElements(),n.bindWavesurferEvents(),n.bindMinimapEvents(),n.wavesurfer.regions&&n.params.showRegions&&n.regions(),n.render()},this._onAudioprocess=function(e){n.drawer.progress(n.wavesurfer.backend.getPlayedPercents())},this._onSeek=function(){return n.drawer.progress(i.backend.getPlayedPercents())},this._onScroll=function(e){n.draggingOverview||n.moveOverviewRegion(e.target.scrollLeft/n.ratio)},this._onMouseover=function(e){n.draggingOverview&&(n.draggingOverview=!1)};var o=0;this._onResize=i.util.debounce(function(){o!=n.drawer.wrapper.clientWidth&&(o=n.drawer.wrapper.clientWidth,n.render(),n.drawer.progress(n.wavesurfer.backend.getPlayedPercents()))})}return n(e,null,[{key:"create",value:function(r){return{name:"minimap",deferInit:!(!r||!r.deferInit)&&r.deferInit,params:r,staticProps:{initMinimap:function(e){console.warn("Deprecated initMinimap!"),r=e,this.initPlugins("minimap")}},instance:e}}}]),n(e,[{key:"init",value:function(){this.wavesurfer.isReady&&this._onShouldRender(),this.wavesurfer.on(this.renderEvent,this._onShouldRender)}},{key:"destroy",value:function(){window.removeEventListener("resize",this._onResize,!0),window.removeEventListener("orientationchange",this._onResize,!0),this.wavesurfer.drawer.wrapper.removeEventListener("mouseover",this._onMouseover),this.wavesurfer.un(this.renderEvent,this._onShouldRender),this.wavesurfer.un("seek",this._onSeek),this.wavesurfer.un("scroll",this._onScroll),this.wavesurfer.un("audioprocess",this._onAudioprocess),this.drawer.destroy(),this.overviewRegion=null,this.unAll()}},{key:"regions",value:function(){var e=this;this.regions={},this.wavesurfer.on("region-created",function(r){e.regions[r.id]=r,e.renderRegions()}),this.wavesurfer.on("region-updated",function(r){e.regions[r.id]=r,e.renderRegions()}),this.wavesurfer.on("region-removed",function(r){delete e.regions[r.id],e.renderRegions()})}},{key:"renderRegions",value:function(){var e=this,r=this.drawer.wrapper.querySelectorAll("region"),i=void 0;for(i=0;i<r.length;++i)this.drawer.wrapper.removeChild(r[i]);Object.keys(this.regions).forEach(function(r){var i=e.regions[r],t=e.drawer.width*((i.end-i.start)/e.wavesurfer.getDuration()),n=e.drawer.width*(i.start/e.wavesurfer.getDuration()),o=e.util.style(document.createElement("region"),{height:"inherit",backgroundColor:i.color,width:t+"px",left:n+"px",display:"block",position:"absolute"});o.classList.add(r),e.drawer.wrapper.appendChild(o)})}},{key:"createElements",value:function(){this.drawer.createElements(),this.params.showOverview&&(this.overviewRegion=this.util.style(document.createElement("overview"),{height:this.drawer.wrapper.offsetHeight-2*this.params.overviewBorderSize+"px",width:"0px",display:"block",position:"absolute",cursor:"move",border:this.params.overviewBorderSize+"px solid "+this.params.overviewBorderColor,zIndex:2,opacity:this.params.overviewOpacity}),this.drawer.wrapper.appendChild(this.overviewRegion))}},{key:"bindWavesurferEvents",value:function(){window.addEventListener("resize",this._onResize,!0),window.addEventListener("orientationchange",this._onResize,!0),this.wavesurfer.on("audioprocess",this._onAudioprocess),this.wavesurfer.on("seek",this._onSeek),this.params.showOverview&&(this.wavesurfer.on("scroll",this._onScroll),this.wavesurfer.drawer.wrapper.addEventListener("mouseover",this._onMouseover))}},{key:"bindMinimapEvents",value:function(){var e=this,r={clientX:0,clientY:0},i=0,t=!0;this.on("click",function(r,i){t?(e.progress(i),e.wavesurfer.seekAndCenter(i)):t=!0}),this.params.showOverview&&(this.overviewRegion.addEventListener("mousedown",function(t){e.draggingOverview=!0,i=t.layerX,r.clientX=t.clientX,r.clientY=t.clientY}),this.drawer.wrapper.addEventListener("mousemove",function(r){e.draggingOverview&&e.moveOverviewRegion(r.clientX-e.drawer.container.getBoundingClientRect().left-i)}),this.drawer.wrapper.addEventListener("mouseup",function(i){r.clientX-i.clientX==0&&r.clientX-i.clientX==0?(t=!0,e.draggingOverview=!1):e.draggingOverview&&(t=!1,e.draggingOverview=!1)}))}},{key:"render",value:function(){var e=this.drawer.getWidth(),r=this.wavesurfer.backend.getPeaks(e,0,e);this.drawer.drawPeaks(r,e,0,e),this.params.showOverview&&(this.ratio=this.wavesurfer.drawer.width/this.drawer.width,this.waveShowedWidth=this.wavesurfer.drawer.width/this.ratio,this.waveWidth=this.wavesurfer.drawer.width,this.overviewWidth=this.drawer.width/this.ratio,this.overviewPosition=0,this.moveOverviewRegion(this.wavesurfer.drawer.wrapper.scrollLeft/this.ratio),this.overviewRegion.style.width=this.overviewWidth-2*this.params.overviewBorderSize+"px")}},{key:"moveOverviewRegion",value:function(e){e<0?this.overviewPosition=0:e+this.overviewWidth<this.drawer.width?this.overviewPosition=e:this.overviewPosition=this.drawer.width-this.overviewWidth,this.overviewRegion.style.left=this.overviewPosition+"px",this.draggingOverview&&(this.wavesurfer.drawer.wrapper.scrollLeft=this.overviewPosition*this.ratio)}}]),e}();r.default=o,e.exports=r.default}})});
-//# sourceMappingURL=wavesurfer.minimap.min.js.map
\ No newline at end of file
diff --git a/dist/plugin/wavesurfer.regions.min.js b/dist/plugin/wavesurfer.regions.min.js
deleted file mode 100644
index 3f4761326..000000000
--- a/dist/plugin/wavesurfer.regions.min.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("regions",[],t):"object"==typeof exports?exports.regions=t():(e.WaveSurfer=e.WaveSurfer||{},e.WaveSurfer.regions=t())}(this,function(){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return e[r].call(i.exports,i,i.exports,t),i.l=!0,i.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="localhost:8080/dist/plugin/",t(t.s=4)}({4:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),s=function(){function e(t,n){var i=this;r(this,e),this.wavesurfer=n,this.wrapper=n.drawer.wrapper,this.style=n.util.style,this.id=null==t.id?n.util.getId():t.id,this.start=Number(t.start)||0,this.end=null==t.end?this.start+4/this.wrapper.scrollWidth*this.wavesurfer.getDuration():Number(t.end),this.resize=void 0===t.resize||Boolean(t.resize),this.drag=void 0===t.drag||Boolean(t.drag),this.loop=Boolean(t.loop),this.color=t.color||"rgba(0, 0, 0, 0.1)",this.data=t.data||{},this.attributes=t.attributes||{},this.maxLength=t.maxLength,this.minLength=t.minLength,this.bindInOut(),this.render(),this.wavesurfer.on("zoom",function(){return i.updateRender()}),this.wavesurfer.fireEvent("region-created",this)}return i(e,[{key:"update",value:function(e){null!=e.start&&(this.start=Number(e.start)),null!=e.end&&(this.end=Number(e.end)),null!=e.loop&&(this.loop=Boolean(e.loop)),null!=e.color&&(this.color=e.color),null!=e.data&&(this.data=e.data),null!=e.resize&&(this.resize=Boolean(e.resize)),null!=e.drag&&(this.drag=Boolean(e.drag)),null!=e.maxLength&&(this.maxLength=Number(e.maxLength)),null!=e.minLength&&(this.minLength=Number(e.minLength)),null!=e.attributes&&(this.attributes=e.attributes),this.updateRender(),this.fireEvent("update"),this.wavesurfer.fireEvent("region-updated",this)}},{key:"remove",value:function(){var e=this;this.element&&(this.wrapper.removeChild(this.element),this.element=null,this.fireEvent("remove"),this.wavesurfer.un("zoom",function(t){return e.updateRender(t)}),this.wavesurfer.fireEvent("region-removed",this))}},{key:"play",value:function(){this.wavesurfer.play(this.start,this.end),this.fireEvent("play"),this.wavesurfer.fireEvent("region-play",this)}},{key:"playLoop",value:function(){var e=this;this.play(),this.once("out",function(){return e.playLoop()})}},{key:"render",value:function(){var e=document.createElement("region");e.className="wavesurfer-region",e.title=this.formatTime(this.start,this.end),e.setAttribute("data-id",this.id);for(var t in this.attributes)e.setAttribute("data-region-"+t,this.attributes[t]);this.wrapper.scrollWidth;if(this.style(e,{position:"absolute",zIndex:2,height:"100%",top:"0px"}),this.resize){var n=e.appendChild(document.createElement("handle")),r=e.appendChild(document.createElement("handle"));n.className="wavesurfer-handle wavesurfer-handle-start",r.className="wavesurfer-handle wavesurfer-handle-end";var i={cursor:"col-resize",position:"absolute",left:"0px",top:"0px",width:"1%",maxWidth:"4px",height:"100%"};this.style(n,i),this.style(r,i),this.style(r,{left:"100%"})}this.element=this.wrapper.appendChild(e),this.updateRender(),this.bindEvents(e)}},{key:"formatTime",value:function(e,t){return(e==t?[e]:[e,t]).map(function(e){return[Math.floor(e%3600/60),("00"+Math.floor(e%60)).slice(-2)].join(":")}).join("-")}},{key:"updateRender",value:function(e){var t=this.wavesurfer.getDuration(),n=void 0;if(n=e?Math.round(this.wavesurfer.getDuration()*e):this.wrapper.scrollWidth,this.start<0&&(this.start=0,this.end=this.end-this.start),this.end>t&&(this.end=t,this.start=t-(this.end-this.start)),null!=this.minLength&&(this.end=Math.max(this.start+this.minLength,this.end)),null!=this.maxLength&&(this.end=Math.min(this.start+this.maxLength,this.end)),null!=this.element){var r=Math.round(this.start/t*n),i=Math.round(this.end/t*n)-r;this.style(this.element,{left:r+"px",width:i+"px",backgroundColor:this.color,cursor:this.drag?"move":"default"});for(var s in this.attributes)this.element.setAttribute("data-region-"+s,this.attributes[s]);this.element.title=this.formatTime(this.start,this.end)}}},{key:"bindInOut",value:function(){var e=this;this.firedIn=!1,this.firedOut=!1;var t=function(t){!e.firedOut&&e.firedIn&&(e.start>=Math.round(100*t)/100||e.end<=Math.round(100*t)/100)&&(e.firedOut=!0,e.firedIn=!1,e.fireEvent("out"),e.wavesurfer.fireEvent("region-out",e)),!e.firedIn&&e.start<=t&&e.end>t&&(e.firedIn=!0,e.firedOut=!1,e.fireEvent("in"),e.wavesurfer.fireEvent("region-in",e))};this.wavesurfer.backend.on("audioprocess",t),this.on("remove",function(){e.wavesurfer.backend.un("audioprocess",t)}),this.on("out",function(){e.loop&&e.wavesurfer.play(e.start)})}},{key:"bindEvents",value:function(){var e=this;this.element.addEventListener("mouseenter",function(t){e.fireEvent("mouseenter",t),e.wavesurfer.fireEvent("region-mouseenter",e,t)}),this.element.addEventListener("mouseleave",function(t){e.fireEvent("mouseleave",t),e.wavesurfer.fireEvent("region-mouseleave",e,t)}),this.element.addEventListener("click",function(t){t.preventDefault(),e.fireEvent("click",t),e.wavesurfer.fireEvent("region-click",e,t)}),this.element.addEventListener("dblclick",function(t){t.stopPropagation(),t.preventDefault(),e.fireEvent("dblclick",t),e.wavesurfer.fireEvent("region-dblclick",e,t)}),(this.drag||this.resize)&&function(){var t=e.wavesurfer.getDuration(),n=void 0,r=void 0,i=void 0,s=void 0,a=function(a){a.touches&&a.touches.length>1||(r=a.targetTouches?a.targetTouches[0].identifier:null,a.stopPropagation(),n=e.wavesurfer.drawer.handleEvent(a,!0)*t,"handle"==a.target.tagName.toLowerCase()?s=a.target.classList.contains("wavesurfer-handle-start")?"start":"end":(i=!0,s=!1))},o=function(t){t.touches&&t.touches.length>1||(i||s)&&(i=!1,s=!1,e.fireEvent("update-end",t),e.wavesurfer.fireEvent("region-update-end",e,t))},u=function(a){if(!(a.touches&&a.touches.length>1)&&(!a.targetTouches||a.targetTouches[0].identifier==r)&&(i||s)){var o=e.wavesurfer.drawer.handleEvent(a)*t,u=o-n;n=o,e.drag&&i&&e.onDrag(u),e.resize&&s&&e.onResize(u,s)}};e.element.addEventListener("mousedown",a),e.element.addEventListener("touchstart",a),e.wrapper.addEventListener("mousemove",u),e.wrapper.addEventListener("touchmove",u),document.body.addEventListener("mouseup",o),document.body.addEventListener("touchend",o),e.on("remove",function(){document.body.removeEventListener("mouseup",o),document.body.removeEventListener("touchend",o),e.wrapper.removeEventListener("mousemove",u),e.wrapper.removeEventListener("touchmove",u)}),e.wavesurfer.on("destroy",function(){document.body.removeEventListener("mouseup",o),document.body.removeEventListener("touchend",o)})}()}},{key:"onDrag",value:function(e){var t=this.wavesurfer.getDuration();this.end+e>t||this.start+e<0||this.update({start:this.start+e,end:this.end+e})}},{key:"onResize",value:function(e,t){"start"==t?this.update({start:Math.min(this.start+e,this.end),end:Math.max(this.start+e,this.end)}):this.update({start:Math.min(this.end+e,this.start),end:Math.max(this.end+e,this.start)})}}]),e}(),a=function(){function e(t,n){var i=this;r(this,e),this.params=t,this.wavesurfer=n,this.util=n.util,Object.getOwnPropertyNames(this.util.Observer.prototype).forEach(function(e){s.prototype[e]=i.util.Observer.prototype[e]}),this.wavesurfer.Region=s,this.list={},this._onReady=function(){i.wrapper=i.wavesurfer.drawer.wrapper,i.params.regions&&i.params.regions.forEach(function(e){i.add(e)}),i.params.dragSelection&&i.enableDragSelection(i.params.dragSelection)}}return i(e,null,[{key:"create",value:function(t){return{name:"regions",deferInit:!(!t||!t.deferInit)&&t.deferInit,params:t,staticProps:{initRegions:function(){console.warn('Deprecated initRegions! Use wavesurfer.initPlugins("regions") instead!'),this.initPlugin("regions")},addRegion:function(e){this.initialisedPluginList.regions||this.initPlugin("regions"),this.regions.add(e)},clearRegions:function(){this.regions&&this.regions.clear()},enableDragSelection:function(e){this.initialisedPluginList.regions||this.initPlugin("regions"),this.regions.enableDragSelection(e)},disableDragSelection:function(){this.regions.disableDragSelection()}},instance:e}}}]),i(e,[{key:"init",value:function(){this.wavesurfer.isReady&&this._onReady(),this.wavesurfer.on("ready",this._onReady)}},{key:"destroy",value:function(){this.wavesurfer.un("ready",this._onReady),this.disableDragSelection(),this.clear()}},{key:"add",value:function(e){var t=this,n=new this.wavesurfer.Region(e,this.wavesurfer);return this.list[n.id]=n,n.on("remove",function(){delete t.list[n.id]}),n}},{key:"clear",value:function(){var e=this;Object.keys(this.list).forEach(function(t){e.list[t].remove()})}},{key:"enableDragSelection",value:function(e){var t=this,n=e.slop||2,r=void 0,i=void 0,s=void 0,a=void 0,o=0,u=function(e){e.touches&&e.touches.length>1||(a=e.targetTouches?e.targetTouches[0].identifier:null,r=!0,i=t.wavesurfer.drawer.handleEvent(e,!0),s=null)};this.wrapper.addEventListener("mousedown",u),this.wrapper.addEventListener("touchstart",u),this.on("disable-drag-selection",function(){t.wrapper.removeEventListener("touchstart",u),t.wrapper.removeEventListener("mousedown",u)});var h=function(e){e.touches&&e.touches.length>1||(r=!1,o=0,s&&(s.fireEvent("update-end",e),t.wavesurfer.fireEvent("region-update-end",s,e)),s=null)};this.wrapper.addEventListener("mouseup",h),this.wrapper.addEventListener("touchend",h),this.on("disable-drag-selection",function(){t.wrapper.removeEventListener("touchend",h),t.wrapper.removeEventListener("mouseup",h)});var d=function(u){if(r&&!(++o<=n||u.touches&&u.touches.length>1||u.targetTouches&&u.targetTouches[0].identifier!=a)){s||(s=t.add(e||{}));var h=t.wavesurfer.getDuration(),d=t.wavesurfer.drawer.handleEvent(u);s.update({start:Math.min(d*h,i*h),end:Math.max(d*h,i*h)})}};this.wrapper.addEventListener("mousemove",d),this.wrapper.addEventListener("touchmove",d),this.on("disable-drag-selection",function(){t.wrapper.removeEventListener("touchmove",d),t.wrapper.removeEventListener("mousemove",d)})}},{key:"disableDragSelection",value:function(){this.fireEvent("disable-drag-selection")}}]),e}();t.default=a,e.exports=t.default}})});
-//# sourceMappingURL=wavesurfer.regions.min.js.map
\ No newline at end of file
diff --git a/dist/plugin/wavesurfer.spectrogram.min.js b/dist/plugin/wavesurfer.spectrogram.min.js
deleted file mode 100644
index 9c5d001a7..000000000
--- a/dist/plugin/wavesurfer.spectrogram.min.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("spectrogram",[],t):"object"==typeof exports?exports.spectrogram=t():(e.WaveSurfer=e.WaveSurfer||{},e.WaveSurfer.spectrogram=t())}(this,function(){return function(e){function t(r){if(a[r])return a[r].exports;var i=a[r]={i:r,l:!1,exports:{}};return e[r].call(i.exports,i,i.exports,t),i.l=!0,i.exports}var a={};return t.m=e,t.c=a,t.i=function(e){return e},t.d=function(e,a,r){t.o(e,a)||Object.defineProperty(e,a,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var a=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(a,"a",a),a},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="localhost:8080/dist/plugin/",t(t.s=5)}({5:function(e,t,a){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var a=0;a<t.length;a++){var r=t[a];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,a,r){return a&&e(t.prototype,a),r&&e(t,r),t}}(),n=function(e,t,a,r){switch(this.bufferSize=e,this.sampleRate=t,this.bandwidth=2/e*t/2,this.sinTable=new Float32Array(e),this.cosTable=new Float32Array(e),this.windowValues=new Float32Array(e),this.reverseTable=new Uint32Array(e),this.peakBand=0,this.peak=0,a){case"bartlett":for(var i=0;i<e;i++)this.windowValues[i]=2/(e-1)*((e-1)/2-Math.abs(i-(e-1)/2));break;case"bartlettHann":for(var i=0;i<e;i++)this.windowValues[i]=.62-.48*Math.abs(i/(e-1)-.5)-.38*Math.cos(2*Math.PI*i/(e-1));break;case"blackman":r=r||.16;for(var i=0;i<e;i++)this.windowValues[i]=(1-r)/2-.5*Math.cos(2*Math.PI*i/(e-1))+r/2*Math.cos(4*Math.PI*i/(e-1));break;case"cosine":for(var i=0;i<e;i++)this.windowValues[i]=Math.cos(Math.PI*i/(e-1)-Math.PI/2);break;case"gauss":r=r||.25;for(var i=0;i<e;i++)this.windowValues[i]=Math.pow(Math.E,-.5*Math.pow((i-(e-1)/2)/(r*(e-1)/2),2));break;case"hamming":for(var i=0;i<e;i++)this.windowValues[i]=.54-.46*Math.cos(2*Math.PI*i/(e-1));break;case"hann":case void 0:for(var i=0;i<e;i++)this.windowValues[i]=.5*(1-Math.cos(2*Math.PI*i/(e-1)));break;case"lanczoz":for(var i=0;i<e;i++)this.windowValues[i]=Math.sin(Math.PI*(2*i/(e-1)-1))/(Math.PI*(2*i/(e-1)-1));break;case"rectangular":for(var i=0;i<e;i++)this.windowValues[i]=1;break;case"triangular":for(var i=0;i<e;i++)this.windowValues[i]=2/e*(e/2-Math.abs(i-(e-1)/2));break;default:throw Error("No such window function '"+a+"'")}for(var i,n=1,s=e>>1;n<e;){for(i=0;i<n;i++)this.reverseTable[i+n]=this.reverseTable[i]+s;n<<=1,s>>=1}for(i=0;i<e;i++)this.sinTable[i]=Math.sin(-Math.PI/i),this.cosTable[i]=Math.cos(-Math.PI/i);this.calculateSpectrum=function(e){var t,a,r,i=this.bufferSize,n=this.cosTable,s=this.sinTable,o=this.reverseTable,l=new Float32Array(i),h=new Float32Array(i),f=2/this.bufferSize,u=Math.sqrt,c=new Float32Array(i/2),p=Math.floor(Math.log(i)/Math.LN2);if(Math.pow(2,p)!==i)throw"Invalid buffer size, must be a power of 2.";if(i!==e.length)throw"Supplied buffer is not the same size as defined FFT. FFT Size: "+i+" Buffer Size: "+e.length;for(var d,v,w,b,m,y,g,M,x=1,S=0;S<i;S++)l[S]=e[o[S]]*this.windowValues[o[S]],h[S]=0;for(;x<i;){d=n[x],v=s[x],w=1,b=0;for(var k=0;k<x;k++){for(var S=k;S<i;)m=S+x,y=w*l[m]-b*h[m],g=w*h[m]+b*l[m],l[m]=l[S]-y,h[m]=h[S]-g,l[S]+=y,h[S]+=g,S+=x<<1;M=w,w=M*d-b*v,b=M*v+b*d}x<<=1}for(var S=0,T=i/2;S<T;S++)t=l[S],a=h[S],r=f*u(t*t+a*a),r>this.peak&&(this.peakBand=S,this.peak=r),c[S]=r;return c}},s=function(){function e(t,a){var i=this;r(this,e),this.params=t,this.wavesurfer=a,this.util=a.util,this.frequenciesDataUrl=t.frequenciesDataUrl,this._onScroll=function(e){i.updateScroll(e)},this._onReady=function(){var e=i.drawer=a.drawer;if(i.container="string"==typeof t.container?document.querySelector(t.container):t.container,!i.container)throw Error("No container for WaveSurfer spectrogram");i.width=e.width,i.pixelRatio=i.params.pixelRatio||a.params.pixelRatio,i.fftSamples=i.params.fftSamples||a.params.fftSamples||512,i.height=i.fftSamples/2,i.noverlap=t.noverlap,i.windowFunc=t.windowFunc,i.alpha=t.alpha,i.createWrapper(),i.createCanvas(),i.render(),e.wrapper.addEventListener("scroll",i._onScroll),a.on("redraw",function(){return i.render()})}}return i(e,null,[{key:"create",value:function(t){return{name:"spectrogram",deferInit:!(!t||!t.deferInit)&&t.deferInit,params:t,staticProps:{FFT:n},instance:e}}}]),i(e,[{key:"init",value:function(){this.wavesurfer.isReady&&this._onReady(),this.wavesurfer.on("ready",this._onReady)}},{key:"destroy",value:function(){this.unAll(),this.wavesurfer.un("ready",this._onReady),this.drawer.wrapper.removeEventListener("scroll",this._onScroll),this.wavesurfer=null,this.util=null,this.params=null,this.wrapper&&(this.wrapper.parentNode.removeChild(this.wrapper),this.wrapper=null)}},{key:"createWrapper",value:function(){var e=this,t=this.container.querySelector("spectrogram");t&&this.container.removeChild(t);var a=this.wavesurfer.params;if(this.wrapper=document.createElement("spectrogram"),this.params.labels){var r=this.labelsEl=document.createElement("canvas");r.classList.add("spec-labels"),this.drawer.style(r,{left:0,position:"absolute",zIndex:9,height:this.height/this.pixelRatio+"px",width:55/this.pixelRatio+"px"}),this.wrapper.appendChild(r),this.loadLabels("rgba(68,68,68,0.5)","12px","10px","","#fff","#f7f7f7","center","#specLabels")}this.drawer.style(this.wrapper,{display:"block",position:"relative",userSelect:"none",webkitUserSelect:"none",height:this.height+"px"}),(a.fillParent||a.scrollParent)&&this.drawer.style(this.wrapper,{width:"100%",overflowX:"hidden",overflowY:"hidden"}),this.container.appendChild(this.wrapper),this.wrapper.addEventListener("click",function(t){t.preventDefault();var a="offsetX"in t?t.offsetX:t.layerX;e.fireEvent("click",a/e.scrollWidth||0)})}},{key:"createCanvas",value:function(){var e=this.canvas=this.wrapper.appendChild(document.createElement("canvas"));this.spectrCc=e.getContext("2d"),this.util.style(e,{position:"absolute",zIndex:4})}},{key:"render",value:function(){this.updateCanvasStyle(),this.frequenciesDataUrl?this.loadFrequenciesData(this.frequenciesDataUrl):this.getFrequencies(this.drawSpectrogram)}},{key:"updateCanvasStyle",value:function(){var e=Math.round(this.width/this.pixelRatio)+"px";this.canvas.width=this.width,this.canvas.height=this.height,this.canvas.style.width=e}},{key:"drawSpectrogram",value:function(e,t){var a=(t.spectrCc,t.wavesurfer.backend.getDuration(),t.height),r=t.resample(e),i=t.buffer?2/t.buffer.numberOfChannels:1,n=void 0,s=void 0;for(n=0;n<r.length;n++)for(s=0;s<r[n].length;s++){var o=255-r[n][s];t.spectrCc.fillStyle="rgb("+o+", "+o+", "+o+")",t.spectrCc.fillRect(n,a-s*i,1,i)}}},{key:"getFrequencies",value:function(e){var t=this.fftSamples,a=this.buffer=this.wavesurfer.backend.buffer,r=a.getChannelData(0),i=a.length,s=a.sampleRate,o=[];if(!a)return void this.fireEvent("error","Web Audio buffer is not available");var l=this.noverlap;if(!l){var h=a.length/this.canvas.width;l=Math.max(0,Math.round(t-h))}for(var f=new n(t,s,this.windowFunc,this.alpha),u=(Math.floor(i/(t-l)),0);u+t<r.length;){var c=r.slice(u,u+t),p=f.calculateSpectrum(c),d=new Uint8Array(t/2),v=void 0;for(v=0;v<t/2;v++)d[v]=Math.max(-255,45*Math.log10(p[v]));o.push(d),u+=t-l}e(o,this)}},{key:"loadFrequenciesData",value:function(e){var t=this,a=this.util.ajax({url:e});return a.on("success",function(e){return t.drawSpectrogram(JSON.parse(e),t)}),a.on("error",function(e){return t.fireEvent("error","XHR error: "+e.target.statusText)}),a}},{key:"freqType",value:function(e){return e>=1e3?(e/1e3).toFixed(1):Math.round(e)}},{key:"unitType",value:function(e){return e>=1e3?"KHz":"Hz"}},{key:"loadLabels",value:function(e,t,a,r,i,n,s,o){var l=this.height;e=e||"rgba(68,68,68,0)",t=t||"12px",a=a||"10px",r=r||"Helvetica",i=i||"#fff",n=n||"#fff",s=s||"center",o=o||"#specLabels";var h=l||512,f=h/256*5,u=(this.wavesurfer.backend.ac.sampleRate/2-0)/f,c=this.labelsEl.getContext("2d");this.labelsEl.height=this.height,this.labelsEl.width=55,c.fillStyle=e,c.fillRect(0,0,55,h),c.fill();var p=void 0;for(p=0;p<=f;p++){c.textAlign=s,c.textBaseline="middle";var d=0+u*p,v=Math.round(d/(this.sampleRate/2)*this.fftSamples),w=v/this.fftSamples/2,b=(this.height,this.freqType(d)),m=this.unitType(d);0==p?(c.fillStyle=n,c.font=a+" "+r,c.fillText(m,40,h+p-10),c.fillStyle=i,c.font=t+" "+r,c.fillText(b,16,h+p-10)):(c.fillStyle=n,c.font=a+" "+r,c.fillText(m,40,h-50*p+2),c.fillStyle=i,c.font=t+" "+r,c.fillText(b,16,h-50*p+2))}}},{key:"updateScroll",value:function(e){this.wrapper.scrollLeft=e.target.scrollLeft}},{key:"resample",value:function(e){var t=this.width,a=[],r=1/e.length,i=1/t,n=void 0;for(n=0;n<t;n++){var s=new Array(e[0].length),o=void 0;for(o=0;o<e.length;o++){var l=o*r,h=l+r,f=n*i,u=f+i,c=h<=f||u<=l?0:Math.min(Math.max(h,f),Math.max(u,l))-Math.max(Math.min(h,f),Math.min(u,l)),p=void 0;if(c>0)for(p=0;p<e[0].length;p++)null==s[p]&&(s[p]=0),s[p]+=c/i*e[o][p]}var d=new Uint8Array(e[0].length),v=void 0;for(v=0;v<e[0].length;v++)d[v]=s[v];a.push(d)}return a}}]),e}();t.default=s,e.exports=t.default}})});
-//# sourceMappingURL=wavesurfer.spectrogram.min.js.map
\ No newline at end of file
diff --git a/dist/plugin/wavesurfer.timeline.min.js b/dist/plugin/wavesurfer.timeline.min.js
deleted file mode 100644
index 9ccf15a39..000000000
--- a/dist/plugin/wavesurfer.timeline.min.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("timeline",[],t):"object"==typeof exports?exports.timeline=t():(e.WaveSurfer=e.WaveSurfer||{},e.WaveSurfer.timeline=t())}(this,function(){return function(e){function t(a){if(r[a])return r[a].exports;var i=r[a]={i:a,l:!1,exports:{}};return e[a].call(i.exports,i,i.exports,t),i.l=!0,i.exports}var r={};return t.m=e,t.c=r,t.i=function(e){return e},t.d=function(e,r,a){t.o(e,r)||Object.defineProperty(e,r,{configurable:!1,enumerable:!0,get:a})},t.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(r,"a",r),r},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="localhost:8080/dist/plugin/",t(t.s=6)}({6:function(e,t,r){"use strict";function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var r=0;r<t.length;r++){var a=t[r];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,r,a){return r&&e(t.prototype,r),a&&e(t,a),t}}(),n=function(){function e(t,r){var i=this;if(a(this,e),this.container="string"==typeof t.container?document.querySelector(t.container):t.container,!this.container)throw new Error("No container for wavesurfer timeline");this.wavesurfer=r,this.util=r.util,this.params=this.util.extend({},{height:20,notchPercentHeight:90,primaryColor:"#000",secondaryColor:"#c0c0c0",primaryFontColor:"#000",secondaryFontColor:"#000",fontFamily:"Arial",fontSize:10,formatTimeCallback:function(e){if(e/60>1){var t=parseInt(e/60,10);return e=parseInt(e%60,10),e=e<10?"0"+e:e,t+":"+e}return e},timeInterval:function(e){return e>=25?1:5*e>=25?5:15*e>=25?15:60},primaryLabelInterval:function(e){return e>=25?10:5*e>=25?6:4},secondaryLabelInterval:function(e){return e>=25?5:2}},t),this.canvases=[],this._onScroll=function(){i.wrapper.scrollLeft=i.drawer.wrapper.scrollLeft},this._onRedraw=function(){return i.render()},this._onReady=function(){i.drawer=r.drawer,i.pixelRatio=r.drawer.params.pixelRatio,i.maxCanvasWidth=r.drawer.maxCanvasWidth||r.drawer.width,i.maxCanvasElementWidth=r.drawer.maxCanvasElementWidth||Math.round(i.maxCanvasWidth/i.pixelRatio),i.createWrapper(),i.render(),r.drawer.wrapper.addEventListener("scroll",i._onScroll),r.on("redraw",i._onRedraw)}}return i(e,null,[{key:"create",value:function(t){return{name:"timeline",deferInit:!(!t||!t.deferInit)&&t.deferInit,params:t,instance:e}}}]),i(e,[{key:"init",value:function(){this.wavesurfer.on("ready",this._onReady),this.wavesurfer.isReady&&this._onReady()}},{key:"destroy",value:function(){this.unAll(),this.wavesurfer.un("redraw",this._onRedraw),this.wavesurfer.un("ready",this._onReady),this.wavesurfer.drawer.wrapper.removeEventListener("scroll",this._onScroll),this.wrapper&&this.wrapper.parentNode&&(this.wrapper.parentNode.removeChild(this.wrapper),this.wrapper=null)}},{key:"createWrapper",value:function(){var e=this,t=this.wavesurfer.params;this.wrapper=this.container.appendChild(document.createElement("timeline")),this.util.style(this.wrapper,{display:"block",position:"relative",userSelect:"none",webkitUserSelect:"none",height:this.params.height+"px"}),(t.fillParent||t.scrollParent)&&this.util.style(this.wrapper,{width:"100%",overflowX:"hidden",overflowY:"hidden"}),this._onClick=function(t){t.preventDefault();var r="offsetX"in t?t.offsetX:t.layerX;e.fireEvent("click",r/e.wrapper.scrollWidth||0)},this.wrapper.addEventListener("click",this._onClick)}},{key:"removeOldCanvases",value:function(){for(;this.canvases.length>0;){var e=this.canvases.pop();e.parentElement.removeChild(e)}}},{key:"createCanvases",value:function(){this.removeOldCanvases();var e=Math.round(this.drawer.wrapper.scrollWidth),t=Math.ceil(e/this.maxCanvasElementWidth),r=void 0;for(r=0;r<t;r++){var a=this.wrapper.appendChild(document.createElement("canvas"));this.canvases.push(a),this.util.style(a,{position:"absolute",zIndex:4})}}},{key:"render",value:function(){this.createCanvases(),this.updateCanvasStyle(),this.drawTimeCanvases()}},{key:"updateCanvasStyle",value:function(){var e=this.canvases.length,t=void 0;for(t=0;t<e;t++){var r=this.canvases[t],a=this.maxCanvasElementWidth;t===e-1&&(a=this.drawer.wrapper.scrollWidth-this.maxCanvasElementWidth*(e-1)),r.width=a*this.pixelRatio,r.height=this.params.height*this.pixelRatio,this.util.style(r,{width:a+"px",height:this.params.height+"px",left:t*this.maxCanvasElementWidth+"px"})}}},{key:"drawTimeCanvases",value:function(){var e=(this.wavesurfer.backend,this.wavesurfer.params),t=this.wavesurfer.backend.getDuration(),r=parseInt(t,10)+1,a=e.fillParent&&!e.scrollParent?this.drawer.getWidth():this.drawer.wrapper.scrollWidth*e.pixelRatio,i=a/t,n=this.params.formatTimeCallback,s=function(e){return"function"==typeof e?e(i):e},o=s(this.params.timeInterval),l=s(this.params.primaryLabelInterval),h=s(this.params.secondaryLabelInterval),c=0,u=0;if(!(t<=0)){var p=this.params.height-4,f=this.params.height*(this.params.notchPercentHeight/100)-4,d=this.params.fontSize*e.pixelRatio,v=void 0;for(v=0;v<r/o;v++)v%l==0?(this.setFillStyles(this.params.primaryColor),this.fillRect(c,0,1,p),this.setFonts(d+"px "+this.params.fontFamily),this.setFillStyles(this.params.primaryFontColor),this.fillText(n(u),c+5,p)):v%h==0?(this.setFillStyles(this.params.secondaryColor),this.fillRect(c,0,1,p),this.setFonts(d+"px "+this.params.fontFamily),this.setFillStyles(this.params.secondaryFontColor),this.fillText(n(u),c+5,p)):(this.setFillStyles(this.params.secondaryColor),this.fillRect(c,0,1,f)),u+=o,c+=i*o}}},{key:"setFillStyles",value:function(e){this.canvases.forEach(function(t){t.getContext("2d").fillStyle=e})}},{key:"setFonts",value:function(e){this.canvases.forEach(function(t){t.getContext("2d").font=e})}},{key:"fillRect",value:function(e,t,r,a){var i=this;this.canvases.forEach(function(n,s){var o=s*i.maxCanvasWidth,l={x1:Math.max(e,s*i.maxCanvasWidth),y1:t,x2:Math.min(e+r,s*i.maxCanvasWidth+n.width),y2:t+a};l.x1<l.x2&&n.getContext("2d").fillRect(l.x1-o,l.y1,l.x2-l.x1,l.y2-l.y1)})}},{key:"fillText",value:function(e,t,r){var a=void 0,i=0,n=void 0;for(n in this.canvases){var s=this.canvases[n].getContext("2d"),o=s.canvas.width;if(i>t+a)break;i+o>t&&(a=s.measureText(e).width,s.fillText(e,t-i,r)),i+=o}}}]),e}();t.default=n,e.exports=t.default}})});
-//# sourceMappingURL=wavesurfer.timeline.min.js.map
\ No newline at end of file
diff --git a/dist/wavesurfer-html-init.js b/dist/wavesurfer-html-init.js
deleted file mode 100644
index 1f13c7111..000000000
--- a/dist/wavesurfer-html-init.js
+++ /dev/null
@@ -1,414 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-(function webpackUniversalModuleDefinition(root, factory) {
-	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory();
-	else if(typeof define === 'function' && define.amd)
-		define("html-init", [], factory);
-	else if(typeof exports === 'object')
-		exports["html-init"] = factory();
-	else
-		root["WaveSurfer"] = root["WaveSurfer"] || {}, root["WaveSurfer"]["html-init"] = factory();
-})(this, function() {
-return /******/ (function(modules) { // webpackBootstrap
-/******/ 	// The module cache
-/******/ 	var installedModules = {};
-/******/
-/******/ 	// The require function
-/******/ 	function __webpack_require__(moduleId) {
-/******/
-/******/ 		// Check if module is in cache
-/******/ 		if(installedModules[moduleId]) {
-/******/ 			return installedModules[moduleId].exports;
-/******/ 		}
-/******/ 		// Create a new module (and put it into the cache)
-/******/ 		var module = installedModules[moduleId] = {
-/******/ 			i: moduleId,
-/******/ 			l: false,
-/******/ 			exports: {}
-/******/ 		};
-/******/
-/******/ 		// Execute the module function
-/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-/******/
-/******/ 		// Flag the module as loaded
-/******/ 		module.l = true;
-/******/
-/******/ 		// Return the exports of the module
-/******/ 		return module.exports;
-/******/ 	}
-/******/
-/******/
-/******/ 	// expose the modules object (__webpack_modules__)
-/******/ 	__webpack_require__.m = modules;
-/******/
-/******/ 	// expose the module cache
-/******/ 	__webpack_require__.c = installedModules;
-/******/
-/******/ 	// identity function for calling harmony imports with the correct context
-/******/ 	__webpack_require__.i = function(value) { return value; };
-/******/
-/******/ 	// define getter function for harmony exports
-/******/ 	__webpack_require__.d = function(exports, name, getter) {
-/******/ 		if(!__webpack_require__.o(exports, name)) {
-/******/ 			Object.defineProperty(exports, name, {
-/******/ 				configurable: false,
-/******/ 				enumerable: true,
-/******/ 				get: getter
-/******/ 			});
-/******/ 		}
-/******/ 	};
-/******/
-/******/ 	// getDefaultExport function for compatibility with non-harmony modules
-/******/ 	__webpack_require__.n = function(module) {
-/******/ 		var getter = module && module.__esModule ?
-/******/ 			function getDefault() { return module['default']; } :
-/******/ 			function getModuleExports() { return module; };
-/******/ 		__webpack_require__.d(getter, 'a', getter);
-/******/ 		return getter;
-/******/ 	};
-/******/
-/******/ 	// Object.prototype.hasOwnProperty.call
-/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
-/******/
-/******/ 	// __webpack_public_path__
-/******/ 	__webpack_require__.p = "localhost:8080/dist/";
-/******/
-/******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 1);
-/******/ })
-/************************************************************************/
-/******/ ([
-/* 0 */
-/***/ (function(module, exports) {
-
-
-module.exports = function load (src, opts, cb) {
-  var head = document.head || document.getElementsByTagName('head')[0]
-  var script = document.createElement('script')
-
-  if (typeof opts === 'function') {
-    cb = opts
-    opts = {}
-  }
-
-  opts = opts || {}
-  cb = cb || function() {}
-
-  script.type = opts.type || 'text/javascript'
-  script.charset = opts.charset || 'utf8';
-  script.async = 'async' in opts ? !!opts.async : true
-  script.src = src
-
-  if (opts.attrs) {
-    setAttributes(script, opts.attrs)
-  }
-
-  if (opts.text) {
-    script.text = '' + opts.text
-  }
-
-  var onend = 'onload' in script ? stdOnEnd : ieOnEnd
-  onend(script, cb)
-
-  // some good legacy browsers (firefox) fail the 'in' detection above
-  // so as a fallback we always set onload
-  // old IE will ignore this and new IE will set onload
-  if (!script.onload) {
-    stdOnEnd(script, cb);
-  }
-
-  head.appendChild(script)
-}
-
-function setAttributes(script, attrs) {
-  for (var attr in attrs) {
-    script.setAttribute(attr, attrs[attr]);
-  }
-}
-
-function stdOnEnd (script, cb) {
-  script.onload = function () {
-    this.onerror = this.onload = null
-    cb(null, script)
-  }
-  script.onerror = function () {
-    // this.onload = null here is necessary
-    // because even IE9 works not like others
-    this.onerror = this.onload = null
-    cb(new Error('Failed to load ' + this.src), script)
-  }
-}
-
-function ieOnEnd (script, cb) {
-  script.onreadystatechange = function () {
-    if (this.readyState != 'complete' && this.readyState != 'loaded') return
-    this.onreadystatechange = null
-    cb(null, script) // there is no way to catch loading errors in IE8
-  }
-}
-
-
-/***/ }),
-/* 1 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _loadScript = __webpack_require__(0);
-
-var _loadScript2 = _interopRequireDefault(_loadScript);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-/**
- * @typedef {Object} InitParams
- * @property {WavesurferParams} [defaults={backend: 'MediaElement,
- * mediaControls: true}] The default wavesurfer initialisation parameters
- * @property {string|NodeList} containers='wavesurfer' Selector or NodeList of
- * elements to attach instances to
- * @property {string}
- * pluginCdnTemplate='//localhost:8080/dist/plugin/wavesurfer.[name].js' URL
- * template for the dynamic loading of plugins
- * @property {function} loadPlugin If set overwrites the default ajax function,
- * can be used to inject plugins differently.
- */
-/**
- * The HTML initialisation API is not part of the main library bundle file and
- * must be additionally included.
- *
- * The API attaches wavesurfer instances to all `<wavesurfer>` (can be
- * customised), parsing their `data-` attributes to construct an options object
- * for initialisation. Among other things it can dynamically load plugin code.
- *
- * The automatic initialisation can be prevented by setting the
- * `window.WS_StopAutoInit` flag to true. The `html-init[.min].js` file exports
- * the `Init` class, which can be called manually.
- *
- * Site-wide defaults can be added by setting `window.WS_InitOptions`.
- *
- * @example
- * <!-- with minimap and timeline plugin -->
- * <wavesurfer
- *   data-url="../media/demo.wav"
- *   data-plugins="minimap,timeline"
- *   data-minimap-height="30"
- *   data-minimap-wave-color="#ddd"
- *   data-minimap-progress-color="#999"
- *   data-timeline-font-size="13px"
- *   data-timeline-container="#timeline"
- * >
- * </wavesurfer>
- * <div id="timeline"></div>
- *
- * <!-- with regions plugin -->
- * <wavesurfer
- *   data-url="../media/demo.wav"
- *   data-plugins="regions"
- *   data-regions-regions='[{"start": 1,"end": 3,"color": "hsla(400, 100%, 30%, 0.5)"}]'
- * >
- * </wavesurfer>
- */
-var Init = function () {
-    /**
-     * Instantiate Init class and initialise elements
-     *
-     * This is done automatically if `window` is defined and
-     * `window.WS_StopAutoInit` is not set to true
-     *
-     * @param {WaveSurfer} WaveSurfer The WaveSurfer library object
-     * @param {InitParams} params initialisation options
-     */
-    function Init(WaveSurfer) {
-        var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
-        _classCallCheck(this, Init);
-
-        if (!WaveSurfer) {
-            throw new Error('WaveSurfer is not available!');
-        }
-
-        /**
-         * cache WaveSurfer
-         * @private
-         */
-        this.WaveSurfer = WaveSurfer;
-
-        /**
-         * build parameters, cache them in _params so minified builds are smaller
-         * @private
-         */
-        var _params = this.params = WaveSurfer.util.extend({}, {
-            // wavesurfer parameter defaults so by default the audio player is
-            // usable with native media element controls
-            defaults: {
-                backend: 'MediaElement',
-                mediaControls: true
-            },
-            // containers to instantiate on, can be selector string or NodeList
-            containers: 'wavesurfer',
-            // @TODO insert plugin CDN URIs
-            pluginCdnTemplate: '//localhost:8080/dist/plugin/wavesurfer.[name].js',
-            // loadPlugin function can be overriden to inject plugin definition
-            // objects, this default function uses load-script to load a plugin
-            // and pass it to a callback
-            loadPlugin: function loadPlugin(name, cb) {
-                var src = _params.pluginCdnTemplate.replace('[name]', name);
-                (0, _loadScript2.default)(src, { async: false }, function (err, plugin) {
-                    if (err) {
-                        return console.error('WaveSurfer plugin ' + name + ' not found at ' + src);
-                    }
-                    cb(window.WaveSurfer[name]);
-                });
-            }
-        }, params);
-        /**
-         * The nodes that should have instances attached to them
-         * @type {NodeList}
-         */
-        this.containers = typeof _params.containers == 'string' ? document.querySelectorAll(_params.containers) : _params.containers;
-        /** @private */
-        this.pluginCache = {};
-        /**
-         * An array of wavesurfer instances
-         * @type {Object[]}
-         */
-        this.instances = [];
-
-        this.initAllEls();
-    }
-
-    /**
-     * Initialise all container elements
-     */
-
-
-    _createClass(Init, [{
-        key: 'initAllEls',
-        value: function initAllEls() {
-            var _this = this;
-
-            // iterate over all the container elements
-            Array.prototype.forEach.call(this.containers, function (el) {
-                // load the plugins as an array of plugin names
-                var plugins = el.dataset.plugins ? el.dataset.plugins.split(',') : [];
-
-                // no plugins to be loaded, just render
-                if (!plugins.length) {
-                    return _this.initEl(el);
-                }
-                // … or: iterate over all the plugins
-                plugins.forEach(function (name, i) {
-                    // plugin is not cached already, load it
-                    if (!_this.pluginCache[name]) {
-                        _this.params.loadPlugin(name, function (lib) {
-                            _this.pluginCache[name] = lib;
-                            // plugins were all loaded, render the element
-                            if (i + 1 === plugins.length) {
-                                _this.initEl(el, plugins);
-                            }
-                        });
-                    } else if (i === plugins.length) {
-                        // plugin was cached and this plugin was the last
-                        _this.initEl(el, plugins);
-                    }
-                });
-            });
-        }
-
-        /**
-         * Initialise a single container element and add to `this.instances`
-         *
-         * @param  {HTMLElement} el The container to instantiate wavesurfer to
-         * @param  {PluginDefinition[]} plugins An Array of plugin names to initialise with
-         * @return {Object} Wavesurfer instance
-         */
-
-    }, {
-        key: 'initEl',
-        value: function initEl(el) {
-            var _this2 = this;
-
-            var plugins = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-
-            var jsonRegex = /^[[|{]/;
-            // initialise plugins with the correct options
-            var initialisedPlugins = plugins.map(function (plugin) {
-                var options = {};
-                // the regex to find this plugin attributes
-                var attrNameRegex = new RegExp('^' + plugin);
-                var attrName = void 0;
-                // iterate over all the data attributes and find ones for this
-                // plugin
-                for (attrName in el.dataset) {
-                    var regexResult = attrNameRegex.exec(attrName);
-                    if (regexResult) {
-                        var attr = el.dataset[attrName];
-                        // if the string begins with a [ or a { parse it as JSON
-                        var prop = jsonRegex.test(attr) ? JSON.parse(attr) : attr;
-                        // this removes the plugin prefix and changes the first letter
-                        // of the resulting string to lower case to follow the naming
-                        // convention of ws params
-                        var unprefixedOptionName = attrName.slice(plugin.length, plugin.length + 1).toLowerCase() + attrName.slice(plugin.length + 1);
-                        options[unprefixedOptionName] = prop;
-                    }
-                }
-                return _this2.pluginCache[plugin].create(options);
-            });
-            // build parameter object for this container
-            var params = this.WaveSurfer.util.extend({ container: el }, this.params.defaults, el.dataset, { plugins: initialisedPlugins });
-
-            // @TODO make nicer
-            el.style.display = 'block';
-
-            // initialise wavesurfer, load audio (with peaks if provided)
-            var instance = this.WaveSurfer.create(params);
-            var peaks = params.peaks ? JSON.parse(params.peaks) : undefined;
-            instance.load(params.url, peaks);
-
-            // push this instance into the instances cache
-            this.instances.push(instance);
-            return instance;
-        }
-    }]);
-
-    return Init;
-}();
-
-// if window object exists and window.WS_StopAutoInit is not true
-
-
-if ((typeof window === 'undefined' ? 'undefined' : _typeof(window)) === 'object' && !window.WS_StopAutoInit) {
-    // call init when document is ready, apply any custom default settings
-    // in window.WS_InitOptions
-    if (document.readyState === 'complete') {
-        window.WaveSurferInit = new Init(window.WaveSurfer, window.WS_InitOptions);
-    } else {
-        window.addEventListener('load', function () {
-            window.WaveSurferInit = new Init(window.WaveSurfer, window.WS_InitOptions);
-        });
-    }
-}
-
-// export init for manual usage
-exports.default = Init;
-module.exports = exports['default'];
-
-/***/ })
-/******/ ]);
-});
-//# sourceMappingURL=wavesurfer-html-init.js.map
\ No newline at end of file
diff --git a/dist/wavesurfer-html-init.min.js b/dist/wavesurfer-html-init.min.js
deleted file mode 100644
index 75e7890dc..000000000
--- a/dist/wavesurfer-html-init.min.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("html-init",[],e):"object"==typeof exports?exports["html-init"]=e():(t.WaveSurfer=t.WaveSurfer||{},t.WaveSurfer["html-init"]=e())}(this,function(){return function(t){function e(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var n={};return e.m=t,e.c=n,e.i=function(t){return t},e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:o})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="localhost:8080/dist/",e(e.s=1)}([function(t,e){function n(t,e){for(var n in e)t.setAttribute(n,e[n])}function o(t,e){t.onload=function(){this.onerror=this.onload=null,e(null,t)},t.onerror=function(){this.onerror=this.onload=null,e(new Error("Failed to load "+this.src),t)}}function r(t,e){t.onreadystatechange=function(){"complete"!=this.readyState&&"loaded"!=this.readyState||(this.onreadystatechange=null,e(null,t))}}t.exports=function(t,e,i){var a=document.head||document.getElementsByTagName("head")[0],u=document.createElement("script");"function"==typeof e&&(i=e,e={}),e=e||{},i=i||function(){},u.type=e.type||"text/javascript",u.charset=e.charset||"utf8",u.async=!("async"in e)||!!e.async,u.src=t,e.attrs&&n(u,e.attrs),e.text&&(u.text=""+e.text),("onload"in u?o:r)(u,i),u.onload||o(u,i),a.appendChild(u)}},function(t,e,n){"use strict";function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(e,"__esModule",{value:!0});var r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},i=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),a=n(0),u=function(t){return t&&t.__esModule?t:{default:t}}(a),l=function(){function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(o(this,t),!e)throw new Error("WaveSurfer is not available!");this.WaveSurfer=e;var r=this.params=e.util.extend({},{defaults:{backend:"MediaElement",mediaControls:!0},containers:"wavesurfer",pluginCdnTemplate:"//localhost:8080/dist/plugin/wavesurfer.[name].js",loadPlugin:function(t,e){var n=r.pluginCdnTemplate.replace("[name]",t);(0,u.default)(n,{async:!1},function(o,r){if(o)return console.error("WaveSurfer plugin "+t+" not found at "+n);e(window.WaveSurfer[t])})}},n);this.containers="string"==typeof r.containers?document.querySelectorAll(r.containers):r.containers,this.pluginCache={},this.instances=[],this.initAllEls()}return i(t,[{key:"initAllEls",value:function(){var t=this;Array.prototype.forEach.call(this.containers,function(e){var n=e.dataset.plugins?e.dataset.plugins.split(","):[];if(!n.length)return t.initEl(e);n.forEach(function(o,r){t.pluginCache[o]?r===n.length&&t.initEl(e,n):t.params.loadPlugin(o,function(i){t.pluginCache[o]=i,r+1===n.length&&t.initEl(e,n)})})})}},{key:"initEl",value:function(t){var e=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[],o=/^[[|{]/,r=n.map(function(n){var r={},i=new RegExp("^"+n),a=void 0;for(a in t.dataset){if(i.exec(a)){var u=t.dataset[a],l=o.test(u)?JSON.parse(u):u;r[a.slice(n.length,n.length+1).toLowerCase()+a.slice(n.length+1)]=l}}return e.pluginCache[n].create(r)}),i=this.WaveSurfer.util.extend({container:t},this.params.defaults,t.dataset,{plugins:r});t.style.display="block";var a=this.WaveSurfer.create(i),u=i.peaks?JSON.parse(i.peaks):void 0;return a.load(i.url,u),this.instances.push(a),a}}]),t}();"object"!==("undefined"==typeof window?"undefined":r(window))||window.WS_StopAutoInit||("complete"===document.readyState?window.WaveSurferInit=new l(window.WaveSurfer,window.WS_InitOptions):window.addEventListener("load",function(){window.WaveSurferInit=new l(window.WaveSurfer,window.WS_InitOptions)})),e.default=l,t.exports=e.default}])});
-//# sourceMappingURL=wavesurfer-html-init.min.js.map
\ No newline at end of file
diff --git a/dist/wavesurfer.js b/dist/wavesurfer.js
deleted file mode 100644
index 87565b712..000000000
--- a/dist/wavesurfer.js
+++ /dev/null
@@ -1,4451 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-(function webpackUniversalModuleDefinition(root, factory) {
-	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory();
-	else if(typeof define === 'function' && define.amd)
-		define("WaveSurfer", [], factory);
-	else if(typeof exports === 'object')
-		exports["WaveSurfer"] = factory();
-	else
-		root["WaveSurfer"] = factory();
-})(this, function() {
-return /******/ (function(modules) { // webpackBootstrap
-/******/ 	// The module cache
-/******/ 	var installedModules = {};
-/******/
-/******/ 	// The require function
-/******/ 	function __webpack_require__(moduleId) {
-/******/
-/******/ 		// Check if module is in cache
-/******/ 		if(installedModules[moduleId]) {
-/******/ 			return installedModules[moduleId].exports;
-/******/ 		}
-/******/ 		// Create a new module (and put it into the cache)
-/******/ 		var module = installedModules[moduleId] = {
-/******/ 			i: moduleId,
-/******/ 			l: false,
-/******/ 			exports: {}
-/******/ 		};
-/******/
-/******/ 		// Execute the module function
-/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-/******/
-/******/ 		// Flag the module as loaded
-/******/ 		module.l = true;
-/******/
-/******/ 		// Return the exports of the module
-/******/ 		return module.exports;
-/******/ 	}
-/******/
-/******/
-/******/ 	// expose the modules object (__webpack_modules__)
-/******/ 	__webpack_require__.m = modules;
-/******/
-/******/ 	// expose the module cache
-/******/ 	__webpack_require__.c = installedModules;
-/******/
-/******/ 	// identity function for calling harmony imports with the correct context
-/******/ 	__webpack_require__.i = function(value) { return value; };
-/******/
-/******/ 	// define getter function for harmony exports
-/******/ 	__webpack_require__.d = function(exports, name, getter) {
-/******/ 		if(!__webpack_require__.o(exports, name)) {
-/******/ 			Object.defineProperty(exports, name, {
-/******/ 				configurable: false,
-/******/ 				enumerable: true,
-/******/ 				get: getter
-/******/ 			});
-/******/ 		}
-/******/ 	};
-/******/
-/******/ 	// getDefaultExport function for compatibility with non-harmony modules
-/******/ 	__webpack_require__.n = function(module) {
-/******/ 		var getter = module && module.__esModule ?
-/******/ 			function getDefault() { return module['default']; } :
-/******/ 			function getModuleExports() { return module; };
-/******/ 		__webpack_require__.d(getter, 'a', getter);
-/******/ 		return getter;
-/******/ 	};
-/******/
-/******/ 	// Object.prototype.hasOwnProperty.call
-/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
-/******/
-/******/ 	// __webpack_public_path__
-/******/ 	__webpack_require__.p = "localhost:8080/dist/";
-/******/
-/******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 13);
-/******/ })
-/************************************************************************/
-/******/ ([
-/* 0 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-var _ajax = __webpack_require__(7);
-
-Object.defineProperty(exports, 'ajax', {
-  enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_ajax).default;
-  }
-});
-
-var _getId = __webpack_require__(9);
-
-Object.defineProperty(exports, 'getId', {
-  enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_getId).default;
-  }
-});
-
-var _max = __webpack_require__(10);
-
-Object.defineProperty(exports, 'max', {
-  enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_max).default;
-  }
-});
-
-var _min = __webpack_require__(11);
-
-Object.defineProperty(exports, 'min', {
-  enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_min).default;
-  }
-});
-
-var _observer = __webpack_require__(2);
-
-Object.defineProperty(exports, 'Observer', {
-  enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_observer).default;
-  }
-});
-
-var _extend = __webpack_require__(8);
-
-Object.defineProperty(exports, 'extend', {
-  enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_extend).default;
-  }
-});
-
-var _style = __webpack_require__(12);
-
-Object.defineProperty(exports, 'style', {
-  enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_style).default;
-  }
-});
-
-var _debounce = __webpack_require__(14);
-
-Object.defineProperty(exports, 'debounce', {
-  enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_debounce).default;
-  }
-});
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-/***/ }),
-/* 1 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _util = __webpack_require__(0);
-
-var util = _interopRequireWildcard(_util);
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-// using consts to prevent someone writing the string wrong
-var PLAYING = 'playing';
-var PAUSED = 'paused';
-var FINISHED = 'finished';
-
-/**
- * WebAudio backend
- *
- * @extends {Observer}
- */
-
-var WebAudio = function (_util$Observer) {
-    _inherits(WebAudio, _util$Observer);
-
-    _createClass(WebAudio, [{
-        key: 'supportsWebAudio',
-
-
-        /**
-         * Does the browser support this backend
-         *
-         * @return {boolean}
-         */
-
-        /** @private */
-
-        /** @private */
-        value: function supportsWebAudio() {
-            return !!(window.AudioContext || window.webkitAudioContext);
-        }
-
-        /**
-         * Get the audio context used by this backend or create one
-         *
-         * @return {AudioContext}
-         */
-
-        /** @private */
-
-        /** @private */
-
-    }, {
-        key: 'getAudioContext',
-        value: function getAudioContext() {
-            if (!window.WaveSurferAudioContext) {
-                window.WaveSurferAudioContext = new (window.AudioContext || window.webkitAudioContext)();
-            }
-            return window.WaveSurferAudioContext;
-        }
-
-        /**
-         * Get the offline audio context used by this backend or create one
-         *
-         * @param {number} sampleRate
-         * @return {OfflineAudioContext}
-         */
-
-    }, {
-        key: 'getOfflineAudioContext',
-        value: function getOfflineAudioContext(sampleRate) {
-            if (!window.WaveSurferOfflineAudioContext) {
-                window.WaveSurferOfflineAudioContext = new (window.OfflineAudioContext || window.webkitOfflineAudioContext)(1, 2, sampleRate);
-            }
-            return window.WaveSurferOfflineAudioContext;
-        }
-
-        /**
-         * Construct the backend
-         *
-         * @param {WavesurferParams} params
-         */
-
-    }]);
-
-    function WebAudio(params) {
-        var _this$stateBehaviors, _this$states;
-
-        _classCallCheck(this, WebAudio);
-
-        /** @private */
-        var _this = _possibleConstructorReturn(this, (WebAudio.__proto__ || Object.getPrototypeOf(WebAudio)).call(this));
-
-        _this.audioContext = null;
-        _this.offlineAudioContext = null;
-        _this.stateBehaviors = (_this$stateBehaviors = {}, _defineProperty(_this$stateBehaviors, PLAYING, {
-            init: function init() {
-                this.addOnAudioProcess();
-            },
-            getPlayedPercents: function getPlayedPercents() {
-                var duration = this.getDuration();
-                return this.getCurrentTime() / duration || 0;
-            },
-            getCurrentTime: function getCurrentTime() {
-                return this.startPosition + this.getPlayedTime();
-            }
-        }), _defineProperty(_this$stateBehaviors, PAUSED, {
-            init: function init() {
-                this.removeOnAudioProcess();
-            },
-            getPlayedPercents: function getPlayedPercents() {
-                var duration = this.getDuration();
-                return this.getCurrentTime() / duration || 0;
-            },
-            getCurrentTime: function getCurrentTime() {
-                return this.startPosition;
-            }
-        }), _defineProperty(_this$stateBehaviors, FINISHED, {
-            init: function init() {
-                this.removeOnAudioProcess();
-                this.fireEvent('finish');
-            },
-            getPlayedPercents: function getPlayedPercents() {
-                return 1;
-            },
-            getCurrentTime: function getCurrentTime() {
-                return this.getDuration();
-            }
-        }), _this$stateBehaviors);
-        _this.params = params;
-        /** @private */
-        _this.ac = params.audioContext || _this.getAudioContext();
-        /**@private */
-        _this.lastPlay = _this.ac.currentTime;
-        /** @private */
-        _this.startPosition = 0;
-        /** @private  */
-        _this.scheduledPause = null;
-        /** @private */
-        _this.states = (_this$states = {}, _defineProperty(_this$states, PLAYING, Object.create(_this.stateBehaviors[PLAYING])), _defineProperty(_this$states, PAUSED, Object.create(_this.stateBehaviors[PAUSED])), _defineProperty(_this$states, FINISHED, Object.create(_this.stateBehaviors[FINISHED])), _this$states);
-        /** @private */
-        _this.analyser = null;
-        /** @private */
-        _this.buffer = null;
-        /** @private */
-        _this.filters = [];
-        /** @private */
-        _this.gainNode = null;
-        /** @private */
-        _this.mergedPeaks = null;
-        /** @private */
-        _this.offlineAc = null;
-        /** @private */
-        _this.peaks = null;
-        /** @private */
-        _this.playbackRate = 1;
-        /** @private */
-        _this.analyser = null;
-        /** @private */
-        _this.scriptNode = null;
-        /** @private */
-        _this.source = null;
-        /** @private */
-        _this.splitPeaks = [];
-        /** @private */
-        _this.state = null;
-        return _this;
-    }
-
-    /**
-     * Initialise the backend, called in `wavesurfer.createBackend()`
-     */
-
-
-    _createClass(WebAudio, [{
-        key: 'init',
-        value: function init() {
-            this.createVolumeNode();
-            this.createScriptNode();
-            this.createAnalyserNode();
-
-            this.setState(PAUSED);
-            this.setPlaybackRate(this.params.audioRate);
-            this.setLength(0);
-        }
-
-        /** @private */
-
-    }, {
-        key: 'disconnectFilters',
-        value: function disconnectFilters() {
-            if (this.filters) {
-                this.filters.forEach(function (filter) {
-                    filter && filter.disconnect();
-                });
-                this.filters = null;
-                // Reconnect direct path
-                this.analyser.connect(this.gainNode);
-            }
-        }
-
-        /** @private */
-
-    }, {
-        key: 'setState',
-        value: function setState(state) {
-            if (this.state !== this.states[state]) {
-                this.state = this.states[state];
-                this.state.init.call(this);
-            }
-        }
-
-        /**
-         * Unpacked `setFilters()`
-         *
-         * @param {...AudioNode} filters
-         */
-
-    }, {
-        key: 'setFilter',
-        value: function setFilter() {
-            for (var _len = arguments.length, filters = Array(_len), _key = 0; _key < _len; _key++) {
-                filters[_key] = arguments[_key];
-            }
-
-            this.setFilters(filters);
-        }
-
-        /**
-         * Insert custom Web Audio nodes into the graph
-         *
-         * @param {AudioNode[]} filters Packed filters array
-         * @example
-         * const lowpass = wavesurfer.backend.ac.createBiquadFilter();
-         * wavesurfer.backend.setFilter(lowpass);
-         */
-
-    }, {
-        key: 'setFilters',
-        value: function setFilters(filters) {
-            // Remove existing filters
-            this.disconnectFilters();
-
-            // Insert filters if filter array not empty
-            if (filters && filters.length) {
-                this.filters = filters;
-
-                // Disconnect direct path before inserting filters
-                this.analyser.disconnect();
-
-                // Connect each filter in turn
-                filters.reduce(function (prev, curr) {
-                    prev.connect(curr);
-                    return curr;
-                }, this.analyser).connect(this.gainNode);
-            }
-        }
-
-        /** @private */
-
-    }, {
-        key: 'createScriptNode',
-        value: function createScriptNode() {
-            if (this.ac.createScriptProcessor) {
-                this.scriptNode = this.ac.createScriptProcessor(this.scriptBufferSize);
-            } else {
-                this.scriptNode = this.ac.createJavaScriptNode(this.scriptBufferSize);
-            }
-
-            this.scriptNode.connect(this.ac.destination);
-        }
-
-        /** @private */
-
-    }, {
-        key: 'addOnAudioProcess',
-        value: function addOnAudioProcess() {
-            var _this2 = this;
-
-            this.scriptNode.onaudioprocess = function () {
-                var time = _this2.getCurrentTime();
-
-                if (time >= _this2.getDuration()) {
-                    _this2.setState(FINISHED);
-                    _this2.fireEvent('pause');
-                } else if (time >= _this2.scheduledPause) {
-                    _this2.pause();
-                } else if (_this2.state === _this2.states[PLAYING]) {
-                    _this2.fireEvent('audioprocess', time);
-                }
-            };
-        }
-
-        /** @private */
-
-    }, {
-        key: 'removeOnAudioProcess',
-        value: function removeOnAudioProcess() {
-            this.scriptNode.onaudioprocess = null;
-        }
-
-        /** @private */
-
-    }, {
-        key: 'createAnalyserNode',
-        value: function createAnalyserNode() {
-            this.analyser = this.ac.createAnalyser();
-            this.analyser.connect(this.gainNode);
-        }
-
-        /**
-         * Create the gain node needed to control the playback volume.
-         *
-         * @private
-         */
-
-    }, {
-        key: 'createVolumeNode',
-        value: function createVolumeNode() {
-            // Create gain node using the AudioContext
-            if (this.ac.createGain) {
-                this.gainNode = this.ac.createGain();
-            } else {
-                this.gainNode = this.ac.createGainNode();
-            }
-            // Add the gain node to the graph
-            this.gainNode.connect(this.ac.destination);
-        }
-
-        /**
-         * Set the audio volume
-         *
-         * @param {number} value A floating point value between 0 and 1.
-         */
-
-    }, {
-        key: 'setVolume',
-        value: function setVolume(value) {
-            this.gainNode.gain.value = value;
-        }
-
-        /**
-         * Get the current volume
-         *
-         * @return {number} value A floating point value between 0 and 1.
-         */
-
-    }, {
-        key: 'getVolume',
-        value: function getVolume() {
-            return this.gainNode.gain.value;
-        }
-
-        /** @private */
-
-    }, {
-        key: 'decodeArrayBuffer',
-        value: function decodeArrayBuffer(arraybuffer, callback, errback) {
-            if (!this.offlineAc) {
-                this.offlineAc = this.getOfflineAudioContext(this.ac ? this.ac.sampleRate : 44100);
-            }
-            this.offlineAc.decodeAudioData(arraybuffer, function (data) {
-                return callback(data);
-            }, errback);
-        }
-
-        /**
-         * Set pre-decoded peaks
-         *
-         * @param {Array} peaks
-         */
-
-    }, {
-        key: 'setPeaks',
-        value: function setPeaks(peaks) {
-            this.peaks = peaks;
-        }
-
-        /**
-         * Set the rendered length (different from the length of the audio).
-         *
-         * @param {number} length
-         */
-
-    }, {
-        key: 'setLength',
-        value: function setLength(length) {
-            // No resize, we can preserve the cached peaks.
-            if (this.mergedPeaks && length == 2 * this.mergedPeaks.length - 1 + 2) {
-                return;
-            }
-
-            this.splitPeaks = [];
-            this.mergedPeaks = [];
-            // Set the last element of the sparse array so the peak arrays are
-            // appropriately sized for other calculations.
-            var channels = this.buffer ? this.buffer.numberOfChannels : 1;
-            var c = void 0;
-            for (c = 0; c < channels; c++) {
-                this.splitPeaks[c] = [];
-                this.splitPeaks[c][2 * (length - 1)] = 0;
-                this.splitPeaks[c][2 * (length - 1) + 1] = 0;
-            }
-            this.mergedPeaks[2 * (length - 1)] = 0;
-            this.mergedPeaks[2 * (length - 1) + 1] = 0;
-        }
-
-        /**
-         * Compute the max and min value of the waveform when broken into <length> subranges.
-         *
-         * @param {number} length How many subranges to break the waveform into.
-         * @param {number} first First sample in the required range.
-         * @param {number} last Last sample in the required range.
-         * @return {number[]|number[][]} Array of 2*<length> peaks or array of arrays of
-         * peaks consisting of (max, min) values for each subrange.
-         */
-
-    }, {
-        key: 'getPeaks',
-        value: function getPeaks(length, first, last) {
-            if (this.peaks) {
-                return this.peaks;
-            }
-
-            this.setLength(length);
-
-            var sampleSize = this.buffer.length / length;
-            var sampleStep = ~~(sampleSize / 10) || 1;
-            var channels = this.buffer.numberOfChannels;
-            var c = void 0;
-
-            for (c = 0; c < channels; c++) {
-                var peaks = this.splitPeaks[c];
-                var chan = this.buffer.getChannelData(c);
-                var i = void 0;
-
-                for (i = first; i <= last; i++) {
-                    var start = ~~(i * sampleSize);
-                    var end = ~~(start + sampleSize);
-                    var min = 0;
-                    var max = 0;
-                    var j = void 0;
-
-                    for (j = start; j < end; j += sampleStep) {
-                        var value = chan[j];
-
-                        if (value > max) {
-                            max = value;
-                        }
-
-                        if (value < min) {
-                            min = value;
-                        }
-                    }
-
-                    peaks[2 * i] = max;
-                    peaks[2 * i + 1] = min;
-
-                    if (c == 0 || max > this.mergedPeaks[2 * i]) {
-                        this.mergedPeaks[2 * i] = max;
-                    }
-
-                    if (c == 0 || min < this.mergedPeaks[2 * i + 1]) {
-                        this.mergedPeaks[2 * i + 1] = min;
-                    }
-                }
-            }
-
-            return this.params.splitChannels ? this.splitPeaks : this.mergedPeaks;
-        }
-
-        /**
-         * Get the position from 0 to 1
-         *
-         * @return {number}
-         */
-
-    }, {
-        key: 'getPlayedPercents',
-        value: function getPlayedPercents() {
-            return this.state.getPlayedPercents.call(this);
-        }
-
-        /** @private */
-
-    }, {
-        key: 'disconnectSource',
-        value: function disconnectSource() {
-            if (this.source) {
-                this.source.disconnect();
-            }
-        }
-
-        /**
-         * This is called when wavesurfer is destroyed
-         */
-
-    }, {
-        key: 'destroy',
-        value: function destroy() {
-            if (!this.isPaused()) {
-                this.pause();
-            }
-            this.unAll();
-            this.buffer = null;
-            this.disconnectFilters();
-            this.disconnectSource();
-            this.gainNode.disconnect();
-            this.scriptNode.disconnect();
-            this.analyser.disconnect();
-
-            // close the audioContext if closeAudioContext option is set to true
-            if (this.params.closeAudioContext) {
-                // check if browser supports AudioContext.close()
-                if (typeof this.ac.close === 'function') {
-                    this.ac.close();
-                }
-                // clear the reference to the audiocontext
-                this.ac = null;
-                // clear the actual audiocontext, either passed as param or the
-                // global singleton
-                if (!this.params.audioContext) {
-                    window.WaveSurferAudioContext = null;
-                } else {
-                    this.params.audioContext = null;
-                }
-                // clear the offlineAudioContext
-                window.WaveSurferOfflineAudioContext = null;
-            }
-        }
-
-        /**
-         * Loaded a decoded audio buffer
-         *
-         * @param {Object} buffer
-         */
-
-    }, {
-        key: 'load',
-        value: function load(buffer) {
-            this.startPosition = 0;
-            this.lastPlay = this.ac.currentTime;
-            this.buffer = buffer;
-            this.createSource();
-        }
-
-        /** @private */
-
-    }, {
-        key: 'createSource',
-        value: function createSource() {
-            this.disconnectSource();
-            this.source = this.ac.createBufferSource();
-
-            //adjust for old browsers.
-            this.source.start = this.source.start || this.source.noteGrainOn;
-            this.source.stop = this.source.stop || this.source.noteOff;
-
-            this.source.playbackRate.value = this.playbackRate;
-            this.source.buffer = this.buffer;
-            this.source.connect(this.analyser);
-        }
-
-        /**
-         * Used by `wavesurfer.isPlaying()` and `wavesurfer.playPause()`
-         *
-         * @return {boolean}
-         */
-
-    }, {
-        key: 'isPaused',
-        value: function isPaused() {
-            return this.state !== this.states[PLAYING];
-        }
-
-        /**
-         * Used by `wavesurfer.getDuration()`
-         *
-         * @return {number}
-         */
-
-    }, {
-        key: 'getDuration',
-        value: function getDuration() {
-            if (!this.buffer) {
-                return 0;
-            }
-            return this.buffer.duration;
-        }
-
-        /**
-         * Used by `wavesurfer.seekTo()`
-         *
-         * @param {number} start Position to start at in seconds
-         * @param {number} end Position to end at in seconds
-         * @return {{start: number, end: number}}
-         */
-
-    }, {
-        key: 'seekTo',
-        value: function seekTo(start, end) {
-            if (!this.buffer) {
-                return;
-            }
-
-            this.scheduledPause = null;
-
-            if (start == null) {
-                start = this.getCurrentTime();
-                if (start >= this.getDuration()) {
-                    start = 0;
-                }
-            }
-            if (end == null) {
-                end = this.getDuration();
-            }
-
-            this.startPosition = start;
-            this.lastPlay = this.ac.currentTime;
-
-            if (this.state === this.states[FINISHED]) {
-                this.setState(PAUSED);
-            }
-
-            return {
-                start: start,
-                end: end
-            };
-        }
-
-        /**
-         * Get the playback position in seconds
-         *
-         * @return {number}
-         */
-
-    }, {
-        key: 'getPlayedTime',
-        value: function getPlayedTime() {
-            return (this.ac.currentTime - this.lastPlay) * this.playbackRate;
-        }
-
-        /**
-         * Plays the loaded audio region.
-         *
-         * @param {number} start Start offset in seconds, relative to the beginning
-         * of a clip.
-         * @param {number} end When to stop relative to the beginning of a clip.
-         */
-
-    }, {
-        key: 'play',
-        value: function play(start, end) {
-            if (!this.buffer) {
-                return;
-            }
-
-            // need to re-create source on each playback
-            this.createSource();
-
-            var adjustedTime = this.seekTo(start, end);
-
-            start = adjustedTime.start;
-            end = adjustedTime.end;
-
-            this.scheduledPause = end;
-
-            this.source.start(0, start, end - start);
-
-            if (this.ac.state == 'suspended') {
-                this.ac.resume && this.ac.resume();
-            }
-
-            this.setState(PLAYING);
-
-            this.fireEvent('play');
-        }
-
-        /**
-         * Pauses the loaded audio.
-         */
-
-    }, {
-        key: 'pause',
-        value: function pause() {
-            this.scheduledPause = null;
-
-            this.startPosition += this.getPlayedTime();
-            this.source && this.source.stop(0);
-
-            this.setState(PAUSED);
-
-            this.fireEvent('pause');
-        }
-
-        /**
-        * Returns the current time in seconds relative to the audioclip's
-        * duration.
-        *
-        * @return {number}
-        */
-
-    }, {
-        key: 'getCurrentTime',
-        value: function getCurrentTime() {
-            return this.state.getCurrentTime.call(this);
-        }
-
-        /**
-        * Returns the current playback rate. (0=no playback, 1=normal playback)
-        *
-        * @return {number}
-        */
-
-    }, {
-        key: 'getPlaybackRate',
-        value: function getPlaybackRate() {
-            return this.playbackRate;
-        }
-
-        /**
-         * Set the audio source playback rate.
-         *
-         * @param {number} value
-         */
-
-    }, {
-        key: 'setPlaybackRate',
-        value: function setPlaybackRate(value) {
-            value = value || 1;
-            if (this.isPaused()) {
-                this.playbackRate = value;
-            } else {
-                this.pause();
-                this.playbackRate = value;
-                this.play();
-            }
-        }
-    }]);
-
-    return WebAudio;
-}(util.Observer);
-
-WebAudio.scriptBufferSize = 256;
-exports.default = WebAudio;
-module.exports = exports['default'];
-
-/***/ }),
-/* 2 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-/**
- * @typedef {Object} ListenerDescriptor
- * @property {string} name The name of the event
- * @property {function} callback The callback
- * @property {function} un The function to call to remove the listener
- */
-
-/**
- * Observer class
- */
-var Observer = function () {
-    /**
-     * Instantiate Observer
-     */
-    function Observer() {
-        _classCallCheck(this, Observer);
-
-        /**
-         * @private
-         * @todo Initialise the handlers here already and remove the conditional
-         * assignment in `on()`
-         */
-        this.handlers = null;
-    }
-    /**
-     * Attach a handler function for an event.
-     *
-     * @param {string} event Name of the event to listen to
-     * @param {function} fn The callback to trigger when the event is fired
-     * @return {ListenerDescriptor}
-     */
-
-
-    _createClass(Observer, [{
-        key: "on",
-        value: function on(event, fn) {
-            var _this = this;
-
-            if (!this.handlers) {
-                this.handlers = {};
-            }
-
-            var handlers = this.handlers[event];
-            if (!handlers) {
-                handlers = this.handlers[event] = [];
-            }
-            handlers.push(fn);
-
-            // Return an event descriptor
-            return {
-                name: event,
-                callback: fn,
-                un: function un(e, fn) {
-                    return _this.un(e, fn);
-                }
-            };
-        }
-
-        /**
-         * Remove an event handler.
-         *
-         * @param {string} event Name of the event the listener that should be
-         * removed listens to
-         * @param {function} fn The callback that should be removed
-         */
-
-    }, {
-        key: "un",
-        value: function un(event, fn) {
-            if (!this.handlers) {
-                return;
-            }
-
-            var handlers = this.handlers[event];
-            var i = void 0;
-            if (handlers) {
-                if (fn) {
-                    for (i = handlers.length - 1; i >= 0; i--) {
-                        if (handlers[i] == fn) {
-                            handlers.splice(i, 1);
-                        }
-                    }
-                } else {
-                    handlers.length = 0;
-                }
-            }
-        }
-
-        /**
-         * Remove all event handlers.
-         */
-
-    }, {
-        key: "unAll",
-        value: function unAll() {
-            this.handlers = null;
-        }
-
-        /**
-         * Attach a handler to an event. The handler is executed at most once per
-         * event type.
-         *
-         * @param {string} event The event to listen to
-         * @param {function} handler The callback that is only to be called once
-         * @return {ListenerDescriptor}
-         */
-
-    }, {
-        key: "once",
-        value: function once(event, handler) {
-            var _this2 = this;
-
-            var fn = function fn() {
-                for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
-                    args[_key] = arguments[_key];
-                }
-
-                /*  eslint-disable no-invalid-this */
-                handler.apply(_this2, args);
-                /*  eslint-enable no-invalid-this */
-                setTimeout(function () {
-                    _this2.un(event, fn);
-                }, 0);
-            };
-            return this.on(event, fn);
-        }
-
-        /**
-         * Manually fire an event
-         *
-         * @param {string} event The event to fire manually
-         * @param {...any} args The arguments with which to call the listeners
-         */
-
-    }, {
-        key: "fireEvent",
-        value: function fireEvent(event) {
-            for (var _len2 = arguments.length, args = Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
-                args[_key2 - 1] = arguments[_key2];
-            }
-
-            if (!this.handlers) {
-                return;
-            }
-            var handlers = this.handlers[event];
-            handlers && handlers.forEach(function (fn) {
-                fn.apply(undefined, args);
-            });
-        }
-    }]);
-
-    return Observer;
-}();
-
-exports.default = Observer;
-module.exports = exports["default"];
-
-/***/ }),
-/* 3 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _drawer = __webpack_require__(6);
-
-var _drawer2 = _interopRequireDefault(_drawer);
-
-var _util = __webpack_require__(0);
-
-var util = _interopRequireWildcard(_util);
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-/**
- * @typedef {Object} CanvasEntry
- * @private
- * @property {HTMLElement} wave The wave node
- * @property {CanvasRenderingContext2D} waveCtx The canvas rendering context
- * @property {?HTMLElement} progress The progress wave node
- * @property {?CanvasRenderingContext2D} progressCtx The progress wave canvas
- * rendering context
- * @property {?number} start Start of the area the canvas should render, between 0 and 1
- * @property {?number} end End of the area the canvas should render, between 0 and 1
- */
-
-/**
- * MultiCanvas renderer for wavesurfer. Is currently the default and sole built
- * in renderer.
- */
-var MultiCanvas = function (_Drawer) {
-    _inherits(MultiCanvas, _Drawer);
-
-    /**
-     * @param {HTMLElement} container The container node of the wavesurfer instance
-     * @param {WavesurferParams} params The wavesurfer initialisation options
-     */
-    function MultiCanvas(container, params) {
-        _classCallCheck(this, MultiCanvas);
-
-        /**
-         * @type {number}
-         * @private
-         */
-        var _this = _possibleConstructorReturn(this, (MultiCanvas.__proto__ || Object.getPrototypeOf(MultiCanvas)).call(this, container, params));
-
-        _this.maxCanvasWidth = params.maxCanvasWidth;
-        /**
-         * @private
-         * @type {number}
-         */
-        _this.maxCanvasElementWidth = Math.round(params.maxCanvasWidth / params.pixelRatio);
-
-        /**
-         * Whether or not the progress wave is renderered. If the `waveColor`
-         * and `progressColor` are the same colour it is not.
-         * @type {boolean}
-         */
-        _this.hasProgressCanvas = params.waveColor != params.progressColor;
-        /**
-         * @private
-         * @type {number}
-         */
-        _this.halfPixel = 0.5 / params.pixelRatio;
-        /**
-         * @private
-         * @type {Array}
-         */
-        _this.canvases = [];
-        /** @private */
-        _this.progressWave = null;
-        return _this;
-    }
-
-    /**
-     * Initialise the drawer
-     */
-
-
-    _createClass(MultiCanvas, [{
-        key: 'init',
-        value: function init() {
-            this.createWrapper();
-            this.createElements();
-        }
-
-        /**
-         * Create the canvas elements and style them
-         *
-         * @private
-         */
-
-    }, {
-        key: 'createElements',
-        value: function createElements() {
-            this.progressWave = this.wrapper.appendChild(this.style(document.createElement('wave'), {
-                position: 'absolute',
-                zIndex: 2,
-                left: 0,
-                top: 0,
-                bottom: 0,
-                overflow: 'hidden',
-                width: '0',
-                display: 'none',
-                boxSizing: 'border-box',
-                borderRightStyle: 'solid',
-                borderRightWidth: this.params.cursorWidth + 'px',
-                borderRightColor: this.params.cursorColor
-            }));
-
-            this.addCanvas();
-        }
-
-        /**
-         * Adjust to the updated size by adding or removing canvases
-         */
-
-    }, {
-        key: 'updateSize',
-        value: function updateSize() {
-            var _this2 = this;
-
-            var totalWidth = Math.round(this.width / this.params.pixelRatio);
-            var requiredCanvases = Math.ceil(totalWidth / this.maxCanvasElementWidth);
-
-            while (this.canvases.length < requiredCanvases) {
-                this.addCanvas();
-            }
-
-            while (this.canvases.length > requiredCanvases) {
-                this.removeCanvas();
-            }
-
-            this.canvases.forEach(function (entry, i) {
-                // Add some overlap to prevent vertical white stripes, keep the width even for simplicity.
-                var canvasWidth = _this2.maxCanvasWidth + 2 * Math.ceil(_this2.params.pixelRatio / 2);
-
-                if (i == _this2.canvases.length - 1) {
-                    canvasWidth = _this2.width - _this2.maxCanvasWidth * (_this2.canvases.length - 1);
-                }
-
-                _this2.updateDimensions(entry, canvasWidth, _this2.height);
-                _this2.clearWaveForEntry(entry);
-            });
-        }
-
-        /**
-         * Add a canvas to the canvas list
-         *
-         * @private
-         */
-
-    }, {
-        key: 'addCanvas',
-        value: function addCanvas() {
-            var entry = {};
-            var leftOffset = this.maxCanvasElementWidth * this.canvases.length;
-
-            entry.wave = this.wrapper.appendChild(this.style(document.createElement('canvas'), {
-                position: 'absolute',
-                zIndex: 1,
-                left: leftOffset + 'px',
-                top: 0,
-                bottom: 0
-            }));
-            entry.waveCtx = entry.wave.getContext('2d');
-
-            if (this.hasProgressCanvas) {
-                entry.progress = this.progressWave.appendChild(this.style(document.createElement('canvas'), {
-                    position: 'absolute',
-                    left: leftOffset + 'px',
-                    top: 0,
-                    bottom: 0
-                }));
-                entry.progressCtx = entry.progress.getContext('2d');
-            }
-
-            this.canvases.push(entry);
-        }
-
-        /**
-         * Pop one canvas from the list
-         *
-         * @private
-         */
-
-    }, {
-        key: 'removeCanvas',
-        value: function removeCanvas() {
-            var lastEntry = this.canvases.pop();
-            lastEntry.wave.parentElement.removeChild(lastEntry.wave);
-            if (this.hasProgressCanvas) {
-                lastEntry.progress.parentElement.removeChild(lastEntry.progress);
-            }
-        }
-
-        /**
-         * Update the dimensions of a canvas element
-         *
-         * @private
-         * @param {CanvasEntry} entry
-         * @param {number} width The new width of the element
-         * @param {number} height The new height of the element
-         */
-
-    }, {
-        key: 'updateDimensions',
-        value: function updateDimensions(entry, width, height) {
-            var elementWidth = Math.round(width / this.params.pixelRatio);
-            var totalWidth = Math.round(this.width / this.params.pixelRatio);
-
-            // Where the canvas starts and ends in the waveform, represented as a decimal between 0 and 1.
-            entry.start = entry.waveCtx.canvas.offsetLeft / totalWidth || 0;
-            entry.end = entry.start + elementWidth / totalWidth;
-
-            entry.waveCtx.canvas.width = width;
-            entry.waveCtx.canvas.height = height;
-            this.style(entry.waveCtx.canvas, { width: elementWidth + 'px' });
-
-            this.style(this.progressWave, { display: 'block' });
-
-            if (this.hasProgressCanvas) {
-                entry.progressCtx.canvas.width = width;
-                entry.progressCtx.canvas.height = height;
-                this.style(entry.progressCtx.canvas, { width: elementWidth + 'px' });
-            }
-        }
-
-        /**
-         * Clear the whole waveform
-         */
-
-    }, {
-        key: 'clearWave',
-        value: function clearWave() {
-            var _this3 = this;
-
-            this.canvases.forEach(function (entry) {
-                return _this3.clearWaveForEntry(entry);
-            });
-        }
-
-        /**
-         * Clear one canvas
-         *
-         * @private
-         * @param {CanvasEntry} entry
-         */
-
-    }, {
-        key: 'clearWaveForEntry',
-        value: function clearWaveForEntry(entry) {
-            entry.waveCtx.clearRect(0, 0, entry.waveCtx.canvas.width, entry.waveCtx.canvas.height);
-            if (this.hasProgressCanvas) {
-                entry.progressCtx.clearRect(0, 0, entry.progressCtx.canvas.width, entry.progressCtx.canvas.height);
-            }
-        }
-
-        /**
-         * Draw a waveform with bars
-         *
-         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel
-         * rendering
-         * @param {number} channelIndex The index of the current channel. Normally
-         * should be 0. Must be an integer.
-         * @param {number} start The x-offset of the beginning of the area that
-         * should be rendered
-         * @param {number} end The x-offset of the end of the area that should be
-         * rendered
-         */
-
-    }, {
-        key: 'drawBars',
-        value: function drawBars(peaks, channelIndex, start, end) {
-            var _this4 = this;
-
-            // Split channels
-            if (peaks[0] instanceof Array) {
-                var channels = peaks;
-                if (this.params.splitChannels) {
-                    this.setHeight(channels.length * this.params.height * this.params.pixelRatio);
-                    channels.forEach(function (channelPeaks, i) {
-                        return _this4.drawBars(channelPeaks, i, start, end);
-                    });
-                    return;
-                }
-                peaks = channels[0];
-            }
-
-            // Bar wave draws the bottom only as a reflection of the top,
-            // so we don't need negative values
-            var hasMinVals = [].some.call(peaks, function (val) {
-                return val < 0;
-            });
-            // Skip every other value if there are negatives.
-            var peakIndexScale = hasMinVals ? 2 : 1;
-
-            // A half-pixel offset makes lines crisp
-            var width = this.width;
-            var height = this.params.height * this.params.pixelRatio;
-            var offsetY = height * channelIndex || 0;
-            var halfH = height / 2;
-            var length = peaks.length / peakIndexScale;
-            var bar = this.params.barWidth * this.params.pixelRatio;
-            var gap = Math.max(this.params.pixelRatio, ~~(bar / 2));
-            var step = bar + gap;
-
-            var absmax = 1;
-            if (this.params.normalize) {
-                var max = util.max(peaks);
-                var min = util.min(peaks);
-                absmax = -min > max ? -min : max;
-            }
-
-            var scale = length / width;
-            var i = void 0;
-
-            for (i = start / scale; i < end / scale; i += step) {
-                var peak = peaks[Math.floor(i * scale * peakIndexScale)] || 0;
-                var h = Math.round(peak / absmax * halfH);
-                this.fillRect(i + this.halfPixel, halfH - h + offsetY, bar + this.halfPixel, h * 2);
-            }
-        }
-
-        /**
-         * Draw a waveform
-         *
-         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel
-         * rendering
-         * @param {number} channelIndex The index of the current channel. Normally
-         * should be 0
-         * @param {number} start The x-offset of the beginning of the area that
-         * should be rendered
-         * @param {number} end The x-offset of the end of the area that should be
-         * rendered
-         */
-
-    }, {
-        key: 'drawWave',
-        value: function drawWave(peaks, channelIndex, start, end) {
-            var _this5 = this;
-
-            // Split channels
-            if (peaks[0] instanceof Array) {
-                var channels = peaks;
-                if (this.params.splitChannels) {
-                    this.setHeight(channels.length * this.params.height * this.params.pixelRatio);
-                    channels.forEach(function (channelPeaks, i) {
-                        return _this5.drawWave(channelPeaks, i, start, end);
-                    });
-                    return;
-                }
-                peaks = channels[0];
-            }
-
-            // Support arrays without negative peaks
-            var hasMinValues = [].some.call(peaks, function (val) {
-                return val < 0;
-            });
-            if (!hasMinValues) {
-                var reflectedPeaks = [];
-                var len = peaks.length;
-                var i = void 0;
-                for (i = 0; i < len; i++) {
-                    reflectedPeaks[2 * i] = peaks[i];
-                    reflectedPeaks[2 * i + 1] = -peaks[i];
-                }
-                peaks = reflectedPeaks;
-            }
-
-            // A half-pixel offset makes lines crisp
-            var height = this.params.height * this.params.pixelRatio;
-            var offsetY = height * channelIndex || 0;
-            var halfH = height / 2;
-
-            var absmax = 1;
-            if (this.params.normalize) {
-                var max = util.max(peaks);
-                var min = util.min(peaks);
-                absmax = -min > max ? -min : max;
-            }
-
-            this.drawLine(peaks, absmax, halfH, offsetY, start, end);
-
-            // Always draw a median line
-            this.fillRect(0, halfH + offsetY - this.halfPixel, this.width, this.halfPixel);
-        }
-
-        /**
-         * Tell the canvas entries to render their portion of the waveform
-         *
-         * @private
-         * @param {number[]} peaks Peak data
-         * @param {number} absmax Maximum peak value (absolute)
-         * @param {number} halfH Half the height of the waveform
-         * @param {number} offsetY Offset to the top
-         * @param {number} start The x-offset of the beginning of the area that
-         * should be rendered
-         * @param {number} end The x-offset of the end of the area that
-         * should be rendered
-         */
-
-    }, {
-        key: 'drawLine',
-        value: function drawLine(peaks, absmax, halfH, offsetY, start, end) {
-            var _this6 = this;
-
-            this.canvases.forEach(function (entry) {
-                _this6.setFillStyles(entry);
-                _this6.drawLineToContext(entry, entry.waveCtx, peaks, absmax, halfH, offsetY, start, end);
-                _this6.drawLineToContext(entry, entry.progressCtx, peaks, absmax, halfH, offsetY, start, end);
-            });
-        }
-
-        /**
-         * Render the actual waveform line on a canvas
-         *
-         * @private
-         * @param {CanvasEntry} entry
-         * @param {Canvas2DContextAttributes} ctx Essentially `entry.[wave|progress]Ctx`
-         * @param {number[]} peaks
-         * @param {number} absmax Maximum peak value (absolute)
-         * @param {number} halfH Half the height of the waveform
-         * @param {number} offsetY Offset to the top
-         * @param {number} start The x-offset of the beginning of the area that
-         * should be rendered
-         * @param {number} end The x-offset of the end of the area that
-         * should be rendered
-         */
-
-    }, {
-        key: 'drawLineToContext',
-        value: function drawLineToContext(entry, ctx, peaks, absmax, halfH, offsetY, start, end) {
-            if (!ctx) {
-                return;
-            }
-
-            var length = peaks.length / 2;
-
-            var scale = 1;
-            if (this.params.fillParent && this.width != length) {
-                scale = this.width / length;
-            }
-
-            var first = Math.round(length * entry.start);
-            var last = Math.round(length * entry.end);
-            if (first > end || last < start) {
-                return;
-            }
-            var canvasStart = Math.max(first, start);
-            var canvasEnd = Math.min(last, end);
-            var i = void 0;
-            var j = void 0;
-
-            ctx.beginPath();
-            ctx.moveTo((canvasStart - first) * scale + this.halfPixel, halfH + offsetY);
-
-            for (i = canvasStart; i < canvasEnd; i++) {
-                var peak = peaks[2 * i] || 0;
-                var h = Math.round(peak / absmax * halfH);
-                ctx.lineTo((i - first) * scale + this.halfPixel, halfH - h + offsetY);
-            }
-
-            // Draw the bottom edge going backwards, to make a single
-            // closed hull to fill.
-            for (j = canvasEnd - 1; j >= canvasStart; j--) {
-                var _peak = peaks[2 * j + 1] || 0;
-                var _h = Math.round(_peak / absmax * halfH);
-                ctx.lineTo((j - first) * scale + this.halfPixel, halfH - _h + offsetY);
-            }
-
-            ctx.closePath();
-            ctx.fill();
-        }
-
-        /**
-         * Draw a rectangle on the waveform
-         *
-         * @param {number} x
-         * @param {number} y
-         * @param {number} width
-         * @param {number} height
-         */
-
-    }, {
-        key: 'fillRect',
-        value: function fillRect(x, y, width, height) {
-            var startCanvas = Math.floor(x / this.maxCanvasWidth);
-            var endCanvas = Math.min(Math.ceil((x + width) / this.maxCanvasWidth) + 1, this.canvases.length);
-            var i = void 0;
-            for (i = startCanvas; i < endCanvas; i++) {
-                var entry = this.canvases[i];
-                var leftOffset = i * this.maxCanvasWidth;
-
-                var intersection = {
-                    x1: Math.max(x, i * this.maxCanvasWidth),
-                    y1: y,
-                    x2: Math.min(x + width, i * this.maxCanvasWidth + entry.waveCtx.canvas.width),
-                    y2: y + height
-                };
-
-                if (intersection.x1 < intersection.x2) {
-                    this.setFillStyles(entry);
-
-                    this.fillRectToContext(entry.waveCtx, intersection.x1 - leftOffset, intersection.y1, intersection.x2 - intersection.x1, intersection.y2 - intersection.y1);
-
-                    this.fillRectToContext(entry.progressCtx, intersection.x1 - leftOffset, intersection.y1, intersection.x2 - intersection.x1, intersection.y2 - intersection.y1);
-                }
-            }
-        }
-
-        /**
-         * Draw the actual rectangle on a canvas
-         *
-         * @private
-         * @param {Canvas2DContextAttributes} ctx
-         * @param {number} x
-         * @param {number} y
-         * @param {number} width
-         * @param {number} height
-         */
-
-    }, {
-        key: 'fillRectToContext',
-        value: function fillRectToContext(ctx, x, y, width, height) {
-            if (!ctx) {
-                return;
-            }
-            ctx.fillRect(x, y, width, height);
-        }
-
-        /**
-         * Set the fill styles for a certain entry (wave and progress)
-         *
-         * @private
-         * @param {CanvasEntry} entry
-         */
-
-    }, {
-        key: 'setFillStyles',
-        value: function setFillStyles(entry) {
-            entry.waveCtx.fillStyle = this.params.waveColor;
-            if (this.hasProgressCanvas) {
-                entry.progressCtx.fillStyle = this.params.progressColor;
-            }
-        }
-
-        /**
-         * Return image data of the waveform
-         *
-         * @param {string} type='image/png' An optional value of a format type.
-         * @param {number} quality=0.92 An optional value between 0 and 1.
-         * @return {string|string[]} images A data URL or an array of data URLs
-         */
-
-    }, {
-        key: 'getImage',
-        value: function getImage(type, quality) {
-            var images = this.canvases.map(function (entry) {
-                return entry.wave.toDataURL(type, quality);
-            });
-            return images.length > 1 ? images : images[0];
-        }
-
-        /**
-         * Render the new progress
-         *
-         * @param {number} position X-Offset of progress position in pixels
-         */
-
-    }, {
-        key: 'updateProgress',
-        value: function updateProgress(position) {
-            this.style(this.progressWave, { width: position + 'px' });
-        }
-    }]);
-
-    return MultiCanvas;
-}(_drawer2.default);
-
-exports.default = MultiCanvas;
-module.exports = exports['default'];
-
-/***/ }),
-/* 4 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
-
-var _webaudio = __webpack_require__(1);
-
-var _webaudio2 = _interopRequireDefault(_webaudio);
-
-var _util = __webpack_require__(0);
-
-var util = _interopRequireWildcard(_util);
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-/**
- * MediaElement backend
- */
-var MediaElement = function (_WebAudio) {
-    _inherits(MediaElement, _WebAudio);
-
-    /**
-     * Construct the backend
-     *
-     * @param {WavesurferParams} params
-     */
-    function MediaElement(params) {
-        _classCallCheck(this, MediaElement);
-
-        /** @private */
-        var _this = _possibleConstructorReturn(this, (MediaElement.__proto__ || Object.getPrototypeOf(MediaElement)).call(this, params));
-
-        _this.params = params;
-
-        // Dummy media to catch errors
-        /** @private */
-        _this.media = {
-            currentTime: 0,
-            duration: 0,
-            paused: true,
-            playbackRate: 1,
-            play: function play() {},
-            pause: function pause() {}
-        };
-
-        /** @private */
-        _this.mediaType = params.mediaType.toLowerCase();
-        /** @private */
-        _this.elementPosition = params.elementPosition;
-        /** @private */
-        _this.peaks = null;
-        /** @private */
-        _this.playbackRate = 1;
-        /** @private */
-        _this.buffer = null;
-        /** @private */
-        _this.onPlayEnd = null;
-        return _this;
-    }
-
-    /**
-     * Initialise the backend, called in `wavesurfer.createBackend()`
-     */
-
-
-    _createClass(MediaElement, [{
-        key: 'init',
-        value: function init() {
-            this.setPlaybackRate(this.params.audioRate);
-            this.createTimer();
-        }
-
-        /**
-         * Create a timer to provide a more precise `audioprocess` event.
-         *
-         * @private
-         */
-
-    }, {
-        key: 'createTimer',
-        value: function createTimer() {
-            var _this2 = this;
-
-            var onAudioProcess = function onAudioProcess() {
-                if (_this2.isPaused()) {
-                    return;
-                }
-                _this2.fireEvent('audioprocess', _this2.getCurrentTime());
-
-                // Call again in the next frame
-                var requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame;
-                requestAnimationFrame(onAudioProcess);
-            };
-
-            this.on('play', onAudioProcess);
-        }
-
-        /**
-         *  Create media element with url as its source,
-         *  and append to container element.
-         *
-         *  @param {string} url Path to media file
-         *  @param {HTMLElement} container HTML element
-         *  @param {Array} peaks Array of peak data
-         *  @param {string} preload HTML 5 preload attribute value
-         */
-
-    }, {
-        key: 'load',
-        value: function load(url, container, peaks, preload) {
-            var media = document.createElement(this.mediaType);
-            media.controls = this.params.mediaControls;
-            media.autoplay = this.params.autoplay || false;
-            media.preload = preload == null ? 'auto' : preload;
-            media.src = url;
-            media.style.width = '100%';
-
-            var prevMedia = container.querySelector(this.mediaType);
-            if (prevMedia) {
-                container.removeChild(prevMedia);
-            }
-            container.appendChild(media);
-
-            this._load(media, peaks);
-        }
-
-        /**
-         *  Load existing media element.
-         *
-         *  @param {MediaElement} elt HTML5 Audio or Video element
-         *  @param {Array} peaks Array of peak data
-         */
-
-    }, {
-        key: 'loadElt',
-        value: function loadElt(elt, peaks) {
-            elt.controls = this.params.mediaControls;
-            elt.autoplay = this.params.autoplay || false;
-
-            this._load(elt, peaks);
-        }
-
-        /**
-         *  Private method called by both load (from url)
-         *  and loadElt (existing media element).
-         *
-         *  @param  {MediaElement}  media     HTML5 Audio or Video element
-         *  @param  {Array}         peaks   array of peak data
-         *  @private
-         */
-
-    }, {
-        key: '_load',
-        value: function _load(media, peaks) {
-            var _this3 = this;
-
-            // load must be called manually on iOS, otherwise peaks won't draw
-            // until a user interaction triggers load --> 'ready' event
-            if (typeof media.load == 'function') {
-                media.load();
-            }
-
-            media.addEventListener('error', function () {
-                _this3.fireEvent('error', 'Error loading media element');
-            });
-
-            media.addEventListener('canplay', function () {
-                _this3.fireEvent('canplay');
-            });
-
-            media.addEventListener('ended', function () {
-                _this3.fireEvent('finish');
-            });
-
-            this.media = media;
-            this.peaks = peaks;
-            this.onPlayEnd = null;
-            this.buffer = null;
-            this.setPlaybackRate(this.playbackRate);
-        }
-
-        /**
-         * Used by `wavesurfer.isPlaying()` and `wavesurfer.playPause()`
-         *
-         * @return {boolean}
-         */
-
-    }, {
-        key: 'isPaused',
-        value: function isPaused() {
-            return !this.media || this.media.paused;
-        }
-
-        /**
-         * Used by `wavesurfer.getDuration()`
-         *
-         * @return {number}
-         */
-
-    }, {
-        key: 'getDuration',
-        value: function getDuration() {
-            var duration = (this.buffer || this.media).duration;
-            if (duration >= Infinity) {
-                // streaming audio
-                duration = this.media.seekable.end(0);
-            }
-            return duration;
-        }
-
-        /**
-        * Returns the current time in seconds relative to the audioclip's
-        * duration.
-        *
-        * @return {number}
-        */
-
-    }, {
-        key: 'getCurrentTime',
-        value: function getCurrentTime() {
-            return this.media && this.media.currentTime;
-        }
-
-        /**
-         * Get the position from 0 to 1
-         *
-         * @return {number}
-         */
-
-    }, {
-        key: 'getPlayedPercents',
-        value: function getPlayedPercents() {
-            return this.getCurrentTime() / this.getDuration() || 0;
-        }
-
-        /**
-         * Set the audio source playback rate.
-         *
-         * @param {number} value
-         */
-
-    }, {
-        key: 'setPlaybackRate',
-        value: function setPlaybackRate(value) {
-            this.playbackRate = value || 1;
-            this.media.playbackRate = this.playbackRate;
-        }
-
-        /**
-         * Used by `wavesurfer.seekTo()`
-         *
-         * @param {number} start Position to start at in seconds
-         */
-
-    }, {
-        key: 'seekTo',
-        value: function seekTo(start) {
-            if (start != null) {
-                this.media.currentTime = start;
-            }
-            this.clearPlayEnd();
-        }
-
-        /**
-         * Plays the loaded audio region.
-         *
-         * @param {Number} start Start offset in seconds, relative to the beginning
-         * of a clip.
-         * @param {Number} end When to stop relative to the beginning of a clip.
-         * @emits MediaElement#play
-         */
-
-    }, {
-        key: 'play',
-        value: function play(start, end) {
-            this.seekTo(start);
-            this.media.play();
-            end && this.setPlayEnd(end);
-            this.fireEvent('play');
-        }
-
-        /**
-         * Pauses the loaded audio.
-         *
-         * @emits MediaElement#pause
-         */
-
-    }, {
-        key: 'pause',
-        value: function pause() {
-            this.media && this.media.pause();
-            this.clearPlayEnd();
-            this.fireEvent('pause');
-        }
-
-        /** @private */
-
-    }, {
-        key: 'setPlayEnd',
-        value: function setPlayEnd(end) {
-            var _this4 = this;
-
-            this._onPlayEnd = function (time) {
-                if (time >= end) {
-                    _this4.pause();
-                    _this4.seekTo(end);
-                }
-            };
-            this.on('audioprocess', this._onPlayEnd);
-        }
-
-        /** @private */
-
-    }, {
-        key: 'clearPlayEnd',
-        value: function clearPlayEnd() {
-            if (this._onPlayEnd) {
-                this.un('audioprocess', this._onPlayEnd);
-                this._onPlayEnd = null;
-            }
-        }
-
-        /**
-         * Compute the max and min value of the waveform when broken into
-         * <length> subranges.
-         *
-         * @param {number} length How many subranges to break the waveform into.
-         * @param {number} first First sample in the required range.
-         * @param {number} last Last sample in the required range.
-         * @return {number[]|number[][]} Array of 2*<length> peaks or array of
-         * arrays of peaks consisting of (max, min) values for each subrange.
-         */
-
-    }, {
-        key: 'getPeaks',
-        value: function getPeaks(length, first, last) {
-            if (this.buffer) {
-                return _get(MediaElement.prototype.__proto__ || Object.getPrototypeOf(MediaElement.prototype), 'getPeaks', this).call(this, length, first, last);
-            }
-            return this.peaks || [];
-        }
-
-        /**
-         * Get the current volume
-         *
-         * @return {number} value A floating point value between 0 and 1.
-         */
-
-    }, {
-        key: 'getVolume',
-        value: function getVolume() {
-            return this.media.volume;
-        }
-
-        /**
-         * Set the audio volume
-         *
-         * @param {number} value A floating point value between 0 and 1.
-         */
-
-    }, {
-        key: 'setVolume',
-        value: function setVolume(value) {
-            this.media.volume = value;
-        }
-
-        /**
-         * This is called when wavesurfer is destroyed
-         *
-         */
-
-    }, {
-        key: 'destroy',
-        value: function destroy() {
-            this.pause();
-            this.unAll();
-            this.media && this.media.parentNode && this.media.parentNode.removeChild(this.media);
-            this.media = null;
-        }
-    }]);
-
-    return MediaElement;
-}(_webaudio2.default);
-
-exports.default = MediaElement;
-module.exports = exports['default'];
-
-/***/ }),
-/* 5 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-/**
- * Caches the decoded peaks data to improve rendering speed for lage audio
- *
- * Is used if the option parameter `partialRender` is set to `true`
- */
-var PeakCache = function () {
-    /**
-     * Instantiate cache
-     */
-    function PeakCache() {
-        _classCallCheck(this, PeakCache);
-
-        this.clearPeakCache();
-    }
-
-    /**
-     * Empty the cache
-     */
-
-
-    _createClass(PeakCache, [{
-        key: "clearPeakCache",
-        value: function clearPeakCache() {
-            /**
-             * Flat array with entries that are always in pairs to mark the
-             * beginning and end of each subrange.  This is a convenience so we can
-             * iterate over the pairs for easy set difference operations.
-             * @private
-             */
-            this.peakCacheRanges = [];
-            /**
-             * Length of the entire cachable region, used for resetting the cache
-             * when this changes (zoom events, for instance).
-             * @private
-             */
-            this.peakCacheLength = -1;
-        }
-
-        /**
-         * Add a range of peaks to the cache
-         *
-         * @param {number} length The length of the range
-         * @param {number} start The x offset of the start of the range
-         * @param {number} end The x offset of the end of the range
-         * @return {number[][]}
-         */
-
-    }, {
-        key: "addRangeToPeakCache",
-        value: function addRangeToPeakCache(length, start, end) {
-            if (length != this.peakCacheLength) {
-                this.clearPeakCache();
-                this.peakCacheLength = length;
-            }
-
-            // Return ranges that weren't in the cache before the call.
-            var uncachedRanges = [];
-            var i = 0;
-            // Skip ranges before the current start.
-            while (i < this.peakCacheRanges.length && this.peakCacheRanges[i] < start) {
-                i++;
-            }
-            // If |i| is even, |start| falls after an existing range.  Otherwise,
-            // |start| falls between an existing range, and the uncached region
-            // starts when we encounter the next node in |peakCacheRanges| or
-            // |end|, whichever comes first.
-            if (i % 2 == 0) {
-                uncachedRanges.push(start);
-            }
-            while (i < this.peakCacheRanges.length && this.peakCacheRanges[i] <= end) {
-                uncachedRanges.push(this.peakCacheRanges[i]);
-                i++;
-            }
-            // If |i| is even, |end| is after all existing ranges.
-            if (i % 2 == 0) {
-                uncachedRanges.push(end);
-            }
-
-            // Filter out the 0-length ranges.
-            uncachedRanges = uncachedRanges.filter(function (item, pos, arr) {
-                if (pos == 0) {
-                    return item != arr[pos + 1];
-                } else if (pos == arr.length - 1) {
-                    return item != arr[pos - 1];
-                }
-                return item != arr[pos - 1] && item != arr[pos + 1];
-            });
-
-            // Merge the two ranges together, uncachedRanges will either contain
-            // wholly new points, or duplicates of points in peakCacheRanges.  If
-            // duplicates are detected, remove both and extend the range.
-            this.peakCacheRanges = this.peakCacheRanges.concat(uncachedRanges);
-            this.peakCacheRanges = this.peakCacheRanges.sort(function (a, b) {
-                return a - b;
-            }).filter(function (item, pos, arr) {
-                if (pos == 0) {
-                    return item != arr[pos + 1];
-                } else if (pos == arr.length - 1) {
-                    return item != arr[pos - 1];
-                }
-                return item != arr[pos - 1] && item != arr[pos + 1];
-            });
-
-            // Push the uncached ranges into an array of arrays for ease of
-            // iteration in the functions that call this.
-            var uncachedRangePairs = [];
-            for (i = 0; i < uncachedRanges.length; i += 2) {
-                uncachedRangePairs.push([uncachedRanges[i], uncachedRanges[i + 1]]);
-            }
-
-            return uncachedRangePairs;
-        }
-
-        /**
-         * For testing
-         *
-         * @return {number[][]}
-         */
-
-    }, {
-        key: "getCacheRanges",
-        value: function getCacheRanges() {
-            var peakCacheRangePairs = [];
-            var i = void 0;
-            for (i = 0; i < this.peakCacheRanges.length; i += 2) {
-                peakCacheRangePairs.push([this.peakCacheRanges[i], this.peakCacheRanges[i + 1]]);
-            }
-            return peakCacheRangePairs;
-        }
-    }]);
-
-    return PeakCache;
-}();
-
-exports.default = PeakCache;
-module.exports = exports["default"];
-
-/***/ }),
-/* 6 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _util = __webpack_require__(0);
-
-var util = _interopRequireWildcard(_util);
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-/**
- * Parent class for renderers
- *
- * @extends {Observer}
- */
-var Drawer = function (_util$Observer) {
-    _inherits(Drawer, _util$Observer);
-
-    /**
-     * @param {HTMLElement} container The container node of the wavesurfer instance
-     * @param {WavesurferParams} params The wavesurfer initialisation options
-     */
-    function Drawer(container, params) {
-        _classCallCheck(this, Drawer);
-
-        /** @private */
-        var _this = _possibleConstructorReturn(this, (Drawer.__proto__ || Object.getPrototypeOf(Drawer)).call(this));
-
-        _this.container = container;
-        /**
-         * @type {WavesurferParams}
-         * @private
-         */
-        _this.params = params;
-        /**
-         * The width of the renderer
-         * @type {number}
-         */
-        _this.width = 0;
-        /**
-         * The height of the renderer
-         * @type {number}
-         */
-        _this.height = params.height * _this.params.pixelRatio;
-        /** @private */
-        _this.lastPos = 0;
-        /**
-         * The `<wave>` element which is added to the container
-         * @type {HTMLElement}
-         */
-        _this.wrapper = null;
-        return _this;
-    }
-
-    /**
-     * Alias of `util.style`
-     *
-     * @param {HTMLElement} el The element that the styles will be applied to
-     * @param {Object} styles The map of propName: attribute, both are used as-is
-     * @return {HTMLElement} el
-     */
-
-
-    _createClass(Drawer, [{
-        key: 'style',
-        value: function style(el, styles) {
-            return util.style(el, styles);
-        }
-
-        /**
-         * Create the wrapper `<wave>` element, style it and set up the events for
-         * interaction
-         */
-
-    }, {
-        key: 'createWrapper',
-        value: function createWrapper() {
-            this.wrapper = this.container.appendChild(document.createElement('wave'));
-
-            this.style(this.wrapper, {
-                display: 'block',
-                position: 'relative',
-                userSelect: 'none',
-                webkitUserSelect: 'none',
-                height: this.params.height + 'px'
-            });
-
-            if (this.params.fillParent || this.params.scrollParent) {
-                this.style(this.wrapper, {
-                    width: '100%',
-                    overflowX: this.params.hideScrollbar ? 'hidden' : 'auto',
-                    overflowY: 'hidden'
-                });
-            }
-
-            this.setupWrapperEvents();
-        }
-
-        /**
-         * Handle click event
-         *
-         * @param {Event} e Click event
-         * @param {?boolean} noPrevent Set to true to not call `e.preventDefault()`
-         * @return {number} Playback position from 0 to 1
-         */
-
-    }, {
-        key: 'handleEvent',
-        value: function handleEvent(e, noPrevent) {
-            !noPrevent && e.preventDefault();
-
-            var clientX = e.targetTouches ? e.targetTouches[0].clientX : e.clientX;
-            var bbox = this.wrapper.getBoundingClientRect();
-
-            var nominalWidth = this.width;
-            var parentWidth = this.getWidth();
-
-            var progress = void 0;
-
-            if (!this.params.fillParent && nominalWidth < parentWidth) {
-                progress = (clientX - bbox.left) * this.params.pixelRatio / nominalWidth || 0;
-
-                if (progress > 1) {
-                    progress = 1;
-                }
-            } else {
-                progress = (clientX - bbox.left + this.wrapper.scrollLeft) / this.wrapper.scrollWidth || 0;
-            }
-
-            return progress;
-        }
-
-        /**
-         * @private
-         */
-
-    }, {
-        key: 'setupWrapperEvents',
-        value: function setupWrapperEvents() {
-            var _this2 = this;
-
-            this.wrapper.addEventListener('click', function (e) {
-                var scrollbarHeight = _this2.wrapper.offsetHeight - _this2.wrapper.clientHeight;
-                if (scrollbarHeight != 0) {
-                    // scrollbar is visible.  Check if click was on it
-                    var bbox = _this2.wrapper.getBoundingClientRect();
-                    if (e.clientY >= bbox.bottom - scrollbarHeight) {
-                        // ignore mousedown as it was on the scrollbar
-                        return;
-                    }
-                }
-
-                if (_this2.params.interact) {
-                    _this2.fireEvent('click', e, _this2.handleEvent(e));
-                }
-            });
-
-            this.wrapper.addEventListener('scroll', function (e) {
-                return _this2.fireEvent('scroll', e);
-            });
-        }
-
-        /**
-         * Draw peaks on the canvas
-         *
-         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel
-         * rendering
-         * @param {number} length The width of the area that should be drawn
-         * @param {number} start The x-offset of the beginning of the area that
-         * should be rendered
-         * @param {number} end The x-offset of the end of the area that should be
-         * rendered
-         */
-
-    }, {
-        key: 'drawPeaks',
-        value: function drawPeaks(peaks, length, start, end) {
-            this.setWidth(length);
-
-            this.params.barWidth ? this.drawBars(peaks, 0, start, end) : this.drawWave(peaks, 0, start, end);
-        }
-
-        /**
-         * Scroll to the beginning
-         */
-
-    }, {
-        key: 'resetScroll',
-        value: function resetScroll() {
-            if (this.wrapper !== null) {
-                this.wrapper.scrollLeft = 0;
-            }
-        }
-
-        /**
-         * Recenter the viewport at a certain percent of the waveform
-         *
-         * @param {number} percent Value from 0 to 1 on the waveform
-         */
-
-    }, {
-        key: 'recenter',
-        value: function recenter(percent) {
-            var position = this.wrapper.scrollWidth * percent;
-            this.recenterOnPosition(position, true);
-        }
-
-        /**
-         * Recenter the viewport on a position, either scroll there immediately or
-         * in steps of 5 pixels
-         *
-         * @param {number} position X-offset in pixels
-         * @param {boolean} immediate Set to true to immediately scroll somewhere
-         */
-
-    }, {
-        key: 'recenterOnPosition',
-        value: function recenterOnPosition(position, immediate) {
-            var scrollLeft = this.wrapper.scrollLeft;
-            var half = ~~(this.wrapper.clientWidth / 2);
-            var maxScroll = this.wrapper.scrollWidth - this.wrapper.clientWidth;
-            var target = position - half;
-            var offset = target - scrollLeft;
-
-            if (maxScroll == 0) {
-                // no need to continue if scrollbar is not there
-                return;
-            }
-
-            // if the cursor is currently visible...
-            if (!immediate && -half <= offset && offset < half) {
-                // we'll limit the "re-center" rate.
-                var rate = 5;
-                offset = Math.max(-rate, Math.min(rate, offset));
-                target = scrollLeft + offset;
-            }
-
-            // limit target to valid range (0 to maxScroll)
-            target = Math.max(0, Math.min(maxScroll, target));
-            // no use attempting to scroll if we're not moving
-            if (target != scrollLeft) {
-                this.wrapper.scrollLeft = target;
-            }
-        }
-
-        /**
-         * Get the current scroll position in pixels
-         *
-         * @return {number}
-         */
-
-    }, {
-        key: 'getScrollX',
-        value: function getScrollX() {
-            return Math.round(this.wrapper.scrollLeft * this.params.pixelRatio);
-        }
-
-        /**
-         * Get the width of the container
-         *
-         * @return {number}
-         */
-
-    }, {
-        key: 'getWidth',
-        value: function getWidth() {
-            return Math.round(this.container.clientWidth * this.params.pixelRatio);
-        }
-
-        /**
-         * Set the width of the container
-         *
-         * @param {number} width
-         */
-
-    }, {
-        key: 'setWidth',
-        value: function setWidth(width) {
-            if (this.width == width) {
-                return;
-            }
-
-            this.width = width;
-
-            if (this.params.fillParent || this.params.scrollParent) {
-                this.style(this.wrapper, {
-                    width: ''
-                });
-            } else {
-                this.style(this.wrapper, {
-                    width: ~~(this.width / this.params.pixelRatio) + 'px'
-                });
-            }
-
-            this.updateSize();
-        }
-
-        /**
-         * Set the height of the container
-         *
-         * @param {number} height
-         */
-
-    }, {
-        key: 'setHeight',
-        value: function setHeight(height) {
-            if (height == this.height) {
-                return;
-            }
-            this.height = height;
-            this.style(this.wrapper, {
-                height: ~~(this.height / this.params.pixelRatio) + 'px'
-            });
-            this.updateSize();
-        }
-
-        /**
-         * Called by wavesurfer when progress should be renderered
-         *
-         * @param {number} progress From 0 to 1
-         */
-
-    }, {
-        key: 'progress',
-        value: function progress(_progress) {
-            var minPxDelta = 1 / this.params.pixelRatio;
-            var pos = Math.round(_progress * this.width) * minPxDelta;
-
-            if (pos < this.lastPos || pos - this.lastPos >= minPxDelta) {
-                this.lastPos = pos;
-
-                if (this.params.scrollParent && this.params.autoCenter) {
-                    var newPos = ~~(this.wrapper.scrollWidth * _progress);
-                    this.recenterOnPosition(newPos);
-                }
-
-                this.updateProgress(pos);
-            }
-        }
-
-        /**
-         * This is called when wavesurfer is destroyed
-         */
-
-    }, {
-        key: 'destroy',
-        value: function destroy() {
-            this.unAll();
-            if (this.wrapper) {
-                this.container.removeChild(this.wrapper);
-                this.wrapper = null;
-            }
-        }
-
-        /* Renderer-specific methods */
-        /**
-         * Called when the size of the container changes so the renderer can adjust
-         *
-         * @abstract
-         */
-
-    }, {
-        key: 'updateSize',
-        value: function updateSize() {}
-
-        /**
-         * Draw a waveform with bars
-         *
-         * @abstract
-         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel
-         * rendering
-         * @param {number} channelIndex The index of the current channel. Normally
-         * should be 0
-         * @param {number} start The x-offset of the beginning of the area that
-         * should be rendered
-         * @param {number} end The x-offset of the end of the area that should be
-         * rendered
-         */
-
-    }, {
-        key: 'drawBars',
-        value: function drawBars(peaks, channelIndex, start, end) {}
-
-        /**
-         * Draw a waveform
-         *
-         * @abstract
-         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel
-         * rendering
-         * @param {number} channelIndex The index of the current channel. Normally
-         * should be 0
-         * @param {number} start The x-offset of the beginning of the area that
-         * should be rendered
-         * @param {number} end The x-offset of the end of the area that should be
-         * rendered
-         */
-
-    }, {
-        key: 'drawWave',
-        value: function drawWave(peaks, channelIndex, start, end) {}
-
-        /**
-         * Clear the waveform
-         *
-         * @abstract
-         */
-
-    }, {
-        key: 'clearWave',
-        value: function clearWave() {}
-
-        /**
-         * Render the new progress
-         *
-         * @abstract
-         * @param {number} position X-Offset of progress position in pixels
-         */
-
-    }, {
-        key: 'updateProgress',
-        value: function updateProgress(position) {}
-    }]);
-
-    return Drawer;
-}(util.Observer);
-
-exports.default = Drawer;
-module.exports = exports['default'];
-
-/***/ }),
-/* 7 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-exports.default = ajax;
-
-var _observer = __webpack_require__(2);
-
-var _observer2 = _interopRequireDefault(_observer);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-/**
- * Perform an ajax request
- *
- * @param {Options} options Description
- *
- * @returns {Object} Observer instance
- */
-function ajax(options) {
-    var instance = new _observer2.default();
-    var xhr = new XMLHttpRequest();
-    var fired100 = false;
-    xhr.open(options.method || 'GET', options.url, true);
-    xhr.responseType = options.responseType || 'json';
-    xhr.addEventListener('progress', function (e) {
-        instance.fireEvent('progress', e);
-        if (e.lengthComputable && e.loaded == e.total) {
-            fired100 = true;
-        }
-    });
-    xhr.addEventListener('load', function (e) {
-        if (!fired100) {
-            instance.fireEvent('progress', e);
-        }
-        instance.fireEvent('load', e);
-        if (200 == xhr.status || 206 == xhr.status) {
-            instance.fireEvent('success', xhr.response, e);
-        } else {
-            instance.fireEvent('error', e);
-        }
-    });
-    xhr.addEventListener('error', function (e) {
-        return instance.fireEvent('error', e);
-    });
-    xhr.send();
-    instance.xhr = xhr;
-    return instance;
-}
-module.exports = exports['default'];
-
-/***/ }),
-/* 8 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-exports.default = extend;
-/**
- * Extend an object shallowly with others
- *
- * @param {Object} dest The target object
- * @param {Object[]} sources The objects to use for extending
- *
- * @return {Object} Merged object
- */
-function extend(dest) {
-    for (var _len = arguments.length, sources = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-        sources[_key - 1] = arguments[_key];
-    }
-
-    sources.forEach(function (source) {
-        Object.keys(source).forEach(function (key) {
-            dest[key] = source[key];
-        });
-    });
-    return dest;
-}
-module.exports = exports["default"];
-
-/***/ }),
-/* 9 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = getId;
-/**
- * Get a random prefixed ID
- *
- * @returns {String} Random ID
- */
-function getId() {
-  return 'wavesurfer_' + Math.random().toString(32).substring(2);
-}
-module.exports = exports['default'];
-
-/***/ }),
-/* 10 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-exports.default = max;
-/**
- * Get the largest value
- *
- * @param   {Array} values Array of numbers
- * @returns {Number} Largest number found
- */
-function max(values) {
-    var largest = -Infinity;
-    Object.keys(values).forEach(function (i) {
-        if (values[i] > largest) {
-            largest = values[i];
-        }
-    });
-    return largest;
-}
-module.exports = exports["default"];
-
-/***/ }),
-/* 11 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-exports.default = min;
-/**
- * Get the smallest value
- *
- * @param   {Array} values Array of numbers
- * @returns {Number}       Smallest number found
- */
-function min(values) {
-    var smallest = Number(Infinity);
-    Object.keys(values).forEach(function (i) {
-        if (values[i] < smallest) {
-            smallest = values[i];
-        }
-    });
-    return smallest;
-}
-module.exports = exports["default"];
-
-/***/ }),
-/* 12 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-exports.default = style;
-/**
- * Apply a map of styles to an element
- *
- * @param {HTMLElement} el The element that the styles will be applied to
- * @param {Object} styles The map of propName: attribute, both are used as-is
- *
- * @return {HTMLElement} el
- */
-function style(el, styles) {
-    Object.keys(styles).forEach(function (prop) {
-        if (el.style[prop] !== styles[prop]) {
-            el.style[prop] = styles[prop];
-        }
-    });
-    return el;
-}
-module.exports = exports["default"];
-
-/***/ }),
-/* 13 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _util = __webpack_require__(0);
-
-var util = _interopRequireWildcard(_util);
-
-var _drawer = __webpack_require__(3);
-
-var _drawer2 = _interopRequireDefault(_drawer);
-
-var _webaudio = __webpack_require__(1);
-
-var _webaudio2 = _interopRequireDefault(_webaudio);
-
-var _mediaelement = __webpack_require__(4);
-
-var _mediaelement2 = _interopRequireDefault(_mediaelement);
-
-var _peakcache = __webpack_require__(5);
-
-var _peakcache2 = _interopRequireDefault(_peakcache);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-/** @external {HTMLElement} https://developer.mozilla.org/en/docs/Web/API/HTMLElement */
-/** @external {OfflineAudioContext} https://developer.mozilla.org/en-US/docs/Web/API/OfflineAudioContext */
-/** @external {File} https://developer.mozilla.org/en-US/docs/Web/API/File */
-/** @external {Blob} https://developer.mozilla.org/en-US/docs/Web/API/Blob */
-/** @external {CanvasRenderingContext2D} https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D */
-/** @external {MediaStreamConstraints} https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamConstraints */
-/** @external {AudioNode} https://developer.mozilla.org/de/docs/Web/API/AudioNode */
-
-/**
- * @typedef {Object} WavesurferParams
- * @property {AudioContext} audioContext=null Use your own previously
- * initialized AudioContext or leave blank.
- * @property {number} audioRate=1 Speed at which to play audio. Lower number is
- * slower.
- * @property {boolean} autoCenter=true If a scrollbar is present, center the
- * waveform around the progress
- * @property {string} backend='WebAudio' `'WebAudio'|'MediaElement'` In most cases
- * you don't have to set this manually. MediaElement is a fallback for
- * unsupported browsers.
- * @property {boolean} closeAudioContext=false Close and nullify all audio
- * contexts when the destroy method is called.
- * @property {!string|HTMLElement} container CSS selector or HTML element where
- * the waveform should be drawn. This is the only required parameter.
- * @property {string} cursorColor='#333' The fill color of the cursor indicating
- * the playhead position.
- * @property {number} cursorWidth=1 Measured in pixels.
- * @property {boolean} fillParent=true Whether to fill the entire container or
- * draw only according to `minPxPerSec`.
- * @property {boolean} forceDecode=false Force decoding of audio using web audio
- * when zooming to get a more detailed waveform.
- * @property {number} height=128 The height of the waveform. Measured in
- * pixels.
- * @property {boolean} hideScrollbar=false Whether to hide the horizontal
- * scrollbar when one would normally be shown.
- * @property {boolean} interact=true Whether the mouse interaction will be
- * enabled at initialization. You can switch this parameter at any time later
- * on.
- * @property {boolean} loopSelection=true (Use with regions plugin) Enable
- * looping of selected regions
- * @property {number} maxCanvasWidth=4000 Maximum width of a single canvas in
- * pixels, excluding a small overlap (2 * `pixelRatio`, rounded up to the next
- * even integer). If the waveform is longer than this value, additional canvases
- * will be used to render the waveform, which is useful for very large waveforms
- * that may be too wide for browsers to draw on a single canvas.
- * @property {boolean} mediaControls=false (Use with backend `MediaElement`)
- * this enables the native controls for the media element
- * @property {string} mediaType='audio' (Use with backend `MediaElement`)
- * `'audio'|'video'`
- * @property {number} minPxPerSec=20 Minimum number of pixels per second of
- * audio.
- * @property {boolean} normalize=false If true, normalize by the maximum peak
- * instead of 1.0.
- * @property {boolean} partialRender=false Use the PeakCache to improve
- * rendering speed of large waveforms
- * @property {number} pixelRatio=window.devicePixelRatio The pixel ratio used to
- * calculate display
- * @property {PluginDefinition[]} plugins=[] An array of plugin definitions to
- * register during instantiation, they will be directly initialised unless they
- * are added with the `deferInit` property set to true.
- * @property {string} progressColor='#555' The fill color of the part of the
- * waveform behind the cursor.
- * @property {Object} renderer=MultiCanvas Can be used to inject a custom
- * renderer.
- * @property {boolean|number} responsive=false If set to `true` resize the
- * waveform, when the window is resized. This is debounced with a `100ms`
- * timeout by default. If this parameter is a number it represents that timeout.
- * @property {boolean} scrollParent=false Whether to scroll the container with a
- * lengthy waveform. Otherwise the waveform is shrunk to the container width
- * (see fillParent).
- * @property {number} skipLength=2 Number of seconds to skip with the
- * skipForward() and skipBackward() methods.
- * @property {boolean} splitChannels=false Render with seperate waveforms for
- * the channels of the audio
- * @property {string} waveColor='#999' The fill color of the waveform after the
- * cursor.
- */
-
-/**
- * @typedef {Object} PluginDefinition
- * @desc The Object used to describe a plugin
- * @example wavesurfer.addPlugin(pluginDefinition);
- * @property {string} name The name of the plugin, the plugin instance will be
- * added as a property to the wavesurfer instance under this name
- * @property {?Object} staticProps The properties that should be added to the
- * wavesurfer instance as static properties
- * @property {?boolean} deferInit Don't initialise plugin
- * automatically
- * @property {Object} params={} The plugin parameters, they are the first parameter
- * passed to the plugin class constructor function
- * @property {PluginClass} instance The plugin instance factory, is called with
- * the dependency specified in extends. Returns the plugin class.
- */
-
-/**
- * @interface PluginClass
- *
- * @desc This is the interface which is implemented by all plugin classes. Note
- * that this only turns into an observer after being passed through
- * `wavesurfer.addPlugin`.
- *
- * @extends {Observer}
- */
-var PluginClass = function () {
-    _createClass(PluginClass, [{
-        key: 'create',
-
-        /**
-         * Plugin definition factory
-         *
-         * This function must be used to create a plugin definition which can be
-         * used by wavesurfer to correctly instantiate the plugin.
-         *
-         * @param  {Object} params={} The plugin params (specific to the plugin)
-         * @return {PluginDefinition} an object representing the plugin
-         */
-        value: function create(params) {}
-        /**
-         * Construct the plugin
-         *
-         * @param {Object} ws The wavesurfer instance
-         * @param {Object} params={} The plugin params (specific to the plugin)
-         */
-
-    }]);
-
-    function PluginClass(ws, params) {
-        _classCallCheck(this, PluginClass);
-    }
-    /**
-     * Initialise the plugin
-     *
-     * Start doing something. This is called by
-     * `wavesurfer.initPlugin(pluginName)`
-     */
-
-
-    _createClass(PluginClass, [{
-        key: 'init',
-        value: function init() {}
-        /**
-         * Destroy the plugin instance
-         *
-         * Stop doing something. This is called by
-         * `wavesurfer.destroyPlugin(pluginName)`
-         */
-
-    }, {
-        key: 'destroy',
-        value: function destroy() {}
-    }]);
-
-    return PluginClass;
-}();
-
-/**
- * WaveSurfer core library class
- *
- * @extends {Observer}
- * @example
- * const params = {
- *   container: '#waveform',
- *   waveColor: 'violet',
- *   progressColor: 'purple'
- * };
- *
- * // initialise like this
- * const wavesurfer = WaveSurfer.create(params);
- *
- * // or like this ...
- * const wavesurfer = new WaveSurfer(params);
- * wavesurfer.init();
- *
- * // load audio file
- * wavesurfer.load('example/media/demo.wav');
- */
-
-
-var WaveSurfer = function (_util$Observer) {
-    _inherits(WaveSurfer, _util$Observer);
-
-    _createClass(WaveSurfer, null, [{
-        key: 'create',
-
-
-        /**
-         * Instantiate this class, call its `init` function and returns it
-         *
-         * @param {WavesurferParams} params
-         * @return {Object} WaveSurfer instance
-         * @example const wavesurfer = WaveSurfer.create(params);
-         */
-
-        /** @private */
-        value: function create(params) {
-            var wavesurfer = new WaveSurfer(params);
-            return wavesurfer.init();
-        }
-
-        /**
-         * Functions in the `util` property are available as a prototype property to
-         * all instances
-         *
-         * @type {Object}
-         * @example
-         * const wavesurfer = WaveSurfer.create(params);
-         * wavesurfer.util.style(myElement, { background: 'blue' });
-         */
-
-
-        /** @private */
-
-
-        /**
-         * Functions in the `util` property are available as a static property of the
-         * WaveSurfer class
-         *
-         * @type {Object}
-         * @example
-         * WaveSurfer.util.style(myElement, { background: 'blue' });
-         */
-
-    }]);
-
-    /**
-     * Initialise wavesurfer instance
-     *
-     * @param {WavesurferParams} params Instantiation options for wavesurfer
-     * @example
-     * const wavesurfer = new WaveSurfer(params);
-     * @returns {this}
-     */
-    function WaveSurfer(params) {
-        var _ret;
-
-        _classCallCheck(this, WaveSurfer);
-
-        /**
-         * Extract relevant parameters (or defaults)
-         * @private
-         */
-        var _this = _possibleConstructorReturn(this, (WaveSurfer.__proto__ || Object.getPrototypeOf(WaveSurfer)).call(this));
-
-        _this.defaultParams = {
-            audioContext: null,
-            audioRate: 1,
-            autoCenter: true,
-            backend: 'WebAudio',
-            container: null,
-            cursorColor: '#333',
-            cursorWidth: 1,
-            dragSelection: true,
-            fillParent: true,
-            forceDecode: true,
-            height: 128,
-            hideScrollbar: false,
-            interact: true,
-            loopSelection: true,
-            maxCanvasWidth: 4000,
-            mediaContainer: null,
-            mediaControls: false,
-            mediaType: 'audio',
-            minPxPerSec: 20,
-            normalize: false,
-            partialRender: false,
-            pixelRatio: window.devicePixelRatio || screen.deviceXDPI / screen.logicalXDPI,
-            plugins: [],
-            progressColor: '#555',
-            renderer: _drawer2.default,
-            responsive: false,
-            scrollParent: false,
-            skipLength: 2,
-            splitChannels: false,
-            waveColor: '#999'
-        };
-        _this.backends = {
-            MediaElement: _mediaelement2.default,
-            WebAudio: _webaudio2.default
-        };
-        _this.util = util;
-        _this.params = util.extend({}, _this.defaultParams, params);
-
-        /** @private */
-        _this.container = 'string' == typeof params.container ? document.querySelector(_this.params.container) : _this.params.container;
-
-        if (!_this.container) {
-            throw new Error('Container element not found');
-        }
-
-        if (_this.params.mediaContainer == null) {
-            /** @private */
-            _this.mediaContainer = _this.container;
-        } else if (typeof _this.params.mediaContainer == 'string') {
-            /** @private */
-            _this.mediaContainer = document.querySelector(_this.params.mediaContainer);
-        } else {
-            /** @private */
-            _this.mediaContainer = _this.params.mediaContainer;
-        }
-
-        if (!_this.mediaContainer) {
-            throw new Error('Media Container element not found');
-        }
-
-        if (_this.params.maxCanvasWidth <= 1) {
-            throw new Error('maxCanvasWidth must be greater than 1');
-        } else if (_this.params.maxCanvasWidth % 2 == 1) {
-            throw new Error('maxCanvasWidth must be an even number');
-        }
-
-        /**
-         * @private Used to save the current volume when muting so we can
-         * restore once unmuted
-         * @type {number}
-         */
-        _this.savedVolume = 0;
-
-        /**
-         * @private The current muted state
-         * @type {boolean}
-         */
-        _this.isMuted = false;
-
-        /**
-         * @private Will hold a list of event descriptors that need to be
-         * cancelled on subsequent loads of audio
-         * @type {Object[]}
-         */
-        _this.tmpEvents = [];
-
-        /**
-         * @private Holds any running audio downloads
-         * @type {Observer}
-         */
-        _this.currentAjax = null;
-        /** @private */
-        _this.arraybuffer = null;
-        /** @private */
-        _this.drawer = null;
-        /** @private */
-        _this.backend = null;
-        /** @private */
-        _this.peakCache = null;
-
-        // cache constructor objects
-        if (typeof _this.params.renderer !== 'function') {
-            throw new Error('Renderer parameter is invalid');
-        }
-        /**
-         * @private The uninitialised Drawer class
-         */
-        _this.Drawer = _this.params.renderer;
-        /**
-         * @private The uninitialised Backend class
-         */
-        _this.Backend = _this.backends[_this.params.backend];
-
-        /**
-         * @private map of plugin names that are currently initialised
-         */
-        _this.initialisedPluginList = {};
-        /** @private */
-        _this.isDestroyed = false;
-        /** @private */
-        _this.isReady = false;
-
-        // responsive debounced event listener. If this.params.responsive is not
-        // set, this is never called. Use 100ms or this.params.responsive as
-        // timeout for the debounce function.
-        var prevWidth = 0;
-        _this._onResize = util.debounce(function () {
-            if (prevWidth != _this.drawer.wrapper.clientWidth) {
-                prevWidth = _this.drawer.wrapper.clientWidth;
-                _this.empty();
-                _this.drawBuffer();
-            }
-        }, typeof _this.params.responsive === 'number' ? _this.params.responsive : 100);
-
-        return _ret = _this, _possibleConstructorReturn(_this, _ret);
-    }
-
-    /**
-     * Initialise the wave
-     *
-     * @example
-     * var wavesurfer = new WaveSurfer(params);
-     * wavesurfer.init();
-     * @return {this}
-     */
-
-
-    _createClass(WaveSurfer, [{
-        key: 'init',
-        value: function init() {
-            this.registerPlugins(this.params.plugins);
-            this.createDrawer();
-            this.createBackend();
-            this.createPeakCache();
-            return this;
-        }
-
-        /**
-         * Add and initialise array of plugins (if `plugin.deferInit` is falsey),
-         * this function is called in the init function of wavesurfer
-         *
-         * @param {PluginDefinition[]} plugins An array of plugin definitions
-         * @emits {WaveSurfer#plugins-registered} Called with the array of plugin definitions
-         * @return {this}
-         */
-
-    }, {
-        key: 'registerPlugins',
-        value: function registerPlugins(plugins) {
-            var _this2 = this;
-
-            // first instantiate all the plugins
-            plugins.forEach(function (plugin) {
-                return _this2.addPlugin(plugin);
-            });
-
-            // now run the init functions
-            plugins.forEach(function (plugin) {
-                // call init function of the plugin if deferInit is falsey
-                // in that case you would manually use initPlugins()
-                if (!plugin.deferInit) {
-                    _this2.initPlugin(plugin.name);
-                }
-            });
-            this.fireEvent('plugins-registered', plugins);
-            return this;
-        }
-
-        /**
-         * Add a plugin object to wavesurfer
-         *
-         * @param {PluginDefinition} plugin A plugin definition
-         * @emits {WaveSurfer#plugin-added} Called with the name of the plugin that was added
-         * @example wavesurfer.addPlugin(WaveSurfer.minimap());
-         * @return {this}
-         */
-
-    }, {
-        key: 'addPlugin',
-        value: function addPlugin(plugin) {
-            var _this3 = this;
-
-            if (!plugin.name) {
-                throw new Error('Plugin does not have a name!');
-            }
-            if (!plugin.instance) {
-                throw new Error('Plugin ' + plugin.name + ' does not have an instance property!');
-            }
-
-            // staticProps properties are applied to wavesurfer instance
-            if (plugin.staticProps) {
-                Object.keys(plugin.staticProps).forEach(function (pluginStaticProp) {
-                    /**
-                     * Properties defined in a plugin definition's `staticProps` property are added as
-                     * staticProps properties of the WaveSurfer instance
-                     */
-                    _this3[pluginStaticProp] = plugin.staticProps[pluginStaticProp];
-                });
-            }
-
-            var Instance = plugin.instance;
-
-            // turn the plugin instance into an observer
-            var observerPrototypeKeys = Object.getOwnPropertyNames(util.Observer.prototype);
-            observerPrototypeKeys.forEach(function (key) {
-                Instance.prototype[key] = util.Observer.prototype[key];
-            });
-
-            /**
-             * Instantiated plugin classes are added as a property of the wavesurfer
-             * instance
-             * @type {Object}
-             */
-            this[plugin.name] = new Instance(plugin.params || {}, this);
-            this.fireEvent('plugin-added', plugin.name);
-            return this;
-        }
-
-        /**
-         * Initialise a plugin
-         *
-         * @param {string} name A plugin name
-         * @emits WaveSurfer#plugin-initialised
-         * @example wavesurfer.initPlugin('minimap');
-         * @return {this}
-         */
-
-    }, {
-        key: 'initPlugin',
-        value: function initPlugin(name) {
-            if (!this[name]) {
-                throw new Error('Plugin ' + name + ' has not been added yet!');
-            }
-            if (this.initialisedPluginList[name]) {
-                // destroy any already initialised plugins
-                this.destroyPlugin(name);
-            }
-            this[name].init();
-            this.initialisedPluginList[name] = true;
-            this.fireEvent('plugin-initialised', name);
-            return this;
-        }
-
-        /**
-         * Destroy a plugin
-         *
-         * @param {string} name A plugin name
-         * @emits WaveSurfer#plugin-destroyed
-         * @example wavesurfer.destroyPlugin('minimap');
-         * @returns {this}
-         */
-
-    }, {
-        key: 'destroyPlugin',
-        value: function destroyPlugin(name) {
-            if (!this[name]) {
-                throw new Error('Plugin ' + name + ' has not been added yet and cannot be destroyed!');
-            }
-            if (!this.initialisedPluginList[name]) {
-                throw new Error('Plugin ' + name + ' is not active and cannot be destroyed!');
-            }
-            if (typeof this[name].destroy !== 'function') {
-                throw new Error('Plugin ' + name + ' does not have a destroy function!');
-            }
-
-            this[name].destroy();
-            delete this.initialisedPluginList[name];
-            this.fireEvent('plugin-destroyed', name);
-            return this;
-        }
-
-        /**
-         * Destroy all initialised plugins. Convenience function to use when
-         * wavesurfer is removed
-         *
-         * @private
-         */
-
-    }, {
-        key: 'destroyAllPlugins',
-        value: function destroyAllPlugins() {
-            var _this4 = this;
-
-            Object.keys(this.initialisedPluginList).forEach(function (name) {
-                return _this4.destroyPlugin(name);
-            });
-        }
-
-        /**
-         * Create the drawer and draw the waveform
-         *
-         * @private
-         * @emits WaveSurfer#drawer-created
-         */
-
-    }, {
-        key: 'createDrawer',
-        value: function createDrawer() {
-            var _this5 = this;
-
-            this.drawer = new this.Drawer(this.container, this.params);
-            this.drawer.init();
-            this.fireEvent('drawer-created', this.drawer);
-
-            if (this.params.responsive) {
-                window.addEventListener('resize', this._onResize, true);
-            }
-
-            this.drawer.on('redraw', function () {
-                _this5.drawBuffer();
-                _this5.drawer.progress(_this5.backend.getPlayedPercents());
-            });
-
-            // Click-to-seek
-            this.drawer.on('click', function (e, progress) {
-                setTimeout(function () {
-                    return _this5.seekTo(progress);
-                }, 0);
-            });
-
-            // Relay the scroll event from the drawer
-            this.drawer.on('scroll', function (e) {
-                if (_this5.params.partialRender) {
-                    _this5.drawBuffer();
-                }
-                _this5.fireEvent('scroll', e);
-            });
-        }
-
-        /**
-         * Create the backend
-         *
-         * @private
-         * @emits WaveSurfer#backend-created
-         */
-
-    }, {
-        key: 'createBackend',
-        value: function createBackend() {
-            var _this6 = this;
-
-            if (this.backend) {
-                this.backend.destroy();
-            }
-
-            // Back compat
-            if (this.params.backend == 'AudioElement') {
-                this.params.backend = 'MediaElement';
-            }
-
-            if (this.params.backend == 'WebAudio' && !this.Backend.prototype.supportsWebAudio.call(null)) {
-                this.params.backend = 'MediaElement';
-            }
-
-            this.backend = new this.Backend(this.params);
-            this.backend.init();
-            this.fireEvent('backend-created', this.backend);
-
-            this.backend.on('finish', function () {
-                return _this6.fireEvent('finish');
-            });
-            this.backend.on('play', function () {
-                return _this6.fireEvent('play');
-            });
-            this.backend.on('pause', function () {
-                return _this6.fireEvent('pause');
-            });
-
-            this.backend.on('audioprocess', function (time) {
-                _this6.drawer.progress(_this6.backend.getPlayedPercents());
-                _this6.fireEvent('audioprocess', time);
-            });
-        }
-
-        /**
-         * Create the peak cache
-         *
-         * @private
-         */
-
-    }, {
-        key: 'createPeakCache',
-        value: function createPeakCache() {
-            if (this.params.partialRender) {
-                this.peakCache = new _peakcache2.default();
-            }
-        }
-
-        /**
-         * Get the duration of the audio clip
-         *
-         * @example const duration = wavesurfer.getDuration();
-         * @return {number} Duration in seconds
-         */
-
-    }, {
-        key: 'getDuration',
-        value: function getDuration() {
-            return this.backend.getDuration();
-        }
-
-        /**
-         * Get the current playback position
-         *
-         * @example const currentTime = wavesurfer.getCurrentTime();
-         * @return {number} Playback position in seconds
-         */
-
-    }, {
-        key: 'getCurrentTime',
-        value: function getCurrentTime() {
-            return this.backend.getCurrentTime();
-        }
-
-        /**
-         * Starts playback from the current position. Optional start and end
-         * measured in seconds can be used to set the range of audio to play.
-         *
-         * @param {?number} start Position to start at
-         * @param {?number} end Position to end at
-         * @emits WaveSurfer#interaction
-         * @example
-         * // play from second 1 to 5
-         * wavesurfer.play(1, 5);
-         */
-
-    }, {
-        key: 'play',
-        value: function play(start, end) {
-            var _this7 = this;
-
-            this.fireEvent('interaction', function () {
-                return _this7.play(start, end);
-            });
-            this.backend.play(start, end);
-        }
-
-        /**
-         * Stops playback
-         *
-         * @example wavesurfer.pause();
-         */
-
-    }, {
-        key: 'pause',
-        value: function pause() {
-            this.backend.isPaused() || this.backend.pause();
-        }
-
-        /**
-         * Toggle playback
-         *
-         * @example wavesurfer.playPause();
-         */
-
-    }, {
-        key: 'playPause',
-        value: function playPause() {
-            this.backend.isPaused() ? this.play() : this.pause();
-        }
-
-        /**
-         * Get the current playback state
-         *
-         * @example const isPlaying = wavesurfer.isPlaying();
-         * @return {boolean} False if paused, true if playing
-         */
-
-    }, {
-        key: 'isPlaying',
-        value: function isPlaying() {
-            return !this.backend.isPaused();
-        }
-
-        /**
-         * Skip backward
-         *
-         * @param {?number} seconds Amount to skip back, if not specified `skipLength`
-         * is used
-         * @example wavesurfer.skipBackward();
-         */
-
-    }, {
-        key: 'skipBackward',
-        value: function skipBackward(seconds) {
-            this.skip(-seconds || -this.params.skipLength);
-        }
-
-        /**
-         * Skip forward
-         *
-         * @param {?number} seconds Amount to skip back, if not specified `skipLength`
-         * is used
-         * @example wavesurfer.skipForward();
-         */
-
-    }, {
-        key: 'skipForward',
-        value: function skipForward(seconds) {
-            this.skip(seconds || this.params.skipLength);
-        }
-
-        /**
-         * Skip a number of seconds from the current position (use a negative value
-         * to go backwards).
-         *
-         * @param {number} offset Amount to skip back or forwards
-         * @example
-         * // go back 2 seconds
-         * wavesurfer.skip(-2);
-         */
-
-    }, {
-        key: 'skip',
-        value: function skip(offset) {
-            var duration = this.getDuration() || 1;
-            var position = this.getCurrentTime() || 0;
-            position = Math.max(0, Math.min(duration, position + (offset || 0)));
-            this.seekAndCenter(position / duration);
-        }
-
-        /**
-         * Seeks to a position and centers the view
-         *
-         * @param {number} progress Between 0 (=beginning) and 1 (=end)
-         * @example
-         * // seek and go to the middle of the audio
-         * wavesurfer.seekTo(0.5);
-         */
-
-    }, {
-        key: 'seekAndCenter',
-        value: function seekAndCenter(progress) {
-            this.seekTo(progress);
-            this.drawer.recenter(progress);
-        }
-
-        /**
-         * Seeks to a position
-         *
-         * @param {number} progress Between 0 (=beginning) and 1 (=end)
-         * @emits WaveSurfer#interaction
-         * @emits WaveSurfer#seek
-         * @example
-         * // seek to the middle of the audio
-         * wavesurfer.seekTo(0.5);
-         */
-
-    }, {
-        key: 'seekTo',
-        value: function seekTo(progress) {
-            var _this8 = this;
-
-            this.fireEvent('interaction', function () {
-                return _this8.seekTo(progress);
-            });
-
-            var paused = this.backend.isPaused();
-            // avoid draw wrong position while playing backward seeking
-            if (!paused) {
-                this.backend.pause();
-            }
-            // avoid small scrolls while paused seeking
-            var oldScrollParent = this.params.scrollParent;
-            this.params.scrollParent = false;
-            this.backend.seekTo(progress * this.getDuration());
-            this.drawer.progress(this.backend.getPlayedPercents());
-
-            if (!paused) {
-                this.backend.play();
-            }
-            this.params.scrollParent = oldScrollParent;
-            this.fireEvent('seek', progress);
-        }
-
-        /**
-         * Stops and goes to the beginning.
-         *
-         * @example wavesurfer.stop();
-         */
-
-    }, {
-        key: 'stop',
-        value: function stop() {
-            this.pause();
-            this.seekTo(0);
-            this.drawer.progress(0);
-        }
-
-        /**
-         * Set the playback volume.
-         *
-         * @param {number} newVolume A value between 0 and 1, 0 being no
-         * volume and 1 being full volume.
-         */
-
-    }, {
-        key: 'setVolume',
-        value: function setVolume(newVolume) {
-            this.backend.setVolume(newVolume);
-        }
-
-        /**
-         * Get the playback volume.
-         *
-         * @return {number} A value between 0 and 1, 0 being no
-         * volume and 1 being full volume.
-         */
-
-    }, {
-        key: 'getVolume',
-        value: function getVolume() {
-            return this.backend.getVolume();
-        }
-
-        /**
-         * Set the playback rate.
-         *
-         * @param {number} rate A positive number. E.g. 0.5 means half the normal
-         * speed, 2 means double speed and so on.
-         * @example wavesurfer.setPlaybackRate(2);
-         */
-
-    }, {
-        key: 'setPlaybackRate',
-        value: function setPlaybackRate(rate) {
-            this.backend.setPlaybackRate(rate);
-        }
-
-        /**
-         * Get the playback rate.
-         *
-         * @return {number}
-         */
-
-    }, {
-        key: 'getPlaybackRate',
-        value: function getPlaybackRate() {
-            return this.backend.getPlaybackRate();
-        }
-
-        /**
-         * Toggle the volume on and off. It not currenly muted it will save the
-         * current volume value and turn the volume off. If currently muted then it
-         * will restore the volume to the saved value, and then rest the saved
-         * value.
-         *
-         * @example wavesurfer.toggleMute();
-         */
-
-    }, {
-        key: 'toggleMute',
-        value: function toggleMute() {
-            this.setMute(!this.isMuted);
-        }
-
-        /**
-         * Enable or disable muted audio
-         *
-         * @param {boolean} mute
-         * @example
-         * // unmute
-         * wavesurfer.setMute(false);
-         */
-
-    }, {
-        key: 'setMute',
-        value: function setMute(mute) {
-            // ignore all muting requests if the audio is already in that state
-            if (mute === this.isMuted) {
-                return;
-            }
-
-            if (mute) {
-                // If currently not muted then save current volume,
-                // turn off the volume and update the mute properties
-                this.savedVolume = this.backend.getVolume();
-                this.backend.setVolume(0);
-                this.isMuted = true;
-            } else {
-                // If currently muted then restore to the saved volume
-                // and update the mute properties
-                this.backend.setVolume(this.savedVolume);
-                this.isMuted = false;
-            }
-        }
-
-        /**
-         * Get the current mute status.
-         *
-         * @example const isMuted = wavesurfer.getMute();
-         * @return {boolean}
-         */
-
-    }, {
-        key: 'getMute',
-        value: function getMute() {
-            return this.isMuted;
-        }
-
-        /**
-         * Toggles `scrollParent` and redraws
-         *
-         * @example wavesurfer.toggleScroll();
-         */
-
-    }, {
-        key: 'toggleScroll',
-        value: function toggleScroll() {
-            this.params.scrollParent = !this.params.scrollParent;
-            this.drawBuffer();
-        }
-
-        /**
-         * Toggle mouse interaction
-         *
-         * @example wavesurfer.toggleInteraction();
-         */
-
-    }, {
-        key: 'toggleInteraction',
-        value: function toggleInteraction() {
-            this.params.interact = !this.params.interact;
-        }
-
-        /**
-         * Get the correct peaks for current wave viewport and render wave
-         *
-         * @private
-         * @emits WaveSurfer#redraw
-         */
-
-    }, {
-        key: 'drawBuffer',
-        value: function drawBuffer() {
-            var nominalWidth = Math.round(this.getDuration() * this.params.minPxPerSec * this.params.pixelRatio);
-            var parentWidth = this.drawer.getWidth();
-            var width = nominalWidth;
-            var start = this.drawer.getScrollX();
-            var end = Math.min(start + parentWidth, width);
-
-            // Fill container
-            if (this.params.fillParent && (!this.params.scrollParent || nominalWidth < parentWidth)) {
-                width = parentWidth;
-                start = 0;
-                end = width;
-            }
-
-            var peaks = void 0;
-            if (this.params.partialRender) {
-                var newRanges = this.peakCache.addRangeToPeakCache(width, start, end);
-                var i = void 0;
-                for (i = 0; i < newRanges.length; i++) {
-                    peaks = this.backend.getPeaks(width, newRanges[i][0], newRanges[i][1]);
-                    this.drawer.drawPeaks(peaks, width, newRanges[i][0], newRanges[i][1]);
-                }
-            } else {
-                start = 0;
-                end = width;
-                peaks = this.backend.getPeaks(width, start, end);
-                this.drawer.drawPeaks(peaks, width, start, end);
-            }
-            this.fireEvent('redraw', peaks, width);
-        }
-
-        /**
-         * Horizontally zooms the waveform in and out. It also changes the parameter
-         * `minPxPerSec` and enables the `scrollParent` option.
-         *
-         * @param {number} pxPerSec Number of horizontal pixels per second of audio
-         * @emits WaveSurfer#zoom
-         * @example wavesurfer.zoom(20);
-         */
-
-    }, {
-        key: 'zoom',
-        value: function zoom(pxPerSec) {
-            this.params.minPxPerSec = pxPerSec;
-
-            this.params.scrollParent = true;
-
-            this.drawBuffer();
-            this.drawer.progress(this.backend.getPlayedPercents());
-
-            this.drawer.recenter(this.getCurrentTime() / this.getDuration());
-            this.fireEvent('zoom', pxPerSec);
-        }
-
-        /**
-         * Decode buffer and load
-         *
-         * @private
-         * @param {ArrayBuffer} arraybuffer
-         */
-
-    }, {
-        key: 'loadArrayBuffer',
-        value: function loadArrayBuffer(arraybuffer) {
-            var _this9 = this;
-
-            this.decodeArrayBuffer(arraybuffer, function (data) {
-                if (!_this9.isDestroyed) {
-                    _this9.loadDecodedBuffer(data);
-                }
-            });
-        }
-
-        /**
-         * Directly load an externally decoded AudioBuffer
-         *
-         * @private
-         * @param {AudioBuffer} buffer
-         * @emits WaveSurfer#ready
-         */
-
-    }, {
-        key: 'loadDecodedBuffer',
-        value: function loadDecodedBuffer(buffer) {
-            this.backend.load(buffer);
-            this.drawBuffer();
-            this.fireEvent('ready');
-            this.isReady = true;
-        }
-
-        /**
-         * Loads audio data from a Blob or File object
-         *
-         * @param {Blob|File} blob Audio data
-         * @example
-         */
-
-    }, {
-        key: 'loadBlob',
-        value: function loadBlob(blob) {
-            var _this10 = this;
-
-            // Create file reader
-            var reader = new FileReader();
-            reader.addEventListener('progress', function (e) {
-                return _this10.onProgress(e);
-            });
-            reader.addEventListener('load', function (e) {
-                return _this10.loadArrayBuffer(e.target.result);
-            });
-            reader.addEventListener('error', function () {
-                return _this10.fireEvent('error', 'Error reading file');
-            });
-            reader.readAsArrayBuffer(blob);
-            this.empty();
-        }
-
-        /**
-         * Loads audio and re-renders the waveform.
-         *
-         * @param {string} url The url of the audio file
-         * @param {?number[]|number[][]} peaks Wavesurfer does not have to decode the audio to
-         * render the waveform if this is specified
-         * @param {?string} preload (Use with backend `MediaElement`)
-         * `'none'|'metadata'|'auto'` Preload attribute for the media element
-         * @example
-         * // using ajax or media element to load (depending on backend)
-         * wavesurfer.load('http://example.com/demo.wav');
-         *
-         * // setting preload attribute with media element backend and supplying
-         * peaks wavesurfer.load(
-         *   'http://example.com/demo.wav',
-         *   [0.0218, 0.0183, 0.0165, 0.0198, 0.2137, 0.2888],
-         *   true,
-         * );
-         */
-
-    }, {
-        key: 'load',
-        value: function load(url, peaks, preload) {
-            this.empty();
-
-            switch (this.params.backend) {
-                case 'WebAudio':
-                    return this.loadBuffer(url, peaks);
-                case 'MediaElement':
-                    return this.loadMediaElement(url, peaks, preload);
-            }
-        }
-
-        /**
-         * Loads audio using Web Audio buffer backend.
-         *
-         * @private
-         * @param {string} url
-         * @param {?number[]|number[][]} peaks
-         */
-
-    }, {
-        key: 'loadBuffer',
-        value: function loadBuffer(url, peaks) {
-            var _this11 = this;
-
-            var load = function load(action) {
-                if (action) {
-                    _this11.tmpEvents.push(_this11.once('ready', action));
-                }
-                return _this11.getArrayBuffer(url, function (data) {
-                    return _this11.loadArrayBuffer(data);
-                });
-            };
-
-            if (peaks) {
-                this.backend.setPeaks(peaks);
-                this.drawBuffer();
-                this.tmpEvents.push(this.once('interaction', load));
-            } else {
-                return load();
-            }
-        }
-
-        /**
-         * Either create a media element, or load an existing media element.
-         *
-         * @private
-         * @param {string|HTMLElement} urlOrElt Either a path to a media file, or an
-         * existing HTML5 Audio/Video Element
-         * @param {number[]|number[][]} peaks Array of peaks. Required to bypass web audio
-         * dependency
-         * @param {?boolean} preload Set to true if the preload attribute of the
-         * audio element should be enabled
-         */
-
-    }, {
-        key: 'loadMediaElement',
-        value: function loadMediaElement(urlOrElt, peaks, preload) {
-            var _this12 = this;
-
-            var url = urlOrElt;
-
-            if (typeof urlOrElt === 'string') {
-                this.backend.load(url, this.mediaContainer, peaks, preload);
-            } else {
-                var elt = urlOrElt;
-                this.backend.loadElt(elt, peaks);
-
-                // If peaks are not provided,
-                // url = element.src so we can get peaks with web audio
-                url = elt.src;
-            }
-
-            this.tmpEvents.push(this.backend.once('canplay', function () {
-                _this12.drawBuffer();
-                _this12.fireEvent('ready');
-            }), this.backend.once('error', function (err) {
-                return _this12.fireEvent('error', err);
-            }));
-
-            // If no pre-decoded peaks provided or pre-decoded peaks are
-            // provided with forceDecode flag, attempt to download the
-            // audio file and decode it with Web Audio.
-            if (peaks) {
-                this.backend.setPeaks(peaks);
-            }
-
-            if ((!peaks || this.params.forceDecode) && this.backend.supportsWebAudio()) {
-                this.getArrayBuffer(url, function (arraybuffer) {
-                    _this12.decodeArrayBuffer(arraybuffer, function (buffer) {
-                        _this12.backend.buffer = buffer;
-                        _this12.backend.setPeaks(null);
-                        _this12.drawBuffer();
-                        _this12.fireEvent('waveform-ready');
-                    });
-                });
-            }
-        }
-
-        /**
-         * Decode an array buffer and pass data to a callback
-         *
-         * @private
-         * @param {Object} arraybuffer
-         * @param {function} callback
-         */
-
-    }, {
-        key: 'decodeArrayBuffer',
-        value: function decodeArrayBuffer(arraybuffer, callback) {
-            var _this13 = this;
-
-            this.arraybuffer = arraybuffer;
-
-            this.backend.decodeArrayBuffer(arraybuffer, function (data) {
-                // Only use the decoded data if we haven't been destroyed or
-                // another decode started in the meantime
-                if (!_this13.isDestroyed && _this13.arraybuffer == arraybuffer) {
-                    callback(data);
-                    _this13.arraybuffer = null;
-                }
-            }, function () {
-                return _this13.fireEvent('error', 'Error decoding audiobuffer');
-            });
-        }
-
-        /**
-         * Load an array buffer by ajax and pass to a callback
-         *
-         * @param {string} url
-         * @param {function} callback
-         * @private
-         */
-
-    }, {
-        key: 'getArrayBuffer',
-        value: function getArrayBuffer(url, callback) {
-            var _this14 = this;
-
-            var ajax = util.ajax({
-                url: url,
-                responseType: 'arraybuffer'
-            });
-
-            this.currentAjax = ajax;
-
-            this.tmpEvents.push(ajax.on('progress', function (e) {
-                _this14.onProgress(e);
-            }), ajax.on('success', function (data, e) {
-                callback(data);
-                _this14.currentAjax = null;
-            }), ajax.on('error', function (e) {
-                _this14.fireEvent('error', 'XHR error: ' + e.target.statusText);
-                _this14.currentAjax = null;
-            }));
-
-            return ajax;
-        }
-
-        /**
-         * Called while the audio file is loading
-         *
-         * @private
-         * @param {Event} e
-         * @emits WaveSurfer#loading
-         */
-
-    }, {
-        key: 'onProgress',
-        value: function onProgress(e) {
-            var percentComplete = void 0;
-            if (e.lengthComputable) {
-                percentComplete = e.loaded / e.total;
-            } else {
-                // Approximate progress with an asymptotic
-                // function, and assume downloads in the 1-3 MB range.
-                percentComplete = e.loaded / (e.loaded + 1000000);
-            }
-            this.fireEvent('loading', Math.round(percentComplete * 100), e.target);
-        }
-
-        /**
-         * Exports PCM data into a JSON array and opens in a new window.
-         *
-         * @param {number} length=1024 The scale in which to export the peaks. (Integer)
-         * @param {number} accuracy=10000 (Integer)
-         * @param {?boolean} noWindow Set to true to disable opening a new
-         * window with the JSON
-         * @todo Update exportPCM to work with new getPeaks signature
-         * @return {JSON} JSON of peaks
-         */
-
-    }, {
-        key: 'exportPCM',
-        value: function exportPCM(length, accuracy, noWindow) {
-            length = length || 1024;
-            accuracy = accuracy || 10000;
-            noWindow = noWindow || false;
-            var peaks = this.backend.getPeaks(length, accuracy);
-            var arr = [].map.call(peaks, function (val) {
-                return Math.round(val * accuracy) / accuracy;
-            });
-            var json = JSON.stringify(arr);
-            if (!noWindow) {
-                window.open('data:application/json;charset=utf-8,' + encodeURIComponent(json));
-            }
-            return json;
-        }
-
-        /**
-         * Save waveform image as data URI.
-         *
-         * The default format is `image/png`. Other supported types are
-         * `image/jpeg` and `image/webp`.
-         *
-         * @param {string} format='image/png'
-         * @param {number} quality=1
-         * @return {string} data URI of image
-         */
-
-    }, {
-        key: 'exportImage',
-        value: function exportImage(format, quality) {
-            if (!format) {
-                format = 'image/png';
-            }
-            if (!quality) {
-                quality = 1;
-            }
-
-            return this.drawer.getImage(format, quality);
-        }
-
-        /**
-         * Cancel any ajax request currently in progress
-         */
-
-    }, {
-        key: 'cancelAjax',
-        value: function cancelAjax() {
-            if (this.currentAjax) {
-                this.currentAjax.xhr.abort();
-                this.currentAjax = null;
-            }
-        }
-
-        /**
-         * @private
-         */
-
-    }, {
-        key: 'clearTmpEvents',
-        value: function clearTmpEvents() {
-            this.tmpEvents.forEach(function (e) {
-                return e.un();
-            });
-        }
-
-        /**
-         * Display empty waveform.
-         */
-
-    }, {
-        key: 'empty',
-        value: function empty() {
-            if (!this.backend.isPaused()) {
-                this.stop();
-                this.backend.disconnectSource();
-            }
-            this.cancelAjax();
-            this.clearTmpEvents();
-            this.drawer.progress(0);
-            this.drawer.setWidth(0);
-            this.drawer.drawPeaks({ length: this.drawer.getWidth() }, 0);
-        }
-
-        /**
-         * Remove events, elements and disconnect WebAudio nodes.
-         *
-         * @emits WaveSurfer#destroy
-         */
-
-    }, {
-        key: 'destroy',
-        value: function destroy() {
-            this.destroyAllPlugins();
-            this.fireEvent('destroy');
-            this.cancelAjax();
-            this.clearTmpEvents();
-            this.unAll();
-            if (this.params.responsive) {
-                window.removeEventListener('resize', this._onResize, true);
-            }
-            this.backend.destroy();
-            this.drawer.destroy();
-            this.isDestroyed = true;
-            this.arraybuffer = null;
-        }
-    }]);
-
-    return WaveSurfer;
-}(util.Observer);
-
-WaveSurfer.util = util;
-exports.default = WaveSurfer;
-module.exports = exports['default'];
-
-/***/ }),
-/* 14 */
-/***/ (function(module, exports) {
-
-/**
- * Returns a function, that, as long as it continues to be invoked, will not
- * be triggered. The function will be called after it stops being called for
- * N milliseconds. If `immediate` is passed, trigger the function on the
- * leading edge, instead of the trailing. The function also has a property 'clear' 
- * that is a function which will clear the timer to prevent previously scheduled executions. 
- *
- * @source underscore.js
- * @see http://unscriptable.com/2009/03/20/debouncing-javascript-methods/
- * @param {Function} function to wrap
- * @param {Number} timeout in ms (`100`)
- * @param {Boolean} whether to execute at the beginning (`false`)
- * @api public
- */
-
-module.exports = function debounce(func, wait, immediate){
-  var timeout, args, context, timestamp, result;
-  if (null == wait) wait = 100;
-
-  function later() {
-    var last = Date.now() - timestamp;
-
-    if (last < wait && last >= 0) {
-      timeout = setTimeout(later, wait - last);
-    } else {
-      timeout = null;
-      if (!immediate) {
-        result = func.apply(context, args);
-        context = args = null;
-      }
-    }
-  };
-
-  var debounced = function(){
-    context = this;
-    args = arguments;
-    timestamp = Date.now();
-    var callNow = immediate && !timeout;
-    if (!timeout) timeout = setTimeout(later, wait);
-    if (callNow) {
-      result = func.apply(context, args);
-      context = args = null;
-    }
-
-    return result;
-  };
-
-  debounced.clear = function() {
-    if (timeout) {
-      clearTimeout(timeout);
-      timeout = null;
-    }
-  };
-
-  return debounced;
-};
-
-
-/***/ })
-/******/ ]);
-});
-//# sourceMappingURL=wavesurfer.js.map
\ No newline at end of file
diff --git a/dist/wavesurfer.min.js b/dist/wavesurfer.min.js
deleted file mode 100644
index 1ecdc37e9..000000000
--- a/dist/wavesurfer.min.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/*!
- * wavesurfer.js 2.0.0-beta01 (Tue May 02 2017 19:46:40 GMT+0200 (CEST))
- * https://github.com/katspaugh/wavesurfer.js
- * @license CC-BY-3.0
- */
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("WaveSurfer",[],t):"object"==typeof exports?exports.WaveSurfer=t():e.WaveSurfer=t()}(this,function(){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return e[r].call(i.exports,i,i.exports,t),i.l=!0,i.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="localhost:8080/dist/",t(t.s=13)}([function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var i=n(7);Object.defineProperty(t,"ajax",{enumerable:!0,get:function(){return r(i).default}});var a=n(9);Object.defineProperty(t,"getId",{enumerable:!0,get:function(){return r(a).default}});var s=n(10);Object.defineProperty(t,"max",{enumerable:!0,get:function(){return r(s).default}});var o=n(11);Object.defineProperty(t,"min",{enumerable:!0,get:function(){return r(o).default}});var u=n(2);Object.defineProperty(t,"Observer",{enumerable:!0,get:function(){return r(u).default}});var l=n(8);Object.defineProperty(t,"extend",{enumerable:!0,get:function(){return r(l).default}});var c=n(12);Object.defineProperty(t,"style",{enumerable:!0,get:function(){return r(c).default}});var h=n(14);Object.defineProperty(t,"debounce",{enumerable:!0,get:function(){return r(h).default}})},function(e,t,n){"use strict";function r(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function s(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),u=n(0),l=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(u),c="playing",h="paused",f="finished",d=function(e){function t(e){var n,s;i(this,t);var o=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this));return o.audioContext=null,o.offlineAudioContext=null,o.stateBehaviors=(n={},r(n,c,{init:function(){this.addOnAudioProcess()},getPlayedPercents:function(){var e=this.getDuration();return this.getCurrentTime()/e||0},getCurrentTime:function(){return this.startPosition+this.getPlayedTime()}}),r(n,h,{init:function(){this.removeOnAudioProcess()},getPlayedPercents:function(){var e=this.getDuration();return this.getCurrentTime()/e||0},getCurrentTime:function(){return this.startPosition}}),r(n,f,{init:function(){this.removeOnAudioProcess(),this.fireEvent("finish")},getPlayedPercents:function(){return 1},getCurrentTime:function(){return this.getDuration()}}),n),o.params=e,o.ac=e.audioContext||o.getAudioContext(),o.lastPlay=o.ac.currentTime,o.startPosition=0,o.scheduledPause=null,o.states=(s={},r(s,c,Object.create(o.stateBehaviors[c])),r(s,h,Object.create(o.stateBehaviors[h])),r(s,f,Object.create(o.stateBehaviors[f])),s),o.analyser=null,o.buffer=null,o.filters=[],o.gainNode=null,o.mergedPeaks=null,o.offlineAc=null,o.peaks=null,o.playbackRate=1,o.analyser=null,o.scriptNode=null,o.source=null,o.splitPeaks=[],o.state=null,o}return s(t,e),o(t,[{key:"supportsWebAudio",value:function(){return!(!window.AudioContext&&!window.webkitAudioContext)}},{key:"getAudioContext",value:function(){return window.WaveSurferAudioContext||(window.WaveSurferAudioContext=new(window.AudioContext||window.webkitAudioContext)),window.WaveSurferAudioContext}},{key:"getOfflineAudioContext",value:function(e){return window.WaveSurferOfflineAudioContext||(window.WaveSurferOfflineAudioContext=new(window.OfflineAudioContext||window.webkitOfflineAudioContext)(1,2,e)),window.WaveSurferOfflineAudioContext}}]),o(t,[{key:"init",value:function(){this.createVolumeNode(),this.createScriptNode(),this.createAnalyserNode(),this.setState(h),this.setPlaybackRate(this.params.audioRate),this.setLength(0)}},{key:"disconnectFilters",value:function(){this.filters&&(this.filters.forEach(function(e){e&&e.disconnect()}),this.filters=null,this.analyser.connect(this.gainNode))}},{key:"setState",value:function(e){this.state!==this.states[e]&&(this.state=this.states[e],this.state.init.call(this))}},{key:"setFilter",value:function(){for(var e=arguments.length,t=Array(e),n=0;n<e;n++)t[n]=arguments[n];this.setFilters(t)}},{key:"setFilters",value:function(e){this.disconnectFilters(),e&&e.length&&(this.filters=e,this.analyser.disconnect(),e.reduce(function(e,t){return e.connect(t),t},this.analyser).connect(this.gainNode))}},{key:"createScriptNode",value:function(){this.ac.createScriptProcessor?this.scriptNode=this.ac.createScriptProcessor(this.scriptBufferSize):this.scriptNode=this.ac.createJavaScriptNode(this.scriptBufferSize),this.scriptNode.connect(this.ac.destination)}},{key:"addOnAudioProcess",value:function(){var e=this;this.scriptNode.onaudioprocess=function(){var t=e.getCurrentTime();t>=e.getDuration()?(e.setState(f),e.fireEvent("pause")):t>=e.scheduledPause?e.pause():e.state===e.states[c]&&e.fireEvent("audioprocess",t)}}},{key:"removeOnAudioProcess",value:function(){this.scriptNode.onaudioprocess=null}},{key:"createAnalyserNode",value:function(){this.analyser=this.ac.createAnalyser(),this.analyser.connect(this.gainNode)}},{key:"createVolumeNode",value:function(){this.ac.createGain?this.gainNode=this.ac.createGain():this.gainNode=this.ac.createGainNode(),this.gainNode.connect(this.ac.destination)}},{key:"setVolume",value:function(e){this.gainNode.gain.value=e}},{key:"getVolume",value:function(){return this.gainNode.gain.value}},{key:"decodeArrayBuffer",value:function(e,t,n){this.offlineAc||(this.offlineAc=this.getOfflineAudioContext(this.ac?this.ac.sampleRate:44100)),this.offlineAc.decodeAudioData(e,function(e){return t(e)},n)}},{key:"setPeaks",value:function(e){this.peaks=e}},{key:"setLength",value:function(e){if(!this.mergedPeaks||e!=2*this.mergedPeaks.length-1+2){this.splitPeaks=[],this.mergedPeaks=[];var t=this.buffer?this.buffer.numberOfChannels:1,n=void 0;for(n=0;n<t;n++)this.splitPeaks[n]=[],this.splitPeaks[n][2*(e-1)]=0,this.splitPeaks[n][2*(e-1)+1]=0;this.mergedPeaks[2*(e-1)]=0,this.mergedPeaks[2*(e-1)+1]=0}}},{key:"getPeaks",value:function(e,t,n){if(this.peaks)return this.peaks;this.setLength(e);var r=this.buffer.length/e,i=~~(r/10)||1,a=this.buffer.numberOfChannels,s=void 0;for(s=0;s<a;s++){var o=this.splitPeaks[s],u=this.buffer.getChannelData(s),l=void 0;for(l=t;l<=n;l++){var c=~~(l*r),h=~~(c+r),f=0,d=0,p=void 0;for(p=c;p<h;p+=i){var v=u[p];v>d&&(d=v),v<f&&(f=v)}o[2*l]=d,o[2*l+1]=f,(0==s||d>this.mergedPeaks[2*l])&&(this.mergedPeaks[2*l]=d),(0==s||f<this.mergedPeaks[2*l+1])&&(this.mergedPeaks[2*l+1]=f)}}return this.params.splitChannels?this.splitPeaks:this.mergedPeaks}},{key:"getPlayedPercents",value:function(){return this.state.getPlayedPercents.call(this)}},{key:"disconnectSource",value:function(){this.source&&this.source.disconnect()}},{key:"destroy",value:function(){this.isPaused()||this.pause(),this.unAll(),this.buffer=null,this.disconnectFilters(),this.disconnectSource(),this.gainNode.disconnect(),this.scriptNode.disconnect(),this.analyser.disconnect(),this.params.closeAudioContext&&("function"==typeof this.ac.close&&this.ac.close(),this.ac=null,this.params.audioContext?this.params.audioContext=null:window.WaveSurferAudioContext=null,window.WaveSurferOfflineAudioContext=null)}},{key:"load",value:function(e){this.startPosition=0,this.lastPlay=this.ac.currentTime,this.buffer=e,this.createSource()}},{key:"createSource",value:function(){this.disconnectSource(),this.source=this.ac.createBufferSource(),this.source.start=this.source.start||this.source.noteGrainOn,this.source.stop=this.source.stop||this.source.noteOff,this.source.playbackRate.value=this.playbackRate,this.source.buffer=this.buffer,this.source.connect(this.analyser)}},{key:"isPaused",value:function(){return this.state!==this.states[c]}},{key:"getDuration",value:function(){return this.buffer?this.buffer.duration:0}},{key:"seekTo",value:function(e,t){if(this.buffer)return this.scheduledPause=null,null==e&&(e=this.getCurrentTime())>=this.getDuration()&&(e=0),null==t&&(t=this.getDuration()),this.startPosition=e,this.lastPlay=this.ac.currentTime,this.state===this.states[f]&&this.setState(h),{start:e,end:t}}},{key:"getPlayedTime",value:function(){return(this.ac.currentTime-this.lastPlay)*this.playbackRate}},{key:"play",value:function(e,t){if(this.buffer){this.createSource();var n=this.seekTo(e,t);e=n.start,t=n.end,this.scheduledPause=t,this.source.start(0,e,t-e),"suspended"==this.ac.state&&this.ac.resume&&this.ac.resume(),this.setState(c),this.fireEvent("play")}}},{key:"pause",value:function(){this.scheduledPause=null,this.startPosition+=this.getPlayedTime(),this.source&&this.source.stop(0),this.setState(h),this.fireEvent("pause")}},{key:"getCurrentTime",value:function(){return this.state.getCurrentTime.call(this)}},{key:"getPlaybackRate",value:function(){return this.playbackRate}},{key:"setPlaybackRate",value:function(e){e=e||1,this.isPaused()?this.playbackRate=e:(this.pause(),this.playbackRate=e,this.play())}}]),t}(l.Observer);d.scriptBufferSize=256,t.default=d,e.exports=t.default},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=function(){function e(){r(this,e),this.handlers=null}return i(e,[{key:"on",value:function(e,t){var n=this;this.handlers||(this.handlers={});var r=this.handlers[e];return r||(r=this.handlers[e]=[]),r.push(t),{name:e,callback:t,un:function(e,t){return n.un(e,t)}}}},{key:"un",value:function(e,t){if(this.handlers){var n=this.handlers[e],r=void 0;if(n)if(t)for(r=n.length-1;r>=0;r--)n[r]==t&&n.splice(r,1);else n.length=0}}},{key:"unAll",value:function(){this.handlers=null}},{key:"once",value:function(e,t){var n=this,r=function r(){for(var i=arguments.length,a=Array(i),s=0;s<i;s++)a[s]=arguments[s];t.apply(n,a),setTimeout(function(){n.un(e,r)},0)};return this.on(e,r)}},{key:"fireEvent",value:function(e){for(var t=arguments.length,n=Array(t>1?t-1:0),r=1;r<t;r++)n[r-1]=arguments[r];if(this.handlers){var i=this.handlers[e];i&&i.forEach(function(e){e.apply(void 0,n)})}}}]),e}();t.default=a,e.exports=t.default},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),o=n(6),u=function(e){return e&&e.__esModule?e:{default:e}}(o),l=n(0),c=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(l),h=function(e){function t(e,n){r(this,t);var a=i(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e,n));return a.maxCanvasWidth=n.maxCanvasWidth,a.maxCanvasElementWidth=Math.round(n.maxCanvasWidth/n.pixelRatio),a.hasProgressCanvas=n.waveColor!=n.progressColor,a.halfPixel=.5/n.pixelRatio,a.canvases=[],a.progressWave=null,a}return a(t,e),s(t,[{key:"init",value:function(){this.createWrapper(),this.createElements()}},{key:"createElements",value:function(){this.progressWave=this.wrapper.appendChild(this.style(document.createElement("wave"),{position:"absolute",zIndex:2,left:0,top:0,bottom:0,overflow:"hidden",width:"0",display:"none",boxSizing:"border-box",borderRightStyle:"solid",borderRightWidth:this.params.cursorWidth+"px",borderRightColor:this.params.cursorColor})),this.addCanvas()}},{key:"updateSize",value:function(){for(var e=this,t=Math.round(this.width/this.params.pixelRatio),n=Math.ceil(t/this.maxCanvasElementWidth);this.canvases.length<n;)this.addCanvas();for(;this.canvases.length>n;)this.removeCanvas();this.canvases.forEach(function(t,n){var r=e.maxCanvasWidth+2*Math.ceil(e.params.pixelRatio/2);n==e.canvases.length-1&&(r=e.width-e.maxCanvasWidth*(e.canvases.length-1)),e.updateDimensions(t,r,e.height),e.clearWaveForEntry(t)})}},{key:"addCanvas",value:function(){var e={},t=this.maxCanvasElementWidth*this.canvases.length;e.wave=this.wrapper.appendChild(this.style(document.createElement("canvas"),{position:"absolute",zIndex:1,left:t+"px",top:0,bottom:0})),e.waveCtx=e.wave.getContext("2d"),this.hasProgressCanvas&&(e.progress=this.progressWave.appendChild(this.style(document.createElement("canvas"),{position:"absolute",left:t+"px",top:0,bottom:0})),e.progressCtx=e.progress.getContext("2d")),this.canvases.push(e)}},{key:"removeCanvas",value:function(){var e=this.canvases.pop();e.wave.parentElement.removeChild(e.wave),this.hasProgressCanvas&&e.progress.parentElement.removeChild(e.progress)}},{key:"updateDimensions",value:function(e,t,n){var r=Math.round(t/this.params.pixelRatio),i=Math.round(this.width/this.params.pixelRatio);e.start=e.waveCtx.canvas.offsetLeft/i||0,e.end=e.start+r/i,e.waveCtx.canvas.width=t,e.waveCtx.canvas.height=n,this.style(e.waveCtx.canvas,{width:r+"px"}),this.style(this.progressWave,{display:"block"}),this.hasProgressCanvas&&(e.progressCtx.canvas.width=t,e.progressCtx.canvas.height=n,this.style(e.progressCtx.canvas,{width:r+"px"}))}},{key:"clearWave",value:function(){var e=this;this.canvases.forEach(function(t){return e.clearWaveForEntry(t)})}},{key:"clearWaveForEntry",value:function(e){e.waveCtx.clearRect(0,0,e.waveCtx.canvas.width,e.waveCtx.canvas.height),this.hasProgressCanvas&&e.progressCtx.clearRect(0,0,e.progressCtx.canvas.width,e.progressCtx.canvas.height)}},{key:"drawBars",value:function(e,t,n,r){var i=this;if(e[0]instanceof Array){var a=e;if(this.params.splitChannels)return this.setHeight(a.length*this.params.height*this.params.pixelRatio),void a.forEach(function(e,t){return i.drawBars(e,t,n,r)});e=a[0]}var s=[].some.call(e,function(e){return e<0}),o=s?2:1,u=this.width,l=this.params.height*this.params.pixelRatio,h=l*t||0,f=l/2,d=e.length/o,p=this.params.barWidth*this.params.pixelRatio,v=Math.max(this.params.pixelRatio,~~(p/2)),y=p+v,m=1;if(this.params.normalize){var k=c.max(e),g=c.min(e);m=-g>k?-g:k}var b=d/u,w=void 0;for(w=n/b;w<r/b;w+=y){var P=e[Math.floor(w*b*o)]||0,C=Math.round(P/m*f);this.fillRect(w+this.halfPixel,f-C+h,p+this.halfPixel,2*C)}}},{key:"drawWave",value:function(e,t,n,r){var i=this;if(e[0]instanceof Array){var a=e;if(this.params.splitChannels)return this.setHeight(a.length*this.params.height*this.params.pixelRatio),void a.forEach(function(e,t){return i.drawWave(e,t,n,r)});e=a[0]}if(![].some.call(e,function(e){return e<0})){var s=[],o=e.length,u=void 0;for(u=0;u<o;u++)s[2*u]=e[u],s[2*u+1]=-e[u];e=s}var l=this.params.height*this.params.pixelRatio,h=l*t||0,f=l/2,d=1;if(this.params.normalize){var p=c.max(e),v=c.min(e);d=-v>p?-v:p}this.drawLine(e,d,f,h,n,r),this.fillRect(0,f+h-this.halfPixel,this.width,this.halfPixel)}},{key:"drawLine",value:function(e,t,n,r,i,a){var s=this;this.canvases.forEach(function(o){s.setFillStyles(o),s.drawLineToContext(o,o.waveCtx,e,t,n,r,i,a),s.drawLineToContext(o,o.progressCtx,e,t,n,r,i,a)})}},{key:"drawLineToContext",value:function(e,t,n,r,i,a,s,o){if(t){var u=n.length/2,l=1;this.params.fillParent&&this.width!=u&&(l=this.width/u);var c=Math.round(u*e.start),h=Math.round(u*e.end);if(!(c>o||h<s)){var f=Math.max(c,s),d=Math.min(h,o),p=void 0,v=void 0;for(t.beginPath(),t.moveTo((f-c)*l+this.halfPixel,i+a),p=f;p<d;p++){var y=n[2*p]||0,m=Math.round(y/r*i);t.lineTo((p-c)*l+this.halfPixel,i-m+a)}for(v=d-1;v>=f;v--){var k=n[2*v+1]||0,g=Math.round(k/r*i);t.lineTo((v-c)*l+this.halfPixel,i-g+a)}t.closePath(),t.fill()}}}},{key:"fillRect",value:function(e,t,n,r){var i=Math.floor(e/this.maxCanvasWidth),a=Math.min(Math.ceil((e+n)/this.maxCanvasWidth)+1,this.canvases.length),s=void 0;for(s=i;s<a;s++){var o=this.canvases[s],u=s*this.maxCanvasWidth,l={x1:Math.max(e,s*this.maxCanvasWidth),y1:t,x2:Math.min(e+n,s*this.maxCanvasWidth+o.waveCtx.canvas.width),y2:t+r};l.x1<l.x2&&(this.setFillStyles(o),this.fillRectToContext(o.waveCtx,l.x1-u,l.y1,l.x2-l.x1,l.y2-l.y1),this.fillRectToContext(o.progressCtx,l.x1-u,l.y1,l.x2-l.x1,l.y2-l.y1))}}},{key:"fillRectToContext",value:function(e,t,n,r,i){e&&e.fillRect(t,n,r,i)}},{key:"setFillStyles",value:function(e){e.waveCtx.fillStyle=this.params.waveColor,this.hasProgressCanvas&&(e.progressCtx.fillStyle=this.params.progressColor)}},{key:"getImage",value:function(e,t){var n=this.canvases.map(function(n){return n.wave.toDataURL(e,t)});return n.length>1?n:n[0]}},{key:"updateProgress",value:function(e){this.style(this.progressWave,{width:e+"px"})}}]),t}(u.default);t.default=h,e.exports=t.default},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),o=function e(t,n,r){null===t&&(t=Function.prototype);var i=Object.getOwnPropertyDescriptor(t,n);if(void 0===i){var a=Object.getPrototypeOf(t);return null===a?void 0:e(a,n,r)}if("value"in i)return i.value;var s=i.get;if(void 0!==s)return s.call(r)},u=n(1),l=function(e){return e&&e.__esModule?e:{default:e}}(u),c=n(0),h=(function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);t.default=e}(c),function(e){function t(e){r(this,t);var n=i(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n.params=e,n.media={currentTime:0,duration:0,paused:!0,playbackRate:1,play:function(){},pause:function(){}},n.mediaType=e.mediaType.toLowerCase(),n.elementPosition=e.elementPosition,n.peaks=null,n.playbackRate=1,n.buffer=null,n.onPlayEnd=null,n}return a(t,e),s(t,[{key:"init",value:function(){this.setPlaybackRate(this.params.audioRate),this.createTimer()}},{key:"createTimer",value:function(){var e=this,t=function t(){if(!e.isPaused()){e.fireEvent("audioprocess",e.getCurrentTime());(window.requestAnimationFrame||window.webkitRequestAnimationFrame)(t)}};this.on("play",t)}},{key:"load",value:function(e,t,n,r){var i=document.createElement(this.mediaType);i.controls=this.params.mediaControls,i.autoplay=this.params.autoplay||!1,i.preload=null==r?"auto":r,i.src=e,i.style.width="100%";var a=t.querySelector(this.mediaType);a&&t.removeChild(a),t.appendChild(i),this._load(i,n)}},{key:"loadElt",value:function(e,t){e.controls=this.params.mediaControls,e.autoplay=this.params.autoplay||!1,this._load(e,t)}},{key:"_load",value:function(e,t){var n=this;"function"==typeof e.load&&e.load(),e.addEventListener("error",function(){n.fireEvent("error","Error loading media element")}),e.addEventListener("canplay",function(){n.fireEvent("canplay")}),e.addEventListener("ended",function(){n.fireEvent("finish")}),this.media=e,this.peaks=t,this.onPlayEnd=null,this.buffer=null,this.setPlaybackRate(this.playbackRate)}},{key:"isPaused",value:function(){return!this.media||this.media.paused}},{key:"getDuration",value:function(){var e=(this.buffer||this.media).duration;return e>=1/0&&(e=this.media.seekable.end(0)),e}},{key:"getCurrentTime",value:function(){return this.media&&this.media.currentTime}},{key:"getPlayedPercents",value:function(){return this.getCurrentTime()/this.getDuration()||0}},{key:"setPlaybackRate",value:function(e){this.playbackRate=e||1,this.media.playbackRate=this.playbackRate}},{key:"seekTo",value:function(e){null!=e&&(this.media.currentTime=e),this.clearPlayEnd()}},{key:"play",value:function(e,t){this.seekTo(e),this.media.play(),t&&this.setPlayEnd(t),this.fireEvent("play")}},{key:"pause",value:function(){this.media&&this.media.pause(),this.clearPlayEnd(),this.fireEvent("pause")}},{key:"setPlayEnd",value:function(e){var t=this;this._onPlayEnd=function(n){n>=e&&(t.pause(),t.seekTo(e))},this.on("audioprocess",this._onPlayEnd)}},{key:"clearPlayEnd",value:function(){this._onPlayEnd&&(this.un("audioprocess",this._onPlayEnd),this._onPlayEnd=null)}},{key:"getPeaks",value:function(e,n,r){return this.buffer?o(t.prototype.__proto__||Object.getPrototypeOf(t.prototype),"getPeaks",this).call(this,e,n,r):this.peaks||[]}},{key:"getVolume",value:function(){return this.media.volume}},{key:"setVolume",value:function(e){this.media.volume=e}},{key:"destroy",value:function(){this.pause(),this.unAll(),this.media&&this.media.parentNode&&this.media.parentNode.removeChild(this.media),this.media=null}}]),t}(l.default));t.default=h,e.exports=t.default},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=function(){function e(){r(this,e),this.clearPeakCache()}return i(e,[{key:"clearPeakCache",value:function(){this.peakCacheRanges=[],this.peakCacheLength=-1}},{key:"addRangeToPeakCache",value:function(e,t,n){e!=this.peakCacheLength&&(this.clearPeakCache(),this.peakCacheLength=e);for(var r=[],i=0;i<this.peakCacheRanges.length&&this.peakCacheRanges[i]<t;)i++;for(i%2==0&&r.push(t);i<this.peakCacheRanges.length&&this.peakCacheRanges[i]<=n;)r.push(this.peakCacheRanges[i]),i++;i%2==0&&r.push(n),r=r.filter(function(e,t,n){return 0==t?e!=n[t+1]:t==n.length-1?e!=n[t-1]:e!=n[t-1]&&e!=n[t+1]}),this.peakCacheRanges=this.peakCacheRanges.concat(r),this.peakCacheRanges=this.peakCacheRanges.sort(function(e,t){return e-t}).filter(function(e,t,n){return 0==t?e!=n[t+1]:t==n.length-1?e!=n[t-1]:e!=n[t-1]&&e!=n[t+1]});var a=[];for(i=0;i<r.length;i+=2)a.push([r[i],r[i+1]]);return a}},{key:"getCacheRanges",value:function(){var e=[],t=void 0;for(t=0;t<this.peakCacheRanges.length;t+=2)e.push([this.peakCacheRanges[t],this.peakCacheRanges[t+1]]);return e}}]),e}();t.default=a,e.exports=t.default},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),o=n(0),u=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(o),l=function(e){function t(e,n){r(this,t);var a=i(this,(t.__proto__||Object.getPrototypeOf(t)).call(this));return a.container=e,a.params=n,a.width=0,a.height=n.height*a.params.pixelRatio,a.lastPos=0,a.wrapper=null,a}return a(t,e),s(t,[{key:"style",value:function(e,t){return u.style(e,t)}},{key:"createWrapper",value:function(){this.wrapper=this.container.appendChild(document.createElement("wave")),this.style(this.wrapper,{display:"block",position:"relative",userSelect:"none",webkitUserSelect:"none",height:this.params.height+"px"}),(this.params.fillParent||this.params.scrollParent)&&this.style(this.wrapper,{width:"100%",overflowX:this.params.hideScrollbar?"hidden":"auto",overflowY:"hidden"}),this.setupWrapperEvents()}},{key:"handleEvent",value:function(e,t){!t&&e.preventDefault();var n=e.targetTouches?e.targetTouches[0].clientX:e.clientX,r=this.wrapper.getBoundingClientRect(),i=this.width,a=this.getWidth(),s=void 0;return!this.params.fillParent&&i<a?(s=(n-r.left)*this.params.pixelRatio/i||0)>1&&(s=1):s=(n-r.left+this.wrapper.scrollLeft)/this.wrapper.scrollWidth||0,s}},{key:"setupWrapperEvents",value:function(){var e=this;this.wrapper.addEventListener("click",function(t){var n=e.wrapper.offsetHeight-e.wrapper.clientHeight;if(0!=n){var r=e.wrapper.getBoundingClientRect();if(t.clientY>=r.bottom-n)return}e.params.interact&&e.fireEvent("click",t,e.handleEvent(t))}),this.wrapper.addEventListener("scroll",function(t){return e.fireEvent("scroll",t)})}},{key:"drawPeaks",value:function(e,t,n,r){this.setWidth(t),this.params.barWidth?this.drawBars(e,0,n,r):this.drawWave(e,0,n,r)}},{key:"resetScroll",value:function(){null!==this.wrapper&&(this.wrapper.scrollLeft=0)}},{key:"recenter",value:function(e){var t=this.wrapper.scrollWidth*e;this.recenterOnPosition(t,!0)}},{key:"recenterOnPosition",value:function(e,t){var n=this.wrapper.scrollLeft,r=~~(this.wrapper.clientWidth/2),i=this.wrapper.scrollWidth-this.wrapper.clientWidth,a=e-r,s=a-n;if(0!=i){if(!t&&-r<=s&&s<r){s=Math.max(-5,Math.min(5,s)),a=n+s}a=Math.max(0,Math.min(i,a)),a!=n&&(this.wrapper.scrollLeft=a)}}},{key:"getScrollX",value:function(){return Math.round(this.wrapper.scrollLeft*this.params.pixelRatio)}},{key:"getWidth",value:function(){return Math.round(this.container.clientWidth*this.params.pixelRatio)}},{key:"setWidth",value:function(e){this.width!=e&&(this.width=e,this.params.fillParent||this.params.scrollParent?this.style(this.wrapper,{width:""}):this.style(this.wrapper,{width:~~(this.width/this.params.pixelRatio)+"px"}),this.updateSize())}},{key:"setHeight",value:function(e){e!=this.height&&(this.height=e,this.style(this.wrapper,{height:~~(this.height/this.params.pixelRatio)+"px"}),this.updateSize())}},{key:"progress",value:function(e){var t=1/this.params.pixelRatio,n=Math.round(e*this.width)*t;if(n<this.lastPos||n-this.lastPos>=t){if(this.lastPos=n,this.params.scrollParent&&this.params.autoCenter){var r=~~(this.wrapper.scrollWidth*e);this.recenterOnPosition(r)}this.updateProgress(n)}}},{key:"destroy",value:function(){this.unAll(),this.wrapper&&(this.container.removeChild(this.wrapper),this.wrapper=null)}},{key:"updateSize",value:function(){}},{key:"drawBars",value:function(e,t,n,r){}},{key:"drawWave",value:function(e,t,n,r){}},{key:"clearWave",value:function(){}},{key:"updateProgress",value:function(e){}}]),t}(u.Observer);t.default=l,e.exports=t.default},function(e,t,n){"use strict";function r(e){var t=new a.default,n=new XMLHttpRequest,r=!1;return n.open(e.method||"GET",e.url,!0),n.responseType=e.responseType||"json",n.addEventListener("progress",function(e){t.fireEvent("progress",e),e.lengthComputable&&e.loaded==e.total&&(r=!0)}),n.addEventListener("load",function(e){r||t.fireEvent("progress",e),t.fireEvent("load",e),200==n.status||206==n.status?t.fireEvent("success",n.response,e):t.fireEvent("error",e)}),n.addEventListener("error",function(e){return t.fireEvent("error",e)}),n.send(),t.xhr=n,t}Object.defineProperty(t,"__esModule",{value:!0}),t.default=r;var i=n(2),a=function(e){return e&&e.__esModule?e:{default:e}}(i);e.exports=t.default},function(e,t,n){"use strict";function r(e){for(var t=arguments.length,n=Array(t>1?t-1:0),r=1;r<t;r++)n[r-1]=arguments[r];return n.forEach(function(t){Object.keys(t).forEach(function(n){e[n]=t[n]})}),e}Object.defineProperty(t,"__esModule",{value:!0}),t.default=r,e.exports=t.default},function(e,t,n){"use strict";function r(){return"wavesurfer_"+Math.random().toString(32).substring(2)}Object.defineProperty(t,"__esModule",{value:!0}),t.default=r,e.exports=t.default},function(e,t,n){"use strict";function r(e){var t=-1/0;return Object.keys(e).forEach(function(n){e[n]>t&&(t=e[n])}),t}Object.defineProperty(t,"__esModule",{value:!0}),t.default=r,e.exports=t.default},function(e,t,n){"use strict";function r(e){var t=Number(1/0);return Object.keys(e).forEach(function(n){e[n]<t&&(t=e[n])}),t}Object.defineProperty(t,"__esModule",{value:!0}),t.default=r,e.exports=t.default},function(e,t,n){"use strict";function r(e,t){return Object.keys(t).forEach(function(n){e.style[n]!==t[n]&&(e.style[n]=t[n])}),e}Object.defineProperty(t,"__esModule",{value:!0}),t.default=r,e.exports=t.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}function s(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),u=n(0),l=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(u),c=n(3),h=r(c),f=n(1),d=r(f),p=n(4),v=r(p),y=n(5),m=r(y),k=(function(){function e(t,n){s(this,e)}o(e,[{key:"create",value:function(e){}}]),o(e,[{key:"init",value:function(){}},{key:"destroy",value:function(){}}])}(),function(e){function t(e){var n;s(this,t);var r=i(this,(t.__proto__||Object.getPrototypeOf(t)).call(this));if(r.defaultParams={audioContext:null,audioRate:1,autoCenter:!0,backend:"WebAudio",container:null,cursorColor:"#333",cursorWidth:1,dragSelection:!0,fillParent:!0,forceDecode:!0,height:128,hideScrollbar:!1,interact:!0,loopSelection:!0,maxCanvasWidth:4e3,mediaContainer:null,mediaControls:!1,mediaType:"audio",minPxPerSec:20,normalize:!1,partialRender:!1,pixelRatio:window.devicePixelRatio||screen.deviceXDPI/screen.logicalXDPI,plugins:[],progressColor:"#555",renderer:h.default,responsive:!1,scrollParent:!1,skipLength:2,splitChannels:!1,waveColor:"#999"},r.backends={MediaElement:v.default,WebAudio:d.default},r.util=l,r.params=l.extend({},r.defaultParams,e),r.container="string"==typeof e.container?document.querySelector(r.params.container):r.params.container,!r.container)throw new Error("Container element not found");if(null==r.params.mediaContainer?r.mediaContainer=r.container:"string"==typeof r.params.mediaContainer?r.mediaContainer=document.querySelector(r.params.mediaContainer):r.mediaContainer=r.params.mediaContainer,!r.mediaContainer)throw new Error("Media Container element not found");if(r.params.maxCanvasWidth<=1)throw new Error("maxCanvasWidth must be greater than 1");if(r.params.maxCanvasWidth%2==1)throw new Error("maxCanvasWidth must be an even number");if(r.savedVolume=0,r.isMuted=!1,r.tmpEvents=[],r.currentAjax=null,r.arraybuffer=null,r.drawer=null,r.backend=null,r.peakCache=null,"function"!=typeof r.params.renderer)throw new Error("Renderer parameter is invalid");r.Drawer=r.params.renderer,r.Backend=r.backends[r.params.backend],r.initialisedPluginList={},r.isDestroyed=!1,r.isReady=!1;var a=0;return r._onResize=l.debounce(function(){a!=r.drawer.wrapper.clientWidth&&(a=r.drawer.wrapper.clientWidth,r.empty(),r.drawBuffer())},"number"==typeof r.params.responsive?r.params.responsive:100),n=r,i(r,n)}return a(t,e),o(t,null,[{key:"create",value:function(e){return new t(e).init()}}]),o(t,[{key:"init",value:function(){return this.registerPlugins(this.params.plugins),this.createDrawer(),this.createBackend(),this.createPeakCache(),this}},{key:"registerPlugins",value:function(e){var t=this;return e.forEach(function(e){return t.addPlugin(e)}),e.forEach(function(e){e.deferInit||t.initPlugin(e.name)}),this.fireEvent("plugins-registered",e),this}},{key:"addPlugin",value:function(e){var t=this;if(!e.name)throw new Error("Plugin does not have a name!");if(!e.instance)throw new Error("Plugin "+e.name+" does not have an instance property!");e.staticProps&&Object.keys(e.staticProps).forEach(function(n){t[n]=e.staticProps[n]});var n=e.instance;return Object.getOwnPropertyNames(l.Observer.prototype).forEach(function(e){n.prototype[e]=l.Observer.prototype[e]}),this[e.name]=new n(e.params||{},this),this.fireEvent("plugin-added",e.name),this}},{key:"initPlugin",value:function(e){if(!this[e])throw new Error("Plugin "+e+" has not been added yet!");return this.initialisedPluginList[e]&&this.destroyPlugin(e),this[e].init(),this.initialisedPluginList[e]=!0,this.fireEvent("plugin-initialised",e),this}},{key:"destroyPlugin",value:function(e){if(!this[e])throw new Error("Plugin "+e+" has not been added yet and cannot be destroyed!");if(!this.initialisedPluginList[e])throw new Error("Plugin "+e+" is not active and cannot be destroyed!");if("function"!=typeof this[e].destroy)throw new Error("Plugin "+e+" does not have a destroy function!");return this[e].destroy(),delete this.initialisedPluginList[e],this.fireEvent("plugin-destroyed",e),this}},{key:"destroyAllPlugins",value:function(){var e=this;Object.keys(this.initialisedPluginList).forEach(function(t){return e.destroyPlugin(t)})}},{key:"createDrawer",value:function(){var e=this;this.drawer=new this.Drawer(this.container,this.params),this.drawer.init(),this.fireEvent("drawer-created",this.drawer),this.params.responsive&&window.addEventListener("resize",this._onResize,!0),this.drawer.on("redraw",function(){e.drawBuffer(),e.drawer.progress(e.backend.getPlayedPercents())}),this.drawer.on("click",function(t,n){setTimeout(function(){return e.seekTo(n)},0)}),this.drawer.on("scroll",function(t){e.params.partialRender&&e.drawBuffer(),e.fireEvent("scroll",t)})}},{key:"createBackend",value:function(){var e=this;this.backend&&this.backend.destroy(),"AudioElement"==this.params.backend&&(this.params.backend="MediaElement"),"WebAudio"!=this.params.backend||this.Backend.prototype.supportsWebAudio.call(null)||(this.params.backend="MediaElement"),this.backend=new this.Backend(this.params),this.backend.init(),this.fireEvent("backend-created",this.backend),this.backend.on("finish",function(){return e.fireEvent("finish")}),this.backend.on("play",function(){return e.fireEvent("play")}),this.backend.on("pause",function(){return e.fireEvent("pause")}),this.backend.on("audioprocess",function(t){e.drawer.progress(e.backend.getPlayedPercents()),e.fireEvent("audioprocess",t)})}},{key:"createPeakCache",value:function(){this.params.partialRender&&(this.peakCache=new m.default)}},{key:"getDuration",value:function(){return this.backend.getDuration()}},{key:"getCurrentTime",value:function(){return this.backend.getCurrentTime()}},{key:"play",value:function(e,t){var n=this;this.fireEvent("interaction",function(){return n.play(e,t)}),this.backend.play(e,t)}},{key:"pause",value:function(){this.backend.isPaused()||this.backend.pause()}},{key:"playPause",value:function(){this.backend.isPaused()?this.play():this.pause()}},{key:"isPlaying",value:function(){return!this.backend.isPaused()}},{key:"skipBackward",value:function(e){this.skip(-e||-this.params.skipLength)}},{key:"skipForward",value:function(e){this.skip(e||this.params.skipLength)}},{key:"skip",value:function(e){var t=this.getDuration()||1,n=this.getCurrentTime()||0;n=Math.max(0,Math.min(t,n+(e||0))),this.seekAndCenter(n/t)}},{key:"seekAndCenter",value:function(e){this.seekTo(e),this.drawer.recenter(e)}},{key:"seekTo",value:function(e){var t=this;this.fireEvent("interaction",function(){return t.seekTo(e)});var n=this.backend.isPaused();n||this.backend.pause();var r=this.params.scrollParent;this.params.scrollParent=!1,this.backend.seekTo(e*this.getDuration()),this.drawer.progress(this.backend.getPlayedPercents()),n||this.backend.play(),this.params.scrollParent=r,this.fireEvent("seek",e)}},{key:"stop",value:function(){this.pause(),this.seekTo(0),this.drawer.progress(0)}},{key:"setVolume",value:function(e){this.backend.setVolume(e)}},{key:"getVolume",value:function(){return this.backend.getVolume()}},{key:"setPlaybackRate",value:function(e){this.backend.setPlaybackRate(e)}},{key:"getPlaybackRate",value:function(){return this.backend.getPlaybackRate()}},{key:"toggleMute",value:function(){this.setMute(!this.isMuted)}},{key:"setMute",value:function(e){e!==this.isMuted&&(e?(this.savedVolume=this.backend.getVolume(),this.backend.setVolume(0),this.isMuted=!0):(this.backend.setVolume(this.savedVolume),this.isMuted=!1))}},{key:"getMute",value:function(){return this.isMuted}},{key:"toggleScroll",value:function(){this.params.scrollParent=!this.params.scrollParent,this.drawBuffer()}},{key:"toggleInteraction",value:function(){this.params.interact=!this.params.interact}},{key:"drawBuffer",value:function(){var e=Math.round(this.getDuration()*this.params.minPxPerSec*this.params.pixelRatio),t=this.drawer.getWidth(),n=e,r=this.drawer.getScrollX(),i=Math.min(r+t,n);this.params.fillParent&&(!this.params.scrollParent||e<t)&&(n=t,r=0,i=n);var a=void 0;if(this.params.partialRender){var s=this.peakCache.addRangeToPeakCache(n,r,i),o=void 0;for(o=0;o<s.length;o++)a=this.backend.getPeaks(n,s[o][0],s[o][1]),this.drawer.drawPeaks(a,n,s[o][0],s[o][1])}else r=0,i=n,a=this.backend.getPeaks(n,r,i),this.drawer.drawPeaks(a,n,r,i);this.fireEvent("redraw",a,n)}},{key:"zoom",value:function(e){this.params.minPxPerSec=e,this.params.scrollParent=!0,this.drawBuffer(),this.drawer.progress(this.backend.getPlayedPercents()),this.drawer.recenter(this.getCurrentTime()/this.getDuration()),this.fireEvent("zoom",e)}},{key:"loadArrayBuffer",value:function(e){var t=this;this.decodeArrayBuffer(e,function(e){t.isDestroyed||t.loadDecodedBuffer(e)})}},{key:"loadDecodedBuffer",value:function(e){this.backend.load(e),this.drawBuffer(),this.fireEvent("ready"),this.isReady=!0}},{key:"loadBlob",value:function(e){var t=this,n=new FileReader;n.addEventListener("progress",function(e){return t.onProgress(e)}),n.addEventListener("load",function(e){return t.loadArrayBuffer(e.target.result)}),n.addEventListener("error",function(){return t.fireEvent("error","Error reading file")}),n.readAsArrayBuffer(e),this.empty()}},{key:"load",value:function(e,t,n){switch(this.empty(),this.params.backend){case"WebAudio":return this.loadBuffer(e,t);case"MediaElement":return this.loadMediaElement(e,t,n)}}},{key:"loadBuffer",value:function(e,t){var n=this,r=function(t){return t&&n.tmpEvents.push(n.once("ready",t)),n.getArrayBuffer(e,function(e){return n.loadArrayBuffer(e)})};if(!t)return r();this.backend.setPeaks(t),this.drawBuffer(),this.tmpEvents.push(this.once("interaction",r))}},{key:"loadMediaElement",value:function(e,t,n){var r=this,i=e;if("string"==typeof e)this.backend.load(i,this.mediaContainer,t,n);else{var a=e;this.backend.loadElt(a,t),i=a.src}this.tmpEvents.push(this.backend.once("canplay",function(){r.drawBuffer(),r.fireEvent("ready")}),this.backend.once("error",function(e){return r.fireEvent("error",e)})),t&&this.backend.setPeaks(t),t&&!this.params.forceDecode||!this.backend.supportsWebAudio()||this.getArrayBuffer(i,function(e){r.decodeArrayBuffer(e,function(e){r.backend.buffer=e,r.backend.setPeaks(null),r.drawBuffer(),r.fireEvent("waveform-ready")})})}},{key:"decodeArrayBuffer",value:function(e,t){var n=this;this.arraybuffer=e,this.backend.decodeArrayBuffer(e,function(r){n.isDestroyed||n.arraybuffer!=e||(t(r),n.arraybuffer=null)},function(){return n.fireEvent("error","Error decoding audiobuffer")})}},{key:"getArrayBuffer",value:function(e,t){var n=this,r=l.ajax({url:e,responseType:"arraybuffer"});return this.currentAjax=r,this.tmpEvents.push(r.on("progress",function(e){n.onProgress(e)}),r.on("success",function(e,r){t(e),n.currentAjax=null}),r.on("error",function(e){n.fireEvent("error","XHR error: "+e.target.statusText),n.currentAjax=null})),r}},{key:"onProgress",value:function(e){var t=void 0;t=e.lengthComputable?e.loaded/e.total:e.loaded/(e.loaded+1e6),this.fireEvent("loading",Math.round(100*t),e.target)}},{key:"exportPCM",value:function(e,t,n){e=e||1024,t=t||1e4,n=n||!1;var r=this.backend.getPeaks(e,t),i=[].map.call(r,function(e){return Math.round(e*t)/t}),a=JSON.stringify(i);return n||window.open("data:application/json;charset=utf-8,"+encodeURIComponent(a)),a}},{key:"exportImage",value:function(e,t){return e||(e="image/png"),t||(t=1),this.drawer.getImage(e,t)}},{key:"cancelAjax",value:function(){this.currentAjax&&(this.currentAjax.xhr.abort(),this.currentAjax=null)}},{key:"clearTmpEvents",value:function(){this.tmpEvents.forEach(function(e){return e.un()})}},{key:"empty",value:function(){this.backend.isPaused()||(this.stop(),this.backend.disconnectSource()),this.cancelAjax(),this.clearTmpEvents(),this.drawer.progress(0),this.drawer.setWidth(0),this.drawer.drawPeaks({length:this.drawer.getWidth()},0)}},{key:"destroy",value:function(){this.destroyAllPlugins(),this.fireEvent("destroy"),this.cancelAjax(),this.clearTmpEvents(),this.unAll(),this.params.responsive&&window.removeEventListener("resize",this._onResize,!0),this.backend.destroy(),this.drawer.destroy(),this.isDestroyed=!0,this.arraybuffer=null}}]),t}(l.Observer));k.util=l,t.default=k,e.exports=t.default},function(e,t){e.exports=function(e,t,n){function r(){var l=Date.now()-o;l<t&&l>=0?i=setTimeout(r,t-l):(i=null,n||(u=e.apply(s,a),s=a=null))}var i,a,s,o,u;null==t&&(t=100);var l=function(){s=this,a=arguments,o=Date.now();var l=n&&!i;return i||(i=setTimeout(r,t)),l&&(u=e.apply(s,a),s=a=null),u};return l.clear=function(){i&&(clearTimeout(i),i=null)},l}}])});
-//# sourceMappingURL=wavesurfer.min.js.map
\ No newline at end of file
diff --git a/dist/wavesurfer.min.js.map b/dist/wavesurfer.min.js.map
deleted file mode 100644
index 258fca93e..000000000
--- a/dist/wavesurfer.min.js.map
+++ /dev/null
@@ -1 +0,0 @@
-{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///wavesurfer.min.js","webpack:///webpack/bootstrap 50fae2f3a5eb20a432c2","webpack:///./src/util/index.js","webpack:///./src/webaudio.js","webpack:///./src/util/observer.js","webpack:///./src/drawer.multicanvas.js","webpack:///./src/mediaelement.js","webpack:///./src/peakcache.js","webpack:///./src/drawer.js","webpack:///./src/util/ajax.js","webpack:///./src/util/extend.js","webpack:///./src/util/get-id.js","webpack:///./src/util/max.js","webpack:///./src/util/min.js","webpack:///./src/util/style.js","webpack:///./src/wavesurfer.js","webpack:///./~/debounce/index.js"],"names":["root","factory","exports","module","define","amd","this","modules","__webpack_require__","moduleId","installedModules","i","l","call","m","c","value","d","name","getter","o","Object","defineProperty","configurable","enumerable","get","n","__esModule","object","property","prototype","hasOwnProperty","p","s","_interopRequireDefault","obj","default","_ajax","_getId","_max","_min","_observer","_extend","_style","_debounce","_defineProperty","key","writable","_classCallCheck","instance","Constructor","TypeError","_possibleConstructorReturn","self","ReferenceError","_inherits","subClass","superClass","create","constructor","setPrototypeOf","__proto__","_createClass","defineProperties","target","props","length","descriptor","protoProps","staticProps","_util","util","newObj","PLAYING","PAUSED","FINISHED","WebAudio","_util$Observer","params","_this$stateBehaviors","_this$states","_this","getPrototypeOf","audioContext","offlineAudioContext","stateBehaviors","init","addOnAudioProcess","getPlayedPercents","duration","getDuration","getCurrentTime","startPosition","getPlayedTime","removeOnAudioProcess","fireEvent","ac","getAudioContext","lastPlay","currentTime","scheduledPause","states","analyser","buffer","filters","gainNode","mergedPeaks","offlineAc","peaks","playbackRate","scriptNode","source","splitPeaks","state","window","AudioContext","webkitAudioContext","WaveSurferAudioContext","sampleRate","WaveSurferOfflineAudioContext","OfflineAudioContext","webkitOfflineAudioContext","createVolumeNode","createScriptNode","createAnalyserNode","setState","setPlaybackRate","audioRate","setLength","forEach","filter","disconnect","connect","_len","arguments","Array","_key","setFilters","disconnectFilters","reduce","prev","curr","createScriptProcessor","scriptBufferSize","createJavaScriptNode","destination","_this2","onaudioprocess","time","pause","createAnalyser","createGain","createGainNode","gain","arraybuffer","callback","errback","getOfflineAudioContext","decodeAudioData","data","channels","numberOfChannels","first","last","sampleSize","sampleStep","chan","getChannelData","start","end","min","max","j","splitChannels","isPaused","unAll","disconnectSource","closeAudioContext","close","createSource","createBufferSource","noteGrainOn","stop","noteOff","adjustedTime","seekTo","resume","play","Observer","handlers","event","fn","push","un","e","splice","handler","args","apply","setTimeout","on","_len2","_key2","_drawer","_drawer2","MultiCanvas","_Drawer","container","maxCanvasWidth","maxCanvasElementWidth","Math","round","pixelRatio","hasProgressCanvas","waveColor","progressColor","halfPixel","canvases","progressWave","createWrapper","createElements","wrapper","appendChild","style","document","createElement","position","zIndex","left","top","bottom","overflow","width","display","boxSizing","borderRightStyle","borderRightWidth","cursorWidth","borderRightColor","cursorColor","addCanvas","totalWidth","requiredCanvases","ceil","removeCanvas","entry","canvasWidth","updateDimensions","height","clearWaveForEntry","leftOffset","wave","waveCtx","getContext","progress","progressCtx","lastEntry","pop","parentElement","removeChild","elementWidth","canvas","offsetLeft","_this3","clearRect","channelIndex","_this4","setHeight","channelPeaks","drawBars","hasMinVals","some","val","peakIndexScale","offsetY","halfH","bar","barWidth","gap","step","absmax","normalize","scale","peak","floor","h","fillRect","_this5","drawWave","reflectedPeaks","len","drawLine","_this6","setFillStyles","drawLineToContext","ctx","fillParent","canvasStart","canvasEnd","beginPath","moveTo","lineTo","closePath","fill","x","y","startCanvas","endCanvas","intersection","x1","y1","x2","y2","fillRectToContext","fillStyle","type","quality","images","map","toDataURL","_get","receiver","Function","desc","getOwnPropertyDescriptor","undefined","parent","_webaudio","_webaudio2","MediaElement","_WebAudio","media","paused","mediaType","toLowerCase","elementPosition","onPlayEnd","createTimer","onAudioProcess","requestAnimationFrame","webkitRequestAnimationFrame","url","preload","controls","mediaControls","autoplay","src","prevMedia","querySelector","_load","elt","load","addEventListener","Infinity","seekable","clearPlayEnd","setPlayEnd","_onPlayEnd","volume","parentNode","PeakCache","clearPeakCache","peakCacheRanges","peakCacheLength","uncachedRanges","item","pos","arr","concat","sort","a","b","uncachedRangePairs","peakCacheRangePairs","Drawer","lastPos","el","styles","userSelect","webkitUserSelect","scrollParent","overflowX","hideScrollbar","overflowY","setupWrapperEvents","noPrevent","preventDefault","clientX","targetTouches","bbox","getBoundingClientRect","nominalWidth","parentWidth","getWidth","scrollLeft","scrollWidth","scrollbarHeight","offsetHeight","clientHeight","clientY","interact","handleEvent","setWidth","percent","recenterOnPosition","immediate","half","clientWidth","maxScroll","offset","updateSize","minPxDelta","autoCenter","newPos","updateProgress","ajax","options","_observer2","xhr","XMLHttpRequest","fired100","open","method","responseType","lengthComputable","loaded","total","status","response","send","extend","dest","sources","keys","getId","random","toString","substring","values","largest","smallest","Number","prop","_mediaelement","_mediaelement2","_peakcache","_peakcache2","WaveSurfer","PluginClass","ws","_ret","defaultParams","backend","dragSelection","forceDecode","loopSelection","mediaContainer","minPxPerSec","partialRender","devicePixelRatio","screen","deviceXDPI","logicalXDPI","plugins","renderer","responsive","skipLength","backends","Error","savedVolume","isMuted","tmpEvents","currentAjax","drawer","peakCache","Backend","initialisedPluginList","isDestroyed","isReady","prevWidth","_onResize","debounce","empty","drawBuffer","registerPlugins","createDrawer","createBackend","createPeakCache","plugin","addPlugin","deferInit","initPlugin","pluginStaticProp","Instance","getOwnPropertyNames","destroyPlugin","destroy","supportsWebAudio","_this7","seconds","skip","seekAndCenter","recenter","_this8","oldScrollParent","newVolume","setVolume","getVolume","rate","getPlaybackRate","setMute","mute","getScrollX","newRanges","addRangeToPeakCache","getPeaks","drawPeaks","pxPerSec","_this9","decodeArrayBuffer","loadDecodedBuffer","blob","_this10","reader","FileReader","onProgress","loadArrayBuffer","result","readAsArrayBuffer","loadBuffer","loadMediaElement","_this11","action","once","getArrayBuffer","setPeaks","urlOrElt","_this12","loadElt","err","_this13","_this14","statusText","percentComplete","accuracy","noWindow","json","JSON","stringify","encodeURIComponent","format","getImage","abort","cancelAjax","clearTmpEvents","destroyAllPlugins","removeEventListener","func","wait","later","Date","now","timestamp","timeout","context","debounced","callNow","clear","clearTimeout"],"mappings":"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","file":"wavesurfer.min.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine(\"WaveSurfer\", [], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"WaveSurfer\"] = factory();\n\telse\n\t\troot[\"WaveSurfer\"] = factory();\n})(this, function() {\nreturn \n\n\n// WEBPACK FOOTER //\n// webpack/universalModuleDefinition","(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine(\"WaveSurfer\", [], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"WaveSurfer\"] = factory();\n\telse\n\t\troot[\"WaveSurfer\"] = factory();\n})(this, function() {\nreturn /******/ (function(modules) { // webpackBootstrap\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n/******/\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n/******/\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId]) {\n/******/ \t\t\treturn installedModules[moduleId].exports;\n/******/ \t\t}\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\ti: moduleId,\n/******/ \t\t\tl: false,\n/******/ \t\t\texports: {}\n/******/ \t\t};\n/******/\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n/******/\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.l = true;\n/******/\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n/******/\n/******/\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n/******/\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n/******/\n/******/ \t// identity function for calling harmony imports with the correct context\n/******/ \t__webpack_require__.i = function(value) { return value; };\n/******/\n/******/ \t// define getter function for harmony exports\n/******/ \t__webpack_require__.d = function(exports, name, getter) {\n/******/ \t\tif(!__webpack_require__.o(exports, name)) {\n/******/ \t\t\tObject.defineProperty(exports, name, {\n/******/ \t\t\t\tconfigurable: false,\n/******/ \t\t\t\tenumerable: true,\n/******/ \t\t\t\tget: getter\n/******/ \t\t\t});\n/******/ \t\t}\n/******/ \t};\n/******/\n/******/ \t// getDefaultExport function for compatibility with non-harmony modules\n/******/ \t__webpack_require__.n = function(module) {\n/******/ \t\tvar getter = module && module.__esModule ?\n/******/ \t\t\tfunction getDefault() { return module['default']; } :\n/******/ \t\t\tfunction getModuleExports() { return module; };\n/******/ \t\t__webpack_require__.d(getter, 'a', getter);\n/******/ \t\treturn getter;\n/******/ \t};\n/******/\n/******/ \t// Object.prototype.hasOwnProperty.call\n/******/ \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n/******/\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"localhost:8080/dist/\";\n/******/\n/******/ \t// Load entry module and return exports\n/******/ \treturn __webpack_require__(__webpack_require__.s = 13);\n/******/ })\n/************************************************************************/\n/******/ ([\n/* 0 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n\nvar _ajax = __webpack_require__(7);\n\nObject.defineProperty(exports, 'ajax', {\n  enumerable: true,\n  get: function get() {\n    return _interopRequireDefault(_ajax).default;\n  }\n});\n\nvar _getId = __webpack_require__(9);\n\nObject.defineProperty(exports, 'getId', {\n  enumerable: true,\n  get: function get() {\n    return _interopRequireDefault(_getId).default;\n  }\n});\n\nvar _max = __webpack_require__(10);\n\nObject.defineProperty(exports, 'max', {\n  enumerable: true,\n  get: function get() {\n    return _interopRequireDefault(_max).default;\n  }\n});\n\nvar _min = __webpack_require__(11);\n\nObject.defineProperty(exports, 'min', {\n  enumerable: true,\n  get: function get() {\n    return _interopRequireDefault(_min).default;\n  }\n});\n\nvar _observer = __webpack_require__(2);\n\nObject.defineProperty(exports, 'Observer', {\n  enumerable: true,\n  get: function get() {\n    return _interopRequireDefault(_observer).default;\n  }\n});\n\nvar _extend = __webpack_require__(8);\n\nObject.defineProperty(exports, 'extend', {\n  enumerable: true,\n  get: function get() {\n    return _interopRequireDefault(_extend).default;\n  }\n});\n\nvar _style = __webpack_require__(12);\n\nObject.defineProperty(exports, 'style', {\n  enumerable: true,\n  get: function get() {\n    return _interopRequireDefault(_style).default;\n  }\n});\n\nvar _debounce = __webpack_require__(14);\n\nObject.defineProperty(exports, 'debounce', {\n  enumerable: true,\n  get: function get() {\n    return _interopRequireDefault(_debounce).default;\n  }\n});\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n/***/ }),\n/* 1 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nvar _util = __webpack_require__(0);\n\nvar util = _interopRequireWildcard(_util);\n\nfunction _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\n// using consts to prevent someone writing the string wrong\nvar PLAYING = 'playing';\nvar PAUSED = 'paused';\nvar FINISHED = 'finished';\n\n/**\n * WebAudio backend\n *\n * @extends {Observer}\n */\n\nvar WebAudio = function (_util$Observer) {\n    _inherits(WebAudio, _util$Observer);\n\n    _createClass(WebAudio, [{\n        key: 'supportsWebAudio',\n\n\n        /**\n         * Does the browser support this backend\n         *\n         * @return {boolean}\n         */\n\n        /** @private */\n\n        /** @private */\n        value: function supportsWebAudio() {\n            return !!(window.AudioContext || window.webkitAudioContext);\n        }\n\n        /**\n         * Get the audio context used by this backend or create one\n         *\n         * @return {AudioContext}\n         */\n\n        /** @private */\n\n        /** @private */\n\n    }, {\n        key: 'getAudioContext',\n        value: function getAudioContext() {\n            if (!window.WaveSurferAudioContext) {\n                window.WaveSurferAudioContext = new (window.AudioContext || window.webkitAudioContext)();\n            }\n            return window.WaveSurferAudioContext;\n        }\n\n        /**\n         * Get the offline audio context used by this backend or create one\n         *\n         * @param {number} sampleRate\n         * @return {OfflineAudioContext}\n         */\n\n    }, {\n        key: 'getOfflineAudioContext',\n        value: function getOfflineAudioContext(sampleRate) {\n            if (!window.WaveSurferOfflineAudioContext) {\n                window.WaveSurferOfflineAudioContext = new (window.OfflineAudioContext || window.webkitOfflineAudioContext)(1, 2, sampleRate);\n            }\n            return window.WaveSurferOfflineAudioContext;\n        }\n\n        /**\n         * Construct the backend\n         *\n         * @param {WavesurferParams} params\n         */\n\n    }]);\n\n    function WebAudio(params) {\n        var _this$stateBehaviors, _this$states;\n\n        _classCallCheck(this, WebAudio);\n\n        /** @private */\n        var _this = _possibleConstructorReturn(this, (WebAudio.__proto__ || Object.getPrototypeOf(WebAudio)).call(this));\n\n        _this.audioContext = null;\n        _this.offlineAudioContext = null;\n        _this.stateBehaviors = (_this$stateBehaviors = {}, _defineProperty(_this$stateBehaviors, PLAYING, {\n            init: function init() {\n                this.addOnAudioProcess();\n            },\n            getPlayedPercents: function getPlayedPercents() {\n                var duration = this.getDuration();\n                return this.getCurrentTime() / duration || 0;\n            },\n            getCurrentTime: function getCurrentTime() {\n                return this.startPosition + this.getPlayedTime();\n            }\n        }), _defineProperty(_this$stateBehaviors, PAUSED, {\n            init: function init() {\n                this.removeOnAudioProcess();\n            },\n            getPlayedPercents: function getPlayedPercents() {\n                var duration = this.getDuration();\n                return this.getCurrentTime() / duration || 0;\n            },\n            getCurrentTime: function getCurrentTime() {\n                return this.startPosition;\n            }\n        }), _defineProperty(_this$stateBehaviors, FINISHED, {\n            init: function init() {\n                this.removeOnAudioProcess();\n                this.fireEvent('finish');\n            },\n            getPlayedPercents: function getPlayedPercents() {\n                return 1;\n            },\n            getCurrentTime: function getCurrentTime() {\n                return this.getDuration();\n            }\n        }), _this$stateBehaviors);\n        _this.params = params;\n        /** @private */\n        _this.ac = params.audioContext || _this.getAudioContext();\n        /**@private */\n        _this.lastPlay = _this.ac.currentTime;\n        /** @private */\n        _this.startPosition = 0;\n        /** @private  */\n        _this.scheduledPause = null;\n        /** @private */\n        _this.states = (_this$states = {}, _defineProperty(_this$states, PLAYING, Object.create(_this.stateBehaviors[PLAYING])), _defineProperty(_this$states, PAUSED, Object.create(_this.stateBehaviors[PAUSED])), _defineProperty(_this$states, FINISHED, Object.create(_this.stateBehaviors[FINISHED])), _this$states);\n        /** @private */\n        _this.analyser = null;\n        /** @private */\n        _this.buffer = null;\n        /** @private */\n        _this.filters = [];\n        /** @private */\n        _this.gainNode = null;\n        /** @private */\n        _this.mergedPeaks = null;\n        /** @private */\n        _this.offlineAc = null;\n        /** @private */\n        _this.peaks = null;\n        /** @private */\n        _this.playbackRate = 1;\n        /** @private */\n        _this.analyser = null;\n        /** @private */\n        _this.scriptNode = null;\n        /** @private */\n        _this.source = null;\n        /** @private */\n        _this.splitPeaks = [];\n        /** @private */\n        _this.state = null;\n        return _this;\n    }\n\n    /**\n     * Initialise the backend, called in `wavesurfer.createBackend()`\n     */\n\n\n    _createClass(WebAudio, [{\n        key: 'init',\n        value: function init() {\n            this.createVolumeNode();\n            this.createScriptNode();\n            this.createAnalyserNode();\n\n            this.setState(PAUSED);\n            this.setPlaybackRate(this.params.audioRate);\n            this.setLength(0);\n        }\n\n        /** @private */\n\n    }, {\n        key: 'disconnectFilters',\n        value: function disconnectFilters() {\n            if (this.filters) {\n                this.filters.forEach(function (filter) {\n                    filter && filter.disconnect();\n                });\n                this.filters = null;\n                // Reconnect direct path\n                this.analyser.connect(this.gainNode);\n            }\n        }\n\n        /** @private */\n\n    }, {\n        key: 'setState',\n        value: function setState(state) {\n            if (this.state !== this.states[state]) {\n                this.state = this.states[state];\n                this.state.init.call(this);\n            }\n        }\n\n        /**\n         * Unpacked `setFilters()`\n         *\n         * @param {...AudioNode} filters\n         */\n\n    }, {\n        key: 'setFilter',\n        value: function setFilter() {\n            for (var _len = arguments.length, filters = Array(_len), _key = 0; _key < _len; _key++) {\n                filters[_key] = arguments[_key];\n            }\n\n            this.setFilters(filters);\n        }\n\n        /**\n         * Insert custom Web Audio nodes into the graph\n         *\n         * @param {AudioNode[]} filters Packed filters array\n         * @example\n         * const lowpass = wavesurfer.backend.ac.createBiquadFilter();\n         * wavesurfer.backend.setFilter(lowpass);\n         */\n\n    }, {\n        key: 'setFilters',\n        value: function setFilters(filters) {\n            // Remove existing filters\n            this.disconnectFilters();\n\n            // Insert filters if filter array not empty\n            if (filters && filters.length) {\n                this.filters = filters;\n\n                // Disconnect direct path before inserting filters\n                this.analyser.disconnect();\n\n                // Connect each filter in turn\n                filters.reduce(function (prev, curr) {\n                    prev.connect(curr);\n                    return curr;\n                }, this.analyser).connect(this.gainNode);\n            }\n        }\n\n        /** @private */\n\n    }, {\n        key: 'createScriptNode',\n        value: function createScriptNode() {\n            if (this.ac.createScriptProcessor) {\n                this.scriptNode = this.ac.createScriptProcessor(this.scriptBufferSize);\n            } else {\n                this.scriptNode = this.ac.createJavaScriptNode(this.scriptBufferSize);\n            }\n\n            this.scriptNode.connect(this.ac.destination);\n        }\n\n        /** @private */\n\n    }, {\n        key: 'addOnAudioProcess',\n        value: function addOnAudioProcess() {\n            var _this2 = this;\n\n            this.scriptNode.onaudioprocess = function () {\n                var time = _this2.getCurrentTime();\n\n                if (time >= _this2.getDuration()) {\n                    _this2.setState(FINISHED);\n                    _this2.fireEvent('pause');\n                } else if (time >= _this2.scheduledPause) {\n                    _this2.pause();\n                } else if (_this2.state === _this2.states[PLAYING]) {\n                    _this2.fireEvent('audioprocess', time);\n                }\n            };\n        }\n\n        /** @private */\n\n    }, {\n        key: 'removeOnAudioProcess',\n        value: function removeOnAudioProcess() {\n            this.scriptNode.onaudioprocess = null;\n        }\n\n        /** @private */\n\n    }, {\n        key: 'createAnalyserNode',\n        value: function createAnalyserNode() {\n            this.analyser = this.ac.createAnalyser();\n            this.analyser.connect(this.gainNode);\n        }\n\n        /**\n         * Create the gain node needed to control the playback volume.\n         *\n         * @private\n         */\n\n    }, {\n        key: 'createVolumeNode',\n        value: function createVolumeNode() {\n            // Create gain node using the AudioContext\n            if (this.ac.createGain) {\n                this.gainNode = this.ac.createGain();\n            } else {\n                this.gainNode = this.ac.createGainNode();\n            }\n            // Add the gain node to the graph\n            this.gainNode.connect(this.ac.destination);\n        }\n\n        /**\n         * Set the audio volume\n         *\n         * @param {number} value A floating point value between 0 and 1.\n         */\n\n    }, {\n        key: 'setVolume',\n        value: function setVolume(value) {\n            this.gainNode.gain.value = value;\n        }\n\n        /**\n         * Get the current volume\n         *\n         * @return {number} value A floating point value between 0 and 1.\n         */\n\n    }, {\n        key: 'getVolume',\n        value: function getVolume() {\n            return this.gainNode.gain.value;\n        }\n\n        /** @private */\n\n    }, {\n        key: 'decodeArrayBuffer',\n        value: function decodeArrayBuffer(arraybuffer, callback, errback) {\n            if (!this.offlineAc) {\n                this.offlineAc = this.getOfflineAudioContext(this.ac ? this.ac.sampleRate : 44100);\n            }\n            this.offlineAc.decodeAudioData(arraybuffer, function (data) {\n                return callback(data);\n            }, errback);\n        }\n\n        /**\n         * Set pre-decoded peaks\n         *\n         * @param {Array} peaks\n         */\n\n    }, {\n        key: 'setPeaks',\n        value: function setPeaks(peaks) {\n            this.peaks = peaks;\n        }\n\n        /**\n         * Set the rendered length (different from the length of the audio).\n         *\n         * @param {number} length\n         */\n\n    }, {\n        key: 'setLength',\n        value: function setLength(length) {\n            // No resize, we can preserve the cached peaks.\n            if (this.mergedPeaks && length == 2 * this.mergedPeaks.length - 1 + 2) {\n                return;\n            }\n\n            this.splitPeaks = [];\n            this.mergedPeaks = [];\n            // Set the last element of the sparse array so the peak arrays are\n            // appropriately sized for other calculations.\n            var channels = this.buffer ? this.buffer.numberOfChannels : 1;\n            var c = void 0;\n            for (c = 0; c < channels; c++) {\n                this.splitPeaks[c] = [];\n                this.splitPeaks[c][2 * (length - 1)] = 0;\n                this.splitPeaks[c][2 * (length - 1) + 1] = 0;\n            }\n            this.mergedPeaks[2 * (length - 1)] = 0;\n            this.mergedPeaks[2 * (length - 1) + 1] = 0;\n        }\n\n        /**\n         * Compute the max and min value of the waveform when broken into <length> subranges.\n         *\n         * @param {number} length How many subranges to break the waveform into.\n         * @param {number} first First sample in the required range.\n         * @param {number} last Last sample in the required range.\n         * @return {number[]|number[][]} Array of 2*<length> peaks or array of arrays of\n         * peaks consisting of (max, min) values for each subrange.\n         */\n\n    }, {\n        key: 'getPeaks',\n        value: function getPeaks(length, first, last) {\n            if (this.peaks) {\n                return this.peaks;\n            }\n\n            this.setLength(length);\n\n            var sampleSize = this.buffer.length / length;\n            var sampleStep = ~~(sampleSize / 10) || 1;\n            var channels = this.buffer.numberOfChannels;\n            var c = void 0;\n\n            for (c = 0; c < channels; c++) {\n                var peaks = this.splitPeaks[c];\n                var chan = this.buffer.getChannelData(c);\n                var i = void 0;\n\n                for (i = first; i <= last; i++) {\n                    var start = ~~(i * sampleSize);\n                    var end = ~~(start + sampleSize);\n                    var min = 0;\n                    var max = 0;\n                    var j = void 0;\n\n                    for (j = start; j < end; j += sampleStep) {\n                        var value = chan[j];\n\n                        if (value > max) {\n                            max = value;\n                        }\n\n                        if (value < min) {\n                            min = value;\n                        }\n                    }\n\n                    peaks[2 * i] = max;\n                    peaks[2 * i + 1] = min;\n\n                    if (c == 0 || max > this.mergedPeaks[2 * i]) {\n                        this.mergedPeaks[2 * i] = max;\n                    }\n\n                    if (c == 0 || min < this.mergedPeaks[2 * i + 1]) {\n                        this.mergedPeaks[2 * i + 1] = min;\n                    }\n                }\n            }\n\n            return this.params.splitChannels ? this.splitPeaks : this.mergedPeaks;\n        }\n\n        /**\n         * Get the position from 0 to 1\n         *\n         * @return {number}\n         */\n\n    }, {\n        key: 'getPlayedPercents',\n        value: function getPlayedPercents() {\n            return this.state.getPlayedPercents.call(this);\n        }\n\n        /** @private */\n\n    }, {\n        key: 'disconnectSource',\n        value: function disconnectSource() {\n            if (this.source) {\n                this.source.disconnect();\n            }\n        }\n\n        /**\n         * This is called when wavesurfer is destroyed\n         */\n\n    }, {\n        key: 'destroy',\n        value: function destroy() {\n            if (!this.isPaused()) {\n                this.pause();\n            }\n            this.unAll();\n            this.buffer = null;\n            this.disconnectFilters();\n            this.disconnectSource();\n            this.gainNode.disconnect();\n            this.scriptNode.disconnect();\n            this.analyser.disconnect();\n\n            // close the audioContext if closeAudioContext option is set to true\n            if (this.params.closeAudioContext) {\n                // check if browser supports AudioContext.close()\n                if (typeof this.ac.close === 'function') {\n                    this.ac.close();\n                }\n                // clear the reference to the audiocontext\n                this.ac = null;\n                // clear the actual audiocontext, either passed as param or the\n                // global singleton\n                if (!this.params.audioContext) {\n                    window.WaveSurferAudioContext = null;\n                } else {\n                    this.params.audioContext = null;\n                }\n                // clear the offlineAudioContext\n                window.WaveSurferOfflineAudioContext = null;\n            }\n        }\n\n        /**\n         * Loaded a decoded audio buffer\n         *\n         * @param {Object} buffer\n         */\n\n    }, {\n        key: 'load',\n        value: function load(buffer) {\n            this.startPosition = 0;\n            this.lastPlay = this.ac.currentTime;\n            this.buffer = buffer;\n            this.createSource();\n        }\n\n        /** @private */\n\n    }, {\n        key: 'createSource',\n        value: function createSource() {\n            this.disconnectSource();\n            this.source = this.ac.createBufferSource();\n\n            //adjust for old browsers.\n            this.source.start = this.source.start || this.source.noteGrainOn;\n            this.source.stop = this.source.stop || this.source.noteOff;\n\n            this.source.playbackRate.value = this.playbackRate;\n            this.source.buffer = this.buffer;\n            this.source.connect(this.analyser);\n        }\n\n        /**\n         * Used by `wavesurfer.isPlaying()` and `wavesurfer.playPause()`\n         *\n         * @return {boolean}\n         */\n\n    }, {\n        key: 'isPaused',\n        value: function isPaused() {\n            return this.state !== this.states[PLAYING];\n        }\n\n        /**\n         * Used by `wavesurfer.getDuration()`\n         *\n         * @return {number}\n         */\n\n    }, {\n        key: 'getDuration',\n        value: function getDuration() {\n            if (!this.buffer) {\n                return 0;\n            }\n            return this.buffer.duration;\n        }\n\n        /**\n         * Used by `wavesurfer.seekTo()`\n         *\n         * @param {number} start Position to start at in seconds\n         * @param {number} end Position to end at in seconds\n         * @return {{start: number, end: number}}\n         */\n\n    }, {\n        key: 'seekTo',\n        value: function seekTo(start, end) {\n            if (!this.buffer) {\n                return;\n            }\n\n            this.scheduledPause = null;\n\n            if (start == null) {\n                start = this.getCurrentTime();\n                if (start >= this.getDuration()) {\n                    start = 0;\n                }\n            }\n            if (end == null) {\n                end = this.getDuration();\n            }\n\n            this.startPosition = start;\n            this.lastPlay = this.ac.currentTime;\n\n            if (this.state === this.states[FINISHED]) {\n                this.setState(PAUSED);\n            }\n\n            return {\n                start: start,\n                end: end\n            };\n        }\n\n        /**\n         * Get the playback position in seconds\n         *\n         * @return {number}\n         */\n\n    }, {\n        key: 'getPlayedTime',\n        value: function getPlayedTime() {\n            return (this.ac.currentTime - this.lastPlay) * this.playbackRate;\n        }\n\n        /**\n         * Plays the loaded audio region.\n         *\n         * @param {number} start Start offset in seconds, relative to the beginning\n         * of a clip.\n         * @param {number} end When to stop relative to the beginning of a clip.\n         */\n\n    }, {\n        key: 'play',\n        value: function play(start, end) {\n            if (!this.buffer) {\n                return;\n            }\n\n            // need to re-create source on each playback\n            this.createSource();\n\n            var adjustedTime = this.seekTo(start, end);\n\n            start = adjustedTime.start;\n            end = adjustedTime.end;\n\n            this.scheduledPause = end;\n\n            this.source.start(0, start, end - start);\n\n            if (this.ac.state == 'suspended') {\n                this.ac.resume && this.ac.resume();\n            }\n\n            this.setState(PLAYING);\n\n            this.fireEvent('play');\n        }\n\n        /**\n         * Pauses the loaded audio.\n         */\n\n    }, {\n        key: 'pause',\n        value: function pause() {\n            this.scheduledPause = null;\n\n            this.startPosition += this.getPlayedTime();\n            this.source && this.source.stop(0);\n\n            this.setState(PAUSED);\n\n            this.fireEvent('pause');\n        }\n\n        /**\n        * Returns the current time in seconds relative to the audioclip's\n        * duration.\n        *\n        * @return {number}\n        */\n\n    }, {\n        key: 'getCurrentTime',\n        value: function getCurrentTime() {\n            return this.state.getCurrentTime.call(this);\n        }\n\n        /**\n        * Returns the current playback rate. (0=no playback, 1=normal playback)\n        *\n        * @return {number}\n        */\n\n    }, {\n        key: 'getPlaybackRate',\n        value: function getPlaybackRate() {\n            return this.playbackRate;\n        }\n\n        /**\n         * Set the audio source playback rate.\n         *\n         * @param {number} value\n         */\n\n    }, {\n        key: 'setPlaybackRate',\n        value: function setPlaybackRate(value) {\n            value = value || 1;\n            if (this.isPaused()) {\n                this.playbackRate = value;\n            } else {\n                this.pause();\n                this.playbackRate = value;\n                this.play();\n            }\n        }\n    }]);\n\n    return WebAudio;\n}(util.Observer);\n\nWebAudio.scriptBufferSize = 256;\nexports.default = WebAudio;\nmodule.exports = exports['default'];\n\n/***/ }),\n/* 2 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\n/**\n * @typedef {Object} ListenerDescriptor\n * @property {string} name The name of the event\n * @property {function} callback The callback\n * @property {function} un The function to call to remove the listener\n */\n\n/**\n * Observer class\n */\nvar Observer = function () {\n    /**\n     * Instantiate Observer\n     */\n    function Observer() {\n        _classCallCheck(this, Observer);\n\n        /**\n         * @private\n         * @todo Initialise the handlers here already and remove the conditional\n         * assignment in `on()`\n         */\n        this.handlers = null;\n    }\n    /**\n     * Attach a handler function for an event.\n     *\n     * @param {string} event Name of the event to listen to\n     * @param {function} fn The callback to trigger when the event is fired\n     * @return {ListenerDescriptor}\n     */\n\n\n    _createClass(Observer, [{\n        key: \"on\",\n        value: function on(event, fn) {\n            var _this = this;\n\n            if (!this.handlers) {\n                this.handlers = {};\n            }\n\n            var handlers = this.handlers[event];\n            if (!handlers) {\n                handlers = this.handlers[event] = [];\n            }\n            handlers.push(fn);\n\n            // Return an event descriptor\n            return {\n                name: event,\n                callback: fn,\n                un: function un(e, fn) {\n                    return _this.un(e, fn);\n                }\n            };\n        }\n\n        /**\n         * Remove an event handler.\n         *\n         * @param {string} event Name of the event the listener that should be\n         * removed listens to\n         * @param {function} fn The callback that should be removed\n         */\n\n    }, {\n        key: \"un\",\n        value: function un(event, fn) {\n            if (!this.handlers) {\n                return;\n            }\n\n            var handlers = this.handlers[event];\n            var i = void 0;\n            if (handlers) {\n                if (fn) {\n                    for (i = handlers.length - 1; i >= 0; i--) {\n                        if (handlers[i] == fn) {\n                            handlers.splice(i, 1);\n                        }\n                    }\n                } else {\n                    handlers.length = 0;\n                }\n            }\n        }\n\n        /**\n         * Remove all event handlers.\n         */\n\n    }, {\n        key: \"unAll\",\n        value: function unAll() {\n            this.handlers = null;\n        }\n\n        /**\n         * Attach a handler to an event. The handler is executed at most once per\n         * event type.\n         *\n         * @param {string} event The event to listen to\n         * @param {function} handler The callback that is only to be called once\n         * @return {ListenerDescriptor}\n         */\n\n    }, {\n        key: \"once\",\n        value: function once(event, handler) {\n            var _this2 = this;\n\n            var fn = function fn() {\n                for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {\n                    args[_key] = arguments[_key];\n                }\n\n                /*  eslint-disable no-invalid-this */\n                handler.apply(_this2, args);\n                /*  eslint-enable no-invalid-this */\n                setTimeout(function () {\n                    _this2.un(event, fn);\n                }, 0);\n            };\n            return this.on(event, fn);\n        }\n\n        /**\n         * Manually fire an event\n         *\n         * @param {string} event The event to fire manually\n         * @param {...any} args The arguments with which to call the listeners\n         */\n\n    }, {\n        key: \"fireEvent\",\n        value: function fireEvent(event) {\n            for (var _len2 = arguments.length, args = Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {\n                args[_key2 - 1] = arguments[_key2];\n            }\n\n            if (!this.handlers) {\n                return;\n            }\n            var handlers = this.handlers[event];\n            handlers && handlers.forEach(function (fn) {\n                fn.apply(undefined, args);\n            });\n        }\n    }]);\n\n    return Observer;\n}();\n\nexports.default = Observer;\nmodule.exports = exports[\"default\"];\n\n/***/ }),\n/* 3 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nvar _drawer = __webpack_require__(6);\n\nvar _drawer2 = _interopRequireDefault(_drawer);\n\nvar _util = __webpack_require__(0);\n\nvar util = _interopRequireWildcard(_util);\n\nfunction _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\n/**\n * @typedef {Object} CanvasEntry\n * @private\n * @property {HTMLElement} wave The wave node\n * @property {CanvasRenderingContext2D} waveCtx The canvas rendering context\n * @property {?HTMLElement} progress The progress wave node\n * @property {?CanvasRenderingContext2D} progressCtx The progress wave canvas\n * rendering context\n * @property {?number} start Start of the area the canvas should render, between 0 and 1\n * @property {?number} end End of the area the canvas should render, between 0 and 1\n */\n\n/**\n * MultiCanvas renderer for wavesurfer. Is currently the default and sole built\n * in renderer.\n */\nvar MultiCanvas = function (_Drawer) {\n    _inherits(MultiCanvas, _Drawer);\n\n    /**\n     * @param {HTMLElement} container The container node of the wavesurfer instance\n     * @param {WavesurferParams} params The wavesurfer initialisation options\n     */\n    function MultiCanvas(container, params) {\n        _classCallCheck(this, MultiCanvas);\n\n        /**\n         * @type {number}\n         * @private\n         */\n        var _this = _possibleConstructorReturn(this, (MultiCanvas.__proto__ || Object.getPrototypeOf(MultiCanvas)).call(this, container, params));\n\n        _this.maxCanvasWidth = params.maxCanvasWidth;\n        /**\n         * @private\n         * @type {number}\n         */\n        _this.maxCanvasElementWidth = Math.round(params.maxCanvasWidth / params.pixelRatio);\n\n        /**\n         * Whether or not the progress wave is renderered. If the `waveColor`\n         * and `progressColor` are the same colour it is not.\n         * @type {boolean}\n         */\n        _this.hasProgressCanvas = params.waveColor != params.progressColor;\n        /**\n         * @private\n         * @type {number}\n         */\n        _this.halfPixel = 0.5 / params.pixelRatio;\n        /**\n         * @private\n         * @type {Array}\n         */\n        _this.canvases = [];\n        /** @private */\n        _this.progressWave = null;\n        return _this;\n    }\n\n    /**\n     * Initialise the drawer\n     */\n\n\n    _createClass(MultiCanvas, [{\n        key: 'init',\n        value: function init() {\n            this.createWrapper();\n            this.createElements();\n        }\n\n        /**\n         * Create the canvas elements and style them\n         *\n         * @private\n         */\n\n    }, {\n        key: 'createElements',\n        value: function createElements() {\n            this.progressWave = this.wrapper.appendChild(this.style(document.createElement('wave'), {\n                position: 'absolute',\n                zIndex: 2,\n                left: 0,\n                top: 0,\n                bottom: 0,\n                overflow: 'hidden',\n                width: '0',\n                display: 'none',\n                boxSizing: 'border-box',\n                borderRightStyle: 'solid',\n                borderRightWidth: this.params.cursorWidth + 'px',\n                borderRightColor: this.params.cursorColor\n            }));\n\n            this.addCanvas();\n        }\n\n        /**\n         * Adjust to the updated size by adding or removing canvases\n         */\n\n    }, {\n        key: 'updateSize',\n        value: function updateSize() {\n            var _this2 = this;\n\n            var totalWidth = Math.round(this.width / this.params.pixelRatio);\n            var requiredCanvases = Math.ceil(totalWidth / this.maxCanvasElementWidth);\n\n            while (this.canvases.length < requiredCanvases) {\n                this.addCanvas();\n            }\n\n            while (this.canvases.length > requiredCanvases) {\n                this.removeCanvas();\n            }\n\n            this.canvases.forEach(function (entry, i) {\n                // Add some overlap to prevent vertical white stripes, keep the width even for simplicity.\n                var canvasWidth = _this2.maxCanvasWidth + 2 * Math.ceil(_this2.params.pixelRatio / 2);\n\n                if (i == _this2.canvases.length - 1) {\n                    canvasWidth = _this2.width - _this2.maxCanvasWidth * (_this2.canvases.length - 1);\n                }\n\n                _this2.updateDimensions(entry, canvasWidth, _this2.height);\n                _this2.clearWaveForEntry(entry);\n            });\n        }\n\n        /**\n         * Add a canvas to the canvas list\n         *\n         * @private\n         */\n\n    }, {\n        key: 'addCanvas',\n        value: function addCanvas() {\n            var entry = {};\n            var leftOffset = this.maxCanvasElementWidth * this.canvases.length;\n\n            entry.wave = this.wrapper.appendChild(this.style(document.createElement('canvas'), {\n                position: 'absolute',\n                zIndex: 1,\n                left: leftOffset + 'px',\n                top: 0,\n                bottom: 0\n            }));\n            entry.waveCtx = entry.wave.getContext('2d');\n\n            if (this.hasProgressCanvas) {\n                entry.progress = this.progressWave.appendChild(this.style(document.createElement('canvas'), {\n                    position: 'absolute',\n                    left: leftOffset + 'px',\n                    top: 0,\n                    bottom: 0\n                }));\n                entry.progressCtx = entry.progress.getContext('2d');\n            }\n\n            this.canvases.push(entry);\n        }\n\n        /**\n         * Pop one canvas from the list\n         *\n         * @private\n         */\n\n    }, {\n        key: 'removeCanvas',\n        value: function removeCanvas() {\n            var lastEntry = this.canvases.pop();\n            lastEntry.wave.parentElement.removeChild(lastEntry.wave);\n            if (this.hasProgressCanvas) {\n                lastEntry.progress.parentElement.removeChild(lastEntry.progress);\n            }\n        }\n\n        /**\n         * Update the dimensions of a canvas element\n         *\n         * @private\n         * @param {CanvasEntry} entry\n         * @param {number} width The new width of the element\n         * @param {number} height The new height of the element\n         */\n\n    }, {\n        key: 'updateDimensions',\n        value: function updateDimensions(entry, width, height) {\n            var elementWidth = Math.round(width / this.params.pixelRatio);\n            var totalWidth = Math.round(this.width / this.params.pixelRatio);\n\n            // Where the canvas starts and ends in the waveform, represented as a decimal between 0 and 1.\n            entry.start = entry.waveCtx.canvas.offsetLeft / totalWidth || 0;\n            entry.end = entry.start + elementWidth / totalWidth;\n\n            entry.waveCtx.canvas.width = width;\n            entry.waveCtx.canvas.height = height;\n            this.style(entry.waveCtx.canvas, { width: elementWidth + 'px' });\n\n            this.style(this.progressWave, { display: 'block' });\n\n            if (this.hasProgressCanvas) {\n                entry.progressCtx.canvas.width = width;\n                entry.progressCtx.canvas.height = height;\n                this.style(entry.progressCtx.canvas, { width: elementWidth + 'px' });\n            }\n        }\n\n        /**\n         * Clear the whole waveform\n         */\n\n    }, {\n        key: 'clearWave',\n        value: function clearWave() {\n            var _this3 = this;\n\n            this.canvases.forEach(function (entry) {\n                return _this3.clearWaveForEntry(entry);\n            });\n        }\n\n        /**\n         * Clear one canvas\n         *\n         * @private\n         * @param {CanvasEntry} entry\n         */\n\n    }, {\n        key: 'clearWaveForEntry',\n        value: function clearWaveForEntry(entry) {\n            entry.waveCtx.clearRect(0, 0, entry.waveCtx.canvas.width, entry.waveCtx.canvas.height);\n            if (this.hasProgressCanvas) {\n                entry.progressCtx.clearRect(0, 0, entry.progressCtx.canvas.width, entry.progressCtx.canvas.height);\n            }\n        }\n\n        /**\n         * Draw a waveform with bars\n         *\n         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n         * rendering\n         * @param {number} channelIndex The index of the current channel. Normally\n         * should be 0. Must be an integer.\n         * @param {number} start The x-offset of the beginning of the area that\n         * should be rendered\n         * @param {number} end The x-offset of the end of the area that should be\n         * rendered\n         */\n\n    }, {\n        key: 'drawBars',\n        value: function drawBars(peaks, channelIndex, start, end) {\n            var _this4 = this;\n\n            // Split channels\n            if (peaks[0] instanceof Array) {\n                var channels = peaks;\n                if (this.params.splitChannels) {\n                    this.setHeight(channels.length * this.params.height * this.params.pixelRatio);\n                    channels.forEach(function (channelPeaks, i) {\n                        return _this4.drawBars(channelPeaks, i, start, end);\n                    });\n                    return;\n                }\n                peaks = channels[0];\n            }\n\n            // Bar wave draws the bottom only as a reflection of the top,\n            // so we don't need negative values\n            var hasMinVals = [].some.call(peaks, function (val) {\n                return val < 0;\n            });\n            // Skip every other value if there are negatives.\n            var peakIndexScale = hasMinVals ? 2 : 1;\n\n            // A half-pixel offset makes lines crisp\n            var width = this.width;\n            var height = this.params.height * this.params.pixelRatio;\n            var offsetY = height * channelIndex || 0;\n            var halfH = height / 2;\n            var length = peaks.length / peakIndexScale;\n            var bar = this.params.barWidth * this.params.pixelRatio;\n            var gap = Math.max(this.params.pixelRatio, ~~(bar / 2));\n            var step = bar + gap;\n\n            var absmax = 1;\n            if (this.params.normalize) {\n                var max = util.max(peaks);\n                var min = util.min(peaks);\n                absmax = -min > max ? -min : max;\n            }\n\n            var scale = length / width;\n            var i = void 0;\n\n            for (i = start / scale; i < end / scale; i += step) {\n                var peak = peaks[Math.floor(i * scale * peakIndexScale)] || 0;\n                var h = Math.round(peak / absmax * halfH);\n                this.fillRect(i + this.halfPixel, halfH - h + offsetY, bar + this.halfPixel, h * 2);\n            }\n        }\n\n        /**\n         * Draw a waveform\n         *\n         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n         * rendering\n         * @param {number} channelIndex The index of the current channel. Normally\n         * should be 0\n         * @param {number} start The x-offset of the beginning of the area that\n         * should be rendered\n         * @param {number} end The x-offset of the end of the area that should be\n         * rendered\n         */\n\n    }, {\n        key: 'drawWave',\n        value: function drawWave(peaks, channelIndex, start, end) {\n            var _this5 = this;\n\n            // Split channels\n            if (peaks[0] instanceof Array) {\n                var channels = peaks;\n                if (this.params.splitChannels) {\n                    this.setHeight(channels.length * this.params.height * this.params.pixelRatio);\n                    channels.forEach(function (channelPeaks, i) {\n                        return _this5.drawWave(channelPeaks, i, start, end);\n                    });\n                    return;\n                }\n                peaks = channels[0];\n            }\n\n            // Support arrays without negative peaks\n            var hasMinValues = [].some.call(peaks, function (val) {\n                return val < 0;\n            });\n            if (!hasMinValues) {\n                var reflectedPeaks = [];\n                var len = peaks.length;\n                var i = void 0;\n                for (i = 0; i < len; i++) {\n                    reflectedPeaks[2 * i] = peaks[i];\n                    reflectedPeaks[2 * i + 1] = -peaks[i];\n                }\n                peaks = reflectedPeaks;\n            }\n\n            // A half-pixel offset makes lines crisp\n            var height = this.params.height * this.params.pixelRatio;\n            var offsetY = height * channelIndex || 0;\n            var halfH = height / 2;\n\n            var absmax = 1;\n            if (this.params.normalize) {\n                var max = util.max(peaks);\n                var min = util.min(peaks);\n                absmax = -min > max ? -min : max;\n            }\n\n            this.drawLine(peaks, absmax, halfH, offsetY, start, end);\n\n            // Always draw a median line\n            this.fillRect(0, halfH + offsetY - this.halfPixel, this.width, this.halfPixel);\n        }\n\n        /**\n         * Tell the canvas entries to render their portion of the waveform\n         *\n         * @private\n         * @param {number[]} peaks Peak data\n         * @param {number} absmax Maximum peak value (absolute)\n         * @param {number} halfH Half the height of the waveform\n         * @param {number} offsetY Offset to the top\n         * @param {number} start The x-offset of the beginning of the area that\n         * should be rendered\n         * @param {number} end The x-offset of the end of the area that\n         * should be rendered\n         */\n\n    }, {\n        key: 'drawLine',\n        value: function drawLine(peaks, absmax, halfH, offsetY, start, end) {\n            var _this6 = this;\n\n            this.canvases.forEach(function (entry) {\n                _this6.setFillStyles(entry);\n                _this6.drawLineToContext(entry, entry.waveCtx, peaks, absmax, halfH, offsetY, start, end);\n                _this6.drawLineToContext(entry, entry.progressCtx, peaks, absmax, halfH, offsetY, start, end);\n            });\n        }\n\n        /**\n         * Render the actual waveform line on a canvas\n         *\n         * @private\n         * @param {CanvasEntry} entry\n         * @param {Canvas2DContextAttributes} ctx Essentially `entry.[wave|progress]Ctx`\n         * @param {number[]} peaks\n         * @param {number} absmax Maximum peak value (absolute)\n         * @param {number} halfH Half the height of the waveform\n         * @param {number} offsetY Offset to the top\n         * @param {number} start The x-offset of the beginning of the area that\n         * should be rendered\n         * @param {number} end The x-offset of the end of the area that\n         * should be rendered\n         */\n\n    }, {\n        key: 'drawLineToContext',\n        value: function drawLineToContext(entry, ctx, peaks, absmax, halfH, offsetY, start, end) {\n            if (!ctx) {\n                return;\n            }\n\n            var length = peaks.length / 2;\n\n            var scale = 1;\n            if (this.params.fillParent && this.width != length) {\n                scale = this.width / length;\n            }\n\n            var first = Math.round(length * entry.start);\n            var last = Math.round(length * entry.end);\n            if (first > end || last < start) {\n                return;\n            }\n            var canvasStart = Math.max(first, start);\n            var canvasEnd = Math.min(last, end);\n            var i = void 0;\n            var j = void 0;\n\n            ctx.beginPath();\n            ctx.moveTo((canvasStart - first) * scale + this.halfPixel, halfH + offsetY);\n\n            for (i = canvasStart; i < canvasEnd; i++) {\n                var peak = peaks[2 * i] || 0;\n                var h = Math.round(peak / absmax * halfH);\n                ctx.lineTo((i - first) * scale + this.halfPixel, halfH - h + offsetY);\n            }\n\n            // Draw the bottom edge going backwards, to make a single\n            // closed hull to fill.\n            for (j = canvasEnd - 1; j >= canvasStart; j--) {\n                var _peak = peaks[2 * j + 1] || 0;\n                var _h = Math.round(_peak / absmax * halfH);\n                ctx.lineTo((j - first) * scale + this.halfPixel, halfH - _h + offsetY);\n            }\n\n            ctx.closePath();\n            ctx.fill();\n        }\n\n        /**\n         * Draw a rectangle on the waveform\n         *\n         * @param {number} x\n         * @param {number} y\n         * @param {number} width\n         * @param {number} height\n         */\n\n    }, {\n        key: 'fillRect',\n        value: function fillRect(x, y, width, height) {\n            var startCanvas = Math.floor(x / this.maxCanvasWidth);\n            var endCanvas = Math.min(Math.ceil((x + width) / this.maxCanvasWidth) + 1, this.canvases.length);\n            var i = void 0;\n            for (i = startCanvas; i < endCanvas; i++) {\n                var entry = this.canvases[i];\n                var leftOffset = i * this.maxCanvasWidth;\n\n                var intersection = {\n                    x1: Math.max(x, i * this.maxCanvasWidth),\n                    y1: y,\n                    x2: Math.min(x + width, i * this.maxCanvasWidth + entry.waveCtx.canvas.width),\n                    y2: y + height\n                };\n\n                if (intersection.x1 < intersection.x2) {\n                    this.setFillStyles(entry);\n\n                    this.fillRectToContext(entry.waveCtx, intersection.x1 - leftOffset, intersection.y1, intersection.x2 - intersection.x1, intersection.y2 - intersection.y1);\n\n                    this.fillRectToContext(entry.progressCtx, intersection.x1 - leftOffset, intersection.y1, intersection.x2 - intersection.x1, intersection.y2 - intersection.y1);\n                }\n            }\n        }\n\n        /**\n         * Draw the actual rectangle on a canvas\n         *\n         * @private\n         * @param {Canvas2DContextAttributes} ctx\n         * @param {number} x\n         * @param {number} y\n         * @param {number} width\n         * @param {number} height\n         */\n\n    }, {\n        key: 'fillRectToContext',\n        value: function fillRectToContext(ctx, x, y, width, height) {\n            if (!ctx) {\n                return;\n            }\n            ctx.fillRect(x, y, width, height);\n        }\n\n        /**\n         * Set the fill styles for a certain entry (wave and progress)\n         *\n         * @private\n         * @param {CanvasEntry} entry\n         */\n\n    }, {\n        key: 'setFillStyles',\n        value: function setFillStyles(entry) {\n            entry.waveCtx.fillStyle = this.params.waveColor;\n            if (this.hasProgressCanvas) {\n                entry.progressCtx.fillStyle = this.params.progressColor;\n            }\n        }\n\n        /**\n         * Return image data of the waveform\n         *\n         * @param {string} type='image/png' An optional value of a format type.\n         * @param {number} quality=0.92 An optional value between 0 and 1.\n         * @return {string|string[]} images A data URL or an array of data URLs\n         */\n\n    }, {\n        key: 'getImage',\n        value: function getImage(type, quality) {\n            var images = this.canvases.map(function (entry) {\n                return entry.wave.toDataURL(type, quality);\n            });\n            return images.length > 1 ? images : images[0];\n        }\n\n        /**\n         * Render the new progress\n         *\n         * @param {number} position X-Offset of progress position in pixels\n         */\n\n    }, {\n        key: 'updateProgress',\n        value: function updateProgress(position) {\n            this.style(this.progressWave, { width: position + 'px' });\n        }\n    }]);\n\n    return MultiCanvas;\n}(_drawer2.default);\n\nexports.default = MultiCanvas;\nmodule.exports = exports['default'];\n\n/***/ }),\n/* 4 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nvar _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if (\"value\" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };\n\nvar _webaudio = __webpack_require__(1);\n\nvar _webaudio2 = _interopRequireDefault(_webaudio);\n\nvar _util = __webpack_require__(0);\n\nvar util = _interopRequireWildcard(_util);\n\nfunction _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\n/**\n * MediaElement backend\n */\nvar MediaElement = function (_WebAudio) {\n    _inherits(MediaElement, _WebAudio);\n\n    /**\n     * Construct the backend\n     *\n     * @param {WavesurferParams} params\n     */\n    function MediaElement(params) {\n        _classCallCheck(this, MediaElement);\n\n        /** @private */\n        var _this = _possibleConstructorReturn(this, (MediaElement.__proto__ || Object.getPrototypeOf(MediaElement)).call(this, params));\n\n        _this.params = params;\n\n        // Dummy media to catch errors\n        /** @private */\n        _this.media = {\n            currentTime: 0,\n            duration: 0,\n            paused: true,\n            playbackRate: 1,\n            play: function play() {},\n            pause: function pause() {}\n        };\n\n        /** @private */\n        _this.mediaType = params.mediaType.toLowerCase();\n        /** @private */\n        _this.elementPosition = params.elementPosition;\n        /** @private */\n        _this.peaks = null;\n        /** @private */\n        _this.playbackRate = 1;\n        /** @private */\n        _this.buffer = null;\n        /** @private */\n        _this.onPlayEnd = null;\n        return _this;\n    }\n\n    /**\n     * Initialise the backend, called in `wavesurfer.createBackend()`\n     */\n\n\n    _createClass(MediaElement, [{\n        key: 'init',\n        value: function init() {\n            this.setPlaybackRate(this.params.audioRate);\n            this.createTimer();\n        }\n\n        /**\n         * Create a timer to provide a more precise `audioprocess` event.\n         *\n         * @private\n         */\n\n    }, {\n        key: 'createTimer',\n        value: function createTimer() {\n            var _this2 = this;\n\n            var onAudioProcess = function onAudioProcess() {\n                if (_this2.isPaused()) {\n                    return;\n                }\n                _this2.fireEvent('audioprocess', _this2.getCurrentTime());\n\n                // Call again in the next frame\n                var requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame;\n                requestAnimationFrame(onAudioProcess);\n            };\n\n            this.on('play', onAudioProcess);\n        }\n\n        /**\n         *  Create media element with url as its source,\n         *  and append to container element.\n         *\n         *  @param {string} url Path to media file\n         *  @param {HTMLElement} container HTML element\n         *  @param {Array} peaks Array of peak data\n         *  @param {string} preload HTML 5 preload attribute value\n         */\n\n    }, {\n        key: 'load',\n        value: function load(url, container, peaks, preload) {\n            var media = document.createElement(this.mediaType);\n            media.controls = this.params.mediaControls;\n            media.autoplay = this.params.autoplay || false;\n            media.preload = preload == null ? 'auto' : preload;\n            media.src = url;\n            media.style.width = '100%';\n\n            var prevMedia = container.querySelector(this.mediaType);\n            if (prevMedia) {\n                container.removeChild(prevMedia);\n            }\n            container.appendChild(media);\n\n            this._load(media, peaks);\n        }\n\n        /**\n         *  Load existing media element.\n         *\n         *  @param {MediaElement} elt HTML5 Audio or Video element\n         *  @param {Array} peaks Array of peak data\n         */\n\n    }, {\n        key: 'loadElt',\n        value: function loadElt(elt, peaks) {\n            elt.controls = this.params.mediaControls;\n            elt.autoplay = this.params.autoplay || false;\n\n            this._load(elt, peaks);\n        }\n\n        /**\n         *  Private method called by both load (from url)\n         *  and loadElt (existing media element).\n         *\n         *  @param  {MediaElement}  media     HTML5 Audio or Video element\n         *  @param  {Array}         peaks   array of peak data\n         *  @private\n         */\n\n    }, {\n        key: '_load',\n        value: function _load(media, peaks) {\n            var _this3 = this;\n\n            // load must be called manually on iOS, otherwise peaks won't draw\n            // until a user interaction triggers load --> 'ready' event\n            if (typeof media.load == 'function') {\n                media.load();\n            }\n\n            media.addEventListener('error', function () {\n                _this3.fireEvent('error', 'Error loading media element');\n            });\n\n            media.addEventListener('canplay', function () {\n                _this3.fireEvent('canplay');\n            });\n\n            media.addEventListener('ended', function () {\n                _this3.fireEvent('finish');\n            });\n\n            this.media = media;\n            this.peaks = peaks;\n            this.onPlayEnd = null;\n            this.buffer = null;\n            this.setPlaybackRate(this.playbackRate);\n        }\n\n        /**\n         * Used by `wavesurfer.isPlaying()` and `wavesurfer.playPause()`\n         *\n         * @return {boolean}\n         */\n\n    }, {\n        key: 'isPaused',\n        value: function isPaused() {\n            return !this.media || this.media.paused;\n        }\n\n        /**\n         * Used by `wavesurfer.getDuration()`\n         *\n         * @return {number}\n         */\n\n    }, {\n        key: 'getDuration',\n        value: function getDuration() {\n            var duration = (this.buffer || this.media).duration;\n            if (duration >= Infinity) {\n                // streaming audio\n                duration = this.media.seekable.end(0);\n            }\n            return duration;\n        }\n\n        /**\n        * Returns the current time in seconds relative to the audioclip's\n        * duration.\n        *\n        * @return {number}\n        */\n\n    }, {\n        key: 'getCurrentTime',\n        value: function getCurrentTime() {\n            return this.media && this.media.currentTime;\n        }\n\n        /**\n         * Get the position from 0 to 1\n         *\n         * @return {number}\n         */\n\n    }, {\n        key: 'getPlayedPercents',\n        value: function getPlayedPercents() {\n            return this.getCurrentTime() / this.getDuration() || 0;\n        }\n\n        /**\n         * Set the audio source playback rate.\n         *\n         * @param {number} value\n         */\n\n    }, {\n        key: 'setPlaybackRate',\n        value: function setPlaybackRate(value) {\n            this.playbackRate = value || 1;\n            this.media.playbackRate = this.playbackRate;\n        }\n\n        /**\n         * Used by `wavesurfer.seekTo()`\n         *\n         * @param {number} start Position to start at in seconds\n         */\n\n    }, {\n        key: 'seekTo',\n        value: function seekTo(start) {\n            if (start != null) {\n                this.media.currentTime = start;\n            }\n            this.clearPlayEnd();\n        }\n\n        /**\n         * Plays the loaded audio region.\n         *\n         * @param {Number} start Start offset in seconds, relative to the beginning\n         * of a clip.\n         * @param {Number} end When to stop relative to the beginning of a clip.\n         * @emits MediaElement#play\n         */\n\n    }, {\n        key: 'play',\n        value: function play(start, end) {\n            this.seekTo(start);\n            this.media.play();\n            end && this.setPlayEnd(end);\n            this.fireEvent('play');\n        }\n\n        /**\n         * Pauses the loaded audio.\n         *\n         * @emits MediaElement#pause\n         */\n\n    }, {\n        key: 'pause',\n        value: function pause() {\n            this.media && this.media.pause();\n            this.clearPlayEnd();\n            this.fireEvent('pause');\n        }\n\n        /** @private */\n\n    }, {\n        key: 'setPlayEnd',\n        value: function setPlayEnd(end) {\n            var _this4 = this;\n\n            this._onPlayEnd = function (time) {\n                if (time >= end) {\n                    _this4.pause();\n                    _this4.seekTo(end);\n                }\n            };\n            this.on('audioprocess', this._onPlayEnd);\n        }\n\n        /** @private */\n\n    }, {\n        key: 'clearPlayEnd',\n        value: function clearPlayEnd() {\n            if (this._onPlayEnd) {\n                this.un('audioprocess', this._onPlayEnd);\n                this._onPlayEnd = null;\n            }\n        }\n\n        /**\n         * Compute the max and min value of the waveform when broken into\n         * <length> subranges.\n         *\n         * @param {number} length How many subranges to break the waveform into.\n         * @param {number} first First sample in the required range.\n         * @param {number} last Last sample in the required range.\n         * @return {number[]|number[][]} Array of 2*<length> peaks or array of\n         * arrays of peaks consisting of (max, min) values for each subrange.\n         */\n\n    }, {\n        key: 'getPeaks',\n        value: function getPeaks(length, first, last) {\n            if (this.buffer) {\n                return _get(MediaElement.prototype.__proto__ || Object.getPrototypeOf(MediaElement.prototype), 'getPeaks', this).call(this, length, first, last);\n            }\n            return this.peaks || [];\n        }\n\n        /**\n         * Get the current volume\n         *\n         * @return {number} value A floating point value between 0 and 1.\n         */\n\n    }, {\n        key: 'getVolume',\n        value: function getVolume() {\n            return this.media.volume;\n        }\n\n        /**\n         * Set the audio volume\n         *\n         * @param {number} value A floating point value between 0 and 1.\n         */\n\n    }, {\n        key: 'setVolume',\n        value: function setVolume(value) {\n            this.media.volume = value;\n        }\n\n        /**\n         * This is called when wavesurfer is destroyed\n         *\n         */\n\n    }, {\n        key: 'destroy',\n        value: function destroy() {\n            this.pause();\n            this.unAll();\n            this.media && this.media.parentNode && this.media.parentNode.removeChild(this.media);\n            this.media = null;\n        }\n    }]);\n\n    return MediaElement;\n}(_webaudio2.default);\n\nexports.default = MediaElement;\nmodule.exports = exports['default'];\n\n/***/ }),\n/* 5 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\n/**\n * Caches the decoded peaks data to improve rendering speed for lage audio\n *\n * Is used if the option parameter `partialRender` is set to `true`\n */\nvar PeakCache = function () {\n    /**\n     * Instantiate cache\n     */\n    function PeakCache() {\n        _classCallCheck(this, PeakCache);\n\n        this.clearPeakCache();\n    }\n\n    /**\n     * Empty the cache\n     */\n\n\n    _createClass(PeakCache, [{\n        key: \"clearPeakCache\",\n        value: function clearPeakCache() {\n            /**\n             * Flat array with entries that are always in pairs to mark the\n             * beginning and end of each subrange.  This is a convenience so we can\n             * iterate over the pairs for easy set difference operations.\n             * @private\n             */\n            this.peakCacheRanges = [];\n            /**\n             * Length of the entire cachable region, used for resetting the cache\n             * when this changes (zoom events, for instance).\n             * @private\n             */\n            this.peakCacheLength = -1;\n        }\n\n        /**\n         * Add a range of peaks to the cache\n         *\n         * @param {number} length The length of the range\n         * @param {number} start The x offset of the start of the range\n         * @param {number} end The x offset of the end of the range\n         * @return {number[][]}\n         */\n\n    }, {\n        key: \"addRangeToPeakCache\",\n        value: function addRangeToPeakCache(length, start, end) {\n            if (length != this.peakCacheLength) {\n                this.clearPeakCache();\n                this.peakCacheLength = length;\n            }\n\n            // Return ranges that weren't in the cache before the call.\n            var uncachedRanges = [];\n            var i = 0;\n            // Skip ranges before the current start.\n            while (i < this.peakCacheRanges.length && this.peakCacheRanges[i] < start) {\n                i++;\n            }\n            // If |i| is even, |start| falls after an existing range.  Otherwise,\n            // |start| falls between an existing range, and the uncached region\n            // starts when we encounter the next node in |peakCacheRanges| or\n            // |end|, whichever comes first.\n            if (i % 2 == 0) {\n                uncachedRanges.push(start);\n            }\n            while (i < this.peakCacheRanges.length && this.peakCacheRanges[i] <= end) {\n                uncachedRanges.push(this.peakCacheRanges[i]);\n                i++;\n            }\n            // If |i| is even, |end| is after all existing ranges.\n            if (i % 2 == 0) {\n                uncachedRanges.push(end);\n            }\n\n            // Filter out the 0-length ranges.\n            uncachedRanges = uncachedRanges.filter(function (item, pos, arr) {\n                if (pos == 0) {\n                    return item != arr[pos + 1];\n                } else if (pos == arr.length - 1) {\n                    return item != arr[pos - 1];\n                }\n                return item != arr[pos - 1] && item != arr[pos + 1];\n            });\n\n            // Merge the two ranges together, uncachedRanges will either contain\n            // wholly new points, or duplicates of points in peakCacheRanges.  If\n            // duplicates are detected, remove both and extend the range.\n            this.peakCacheRanges = this.peakCacheRanges.concat(uncachedRanges);\n            this.peakCacheRanges = this.peakCacheRanges.sort(function (a, b) {\n                return a - b;\n            }).filter(function (item, pos, arr) {\n                if (pos == 0) {\n                    return item != arr[pos + 1];\n                } else if (pos == arr.length - 1) {\n                    return item != arr[pos - 1];\n                }\n                return item != arr[pos - 1] && item != arr[pos + 1];\n            });\n\n            // Push the uncached ranges into an array of arrays for ease of\n            // iteration in the functions that call this.\n            var uncachedRangePairs = [];\n            for (i = 0; i < uncachedRanges.length; i += 2) {\n                uncachedRangePairs.push([uncachedRanges[i], uncachedRanges[i + 1]]);\n            }\n\n            return uncachedRangePairs;\n        }\n\n        /**\n         * For testing\n         *\n         * @return {number[][]}\n         */\n\n    }, {\n        key: \"getCacheRanges\",\n        value: function getCacheRanges() {\n            var peakCacheRangePairs = [];\n            var i = void 0;\n            for (i = 0; i < this.peakCacheRanges.length; i += 2) {\n                peakCacheRangePairs.push([this.peakCacheRanges[i], this.peakCacheRanges[i + 1]]);\n            }\n            return peakCacheRangePairs;\n        }\n    }]);\n\n    return PeakCache;\n}();\n\nexports.default = PeakCache;\nmodule.exports = exports[\"default\"];\n\n/***/ }),\n/* 6 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nvar _util = __webpack_require__(0);\n\nvar util = _interopRequireWildcard(_util);\n\nfunction _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\n/**\n * Parent class for renderers\n *\n * @extends {Observer}\n */\nvar Drawer = function (_util$Observer) {\n    _inherits(Drawer, _util$Observer);\n\n    /**\n     * @param {HTMLElement} container The container node of the wavesurfer instance\n     * @param {WavesurferParams} params The wavesurfer initialisation options\n     */\n    function Drawer(container, params) {\n        _classCallCheck(this, Drawer);\n\n        /** @private */\n        var _this = _possibleConstructorReturn(this, (Drawer.__proto__ || Object.getPrototypeOf(Drawer)).call(this));\n\n        _this.container = container;\n        /**\n         * @type {WavesurferParams}\n         * @private\n         */\n        _this.params = params;\n        /**\n         * The width of the renderer\n         * @type {number}\n         */\n        _this.width = 0;\n        /**\n         * The height of the renderer\n         * @type {number}\n         */\n        _this.height = params.height * _this.params.pixelRatio;\n        /** @private */\n        _this.lastPos = 0;\n        /**\n         * The `<wave>` element which is added to the container\n         * @type {HTMLElement}\n         */\n        _this.wrapper = null;\n        return _this;\n    }\n\n    /**\n     * Alias of `util.style`\n     *\n     * @param {HTMLElement} el The element that the styles will be applied to\n     * @param {Object} styles The map of propName: attribute, both are used as-is\n     * @return {HTMLElement} el\n     */\n\n\n    _createClass(Drawer, [{\n        key: 'style',\n        value: function style(el, styles) {\n            return util.style(el, styles);\n        }\n\n        /**\n         * Create the wrapper `<wave>` element, style it and set up the events for\n         * interaction\n         */\n\n    }, {\n        key: 'createWrapper',\n        value: function createWrapper() {\n            this.wrapper = this.container.appendChild(document.createElement('wave'));\n\n            this.style(this.wrapper, {\n                display: 'block',\n                position: 'relative',\n                userSelect: 'none',\n                webkitUserSelect: 'none',\n                height: this.params.height + 'px'\n            });\n\n            if (this.params.fillParent || this.params.scrollParent) {\n                this.style(this.wrapper, {\n                    width: '100%',\n                    overflowX: this.params.hideScrollbar ? 'hidden' : 'auto',\n                    overflowY: 'hidden'\n                });\n            }\n\n            this.setupWrapperEvents();\n        }\n\n        /**\n         * Handle click event\n         *\n         * @param {Event} e Click event\n         * @param {?boolean} noPrevent Set to true to not call `e.preventDefault()`\n         * @return {number} Playback position from 0 to 1\n         */\n\n    }, {\n        key: 'handleEvent',\n        value: function handleEvent(e, noPrevent) {\n            !noPrevent && e.preventDefault();\n\n            var clientX = e.targetTouches ? e.targetTouches[0].clientX : e.clientX;\n            var bbox = this.wrapper.getBoundingClientRect();\n\n            var nominalWidth = this.width;\n            var parentWidth = this.getWidth();\n\n            var progress = void 0;\n\n            if (!this.params.fillParent && nominalWidth < parentWidth) {\n                progress = (clientX - bbox.left) * this.params.pixelRatio / nominalWidth || 0;\n\n                if (progress > 1) {\n                    progress = 1;\n                }\n            } else {\n                progress = (clientX - bbox.left + this.wrapper.scrollLeft) / this.wrapper.scrollWidth || 0;\n            }\n\n            return progress;\n        }\n\n        /**\n         * @private\n         */\n\n    }, {\n        key: 'setupWrapperEvents',\n        value: function setupWrapperEvents() {\n            var _this2 = this;\n\n            this.wrapper.addEventListener('click', function (e) {\n                var scrollbarHeight = _this2.wrapper.offsetHeight - _this2.wrapper.clientHeight;\n                if (scrollbarHeight != 0) {\n                    // scrollbar is visible.  Check if click was on it\n                    var bbox = _this2.wrapper.getBoundingClientRect();\n                    if (e.clientY >= bbox.bottom - scrollbarHeight) {\n                        // ignore mousedown as it was on the scrollbar\n                        return;\n                    }\n                }\n\n                if (_this2.params.interact) {\n                    _this2.fireEvent('click', e, _this2.handleEvent(e));\n                }\n            });\n\n            this.wrapper.addEventListener('scroll', function (e) {\n                return _this2.fireEvent('scroll', e);\n            });\n        }\n\n        /**\n         * Draw peaks on the canvas\n         *\n         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n         * rendering\n         * @param {number} length The width of the area that should be drawn\n         * @param {number} start The x-offset of the beginning of the area that\n         * should be rendered\n         * @param {number} end The x-offset of the end of the area that should be\n         * rendered\n         */\n\n    }, {\n        key: 'drawPeaks',\n        value: function drawPeaks(peaks, length, start, end) {\n            this.setWidth(length);\n\n            this.params.barWidth ? this.drawBars(peaks, 0, start, end) : this.drawWave(peaks, 0, start, end);\n        }\n\n        /**\n         * Scroll to the beginning\n         */\n\n    }, {\n        key: 'resetScroll',\n        value: function resetScroll() {\n            if (this.wrapper !== null) {\n                this.wrapper.scrollLeft = 0;\n            }\n        }\n\n        /**\n         * Recenter the viewport at a certain percent of the waveform\n         *\n         * @param {number} percent Value from 0 to 1 on the waveform\n         */\n\n    }, {\n        key: 'recenter',\n        value: function recenter(percent) {\n            var position = this.wrapper.scrollWidth * percent;\n            this.recenterOnPosition(position, true);\n        }\n\n        /**\n         * Recenter the viewport on a position, either scroll there immediately or\n         * in steps of 5 pixels\n         *\n         * @param {number} position X-offset in pixels\n         * @param {boolean} immediate Set to true to immediately scroll somewhere\n         */\n\n    }, {\n        key: 'recenterOnPosition',\n        value: function recenterOnPosition(position, immediate) {\n            var scrollLeft = this.wrapper.scrollLeft;\n            var half = ~~(this.wrapper.clientWidth / 2);\n            var maxScroll = this.wrapper.scrollWidth - this.wrapper.clientWidth;\n            var target = position - half;\n            var offset = target - scrollLeft;\n\n            if (maxScroll == 0) {\n                // no need to continue if scrollbar is not there\n                return;\n            }\n\n            // if the cursor is currently visible...\n            if (!immediate && -half <= offset && offset < half) {\n                // we'll limit the \"re-center\" rate.\n                var rate = 5;\n                offset = Math.max(-rate, Math.min(rate, offset));\n                target = scrollLeft + offset;\n            }\n\n            // limit target to valid range (0 to maxScroll)\n            target = Math.max(0, Math.min(maxScroll, target));\n            // no use attempting to scroll if we're not moving\n            if (target != scrollLeft) {\n                this.wrapper.scrollLeft = target;\n            }\n        }\n\n        /**\n         * Get the current scroll position in pixels\n         *\n         * @return {number}\n         */\n\n    }, {\n        key: 'getScrollX',\n        value: function getScrollX() {\n            return Math.round(this.wrapper.scrollLeft * this.params.pixelRatio);\n        }\n\n        /**\n         * Get the width of the container\n         *\n         * @return {number}\n         */\n\n    }, {\n        key: 'getWidth',\n        value: function getWidth() {\n            return Math.round(this.container.clientWidth * this.params.pixelRatio);\n        }\n\n        /**\n         * Set the width of the container\n         *\n         * @param {number} width\n         */\n\n    }, {\n        key: 'setWidth',\n        value: function setWidth(width) {\n            if (this.width == width) {\n                return;\n            }\n\n            this.width = width;\n\n            if (this.params.fillParent || this.params.scrollParent) {\n                this.style(this.wrapper, {\n                    width: ''\n                });\n            } else {\n                this.style(this.wrapper, {\n                    width: ~~(this.width / this.params.pixelRatio) + 'px'\n                });\n            }\n\n            this.updateSize();\n        }\n\n        /**\n         * Set the height of the container\n         *\n         * @param {number} height\n         */\n\n    }, {\n        key: 'setHeight',\n        value: function setHeight(height) {\n            if (height == this.height) {\n                return;\n            }\n            this.height = height;\n            this.style(this.wrapper, {\n                height: ~~(this.height / this.params.pixelRatio) + 'px'\n            });\n            this.updateSize();\n        }\n\n        /**\n         * Called by wavesurfer when progress should be renderered\n         *\n         * @param {number} progress From 0 to 1\n         */\n\n    }, {\n        key: 'progress',\n        value: function progress(_progress) {\n            var minPxDelta = 1 / this.params.pixelRatio;\n            var pos = Math.round(_progress * this.width) * minPxDelta;\n\n            if (pos < this.lastPos || pos - this.lastPos >= minPxDelta) {\n                this.lastPos = pos;\n\n                if (this.params.scrollParent && this.params.autoCenter) {\n                    var newPos = ~~(this.wrapper.scrollWidth * _progress);\n                    this.recenterOnPosition(newPos);\n                }\n\n                this.updateProgress(pos);\n            }\n        }\n\n        /**\n         * This is called when wavesurfer is destroyed\n         */\n\n    }, {\n        key: 'destroy',\n        value: function destroy() {\n            this.unAll();\n            if (this.wrapper) {\n                this.container.removeChild(this.wrapper);\n                this.wrapper = null;\n            }\n        }\n\n        /* Renderer-specific methods */\n        /**\n         * Called when the size of the container changes so the renderer can adjust\n         *\n         * @abstract\n         */\n\n    }, {\n        key: 'updateSize',\n        value: function updateSize() {}\n\n        /**\n         * Draw a waveform with bars\n         *\n         * @abstract\n         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n         * rendering\n         * @param {number} channelIndex The index of the current channel. Normally\n         * should be 0\n         * @param {number} start The x-offset of the beginning of the area that\n         * should be rendered\n         * @param {number} end The x-offset of the end of the area that should be\n         * rendered\n         */\n\n    }, {\n        key: 'drawBars',\n        value: function drawBars(peaks, channelIndex, start, end) {}\n\n        /**\n         * Draw a waveform\n         *\n         * @abstract\n         * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n         * rendering\n         * @param {number} channelIndex The index of the current channel. Normally\n         * should be 0\n         * @param {number} start The x-offset of the beginning of the area that\n         * should be rendered\n         * @param {number} end The x-offset of the end of the area that should be\n         * rendered\n         */\n\n    }, {\n        key: 'drawWave',\n        value: function drawWave(peaks, channelIndex, start, end) {}\n\n        /**\n         * Clear the waveform\n         *\n         * @abstract\n         */\n\n    }, {\n        key: 'clearWave',\n        value: function clearWave() {}\n\n        /**\n         * Render the new progress\n         *\n         * @abstract\n         * @param {number} position X-Offset of progress position in pixels\n         */\n\n    }, {\n        key: 'updateProgress',\n        value: function updateProgress(position) {}\n    }]);\n\n    return Drawer;\n}(util.Observer);\n\nexports.default = Drawer;\nmodule.exports = exports['default'];\n\n/***/ }),\n/* 7 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\nexports.default = ajax;\n\nvar _observer = __webpack_require__(2);\n\nvar _observer2 = _interopRequireDefault(_observer);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n/**\n * Perform an ajax request\n *\n * @param {Options} options Description\n *\n * @returns {Object} Observer instance\n */\nfunction ajax(options) {\n    var instance = new _observer2.default();\n    var xhr = new XMLHttpRequest();\n    var fired100 = false;\n    xhr.open(options.method || 'GET', options.url, true);\n    xhr.responseType = options.responseType || 'json';\n    xhr.addEventListener('progress', function (e) {\n        instance.fireEvent('progress', e);\n        if (e.lengthComputable && e.loaded == e.total) {\n            fired100 = true;\n        }\n    });\n    xhr.addEventListener('load', function (e) {\n        if (!fired100) {\n            instance.fireEvent('progress', e);\n        }\n        instance.fireEvent('load', e);\n        if (200 == xhr.status || 206 == xhr.status) {\n            instance.fireEvent('success', xhr.response, e);\n        } else {\n            instance.fireEvent('error', e);\n        }\n    });\n    xhr.addEventListener('error', function (e) {\n        return instance.fireEvent('error', e);\n    });\n    xhr.send();\n    instance.xhr = xhr;\n    return instance;\n}\nmodule.exports = exports['default'];\n\n/***/ }),\n/* 8 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\nexports.default = extend;\n/**\n * Extend an object shallowly with others\n *\n * @param {Object} dest The target object\n * @param {Object[]} sources The objects to use for extending\n *\n * @return {Object} Merged object\n */\nfunction extend(dest) {\n    for (var _len = arguments.length, sources = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n        sources[_key - 1] = arguments[_key];\n    }\n\n    sources.forEach(function (source) {\n        Object.keys(source).forEach(function (key) {\n            dest[key] = source[key];\n        });\n    });\n    return dest;\n}\nmodule.exports = exports[\"default\"];\n\n/***/ }),\n/* 9 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = getId;\n/**\n * Get a random prefixed ID\n *\n * @returns {String} Random ID\n */\nfunction getId() {\n  return 'wavesurfer_' + Math.random().toString(32).substring(2);\n}\nmodule.exports = exports['default'];\n\n/***/ }),\n/* 10 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\nexports.default = max;\n/**\n * Get the largest value\n *\n * @param   {Array} values Array of numbers\n * @returns {Number} Largest number found\n */\nfunction max(values) {\n    var largest = -Infinity;\n    Object.keys(values).forEach(function (i) {\n        if (values[i] > largest) {\n            largest = values[i];\n        }\n    });\n    return largest;\n}\nmodule.exports = exports[\"default\"];\n\n/***/ }),\n/* 11 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\nexports.default = min;\n/**\n * Get the smallest value\n *\n * @param   {Array} values Array of numbers\n * @returns {Number}       Smallest number found\n */\nfunction min(values) {\n    var smallest = Number(Infinity);\n    Object.keys(values).forEach(function (i) {\n        if (values[i] < smallest) {\n            smallest = values[i];\n        }\n    });\n    return smallest;\n}\nmodule.exports = exports[\"default\"];\n\n/***/ }),\n/* 12 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\nexports.default = style;\n/**\n * Apply a map of styles to an element\n *\n * @param {HTMLElement} el The element that the styles will be applied to\n * @param {Object} styles The map of propName: attribute, both are used as-is\n *\n * @return {HTMLElement} el\n */\nfunction style(el, styles) {\n    Object.keys(styles).forEach(function (prop) {\n        if (el.style[prop] !== styles[prop]) {\n            el.style[prop] = styles[prop];\n        }\n    });\n    return el;\n}\nmodule.exports = exports[\"default\"];\n\n/***/ }),\n/* 13 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nvar _util = __webpack_require__(0);\n\nvar util = _interopRequireWildcard(_util);\n\nvar _drawer = __webpack_require__(3);\n\nvar _drawer2 = _interopRequireDefault(_drawer);\n\nvar _webaudio = __webpack_require__(1);\n\nvar _webaudio2 = _interopRequireDefault(_webaudio);\n\nvar _mediaelement = __webpack_require__(4);\n\nvar _mediaelement2 = _interopRequireDefault(_mediaelement);\n\nvar _peakcache = __webpack_require__(5);\n\nvar _peakcache2 = _interopRequireDefault(_peakcache);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\n/** @external {HTMLElement} https://developer.mozilla.org/en/docs/Web/API/HTMLElement */\n/** @external {OfflineAudioContext} https://developer.mozilla.org/en-US/docs/Web/API/OfflineAudioContext */\n/** @external {File} https://developer.mozilla.org/en-US/docs/Web/API/File */\n/** @external {Blob} https://developer.mozilla.org/en-US/docs/Web/API/Blob */\n/** @external {CanvasRenderingContext2D} https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D */\n/** @external {MediaStreamConstraints} https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamConstraints */\n/** @external {AudioNode} https://developer.mozilla.org/de/docs/Web/API/AudioNode */\n\n/**\n * @typedef {Object} WavesurferParams\n * @property {AudioContext} audioContext=null Use your own previously\n * initialized AudioContext or leave blank.\n * @property {number} audioRate=1 Speed at which to play audio. Lower number is\n * slower.\n * @property {boolean} autoCenter=true If a scrollbar is present, center the\n * waveform around the progress\n * @property {string} backend='WebAudio' `'WebAudio'|'MediaElement'` In most cases\n * you don't have to set this manually. MediaElement is a fallback for\n * unsupported browsers.\n * @property {boolean} closeAudioContext=false Close and nullify all audio\n * contexts when the destroy method is called.\n * @property {!string|HTMLElement} container CSS selector or HTML element where\n * the waveform should be drawn. This is the only required parameter.\n * @property {string} cursorColor='#333' The fill color of the cursor indicating\n * the playhead position.\n * @property {number} cursorWidth=1 Measured in pixels.\n * @property {boolean} fillParent=true Whether to fill the entire container or\n * draw only according to `minPxPerSec`.\n * @property {boolean} forceDecode=false Force decoding of audio using web audio\n * when zooming to get a more detailed waveform.\n * @property {number} height=128 The height of the waveform. Measured in\n * pixels.\n * @property {boolean} hideScrollbar=false Whether to hide the horizontal\n * scrollbar when one would normally be shown.\n * @property {boolean} interact=true Whether the mouse interaction will be\n * enabled at initialization. You can switch this parameter at any time later\n * on.\n * @property {boolean} loopSelection=true (Use with regions plugin) Enable\n * looping of selected regions\n * @property {number} maxCanvasWidth=4000 Maximum width of a single canvas in\n * pixels, excluding a small overlap (2 * `pixelRatio`, rounded up to the next\n * even integer). If the waveform is longer than this value, additional canvases\n * will be used to render the waveform, which is useful for very large waveforms\n * that may be too wide for browsers to draw on a single canvas.\n * @property {boolean} mediaControls=false (Use with backend `MediaElement`)\n * this enables the native controls for the media element\n * @property {string} mediaType='audio' (Use with backend `MediaElement`)\n * `'audio'|'video'`\n * @property {number} minPxPerSec=20 Minimum number of pixels per second of\n * audio.\n * @property {boolean} normalize=false If true, normalize by the maximum peak\n * instead of 1.0.\n * @property {boolean} partialRender=false Use the PeakCache to improve\n * rendering speed of large waveforms\n * @property {number} pixelRatio=window.devicePixelRatio The pixel ratio used to\n * calculate display\n * @property {PluginDefinition[]} plugins=[] An array of plugin definitions to\n * register during instantiation, they will be directly initialised unless they\n * are added with the `deferInit` property set to true.\n * @property {string} progressColor='#555' The fill color of the part of the\n * waveform behind the cursor.\n * @property {Object} renderer=MultiCanvas Can be used to inject a custom\n * renderer.\n * @property {boolean|number} responsive=false If set to `true` resize the\n * waveform, when the window is resized. This is debounced with a `100ms`\n * timeout by default. If this parameter is a number it represents that timeout.\n * @property {boolean} scrollParent=false Whether to scroll the container with a\n * lengthy waveform. Otherwise the waveform is shrunk to the container width\n * (see fillParent).\n * @property {number} skipLength=2 Number of seconds to skip with the\n * skipForward() and skipBackward() methods.\n * @property {boolean} splitChannels=false Render with seperate waveforms for\n * the channels of the audio\n * @property {string} waveColor='#999' The fill color of the waveform after the\n * cursor.\n */\n\n/**\n * @typedef {Object} PluginDefinition\n * @desc The Object used to describe a plugin\n * @example wavesurfer.addPlugin(pluginDefinition);\n * @property {string} name The name of the plugin, the plugin instance will be\n * added as a property to the wavesurfer instance under this name\n * @property {?Object} staticProps The properties that should be added to the\n * wavesurfer instance as static properties\n * @property {?boolean} deferInit Don't initialise plugin\n * automatically\n * @property {Object} params={} The plugin parameters, they are the first parameter\n * passed to the plugin class constructor function\n * @property {PluginClass} instance The plugin instance factory, is called with\n * the dependency specified in extends. Returns the plugin class.\n */\n\n/**\n * @interface PluginClass\n *\n * @desc This is the interface which is implemented by all plugin classes. Note\n * that this only turns into an observer after being passed through\n * `wavesurfer.addPlugin`.\n *\n * @extends {Observer}\n */\nvar PluginClass = function () {\n    _createClass(PluginClass, [{\n        key: 'create',\n\n        /**\n         * Plugin definition factory\n         *\n         * This function must be used to create a plugin definition which can be\n         * used by wavesurfer to correctly instantiate the plugin.\n         *\n         * @param  {Object} params={} The plugin params (specific to the plugin)\n         * @return {PluginDefinition} an object representing the plugin\n         */\n        value: function create(params) {}\n        /**\n         * Construct the plugin\n         *\n         * @param {Object} ws The wavesurfer instance\n         * @param {Object} params={} The plugin params (specific to the plugin)\n         */\n\n    }]);\n\n    function PluginClass(ws, params) {\n        _classCallCheck(this, PluginClass);\n    }\n    /**\n     * Initialise the plugin\n     *\n     * Start doing something. This is called by\n     * `wavesurfer.initPlugin(pluginName)`\n     */\n\n\n    _createClass(PluginClass, [{\n        key: 'init',\n        value: function init() {}\n        /**\n         * Destroy the plugin instance\n         *\n         * Stop doing something. This is called by\n         * `wavesurfer.destroyPlugin(pluginName)`\n         */\n\n    }, {\n        key: 'destroy',\n        value: function destroy() {}\n    }]);\n\n    return PluginClass;\n}();\n\n/**\n * WaveSurfer core library class\n *\n * @extends {Observer}\n * @example\n * const params = {\n *   container: '#waveform',\n *   waveColor: 'violet',\n *   progressColor: 'purple'\n * };\n *\n * // initialise like this\n * const wavesurfer = WaveSurfer.create(params);\n *\n * // or like this ...\n * const wavesurfer = new WaveSurfer(params);\n * wavesurfer.init();\n *\n * // load audio file\n * wavesurfer.load('example/media/demo.wav');\n */\n\n\nvar WaveSurfer = function (_util$Observer) {\n    _inherits(WaveSurfer, _util$Observer);\n\n    _createClass(WaveSurfer, null, [{\n        key: 'create',\n\n\n        /**\n         * Instantiate this class, call its `init` function and returns it\n         *\n         * @param {WavesurferParams} params\n         * @return {Object} WaveSurfer instance\n         * @example const wavesurfer = WaveSurfer.create(params);\n         */\n\n        /** @private */\n        value: function create(params) {\n            var wavesurfer = new WaveSurfer(params);\n            return wavesurfer.init();\n        }\n\n        /**\n         * Functions in the `util` property are available as a prototype property to\n         * all instances\n         *\n         * @type {Object}\n         * @example\n         * const wavesurfer = WaveSurfer.create(params);\n         * wavesurfer.util.style(myElement, { background: 'blue' });\n         */\n\n\n        /** @private */\n\n\n        /**\n         * Functions in the `util` property are available as a static property of the\n         * WaveSurfer class\n         *\n         * @type {Object}\n         * @example\n         * WaveSurfer.util.style(myElement, { background: 'blue' });\n         */\n\n    }]);\n\n    /**\n     * Initialise wavesurfer instance\n     *\n     * @param {WavesurferParams} params Instantiation options for wavesurfer\n     * @example\n     * const wavesurfer = new WaveSurfer(params);\n     * @returns {this}\n     */\n    function WaveSurfer(params) {\n        var _ret;\n\n        _classCallCheck(this, WaveSurfer);\n\n        /**\n         * Extract relevant parameters (or defaults)\n         * @private\n         */\n        var _this = _possibleConstructorReturn(this, (WaveSurfer.__proto__ || Object.getPrototypeOf(WaveSurfer)).call(this));\n\n        _this.defaultParams = {\n            audioContext: null,\n            audioRate: 1,\n            autoCenter: true,\n            backend: 'WebAudio',\n            container: null,\n            cursorColor: '#333',\n            cursorWidth: 1,\n            dragSelection: true,\n            fillParent: true,\n            forceDecode: true,\n            height: 128,\n            hideScrollbar: false,\n            interact: true,\n            loopSelection: true,\n            maxCanvasWidth: 4000,\n            mediaContainer: null,\n            mediaControls: false,\n            mediaType: 'audio',\n            minPxPerSec: 20,\n            normalize: false,\n            partialRender: false,\n            pixelRatio: window.devicePixelRatio || screen.deviceXDPI / screen.logicalXDPI,\n            plugins: [],\n            progressColor: '#555',\n            renderer: _drawer2.default,\n            responsive: false,\n            scrollParent: false,\n            skipLength: 2,\n            splitChannels: false,\n            waveColor: '#999'\n        };\n        _this.backends = {\n            MediaElement: _mediaelement2.default,\n            WebAudio: _webaudio2.default\n        };\n        _this.util = util;\n        _this.params = util.extend({}, _this.defaultParams, params);\n\n        /** @private */\n        _this.container = 'string' == typeof params.container ? document.querySelector(_this.params.container) : _this.params.container;\n\n        if (!_this.container) {\n            throw new Error('Container element not found');\n        }\n\n        if (_this.params.mediaContainer == null) {\n            /** @private */\n            _this.mediaContainer = _this.container;\n        } else if (typeof _this.params.mediaContainer == 'string') {\n            /** @private */\n            _this.mediaContainer = document.querySelector(_this.params.mediaContainer);\n        } else {\n            /** @private */\n            _this.mediaContainer = _this.params.mediaContainer;\n        }\n\n        if (!_this.mediaContainer) {\n            throw new Error('Media Container element not found');\n        }\n\n        if (_this.params.maxCanvasWidth <= 1) {\n            throw new Error('maxCanvasWidth must be greater than 1');\n        } else if (_this.params.maxCanvasWidth % 2 == 1) {\n            throw new Error('maxCanvasWidth must be an even number');\n        }\n\n        /**\n         * @private Used to save the current volume when muting so we can\n         * restore once unmuted\n         * @type {number}\n         */\n        _this.savedVolume = 0;\n\n        /**\n         * @private The current muted state\n         * @type {boolean}\n         */\n        _this.isMuted = false;\n\n        /**\n         * @private Will hold a list of event descriptors that need to be\n         * cancelled on subsequent loads of audio\n         * @type {Object[]}\n         */\n        _this.tmpEvents = [];\n\n        /**\n         * @private Holds any running audio downloads\n         * @type {Observer}\n         */\n        _this.currentAjax = null;\n        /** @private */\n        _this.arraybuffer = null;\n        /** @private */\n        _this.drawer = null;\n        /** @private */\n        _this.backend = null;\n        /** @private */\n        _this.peakCache = null;\n\n        // cache constructor objects\n        if (typeof _this.params.renderer !== 'function') {\n            throw new Error('Renderer parameter is invalid');\n        }\n        /**\n         * @private The uninitialised Drawer class\n         */\n        _this.Drawer = _this.params.renderer;\n        /**\n         * @private The uninitialised Backend class\n         */\n        _this.Backend = _this.backends[_this.params.backend];\n\n        /**\n         * @private map of plugin names that are currently initialised\n         */\n        _this.initialisedPluginList = {};\n        /** @private */\n        _this.isDestroyed = false;\n        /** @private */\n        _this.isReady = false;\n\n        // responsive debounced event listener. If this.params.responsive is not\n        // set, this is never called. Use 100ms or this.params.responsive as\n        // timeout for the debounce function.\n        var prevWidth = 0;\n        _this._onResize = util.debounce(function () {\n            if (prevWidth != _this.drawer.wrapper.clientWidth) {\n                prevWidth = _this.drawer.wrapper.clientWidth;\n                _this.empty();\n                _this.drawBuffer();\n            }\n        }, typeof _this.params.responsive === 'number' ? _this.params.responsive : 100);\n\n        return _ret = _this, _possibleConstructorReturn(_this, _ret);\n    }\n\n    /**\n     * Initialise the wave\n     *\n     * @example\n     * var wavesurfer = new WaveSurfer(params);\n     * wavesurfer.init();\n     * @return {this}\n     */\n\n\n    _createClass(WaveSurfer, [{\n        key: 'init',\n        value: function init() {\n            this.registerPlugins(this.params.plugins);\n            this.createDrawer();\n            this.createBackend();\n            this.createPeakCache();\n            return this;\n        }\n\n        /**\n         * Add and initialise array of plugins (if `plugin.deferInit` is falsey),\n         * this function is called in the init function of wavesurfer\n         *\n         * @param {PluginDefinition[]} plugins An array of plugin definitions\n         * @emits {WaveSurfer#plugins-registered} Called with the array of plugin definitions\n         * @return {this}\n         */\n\n    }, {\n        key: 'registerPlugins',\n        value: function registerPlugins(plugins) {\n            var _this2 = this;\n\n            // first instantiate all the plugins\n            plugins.forEach(function (plugin) {\n                return _this2.addPlugin(plugin);\n            });\n\n            // now run the init functions\n            plugins.forEach(function (plugin) {\n                // call init function of the plugin if deferInit is falsey\n                // in that case you would manually use initPlugins()\n                if (!plugin.deferInit) {\n                    _this2.initPlugin(plugin.name);\n                }\n            });\n            this.fireEvent('plugins-registered', plugins);\n            return this;\n        }\n\n        /**\n         * Add a plugin object to wavesurfer\n         *\n         * @param {PluginDefinition} plugin A plugin definition\n         * @emits {WaveSurfer#plugin-added} Called with the name of the plugin that was added\n         * @example wavesurfer.addPlugin(WaveSurfer.minimap());\n         * @return {this}\n         */\n\n    }, {\n        key: 'addPlugin',\n        value: function addPlugin(plugin) {\n            var _this3 = this;\n\n            if (!plugin.name) {\n                throw new Error('Plugin does not have a name!');\n            }\n            if (!plugin.instance) {\n                throw new Error('Plugin ' + plugin.name + ' does not have an instance property!');\n            }\n\n            // staticProps properties are applied to wavesurfer instance\n            if (plugin.staticProps) {\n                Object.keys(plugin.staticProps).forEach(function (pluginStaticProp) {\n                    /**\n                     * Properties defined in a plugin definition's `staticProps` property are added as\n                     * staticProps properties of the WaveSurfer instance\n                     */\n                    _this3[pluginStaticProp] = plugin.staticProps[pluginStaticProp];\n                });\n            }\n\n            var Instance = plugin.instance;\n\n            // turn the plugin instance into an observer\n            var observerPrototypeKeys = Object.getOwnPropertyNames(util.Observer.prototype);\n            observerPrototypeKeys.forEach(function (key) {\n                Instance.prototype[key] = util.Observer.prototype[key];\n            });\n\n            /**\n             * Instantiated plugin classes are added as a property of the wavesurfer\n             * instance\n             * @type {Object}\n             */\n            this[plugin.name] = new Instance(plugin.params || {}, this);\n            this.fireEvent('plugin-added', plugin.name);\n            return this;\n        }\n\n        /**\n         * Initialise a plugin\n         *\n         * @param {string} name A plugin name\n         * @emits WaveSurfer#plugin-initialised\n         * @example wavesurfer.initPlugin('minimap');\n         * @return {this}\n         */\n\n    }, {\n        key: 'initPlugin',\n        value: function initPlugin(name) {\n            if (!this[name]) {\n                throw new Error('Plugin ' + name + ' has not been added yet!');\n            }\n            if (this.initialisedPluginList[name]) {\n                // destroy any already initialised plugins\n                this.destroyPlugin(name);\n            }\n            this[name].init();\n            this.initialisedPluginList[name] = true;\n            this.fireEvent('plugin-initialised', name);\n            return this;\n        }\n\n        /**\n         * Destroy a plugin\n         *\n         * @param {string} name A plugin name\n         * @emits WaveSurfer#plugin-destroyed\n         * @example wavesurfer.destroyPlugin('minimap');\n         * @returns {this}\n         */\n\n    }, {\n        key: 'destroyPlugin',\n        value: function destroyPlugin(name) {\n            if (!this[name]) {\n                throw new Error('Plugin ' + name + ' has not been added yet and cannot be destroyed!');\n            }\n            if (!this.initialisedPluginList[name]) {\n                throw new Error('Plugin ' + name + ' is not active and cannot be destroyed!');\n            }\n            if (typeof this[name].destroy !== 'function') {\n                throw new Error('Plugin ' + name + ' does not have a destroy function!');\n            }\n\n            this[name].destroy();\n            delete this.initialisedPluginList[name];\n            this.fireEvent('plugin-destroyed', name);\n            return this;\n        }\n\n        /**\n         * Destroy all initialised plugins. Convenience function to use when\n         * wavesurfer is removed\n         *\n         * @private\n         */\n\n    }, {\n        key: 'destroyAllPlugins',\n        value: function destroyAllPlugins() {\n            var _this4 = this;\n\n            Object.keys(this.initialisedPluginList).forEach(function (name) {\n                return _this4.destroyPlugin(name);\n            });\n        }\n\n        /**\n         * Create the drawer and draw the waveform\n         *\n         * @private\n         * @emits WaveSurfer#drawer-created\n         */\n\n    }, {\n        key: 'createDrawer',\n        value: function createDrawer() {\n            var _this5 = this;\n\n            this.drawer = new this.Drawer(this.container, this.params);\n            this.drawer.init();\n            this.fireEvent('drawer-created', this.drawer);\n\n            if (this.params.responsive) {\n                window.addEventListener('resize', this._onResize, true);\n            }\n\n            this.drawer.on('redraw', function () {\n                _this5.drawBuffer();\n                _this5.drawer.progress(_this5.backend.getPlayedPercents());\n            });\n\n            // Click-to-seek\n            this.drawer.on('click', function (e, progress) {\n                setTimeout(function () {\n                    return _this5.seekTo(progress);\n                }, 0);\n            });\n\n            // Relay the scroll event from the drawer\n            this.drawer.on('scroll', function (e) {\n                if (_this5.params.partialRender) {\n                    _this5.drawBuffer();\n                }\n                _this5.fireEvent('scroll', e);\n            });\n        }\n\n        /**\n         * Create the backend\n         *\n         * @private\n         * @emits WaveSurfer#backend-created\n         */\n\n    }, {\n        key: 'createBackend',\n        value: function createBackend() {\n            var _this6 = this;\n\n            if (this.backend) {\n                this.backend.destroy();\n            }\n\n            // Back compat\n            if (this.params.backend == 'AudioElement') {\n                this.params.backend = 'MediaElement';\n            }\n\n            if (this.params.backend == 'WebAudio' && !this.Backend.prototype.supportsWebAudio.call(null)) {\n                this.params.backend = 'MediaElement';\n            }\n\n            this.backend = new this.Backend(this.params);\n            this.backend.init();\n            this.fireEvent('backend-created', this.backend);\n\n            this.backend.on('finish', function () {\n                return _this6.fireEvent('finish');\n            });\n            this.backend.on('play', function () {\n                return _this6.fireEvent('play');\n            });\n            this.backend.on('pause', function () {\n                return _this6.fireEvent('pause');\n            });\n\n            this.backend.on('audioprocess', function (time) {\n                _this6.drawer.progress(_this6.backend.getPlayedPercents());\n                _this6.fireEvent('audioprocess', time);\n            });\n        }\n\n        /**\n         * Create the peak cache\n         *\n         * @private\n         */\n\n    }, {\n        key: 'createPeakCache',\n        value: function createPeakCache() {\n            if (this.params.partialRender) {\n                this.peakCache = new _peakcache2.default();\n            }\n        }\n\n        /**\n         * Get the duration of the audio clip\n         *\n         * @example const duration = wavesurfer.getDuration();\n         * @return {number} Duration in seconds\n         */\n\n    }, {\n        key: 'getDuration',\n        value: function getDuration() {\n            return this.backend.getDuration();\n        }\n\n        /**\n         * Get the current playback position\n         *\n         * @example const currentTime = wavesurfer.getCurrentTime();\n         * @return {number} Playback position in seconds\n         */\n\n    }, {\n        key: 'getCurrentTime',\n        value: function getCurrentTime() {\n            return this.backend.getCurrentTime();\n        }\n\n        /**\n         * Starts playback from the current position. Optional start and end\n         * measured in seconds can be used to set the range of audio to play.\n         *\n         * @param {?number} start Position to start at\n         * @param {?number} end Position to end at\n         * @emits WaveSurfer#interaction\n         * @example\n         * // play from second 1 to 5\n         * wavesurfer.play(1, 5);\n         */\n\n    }, {\n        key: 'play',\n        value: function play(start, end) {\n            var _this7 = this;\n\n            this.fireEvent('interaction', function () {\n                return _this7.play(start, end);\n            });\n            this.backend.play(start, end);\n        }\n\n        /**\n         * Stops playback\n         *\n         * @example wavesurfer.pause();\n         */\n\n    }, {\n        key: 'pause',\n        value: function pause() {\n            this.backend.isPaused() || this.backend.pause();\n        }\n\n        /**\n         * Toggle playback\n         *\n         * @example wavesurfer.playPause();\n         */\n\n    }, {\n        key: 'playPause',\n        value: function playPause() {\n            this.backend.isPaused() ? this.play() : this.pause();\n        }\n\n        /**\n         * Get the current playback state\n         *\n         * @example const isPlaying = wavesurfer.isPlaying();\n         * @return {boolean} False if paused, true if playing\n         */\n\n    }, {\n        key: 'isPlaying',\n        value: function isPlaying() {\n            return !this.backend.isPaused();\n        }\n\n        /**\n         * Skip backward\n         *\n         * @param {?number} seconds Amount to skip back, if not specified `skipLength`\n         * is used\n         * @example wavesurfer.skipBackward();\n         */\n\n    }, {\n        key: 'skipBackward',\n        value: function skipBackward(seconds) {\n            this.skip(-seconds || -this.params.skipLength);\n        }\n\n        /**\n         * Skip forward\n         *\n         * @param {?number} seconds Amount to skip back, if not specified `skipLength`\n         * is used\n         * @example wavesurfer.skipForward();\n         */\n\n    }, {\n        key: 'skipForward',\n        value: function skipForward(seconds) {\n            this.skip(seconds || this.params.skipLength);\n        }\n\n        /**\n         * Skip a number of seconds from the current position (use a negative value\n         * to go backwards).\n         *\n         * @param {number} offset Amount to skip back or forwards\n         * @example\n         * // go back 2 seconds\n         * wavesurfer.skip(-2);\n         */\n\n    }, {\n        key: 'skip',\n        value: function skip(offset) {\n            var duration = this.getDuration() || 1;\n            var position = this.getCurrentTime() || 0;\n            position = Math.max(0, Math.min(duration, position + (offset || 0)));\n            this.seekAndCenter(position / duration);\n        }\n\n        /**\n         * Seeks to a position and centers the view\n         *\n         * @param {number} progress Between 0 (=beginning) and 1 (=end)\n         * @example\n         * // seek and go to the middle of the audio\n         * wavesurfer.seekTo(0.5);\n         */\n\n    }, {\n        key: 'seekAndCenter',\n        value: function seekAndCenter(progress) {\n            this.seekTo(progress);\n            this.drawer.recenter(progress);\n        }\n\n        /**\n         * Seeks to a position\n         *\n         * @param {number} progress Between 0 (=beginning) and 1 (=end)\n         * @emits WaveSurfer#interaction\n         * @emits WaveSurfer#seek\n         * @example\n         * // seek to the middle of the audio\n         * wavesurfer.seekTo(0.5);\n         */\n\n    }, {\n        key: 'seekTo',\n        value: function seekTo(progress) {\n            var _this8 = this;\n\n            this.fireEvent('interaction', function () {\n                return _this8.seekTo(progress);\n            });\n\n            var paused = this.backend.isPaused();\n            // avoid draw wrong position while playing backward seeking\n            if (!paused) {\n                this.backend.pause();\n            }\n            // avoid small scrolls while paused seeking\n            var oldScrollParent = this.params.scrollParent;\n            this.params.scrollParent = false;\n            this.backend.seekTo(progress * this.getDuration());\n            this.drawer.progress(this.backend.getPlayedPercents());\n\n            if (!paused) {\n                this.backend.play();\n            }\n            this.params.scrollParent = oldScrollParent;\n            this.fireEvent('seek', progress);\n        }\n\n        /**\n         * Stops and goes to the beginning.\n         *\n         * @example wavesurfer.stop();\n         */\n\n    }, {\n        key: 'stop',\n        value: function stop() {\n            this.pause();\n            this.seekTo(0);\n            this.drawer.progress(0);\n        }\n\n        /**\n         * Set the playback volume.\n         *\n         * @param {number} newVolume A value between 0 and 1, 0 being no\n         * volume and 1 being full volume.\n         */\n\n    }, {\n        key: 'setVolume',\n        value: function setVolume(newVolume) {\n            this.backend.setVolume(newVolume);\n        }\n\n        /**\n         * Get the playback volume.\n         *\n         * @return {number} A value between 0 and 1, 0 being no\n         * volume and 1 being full volume.\n         */\n\n    }, {\n        key: 'getVolume',\n        value: function getVolume() {\n            return this.backend.getVolume();\n        }\n\n        /**\n         * Set the playback rate.\n         *\n         * @param {number} rate A positive number. E.g. 0.5 means half the normal\n         * speed, 2 means double speed and so on.\n         * @example wavesurfer.setPlaybackRate(2);\n         */\n\n    }, {\n        key: 'setPlaybackRate',\n        value: function setPlaybackRate(rate) {\n            this.backend.setPlaybackRate(rate);\n        }\n\n        /**\n         * Get the playback rate.\n         *\n         * @return {number}\n         */\n\n    }, {\n        key: 'getPlaybackRate',\n        value: function getPlaybackRate() {\n            return this.backend.getPlaybackRate();\n        }\n\n        /**\n         * Toggle the volume on and off. It not currenly muted it will save the\n         * current volume value and turn the volume off. If currently muted then it\n         * will restore the volume to the saved value, and then rest the saved\n         * value.\n         *\n         * @example wavesurfer.toggleMute();\n         */\n\n    }, {\n        key: 'toggleMute',\n        value: function toggleMute() {\n            this.setMute(!this.isMuted);\n        }\n\n        /**\n         * Enable or disable muted audio\n         *\n         * @param {boolean} mute\n         * @example\n         * // unmute\n         * wavesurfer.setMute(false);\n         */\n\n    }, {\n        key: 'setMute',\n        value: function setMute(mute) {\n            // ignore all muting requests if the audio is already in that state\n            if (mute === this.isMuted) {\n                return;\n            }\n\n            if (mute) {\n                // If currently not muted then save current volume,\n                // turn off the volume and update the mute properties\n                this.savedVolume = this.backend.getVolume();\n                this.backend.setVolume(0);\n                this.isMuted = true;\n            } else {\n                // If currently muted then restore to the saved volume\n                // and update the mute properties\n                this.backend.setVolume(this.savedVolume);\n                this.isMuted = false;\n            }\n        }\n\n        /**\n         * Get the current mute status.\n         *\n         * @example const isMuted = wavesurfer.getMute();\n         * @return {boolean}\n         */\n\n    }, {\n        key: 'getMute',\n        value: function getMute() {\n            return this.isMuted;\n        }\n\n        /**\n         * Toggles `scrollParent` and redraws\n         *\n         * @example wavesurfer.toggleScroll();\n         */\n\n    }, {\n        key: 'toggleScroll',\n        value: function toggleScroll() {\n            this.params.scrollParent = !this.params.scrollParent;\n            this.drawBuffer();\n        }\n\n        /**\n         * Toggle mouse interaction\n         *\n         * @example wavesurfer.toggleInteraction();\n         */\n\n    }, {\n        key: 'toggleInteraction',\n        value: function toggleInteraction() {\n            this.params.interact = !this.params.interact;\n        }\n\n        /**\n         * Get the correct peaks for current wave viewport and render wave\n         *\n         * @private\n         * @emits WaveSurfer#redraw\n         */\n\n    }, {\n        key: 'drawBuffer',\n        value: function drawBuffer() {\n            var nominalWidth = Math.round(this.getDuration() * this.params.minPxPerSec * this.params.pixelRatio);\n            var parentWidth = this.drawer.getWidth();\n            var width = nominalWidth;\n            var start = this.drawer.getScrollX();\n            var end = Math.min(start + parentWidth, width);\n\n            // Fill container\n            if (this.params.fillParent && (!this.params.scrollParent || nominalWidth < parentWidth)) {\n                width = parentWidth;\n                start = 0;\n                end = width;\n            }\n\n            var peaks = void 0;\n            if (this.params.partialRender) {\n                var newRanges = this.peakCache.addRangeToPeakCache(width, start, end);\n                var i = void 0;\n                for (i = 0; i < newRanges.length; i++) {\n                    peaks = this.backend.getPeaks(width, newRanges[i][0], newRanges[i][1]);\n                    this.drawer.drawPeaks(peaks, width, newRanges[i][0], newRanges[i][1]);\n                }\n            } else {\n                start = 0;\n                end = width;\n                peaks = this.backend.getPeaks(width, start, end);\n                this.drawer.drawPeaks(peaks, width, start, end);\n            }\n            this.fireEvent('redraw', peaks, width);\n        }\n\n        /**\n         * Horizontally zooms the waveform in and out. It also changes the parameter\n         * `minPxPerSec` and enables the `scrollParent` option.\n         *\n         * @param {number} pxPerSec Number of horizontal pixels per second of audio\n         * @emits WaveSurfer#zoom\n         * @example wavesurfer.zoom(20);\n         */\n\n    }, {\n        key: 'zoom',\n        value: function zoom(pxPerSec) {\n            this.params.minPxPerSec = pxPerSec;\n\n            this.params.scrollParent = true;\n\n            this.drawBuffer();\n            this.drawer.progress(this.backend.getPlayedPercents());\n\n            this.drawer.recenter(this.getCurrentTime() / this.getDuration());\n            this.fireEvent('zoom', pxPerSec);\n        }\n\n        /**\n         * Decode buffer and load\n         *\n         * @private\n         * @param {ArrayBuffer} arraybuffer\n         */\n\n    }, {\n        key: 'loadArrayBuffer',\n        value: function loadArrayBuffer(arraybuffer) {\n            var _this9 = this;\n\n            this.decodeArrayBuffer(arraybuffer, function (data) {\n                if (!_this9.isDestroyed) {\n                    _this9.loadDecodedBuffer(data);\n                }\n            });\n        }\n\n        /**\n         * Directly load an externally decoded AudioBuffer\n         *\n         * @private\n         * @param {AudioBuffer} buffer\n         * @emits WaveSurfer#ready\n         */\n\n    }, {\n        key: 'loadDecodedBuffer',\n        value: function loadDecodedBuffer(buffer) {\n            this.backend.load(buffer);\n            this.drawBuffer();\n            this.fireEvent('ready');\n            this.isReady = true;\n        }\n\n        /**\n         * Loads audio data from a Blob or File object\n         *\n         * @param {Blob|File} blob Audio data\n         * @example\n         */\n\n    }, {\n        key: 'loadBlob',\n        value: function loadBlob(blob) {\n            var _this10 = this;\n\n            // Create file reader\n            var reader = new FileReader();\n            reader.addEventListener('progress', function (e) {\n                return _this10.onProgress(e);\n            });\n            reader.addEventListener('load', function (e) {\n                return _this10.loadArrayBuffer(e.target.result);\n            });\n            reader.addEventListener('error', function () {\n                return _this10.fireEvent('error', 'Error reading file');\n            });\n            reader.readAsArrayBuffer(blob);\n            this.empty();\n        }\n\n        /**\n         * Loads audio and re-renders the waveform.\n         *\n         * @param {string} url The url of the audio file\n         * @param {?number[]|number[][]} peaks Wavesurfer does not have to decode the audio to\n         * render the waveform if this is specified\n         * @param {?string} preload (Use with backend `MediaElement`)\n         * `'none'|'metadata'|'auto'` Preload attribute for the media element\n         * @example\n         * // using ajax or media element to load (depending on backend)\n         * wavesurfer.load('http://example.com/demo.wav');\n         *\n         * // setting preload attribute with media element backend and supplying\n         * peaks wavesurfer.load(\n         *   'http://example.com/demo.wav',\n         *   [0.0218, 0.0183, 0.0165, 0.0198, 0.2137, 0.2888],\n         *   true,\n         * );\n         */\n\n    }, {\n        key: 'load',\n        value: function load(url, peaks, preload) {\n            this.empty();\n\n            switch (this.params.backend) {\n                case 'WebAudio':\n                    return this.loadBuffer(url, peaks);\n                case 'MediaElement':\n                    return this.loadMediaElement(url, peaks, preload);\n            }\n        }\n\n        /**\n         * Loads audio using Web Audio buffer backend.\n         *\n         * @private\n         * @param {string} url\n         * @param {?number[]|number[][]} peaks\n         */\n\n    }, {\n        key: 'loadBuffer',\n        value: function loadBuffer(url, peaks) {\n            var _this11 = this;\n\n            var load = function load(action) {\n                if (action) {\n                    _this11.tmpEvents.push(_this11.once('ready', action));\n                }\n                return _this11.getArrayBuffer(url, function (data) {\n                    return _this11.loadArrayBuffer(data);\n                });\n            };\n\n            if (peaks) {\n                this.backend.setPeaks(peaks);\n                this.drawBuffer();\n                this.tmpEvents.push(this.once('interaction', load));\n            } else {\n                return load();\n            }\n        }\n\n        /**\n         * Either create a media element, or load an existing media element.\n         *\n         * @private\n         * @param {string|HTMLElement} urlOrElt Either a path to a media file, or an\n         * existing HTML5 Audio/Video Element\n         * @param {number[]|number[][]} peaks Array of peaks. Required to bypass web audio\n         * dependency\n         * @param {?boolean} preload Set to true if the preload attribute of the\n         * audio element should be enabled\n         */\n\n    }, {\n        key: 'loadMediaElement',\n        value: function loadMediaElement(urlOrElt, peaks, preload) {\n            var _this12 = this;\n\n            var url = urlOrElt;\n\n            if (typeof urlOrElt === 'string') {\n                this.backend.load(url, this.mediaContainer, peaks, preload);\n            } else {\n                var elt = urlOrElt;\n                this.backend.loadElt(elt, peaks);\n\n                // If peaks are not provided,\n                // url = element.src so we can get peaks with web audio\n                url = elt.src;\n            }\n\n            this.tmpEvents.push(this.backend.once('canplay', function () {\n                _this12.drawBuffer();\n                _this12.fireEvent('ready');\n            }), this.backend.once('error', function (err) {\n                return _this12.fireEvent('error', err);\n            }));\n\n            // If no pre-decoded peaks provided or pre-decoded peaks are\n            // provided with forceDecode flag, attempt to download the\n            // audio file and decode it with Web Audio.\n            if (peaks) {\n                this.backend.setPeaks(peaks);\n            }\n\n            if ((!peaks || this.params.forceDecode) && this.backend.supportsWebAudio()) {\n                this.getArrayBuffer(url, function (arraybuffer) {\n                    _this12.decodeArrayBuffer(arraybuffer, function (buffer) {\n                        _this12.backend.buffer = buffer;\n                        _this12.backend.setPeaks(null);\n                        _this12.drawBuffer();\n                        _this12.fireEvent('waveform-ready');\n                    });\n                });\n            }\n        }\n\n        /**\n         * Decode an array buffer and pass data to a callback\n         *\n         * @private\n         * @param {Object} arraybuffer\n         * @param {function} callback\n         */\n\n    }, {\n        key: 'decodeArrayBuffer',\n        value: function decodeArrayBuffer(arraybuffer, callback) {\n            var _this13 = this;\n\n            this.arraybuffer = arraybuffer;\n\n            this.backend.decodeArrayBuffer(arraybuffer, function (data) {\n                // Only use the decoded data if we haven't been destroyed or\n                // another decode started in the meantime\n                if (!_this13.isDestroyed && _this13.arraybuffer == arraybuffer) {\n                    callback(data);\n                    _this13.arraybuffer = null;\n                }\n            }, function () {\n                return _this13.fireEvent('error', 'Error decoding audiobuffer');\n            });\n        }\n\n        /**\n         * Load an array buffer by ajax and pass to a callback\n         *\n         * @param {string} url\n         * @param {function} callback\n         * @private\n         */\n\n    }, {\n        key: 'getArrayBuffer',\n        value: function getArrayBuffer(url, callback) {\n            var _this14 = this;\n\n            var ajax = util.ajax({\n                url: url,\n                responseType: 'arraybuffer'\n            });\n\n            this.currentAjax = ajax;\n\n            this.tmpEvents.push(ajax.on('progress', function (e) {\n                _this14.onProgress(e);\n            }), ajax.on('success', function (data, e) {\n                callback(data);\n                _this14.currentAjax = null;\n            }), ajax.on('error', function (e) {\n                _this14.fireEvent('error', 'XHR error: ' + e.target.statusText);\n                _this14.currentAjax = null;\n            }));\n\n            return ajax;\n        }\n\n        /**\n         * Called while the audio file is loading\n         *\n         * @private\n         * @param {Event} e\n         * @emits WaveSurfer#loading\n         */\n\n    }, {\n        key: 'onProgress',\n        value: function onProgress(e) {\n            var percentComplete = void 0;\n            if (e.lengthComputable) {\n                percentComplete = e.loaded / e.total;\n            } else {\n                // Approximate progress with an asymptotic\n                // function, and assume downloads in the 1-3 MB range.\n                percentComplete = e.loaded / (e.loaded + 1000000);\n            }\n            this.fireEvent('loading', Math.round(percentComplete * 100), e.target);\n        }\n\n        /**\n         * Exports PCM data into a JSON array and opens in a new window.\n         *\n         * @param {number} length=1024 The scale in which to export the peaks. (Integer)\n         * @param {number} accuracy=10000 (Integer)\n         * @param {?boolean} noWindow Set to true to disable opening a new\n         * window with the JSON\n         * @todo Update exportPCM to work with new getPeaks signature\n         * @return {JSON} JSON of peaks\n         */\n\n    }, {\n        key: 'exportPCM',\n        value: function exportPCM(length, accuracy, noWindow) {\n            length = length || 1024;\n            accuracy = accuracy || 10000;\n            noWindow = noWindow || false;\n            var peaks = this.backend.getPeaks(length, accuracy);\n            var arr = [].map.call(peaks, function (val) {\n                return Math.round(val * accuracy) / accuracy;\n            });\n            var json = JSON.stringify(arr);\n            if (!noWindow) {\n                window.open('data:application/json;charset=utf-8,' + encodeURIComponent(json));\n            }\n            return json;\n        }\n\n        /**\n         * Save waveform image as data URI.\n         *\n         * The default format is `image/png`. Other supported types are\n         * `image/jpeg` and `image/webp`.\n         *\n         * @param {string} format='image/png'\n         * @param {number} quality=1\n         * @return {string} data URI of image\n         */\n\n    }, {\n        key: 'exportImage',\n        value: function exportImage(format, quality) {\n            if (!format) {\n                format = 'image/png';\n            }\n            if (!quality) {\n                quality = 1;\n            }\n\n            return this.drawer.getImage(format, quality);\n        }\n\n        /**\n         * Cancel any ajax request currently in progress\n         */\n\n    }, {\n        key: 'cancelAjax',\n        value: function cancelAjax() {\n            if (this.currentAjax) {\n                this.currentAjax.xhr.abort();\n                this.currentAjax = null;\n            }\n        }\n\n        /**\n         * @private\n         */\n\n    }, {\n        key: 'clearTmpEvents',\n        value: function clearTmpEvents() {\n            this.tmpEvents.forEach(function (e) {\n                return e.un();\n            });\n        }\n\n        /**\n         * Display empty waveform.\n         */\n\n    }, {\n        key: 'empty',\n        value: function empty() {\n            if (!this.backend.isPaused()) {\n                this.stop();\n                this.backend.disconnectSource();\n            }\n            this.cancelAjax();\n            this.clearTmpEvents();\n            this.drawer.progress(0);\n            this.drawer.setWidth(0);\n            this.drawer.drawPeaks({ length: this.drawer.getWidth() }, 0);\n        }\n\n        /**\n         * Remove events, elements and disconnect WebAudio nodes.\n         *\n         * @emits WaveSurfer#destroy\n         */\n\n    }, {\n        key: 'destroy',\n        value: function destroy() {\n            this.destroyAllPlugins();\n            this.fireEvent('destroy');\n            this.cancelAjax();\n            this.clearTmpEvents();\n            this.unAll();\n            if (this.params.responsive) {\n                window.removeEventListener('resize', this._onResize, true);\n            }\n            this.backend.destroy();\n            this.drawer.destroy();\n            this.isDestroyed = true;\n            this.arraybuffer = null;\n        }\n    }]);\n\n    return WaveSurfer;\n}(util.Observer);\n\nWaveSurfer.util = util;\nexports.default = WaveSurfer;\nmodule.exports = exports['default'];\n\n/***/ }),\n/* 14 */\n/***/ (function(module, exports) {\n\n/**\n * Returns a function, that, as long as it continues to be invoked, will not\n * be triggered. The function will be called after it stops being called for\n * N milliseconds. If `immediate` is passed, trigger the function on the\n * leading edge, instead of the trailing. The function also has a property 'clear' \n * that is a function which will clear the timer to prevent previously scheduled executions. \n *\n * @source underscore.js\n * @see http://unscriptable.com/2009/03/20/debouncing-javascript-methods/\n * @param {Function} function to wrap\n * @param {Number} timeout in ms (`100`)\n * @param {Boolean} whether to execute at the beginning (`false`)\n * @api public\n */\n\nmodule.exports = function debounce(func, wait, immediate){\n  var timeout, args, context, timestamp, result;\n  if (null == wait) wait = 100;\n\n  function later() {\n    var last = Date.now() - timestamp;\n\n    if (last < wait && last >= 0) {\n      timeout = setTimeout(later, wait - last);\n    } else {\n      timeout = null;\n      if (!immediate) {\n        result = func.apply(context, args);\n        context = args = null;\n      }\n    }\n  };\n\n  var debounced = function(){\n    context = this;\n    args = arguments;\n    timestamp = Date.now();\n    var callNow = immediate && !timeout;\n    if (!timeout) timeout = setTimeout(later, wait);\n    if (callNow) {\n      result = func.apply(context, args);\n      context = args = null;\n    }\n\n    return result;\n  };\n\n  debounced.clear = function() {\n    if (timeout) {\n      clearTimeout(timeout);\n      timeout = null;\n    }\n  };\n\n  return debounced;\n};\n\n\n/***/ })\n/******/ ]);\n});\n\n\n// WEBPACK FOOTER //\n// wavesurfer.min.js"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// identity function for calling harmony imports with the correct context\n \t__webpack_require__.i = function(value) { return value; };\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"localhost:8080/dist/\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 13);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 50fae2f3a5eb20a432c2","export { default as ajax } from './ajax';\nexport { default as getId } from './get-id';\nexport { default as max } from './max';\nexport { default as min } from './min';\nexport { default as Observer } from './observer';\nexport { default as extend } from './extend';\nexport { default as style } from './style';\nexport { default as debounce } from 'debounce';\n\n\n\n// WEBPACK FOOTER //\n// ./src/util/index.js","import * as util from './util';\n\n// using consts to prevent someone writing the string wrong\nconst PLAYING = 'playing';\nconst PAUSED = 'paused';\nconst FINISHED = 'finished';\n\n/**\n * WebAudio backend\n *\n * @extends {Observer}\n */\nexport default class WebAudio extends util.Observer {\n    /** @private */\n    static scriptBufferSize = 256\n    /** @private */\n    audioContext = null\n    /** @private */\n    offlineAudioContext = null\n    /** @private */\n    stateBehaviors = {\n        [PLAYING]: {\n            init() {\n                this.addOnAudioProcess();\n            },\n            getPlayedPercents() {\n                const duration = this.getDuration();\n                return (this.getCurrentTime() / duration) || 0;\n            },\n            getCurrentTime() {\n                return this.startPosition + this.getPlayedTime();\n            }\n        },\n        [PAUSED]: {\n            init() {\n                this.removeOnAudioProcess();\n            },\n            getPlayedPercents() {\n                const duration = this.getDuration();\n                return (this.getCurrentTime() / duration) || 0;\n            },\n            getCurrentTime() {\n                return this.startPosition;\n            }\n        },\n        [FINISHED]: {\n            init() {\n                this.removeOnAudioProcess();\n                this.fireEvent('finish');\n            },\n            getPlayedPercents() {\n                return 1;\n            },\n            getCurrentTime() {\n                return this.getDuration();\n            }\n        }\n    }\n\n    /**\n     * Does the browser support this backend\n     *\n     * @return {boolean}\n     */\n    supportsWebAudio() {\n        return !!(window.AudioContext || window.webkitAudioContext);\n    }\n\n    /**\n     * Get the audio context used by this backend or create one\n     *\n     * @return {AudioContext}\n     */\n    getAudioContext() {\n        if (!window.WaveSurferAudioContext) {\n            window.WaveSurferAudioContext = new (\n                window.AudioContext || window.webkitAudioContext\n            );\n        }\n        return window.WaveSurferAudioContext;\n    }\n\n    /**\n     * Get the offline audio context used by this backend or create one\n     *\n     * @param {number} sampleRate\n     * @return {OfflineAudioContext}\n     */\n    getOfflineAudioContext(sampleRate) {\n        if (!window.WaveSurferOfflineAudioContext) {\n            window.WaveSurferOfflineAudioContext = new (\n                window.OfflineAudioContext || window.webkitOfflineAudioContext\n            )(1, 2, sampleRate);\n        }\n        return window.WaveSurferOfflineAudioContext;\n    }\n\n    /**\n     * Construct the backend\n     *\n     * @param {WavesurferParams} params\n     */\n    constructor(params) {\n        super();\n        /** @private */\n        this.params = params;\n        /** @private */\n        this.ac = params.audioContext || this.getAudioContext();\n        /**@private */\n        this.lastPlay = this.ac.currentTime;\n        /** @private */\n        this.startPosition = 0;\n        /** @private  */\n        this.scheduledPause = null;\n        /** @private */\n        this.states = {\n            [PLAYING]: Object.create(this.stateBehaviors[PLAYING]),\n            [PAUSED]: Object.create(this.stateBehaviors[PAUSED]),\n            [FINISHED]: Object.create(this.stateBehaviors[FINISHED])\n        };\n        /** @private */\n        this.analyser = null;\n        /** @private */\n        this.buffer = null;\n        /** @private */\n        this.filters = [];\n        /** @private */\n        this.gainNode = null;\n        /** @private */\n        this.mergedPeaks = null;\n        /** @private */\n        this.offlineAc = null;\n        /** @private */\n        this.peaks = null;\n        /** @private */\n        this.playbackRate = 1;\n        /** @private */\n        this.analyser = null;\n        /** @private */\n        this.scriptNode = null;\n        /** @private */\n        this.source = null;\n        /** @private */\n        this.splitPeaks = [];\n        /** @private */\n        this.state = null;\n    }\n\n    /**\n     * Initialise the backend, called in `wavesurfer.createBackend()`\n     */\n    init() {\n        this.createVolumeNode();\n        this.createScriptNode();\n        this.createAnalyserNode();\n\n        this.setState(PAUSED);\n        this.setPlaybackRate(this.params.audioRate);\n        this.setLength(0);\n    }\n\n    /** @private */\n    disconnectFilters() {\n        if (this.filters) {\n            this.filters.forEach(filter => {\n                filter && filter.disconnect();\n            });\n            this.filters = null;\n            // Reconnect direct path\n            this.analyser.connect(this.gainNode);\n        }\n    }\n\n    /** @private */\n    setState(state) {\n        if (this.state !== this.states[state]) {\n            this.state = this.states[state];\n            this.state.init.call(this);\n        }\n    }\n\n    /**\n     * Unpacked `setFilters()`\n     *\n     * @param {...AudioNode} filters\n     */\n    setFilter(...filters) {\n        this.setFilters(filters);\n    }\n\n    /**\n     * Insert custom Web Audio nodes into the graph\n     *\n     * @param {AudioNode[]} filters Packed filters array\n     * @example\n     * const lowpass = wavesurfer.backend.ac.createBiquadFilter();\n     * wavesurfer.backend.setFilter(lowpass);\n     */\n    setFilters(filters) {\n        // Remove existing filters\n        this.disconnectFilters();\n\n        // Insert filters if filter array not empty\n        if (filters && filters.length) {\n            this.filters = filters;\n\n            // Disconnect direct path before inserting filters\n            this.analyser.disconnect();\n\n            // Connect each filter in turn\n            filters.reduce((prev, curr) => {\n                prev.connect(curr);\n                return curr;\n            }, this.analyser).connect(this.gainNode);\n        }\n\n    }\n\n    /** @private */\n    createScriptNode() {\n        if (this.ac.createScriptProcessor) {\n            this.scriptNode = this.ac.createScriptProcessor(this.scriptBufferSize);\n        } else {\n            this.scriptNode = this.ac.createJavaScriptNode(this.scriptBufferSize);\n        }\n\n        this.scriptNode.connect(this.ac.destination);\n    }\n\n    /** @private */\n    addOnAudioProcess() {\n        this.scriptNode.onaudioprocess = () => {\n            const time = this.getCurrentTime();\n\n            if (time >= this.getDuration()) {\n                this.setState(FINISHED);\n                this.fireEvent('pause');\n            } else if (time >= this.scheduledPause) {\n                this.pause();\n            } else if (this.state === this.states[PLAYING]) {\n                this.fireEvent('audioprocess', time);\n            }\n        };\n    }\n\n    /** @private */\n    removeOnAudioProcess() {\n        this.scriptNode.onaudioprocess = null;\n    }\n\n    /** @private */\n    createAnalyserNode() {\n        this.analyser = this.ac.createAnalyser();\n        this.analyser.connect(this.gainNode);\n    }\n\n    /**\n     * Create the gain node needed to control the playback volume.\n     *\n     * @private\n     */\n    createVolumeNode() {\n        // Create gain node using the AudioContext\n        if (this.ac.createGain) {\n            this.gainNode = this.ac.createGain();\n        } else {\n            this.gainNode = this.ac.createGainNode();\n        }\n        // Add the gain node to the graph\n        this.gainNode.connect(this.ac.destination);\n    }\n\n    /**\n     * Set the audio volume\n     *\n     * @param {number} value A floating point value between 0 and 1.\n     */\n    setVolume(value) {\n        this.gainNode.gain.value = value;\n    }\n\n    /**\n     * Get the current volume\n     *\n     * @return {number} value A floating point value between 0 and 1.\n     */\n    getVolume() {\n        return this.gainNode.gain.value;\n    }\n\n    /** @private */\n    decodeArrayBuffer(arraybuffer, callback, errback) {\n        if (!this.offlineAc) {\n            this.offlineAc = this.getOfflineAudioContext(this.ac ? this.ac.sampleRate : 44100);\n        }\n        this.offlineAc.decodeAudioData(arraybuffer, data => callback(data), errback);\n    }\n\n    /**\n     * Set pre-decoded peaks\n     *\n     * @param {Array} peaks\n     */\n    setPeaks(peaks) {\n        this.peaks = peaks;\n    }\n\n    /**\n     * Set the rendered length (different from the length of the audio).\n     *\n     * @param {number} length\n     */\n    setLength(length) {\n        // No resize, we can preserve the cached peaks.\n        if (this.mergedPeaks && length == ((2 * this.mergedPeaks.length - 1) + 2)) {\n            return;\n        }\n\n        this.splitPeaks = [];\n        this.mergedPeaks = [];\n        // Set the last element of the sparse array so the peak arrays are\n        // appropriately sized for other calculations.\n        const channels = this.buffer ? this.buffer.numberOfChannels : 1;\n        let c;\n        for (c = 0; c < channels; c++) {\n            this.splitPeaks[c] = [];\n            this.splitPeaks[c][2 * (length - 1)] = 0;\n            this.splitPeaks[c][2 * (length - 1) + 1] = 0;\n        }\n        this.mergedPeaks[2 * (length - 1)] = 0;\n        this.mergedPeaks[2 * (length - 1) + 1] = 0;\n    }\n\n    /**\n     * Compute the max and min value of the waveform when broken into <length> subranges.\n     *\n     * @param {number} length How many subranges to break the waveform into.\n     * @param {number} first First sample in the required range.\n     * @param {number} last Last sample in the required range.\n     * @return {number[]|number[][]} Array of 2*<length> peaks or array of arrays of\n     * peaks consisting of (max, min) values for each subrange.\n     */\n    getPeaks(length, first, last) {\n        if (this.peaks) { return this.peaks; }\n\n        this.setLength(length);\n\n        const sampleSize = this.buffer.length / length;\n        const sampleStep = ~~(sampleSize / 10) || 1;\n        const channels = this.buffer.numberOfChannels;\n        let c;\n\n        for (c = 0; c < channels; c++) {\n            const peaks = this.splitPeaks[c];\n            const chan = this.buffer.getChannelData(c);\n            let i;\n\n            for (i = first; i <= last; i++) {\n                const start = ~~(i * sampleSize);\n                const end = ~~(start + sampleSize);\n                let min = 0;\n                let max = 0;\n                let j;\n\n                for (j = start; j < end; j += sampleStep) {\n                    const value = chan[j];\n\n                    if (value > max) {\n                        max = value;\n                    }\n\n                    if (value < min) {\n                        min = value;\n                    }\n                }\n\n                peaks[2 * i] = max;\n                peaks[2 * i + 1] = min;\n\n                if (c == 0 || max > this.mergedPeaks[2 * i]) {\n                    this.mergedPeaks[2 * i] = max;\n                }\n\n                if (c == 0 || min < this.mergedPeaks[2 * i + 1]) {\n                    this.mergedPeaks[2 * i + 1] = min;\n                }\n            }\n        }\n\n        return this.params.splitChannels ? this.splitPeaks : this.mergedPeaks;\n    }\n\n    /**\n     * Get the position from 0 to 1\n     *\n     * @return {number}\n     */\n    getPlayedPercents() {\n        return this.state.getPlayedPercents.call(this);\n    }\n\n    /** @private */\n    disconnectSource() {\n        if (this.source) {\n            this.source.disconnect();\n        }\n    }\n\n    /**\n     * This is called when wavesurfer is destroyed\n     */\n    destroy() {\n        if (!this.isPaused()) {\n            this.pause();\n        }\n        this.unAll();\n        this.buffer = null;\n        this.disconnectFilters();\n        this.disconnectSource();\n        this.gainNode.disconnect();\n        this.scriptNode.disconnect();\n        this.analyser.disconnect();\n\n        // close the audioContext if closeAudioContext option is set to true\n        if (this.params.closeAudioContext) {\n            // check if browser supports AudioContext.close()\n            if (typeof this.ac.close === 'function') {\n                this.ac.close();\n            }\n            // clear the reference to the audiocontext\n            this.ac = null;\n            // clear the actual audiocontext, either passed as param or the\n            // global singleton\n            if (!this.params.audioContext) {\n                window.WaveSurferAudioContext = null;\n            } else {\n                this.params.audioContext = null;\n            }\n            // clear the offlineAudioContext\n            window.WaveSurferOfflineAudioContext = null;\n        }\n    }\n\n    /**\n     * Loaded a decoded audio buffer\n     *\n     * @param {Object} buffer\n     */\n    load(buffer) {\n        this.startPosition = 0;\n        this.lastPlay = this.ac.currentTime;\n        this.buffer = buffer;\n        this.createSource();\n    }\n\n    /** @private */\n    createSource() {\n        this.disconnectSource();\n        this.source = this.ac.createBufferSource();\n\n        //adjust for old browsers.\n        this.source.start = this.source.start || this.source.noteGrainOn;\n        this.source.stop = this.source.stop || this.source.noteOff;\n\n        this.source.playbackRate.value = this.playbackRate;\n        this.source.buffer = this.buffer;\n        this.source.connect(this.analyser);\n    }\n\n    /**\n     * Used by `wavesurfer.isPlaying()` and `wavesurfer.playPause()`\n     *\n     * @return {boolean}\n     */\n    isPaused() {\n        return this.state !== this.states[PLAYING];\n    }\n\n    /**\n     * Used by `wavesurfer.getDuration()`\n     *\n     * @return {number}\n     */\n    getDuration() {\n        if (!this.buffer) {\n            return 0;\n        }\n        return this.buffer.duration;\n    }\n\n    /**\n     * Used by `wavesurfer.seekTo()`\n     *\n     * @param {number} start Position to start at in seconds\n     * @param {number} end Position to end at in seconds\n     * @return {{start: number, end: number}}\n     */\n    seekTo(start, end) {\n        if (!this.buffer) { return; }\n\n        this.scheduledPause = null;\n\n        if (start == null) {\n            start = this.getCurrentTime();\n            if (start >= this.getDuration()) {\n                start = 0;\n            }\n        }\n        if (end == null) {\n            end = this.getDuration();\n        }\n\n        this.startPosition = start;\n        this.lastPlay = this.ac.currentTime;\n\n        if (this.state === this.states[FINISHED]) {\n            this.setState(PAUSED);\n        }\n\n        return {\n            start: start,\n            end: end\n        };\n    }\n\n    /**\n     * Get the playback position in seconds\n     *\n     * @return {number}\n     */\n    getPlayedTime() {\n        return (this.ac.currentTime - this.lastPlay) * this.playbackRate;\n    }\n\n    /**\n     * Plays the loaded audio region.\n     *\n     * @param {number} start Start offset in seconds, relative to the beginning\n     * of a clip.\n     * @param {number} end When to stop relative to the beginning of a clip.\n     */\n    play(start, end) {\n        if (!this.buffer) { return; }\n\n        // need to re-create source on each playback\n        this.createSource();\n\n        const adjustedTime = this.seekTo(start, end);\n\n        start = adjustedTime.start;\n        end = adjustedTime.end;\n\n        this.scheduledPause = end;\n\n        this.source.start(0, start, end - start);\n\n        if (this.ac.state == 'suspended') {\n            this.ac.resume && this.ac.resume();\n        }\n\n        this.setState(PLAYING);\n\n        this.fireEvent('play');\n    }\n\n    /**\n     * Pauses the loaded audio.\n     */\n    pause() {\n        this.scheduledPause = null;\n\n        this.startPosition += this.getPlayedTime();\n        this.source && this.source.stop(0);\n\n        this.setState(PAUSED);\n\n        this.fireEvent('pause');\n    }\n\n    /**\n    * Returns the current time in seconds relative to the audioclip's\n    * duration.\n    *\n    * @return {number}\n    */\n    getCurrentTime() {\n        return this.state.getCurrentTime.call(this);\n    }\n\n    /**\n    * Returns the current playback rate. (0=no playback, 1=normal playback)\n    *\n    * @return {number}\n    */\n    getPlaybackRate() {\n        return this.playbackRate;\n    }\n\n    /**\n     * Set the audio source playback rate.\n     *\n     * @param {number} value\n     */\n    setPlaybackRate(value) {\n        value = value || 1;\n        if (this.isPaused()) {\n            this.playbackRate = value;\n        } else {\n            this.pause();\n            this.playbackRate = value;\n            this.play();\n        }\n    }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/webaudio.js","/**\n * @typedef {Object} ListenerDescriptor\n * @property {string} name The name of the event\n * @property {function} callback The callback\n * @property {function} un The function to call to remove the listener\n */\n\n/**\n * Observer class\n */\nexport default class Observer {\n    /**\n     * Instantiate Observer\n     */\n    constructor() {\n        /**\n         * @private\n         * @todo Initialise the handlers here already and remove the conditional\n         * assignment in `on()`\n         */\n        this.handlers = null;\n    }\n    /**\n     * Attach a handler function for an event.\n     *\n     * @param {string} event Name of the event to listen to\n     * @param {function} fn The callback to trigger when the event is fired\n     * @return {ListenerDescriptor}\n     */\n    on(event, fn) {\n        if (!this.handlers) { this.handlers = {}; }\n\n        let handlers = this.handlers[event];\n        if (!handlers) {\n            handlers = this.handlers[event] = [];\n        }\n        handlers.push(fn);\n\n        // Return an event descriptor\n        return {\n            name: event,\n            callback: fn,\n            un: (e, fn) => this.un(e, fn)\n        };\n    }\n\n    /**\n     * Remove an event handler.\n     *\n     * @param {string} event Name of the event the listener that should be\n     * removed listens to\n     * @param {function} fn The callback that should be removed\n     */\n    un(event, fn) {\n        if (!this.handlers) { return; }\n\n        const handlers = this.handlers[event];\n        let i;\n        if (handlers) {\n            if (fn) {\n                for (i = handlers.length - 1; i >= 0; i--) {\n                    if (handlers[i] == fn) {\n                        handlers.splice(i, 1);\n                    }\n                }\n            } else {\n                handlers.length = 0;\n            }\n        }\n    }\n\n    /**\n     * Remove all event handlers.\n     */\n    unAll() {\n        this.handlers = null;\n    }\n\n    /**\n     * Attach a handler to an event. The handler is executed at most once per\n     * event type.\n     *\n     * @param {string} event The event to listen to\n     * @param {function} handler The callback that is only to be called once\n     * @return {ListenerDescriptor}\n     */\n    once(event, handler) {\n        const fn = (...args) => {\n            /*  eslint-disable no-invalid-this */\n            handler.apply(this, args);\n            /*  eslint-enable no-invalid-this */\n            setTimeout(() => {\n                this.un(event, fn);\n            }, 0);\n        };\n        return this.on(event, fn);\n    }\n\n    /**\n     * Manually fire an event\n     *\n     * @param {string} event The event to fire manually\n     * @param {...any} args The arguments with which to call the listeners\n     */\n    fireEvent(event, ...args) {\n        if (!this.handlers) { return; }\n        const handlers = this.handlers[event];\n        handlers && handlers.forEach(fn => {\n            fn(...args);\n        });\n    }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/util/observer.js","import Drawer from './drawer';\nimport * as util from './util';\n\n/**\n * @typedef {Object} CanvasEntry\n * @private\n * @property {HTMLElement} wave The wave node\n * @property {CanvasRenderingContext2D} waveCtx The canvas rendering context\n * @property {?HTMLElement} progress The progress wave node\n * @property {?CanvasRenderingContext2D} progressCtx The progress wave canvas\n * rendering context\n * @property {?number} start Start of the area the canvas should render, between 0 and 1\n * @property {?number} end End of the area the canvas should render, between 0 and 1\n */\n\n/**\n * MultiCanvas renderer for wavesurfer. Is currently the default and sole built\n * in renderer.\n */\nexport default class MultiCanvas extends Drawer {\n    /**\n     * @param {HTMLElement} container The container node of the wavesurfer instance\n     * @param {WavesurferParams} params The wavesurfer initialisation options\n     */\n    constructor(container, params) {\n        super(container, params);\n        /**\n         * @type {number}\n         * @private\n         */\n        this.maxCanvasWidth = params.maxCanvasWidth;\n        /**\n         * @private\n         * @type {number}\n         */\n        this.maxCanvasElementWidth = Math.round(params.maxCanvasWidth / params.pixelRatio);\n\n        /**\n         * Whether or not the progress wave is renderered. If the `waveColor`\n         * and `progressColor` are the same colour it is not.\n         * @type {boolean}\n         */\n        this.hasProgressCanvas = params.waveColor != params.progressColor;\n        /**\n         * @private\n         * @type {number}\n         */\n        this.halfPixel = 0.5 / params.pixelRatio;\n        /**\n         * @private\n         * @type {Array}\n         */\n        this.canvases = [];\n        /** @private */\n        this.progressWave = null;\n    }\n\n    /**\n     * Initialise the drawer\n     */\n    init() {\n        this.createWrapper();\n        this.createElements();\n    }\n\n    /**\n     * Create the canvas elements and style them\n     *\n     * @private\n     */\n    createElements() {\n        this.progressWave = this.wrapper.appendChild(\n            this.style(document.createElement('wave'), {\n                position: 'absolute',\n                zIndex: 2,\n                left: 0,\n                top: 0,\n                bottom: 0,\n                overflow: 'hidden',\n                width: '0',\n                display: 'none',\n                boxSizing: 'border-box',\n                borderRightStyle: 'solid',\n                borderRightWidth: this.params.cursorWidth + 'px',\n                borderRightColor: this.params.cursorColor\n            })\n        );\n\n        this.addCanvas();\n    }\n\n    /**\n     * Adjust to the updated size by adding or removing canvases\n     */\n    updateSize() {\n        const totalWidth = Math.round(this.width / this.params.pixelRatio);\n        const requiredCanvases = Math.ceil(totalWidth / this.maxCanvasElementWidth);\n\n        while (this.canvases.length < requiredCanvases) {\n            this.addCanvas();\n        }\n\n        while (this.canvases.length > requiredCanvases) {\n            this.removeCanvas();\n        }\n\n        this.canvases.forEach((entry, i) => {\n            // Add some overlap to prevent vertical white stripes, keep the width even for simplicity.\n            let canvasWidth = this.maxCanvasWidth + 2 * Math.ceil(this.params.pixelRatio / 2);\n\n            if (i == this.canvases.length - 1) {\n                canvasWidth = this.width - (this.maxCanvasWidth * (this.canvases.length - 1));\n            }\n\n            this.updateDimensions(entry, canvasWidth, this.height);\n            this.clearWaveForEntry(entry);\n        });\n    }\n\n    /**\n     * Add a canvas to the canvas list\n     *\n     * @private\n     */\n    addCanvas() {\n        const entry = {};\n        const leftOffset = this.maxCanvasElementWidth * this.canvases.length;\n\n        entry.wave = this.wrapper.appendChild(\n            this.style(document.createElement('canvas'), {\n                position: 'absolute',\n                zIndex: 1,\n                left: leftOffset + 'px',\n                top: 0,\n                bottom: 0\n            })\n        );\n        entry.waveCtx = entry.wave.getContext('2d');\n\n        if (this.hasProgressCanvas) {\n            entry.progress = this.progressWave.appendChild(\n                this.style(document.createElement('canvas'), {\n                    position: 'absolute',\n                    left: leftOffset + 'px',\n                    top: 0,\n                    bottom: 0\n                })\n            );\n            entry.progressCtx = entry.progress.getContext('2d');\n        }\n\n        this.canvases.push(entry);\n    }\n\n    /**\n     * Pop one canvas from the list\n     *\n     * @private\n     */\n    removeCanvas() {\n        const lastEntry = this.canvases.pop();\n        lastEntry.wave.parentElement.removeChild(lastEntry.wave);\n        if (this.hasProgressCanvas) {\n            lastEntry.progress.parentElement.removeChild(lastEntry.progress);\n        }\n    }\n\n    /**\n     * Update the dimensions of a canvas element\n     *\n     * @private\n     * @param {CanvasEntry} entry\n     * @param {number} width The new width of the element\n     * @param {number} height The new height of the element\n     */\n    updateDimensions(entry, width, height) {\n        const elementWidth = Math.round(width / this.params.pixelRatio);\n        const totalWidth = Math.round(this.width / this.params.pixelRatio);\n\n        // Where the canvas starts and ends in the waveform, represented as a decimal between 0 and 1.\n        entry.start = (entry.waveCtx.canvas.offsetLeft / totalWidth) || 0;\n        entry.end = entry.start + elementWidth / totalWidth;\n\n        entry.waveCtx.canvas.width = width;\n        entry.waveCtx.canvas.height = height;\n        this.style(entry.waveCtx.canvas, { width: elementWidth + 'px'});\n\n        this.style(this.progressWave, { display: 'block'});\n\n        if (this.hasProgressCanvas) {\n            entry.progressCtx.canvas.width = width;\n            entry.progressCtx.canvas.height = height;\n            this.style(entry.progressCtx.canvas, { width: elementWidth + 'px'});\n        }\n    }\n\n    /**\n     * Clear the whole waveform\n     */\n    clearWave() {\n        this.canvases.forEach(entry => this.clearWaveForEntry(entry));\n    }\n\n    /**\n     * Clear one canvas\n     *\n     * @private\n     * @param {CanvasEntry} entry\n     */\n    clearWaveForEntry(entry) {\n        entry.waveCtx.clearRect(0, 0, entry.waveCtx.canvas.width, entry.waveCtx.canvas.height);\n        if (this.hasProgressCanvas) {\n            entry.progressCtx.clearRect(0, 0, entry.progressCtx.canvas.width, entry.progressCtx.canvas.height);\n        }\n    }\n\n    /**\n     * Draw a waveform with bars\n     *\n     * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n     * rendering\n     * @param {number} channelIndex The index of the current channel. Normally\n     * should be 0. Must be an integer.\n     * @param {number} start The x-offset of the beginning of the area that\n     * should be rendered\n     * @param {number} end The x-offset of the end of the area that should be\n     * rendered\n     */\n    drawBars(peaks, channelIndex, start, end) {\n        // Split channels\n        if (peaks[0] instanceof Array) {\n            const channels = peaks;\n            if (this.params.splitChannels) {\n                this.setHeight(channels.length * this.params.height * this.params.pixelRatio);\n                channels.forEach((channelPeaks, i) => this.drawBars(channelPeaks, i, start, end));\n                return;\n            }\n            peaks = channels[0];\n        }\n\n        // Bar wave draws the bottom only as a reflection of the top,\n        // so we don't need negative values\n        const hasMinVals = [].some.call(peaks, val => val < 0);\n        // Skip every other value if there are negatives.\n        const peakIndexScale = hasMinVals ? 2 : 1;\n\n        // A half-pixel offset makes lines crisp\n        const width = this.width;\n        const height = this.params.height * this.params.pixelRatio;\n        const offsetY = height * channelIndex || 0;\n        const halfH = height / 2;\n        const length = peaks.length / peakIndexScale;\n        const bar = this.params.barWidth * this.params.pixelRatio;\n        const gap = Math.max(this.params.pixelRatio, ~~(bar / 2));\n        const step = bar + gap;\n\n        let absmax = 1;\n        if (this.params.normalize) {\n            const max = util.max(peaks);\n            const min = util.min(peaks);\n            absmax = -min > max ? -min : max;\n        }\n\n        const scale = length / width;\n        let i;\n\n        for (i = (start / scale); i < (end / scale); i += step) {\n            const peak = peaks[Math.floor(i * scale * peakIndexScale)] || 0;\n            const h = Math.round(peak / absmax * halfH);\n            this.fillRect(i + this.halfPixel, halfH - h + offsetY, bar + this.halfPixel, h * 2);\n        }\n    }\n\n    /**\n     * Draw a waveform\n     *\n     * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n     * rendering\n     * @param {number} channelIndex The index of the current channel. Normally\n     * should be 0\n     * @param {number} start The x-offset of the beginning of the area that\n     * should be rendered\n     * @param {number} end The x-offset of the end of the area that should be\n     * rendered\n     */\n    drawWave(peaks, channelIndex, start, end) {\n        // Split channels\n        if (peaks[0] instanceof Array) {\n            const channels = peaks;\n            if (this.params.splitChannels) {\n                this.setHeight(channels.length * this.params.height * this.params.pixelRatio);\n                channels.forEach((channelPeaks, i) => this.drawWave(channelPeaks, i, start, end));\n                return;\n            }\n            peaks = channels[0];\n        }\n\n        // Support arrays without negative peaks\n        const hasMinValues = [].some.call(peaks, val => val < 0);\n        if (!hasMinValues) {\n            const reflectedPeaks = [];\n            const len = peaks.length;\n            let i;\n            for (i = 0; i < len; i++) {\n                reflectedPeaks[2 * i] = peaks[i];\n                reflectedPeaks[2 * i + 1] = -peaks[i];\n            }\n            peaks = reflectedPeaks;\n        }\n\n        // A half-pixel offset makes lines crisp\n        const height = this.params.height * this.params.pixelRatio;\n        const offsetY = height * channelIndex || 0;\n        const halfH = height / 2;\n\n        let absmax = 1;\n        if (this.params.normalize) {\n            const max = util.max(peaks);\n            const min = util.min(peaks);\n            absmax = -min > max ? -min : max;\n        }\n\n        this.drawLine(peaks, absmax, halfH, offsetY, start, end);\n\n        // Always draw a median line\n        this.fillRect(0, halfH + offsetY - this.halfPixel, this.width, this.halfPixel);\n    }\n\n    /**\n     * Tell the canvas entries to render their portion of the waveform\n     *\n     * @private\n     * @param {number[]} peaks Peak data\n     * @param {number} absmax Maximum peak value (absolute)\n     * @param {number} halfH Half the height of the waveform\n     * @param {number} offsetY Offset to the top\n     * @param {number} start The x-offset of the beginning of the area that\n     * should be rendered\n     * @param {number} end The x-offset of the end of the area that\n     * should be rendered\n     */\n    drawLine(peaks, absmax, halfH, offsetY, start, end) {\n        this.canvases.forEach(entry => {\n            this.setFillStyles(entry);\n            this.drawLineToContext(entry, entry.waveCtx, peaks, absmax, halfH, offsetY, start, end);\n            this.drawLineToContext(entry, entry.progressCtx, peaks, absmax, halfH, offsetY, start, end);\n        });\n    }\n\n    /**\n     * Render the actual waveform line on a canvas\n     *\n     * @private\n     * @param {CanvasEntry} entry\n     * @param {Canvas2DContextAttributes} ctx Essentially `entry.[wave|progress]Ctx`\n     * @param {number[]} peaks\n     * @param {number} absmax Maximum peak value (absolute)\n     * @param {number} halfH Half the height of the waveform\n     * @param {number} offsetY Offset to the top\n     * @param {number} start The x-offset of the beginning of the area that\n     * should be rendered\n     * @param {number} end The x-offset of the end of the area that\n     * should be rendered\n     */\n    drawLineToContext(entry, ctx, peaks, absmax, halfH, offsetY, start, end) {\n        if (!ctx) { return; }\n\n        const length = peaks.length / 2;\n\n        let scale = 1;\n        if (this.params.fillParent && this.width != length) {\n            scale = this.width / length;\n        }\n\n        const first = Math.round(length * entry.start);\n        const last = Math.round(length * entry.end);\n        if (first > end || last < start) { return; }\n        const canvasStart = Math.max(first, start);\n        const canvasEnd = Math.min(last, end);\n        let i;\n        let j;\n\n        ctx.beginPath();\n        ctx.moveTo((canvasStart - first) * scale + this.halfPixel, halfH + offsetY);\n\n        for (i = canvasStart; i < canvasEnd; i++) {\n            const peak = peaks[2 * i] || 0;\n            const h = Math.round(peak / absmax * halfH);\n            ctx.lineTo((i - first) * scale + this.halfPixel, halfH - h + offsetY);\n        }\n\n        // Draw the bottom edge going backwards, to make a single\n        // closed hull to fill.\n        for (j = canvasEnd - 1; j >= canvasStart; j--) {\n            const peak = peaks[2 * j + 1] || 0;\n            const h = Math.round(peak / absmax * halfH);\n            ctx.lineTo((j - first) * scale + this.halfPixel, halfH - h + offsetY);\n        }\n\n        ctx.closePath();\n        ctx.fill();\n    }\n\n    /**\n     * Draw a rectangle on the waveform\n     *\n     * @param {number} x\n     * @param {number} y\n     * @param {number} width\n     * @param {number} height\n     */\n    fillRect(x, y, width, height) {\n        const startCanvas = Math.floor(x / this.maxCanvasWidth);\n        const endCanvas = Math.min(\n          Math.ceil((x + width) / this.maxCanvasWidth) + 1,\n          this.canvases.length\n        );\n        let i;\n        for (i = startCanvas; i < endCanvas; i++) {\n            const entry = this.canvases[i];\n            const leftOffset = i * this.maxCanvasWidth;\n\n            const intersection = {\n                x1: Math.max(x, i * this.maxCanvasWidth),\n                y1: y,\n                x2: Math.min(x + width, i * this.maxCanvasWidth + entry.waveCtx.canvas.width),\n                y2: y + height\n            };\n\n            if (intersection.x1 < intersection.x2) {\n                this.setFillStyles(entry);\n\n                this.fillRectToContext(entry.waveCtx,\n                        intersection.x1 - leftOffset,\n                        intersection.y1,\n                        intersection.x2 - intersection.x1,\n                        intersection.y2 - intersection.y1);\n\n                this.fillRectToContext(entry.progressCtx,\n                        intersection.x1 - leftOffset,\n                        intersection.y1,\n                        intersection.x2 - intersection.x1,\n                        intersection.y2 - intersection.y1);\n            }\n        }\n    }\n\n    /**\n     * Draw the actual rectangle on a canvas\n     *\n     * @private\n     * @param {Canvas2DContextAttributes} ctx\n     * @param {number} x\n     * @param {number} y\n     * @param {number} width\n     * @param {number} height\n     */\n    fillRectToContext(ctx, x, y, width, height) {\n        if (!ctx) { return; }\n        ctx.fillRect(x, y, width, height);\n    }\n\n    /**\n     * Set the fill styles for a certain entry (wave and progress)\n     *\n     * @private\n     * @param {CanvasEntry} entry\n     */\n    setFillStyles(entry) {\n        entry.waveCtx.fillStyle = this.params.waveColor;\n        if (this.hasProgressCanvas) {\n            entry.progressCtx.fillStyle = this.params.progressColor;\n        }\n    }\n\n    /**\n     * Return image data of the waveform\n     *\n     * @param {string} type='image/png' An optional value of a format type.\n     * @param {number} quality=0.92 An optional value between 0 and 1.\n     * @return {string|string[]} images A data URL or an array of data URLs\n     */\n    getImage(type, quality) {\n        const images = this.canvases.map(entry => entry.wave.toDataURL(type, quality));\n        return images.length > 1 ? images : images[0];\n    }\n\n    /**\n     * Render the new progress\n     *\n     * @param {number} position X-Offset of progress position in pixels\n     */\n    updateProgress(position) {\n        this.style(this.progressWave, { width: position + 'px' });\n    }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/drawer.multicanvas.js","import WebAudio from './webaudio';\nimport * as util from './util';\n\n/**\n * MediaElement backend\n */\nexport default class MediaElement extends WebAudio {\n    /**\n     * Construct the backend\n     *\n     * @param {WavesurferParams} params\n     */\n    constructor(params) {\n        super(params);\n        /** @private */\n        this.params = params;\n\n        // Dummy media to catch errors\n        /** @private */\n        this.media = {\n            currentTime: 0,\n            duration: 0,\n            paused: true,\n            playbackRate: 1,\n            play() {},\n            pause() {}\n        };\n\n        /** @private */\n        this.mediaType = params.mediaType.toLowerCase();\n        /** @private */\n        this.elementPosition = params.elementPosition;\n        /** @private */\n        this.peaks = null;\n        /** @private */\n        this.playbackRate = 1;\n        /** @private */\n        this.buffer = null;\n        /** @private */\n        this.onPlayEnd = null;\n    }\n\n    /**\n     * Initialise the backend, called in `wavesurfer.createBackend()`\n     */\n    init() {\n        this.setPlaybackRate(this.params.audioRate);\n        this.createTimer();\n    }\n\n    /**\n     * Create a timer to provide a more precise `audioprocess` event.\n     *\n     * @private\n     */\n    createTimer() {\n        const onAudioProcess = () => {\n            if (this.isPaused()) { return; }\n            this.fireEvent('audioprocess', this.getCurrentTime());\n\n            // Call again in the next frame\n            const requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame;\n            requestAnimationFrame(onAudioProcess);\n        };\n\n        this.on('play', onAudioProcess);\n    }\n\n    /**\n     *  Create media element with url as its source,\n     *  and append to container element.\n     *\n     *  @param {string} url Path to media file\n     *  @param {HTMLElement} container HTML element\n     *  @param {Array} peaks Array of peak data\n     *  @param {string} preload HTML 5 preload attribute value\n     */\n    load(url, container, peaks, preload) {\n        const media = document.createElement(this.mediaType);\n        media.controls = this.params.mediaControls;\n        media.autoplay = this.params.autoplay || false;\n        media.preload = preload == null ? 'auto' : preload;\n        media.src = url;\n        media.style.width = '100%';\n\n        const prevMedia = container.querySelector(this.mediaType);\n        if (prevMedia) {\n            container.removeChild(prevMedia);\n        }\n        container.appendChild(media);\n\n        this._load(media, peaks);\n    }\n\n    /**\n     *  Load existing media element.\n     *\n     *  @param {MediaElement} elt HTML5 Audio or Video element\n     *  @param {Array} peaks Array of peak data\n     */\n    loadElt(elt, peaks) {\n        elt.controls = this.params.mediaControls;\n        elt.autoplay = this.params.autoplay || false;\n\n        this._load(elt, peaks);\n    }\n\n    /**\n     *  Private method called by both load (from url)\n     *  and loadElt (existing media element).\n     *\n     *  @param  {MediaElement}  media     HTML5 Audio or Video element\n     *  @param  {Array}         peaks   array of peak data\n     *  @private\n     */\n    _load(media, peaks) {\n        // load must be called manually on iOS, otherwise peaks won't draw\n        // until a user interaction triggers load --> 'ready' event\n        if (typeof media.load == 'function') {\n            media.load();\n        }\n\n        media.addEventListener('error', () => {\n            this.fireEvent('error', 'Error loading media element');\n        });\n\n        media.addEventListener('canplay', () => {\n            this.fireEvent('canplay');\n        });\n\n        media.addEventListener('ended', () => {\n            this.fireEvent('finish');\n        });\n\n        this.media = media;\n        this.peaks = peaks;\n        this.onPlayEnd = null;\n        this.buffer = null;\n        this.setPlaybackRate(this.playbackRate);\n    }\n\n    /**\n     * Used by `wavesurfer.isPlaying()` and `wavesurfer.playPause()`\n     *\n     * @return {boolean}\n     */\n    isPaused() {\n        return !this.media || this.media.paused;\n    }\n\n    /**\n     * Used by `wavesurfer.getDuration()`\n     *\n     * @return {number}\n     */\n    getDuration() {\n        let duration = (this.buffer || this.media).duration;\n        if (duration >= Infinity) { // streaming audio\n            duration = this.media.seekable.end(0);\n        }\n        return duration;\n    }\n\n    /**\n    * Returns the current time in seconds relative to the audioclip's\n    * duration.\n    *\n    * @return {number}\n    */\n    getCurrentTime() {\n        return this.media && this.media.currentTime;\n    }\n\n    /**\n     * Get the position from 0 to 1\n     *\n     * @return {number}\n     */\n    getPlayedPercents() {\n        return (this.getCurrentTime() / this.getDuration()) || 0;\n    }\n\n    /**\n     * Set the audio source playback rate.\n     *\n     * @param {number} value\n     */\n    setPlaybackRate(value) {\n        this.playbackRate = value || 1;\n        this.media.playbackRate = this.playbackRate;\n    }\n\n    /**\n     * Used by `wavesurfer.seekTo()`\n     *\n     * @param {number} start Position to start at in seconds\n     */\n    seekTo(start) {\n        if (start != null) {\n            this.media.currentTime = start;\n        }\n        this.clearPlayEnd();\n    }\n\n    /**\n     * Plays the loaded audio region.\n     *\n     * @param {Number} start Start offset in seconds, relative to the beginning\n     * of a clip.\n     * @param {Number} end When to stop relative to the beginning of a clip.\n     * @emits MediaElement#play\n     */\n    play(start, end) {\n        this.seekTo(start);\n        this.media.play();\n        end && this.setPlayEnd(end);\n        this.fireEvent('play');\n    }\n\n    /**\n     * Pauses the loaded audio.\n     *\n     * @emits MediaElement#pause\n     */\n    pause() {\n        this.media && this.media.pause();\n        this.clearPlayEnd();\n        this.fireEvent('pause');\n    }\n\n    /** @private */\n    setPlayEnd(end) {\n        this._onPlayEnd = time => {\n            if (time >= end) {\n                this.pause();\n                this.seekTo(end);\n            }\n        };\n        this.on('audioprocess', this._onPlayEnd);\n    }\n\n    /** @private */\n    clearPlayEnd() {\n        if (this._onPlayEnd) {\n            this.un('audioprocess', this._onPlayEnd);\n            this._onPlayEnd = null;\n        }\n    }\n\n    /**\n     * Compute the max and min value of the waveform when broken into\n     * <length> subranges.\n     *\n     * @param {number} length How many subranges to break the waveform into.\n     * @param {number} first First sample in the required range.\n     * @param {number} last Last sample in the required range.\n     * @return {number[]|number[][]} Array of 2*<length> peaks or array of\n     * arrays of peaks consisting of (max, min) values for each subrange.\n     */\n    getPeaks(length, first, last) {\n        if (this.buffer) {\n            return super.getPeaks(length, first, last);\n        }\n        return this.peaks || [];\n    }\n\n    /**\n     * Get the current volume\n     *\n     * @return {number} value A floating point value between 0 and 1.\n     */\n    getVolume() {\n        return this.media.volume;\n    }\n\n    /**\n     * Set the audio volume\n     *\n     * @param {number} value A floating point value between 0 and 1.\n     */\n    setVolume(value) {\n        this.media.volume = value;\n    }\n\n    /**\n     * This is called when wavesurfer is destroyed\n     *\n     */\n    destroy() {\n        this.pause();\n        this.unAll();\n        this.media && this.media.parentNode && this.media.parentNode.removeChild(this.media);\n        this.media = null;\n    }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/mediaelement.js","/**\n * Caches the decoded peaks data to improve rendering speed for lage audio\n *\n * Is used if the option parameter `partialRender` is set to `true`\n */\nexport default class PeakCache {\n    /**\n     * Instantiate cache\n     */\n    constructor() {\n        this.clearPeakCache();\n    }\n\n    /**\n     * Empty the cache\n     */\n    clearPeakCache() {\n        /**\n         * Flat array with entries that are always in pairs to mark the\n         * beginning and end of each subrange.  This is a convenience so we can\n         * iterate over the pairs for easy set difference operations.\n         * @private\n         */\n        this.peakCacheRanges = [];\n        /**\n         * Length of the entire cachable region, used for resetting the cache\n         * when this changes (zoom events, for instance).\n         * @private\n         */\n        this.peakCacheLength = -1;\n    }\n\n    /**\n     * Add a range of peaks to the cache\n     *\n     * @param {number} length The length of the range\n     * @param {number} start The x offset of the start of the range\n     * @param {number} end The x offset of the end of the range\n     * @return {number[][]}\n     */\n    addRangeToPeakCache(length, start, end) {\n        if (length != this.peakCacheLength) {\n            this.clearPeakCache();\n            this.peakCacheLength = length;\n        }\n\n        // Return ranges that weren't in the cache before the call.\n        let uncachedRanges = [];\n        let i = 0;\n        // Skip ranges before the current start.\n        while (i < this.peakCacheRanges.length && this.peakCacheRanges[i] < start) {\n            i++;\n        }\n        // If |i| is even, |start| falls after an existing range.  Otherwise,\n        // |start| falls between an existing range, and the uncached region\n        // starts when we encounter the next node in |peakCacheRanges| or\n        // |end|, whichever comes first.\n        if (i % 2 == 0) {\n            uncachedRanges.push(start);\n        }\n        while (i < this.peakCacheRanges.length && this.peakCacheRanges[i] <= end) {\n            uncachedRanges.push(this.peakCacheRanges[i]);\n            i++;\n        }\n        // If |i| is even, |end| is after all existing ranges.\n        if (i % 2 == 0) {\n            uncachedRanges.push(end);\n        }\n\n        // Filter out the 0-length ranges.\n        uncachedRanges = uncachedRanges.filter((item, pos, arr) => {\n            if (pos == 0) {\n                return item != arr[pos + 1];\n            } else if (pos == arr.length - 1) {\n                return item != arr[pos - 1];\n            }\n            return item != arr[pos - 1] && item != arr[pos + 1];\n        });\n\n        // Merge the two ranges together, uncachedRanges will either contain\n        // wholly new points, or duplicates of points in peakCacheRanges.  If\n        // duplicates are detected, remove both and extend the range.\n        this.peakCacheRanges = this.peakCacheRanges.concat(uncachedRanges);\n        this.peakCacheRanges = this.peakCacheRanges.sort((a, b) => a - b).filter((item, pos, arr) => {\n            if (pos == 0) {\n                return item != arr[pos + 1];\n            } else if (pos == arr.length - 1) {\n                return item != arr[pos - 1];\n            }\n            return item != arr[pos - 1] && item != arr[pos + 1];\n        });\n\n        // Push the uncached ranges into an array of arrays for ease of\n        // iteration in the functions that call this.\n        const uncachedRangePairs = [];\n        for (i = 0; i < uncachedRanges.length; i += 2) {\n            uncachedRangePairs.push([uncachedRanges[i], uncachedRanges[i+1]]);\n        }\n\n        return uncachedRangePairs;\n    }\n\n    /**\n     * For testing\n     *\n     * @return {number[][]}\n     */\n    getCacheRanges() {\n        const peakCacheRangePairs = [];\n        let i;\n        for (i = 0; i < this.peakCacheRanges.length; i += 2) {\n            peakCacheRangePairs.push([this.peakCacheRanges[i], this.peakCacheRanges[i+1]]);\n        }\n        return peakCacheRangePairs;\n    }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/peakcache.js","import * as util from './util';\n/**\n * Parent class for renderers\n *\n * @extends {Observer}\n */\nexport default class Drawer extends util.Observer {\n    /**\n     * @param {HTMLElement} container The container node of the wavesurfer instance\n     * @param {WavesurferParams} params The wavesurfer initialisation options\n     */\n    constructor(container, params) {\n        super();\n        /** @private */\n        this.container = container;\n        /**\n         * @type {WavesurferParams}\n         * @private\n         */\n        this.params = params;\n        /**\n         * The width of the renderer\n         * @type {number}\n         */\n        this.width = 0;\n        /**\n         * The height of the renderer\n         * @type {number}\n         */\n        this.height = params.height * this.params.pixelRatio;\n        /** @private */\n        this.lastPos = 0;\n        /**\n         * The `<wave>` element which is added to the container\n         * @type {HTMLElement}\n         */\n        this.wrapper = null;\n    }\n\n    /**\n     * Alias of `util.style`\n     *\n     * @param {HTMLElement} el The element that the styles will be applied to\n     * @param {Object} styles The map of propName: attribute, both are used as-is\n     * @return {HTMLElement} el\n     */\n    style(el, styles) {\n        return util.style(el, styles);\n    }\n\n    /**\n     * Create the wrapper `<wave>` element, style it and set up the events for\n     * interaction\n     */\n    createWrapper() {\n        this.wrapper = this.container.appendChild(\n            document.createElement('wave')\n        );\n\n        this.style(this.wrapper, {\n            display: 'block',\n            position: 'relative',\n            userSelect: 'none',\n            webkitUserSelect: 'none',\n            height: this.params.height + 'px'\n        });\n\n        if (this.params.fillParent || this.params.scrollParent) {\n            this.style(this.wrapper, {\n                width: '100%',\n                overflowX: this.params.hideScrollbar ? 'hidden' : 'auto',\n                overflowY: 'hidden'\n            });\n        }\n\n        this.setupWrapperEvents();\n    }\n\n    /**\n     * Handle click event\n     *\n     * @param {Event} e Click event\n     * @param {?boolean} noPrevent Set to true to not call `e.preventDefault()`\n     * @return {number} Playback position from 0 to 1\n     */\n    handleEvent(e, noPrevent) {\n        !noPrevent && e.preventDefault();\n\n        const clientX = e.targetTouches ? e.targetTouches[0].clientX : e.clientX;\n        const bbox = this.wrapper.getBoundingClientRect();\n\n        const nominalWidth = this.width;\n        const parentWidth = this.getWidth();\n\n        let progress;\n\n        if (!this.params.fillParent && nominalWidth < parentWidth) {\n            progress = ((clientX - bbox.left) * this.params.pixelRatio / nominalWidth) || 0;\n\n            if (progress > 1) {\n                progress = 1;\n            }\n        } else {\n            progress = ((clientX - bbox.left + this.wrapper.scrollLeft) / this.wrapper.scrollWidth) || 0;\n        }\n\n        return progress;\n    }\n\n    /**\n     * @private\n     */\n    setupWrapperEvents() {\n        this.wrapper.addEventListener('click', e => {\n            const scrollbarHeight = this.wrapper.offsetHeight - this.wrapper.clientHeight;\n            if (scrollbarHeight != 0) {\n                // scrollbar is visible.  Check if click was on it\n                const bbox = this.wrapper.getBoundingClientRect();\n                if (e.clientY >= bbox.bottom - scrollbarHeight) {\n                    // ignore mousedown as it was on the scrollbar\n                    return;\n                }\n            }\n\n            if (this.params.interact) {\n                this.fireEvent('click', e, this.handleEvent(e));\n            }\n        });\n\n        this.wrapper.addEventListener('scroll', e => this.fireEvent('scroll', e));\n    }\n\n    /**\n     * Draw peaks on the canvas\n     *\n     * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n     * rendering\n     * @param {number} length The width of the area that should be drawn\n     * @param {number} start The x-offset of the beginning of the area that\n     * should be rendered\n     * @param {number} end The x-offset of the end of the area that should be\n     * rendered\n     */\n    drawPeaks(peaks, length, start, end) {\n        this.setWidth(length);\n\n        this.params.barWidth ?\n            this.drawBars(peaks, 0, start, end) :\n            this.drawWave(peaks, 0, start, end);\n    }\n\n    /**\n     * Scroll to the beginning\n     */\n    resetScroll() {\n        if (this.wrapper !== null) {\n            this.wrapper.scrollLeft = 0;\n        }\n    }\n\n    /**\n     * Recenter the viewport at a certain percent of the waveform\n     *\n     * @param {number} percent Value from 0 to 1 on the waveform\n     */\n    recenter(percent) {\n        const position = this.wrapper.scrollWidth * percent;\n        this.recenterOnPosition(position, true);\n    }\n\n    /**\n     * Recenter the viewport on a position, either scroll there immediately or\n     * in steps of 5 pixels\n     *\n     * @param {number} position X-offset in pixels\n     * @param {boolean} immediate Set to true to immediately scroll somewhere\n     */\n    recenterOnPosition(position, immediate) {\n        const scrollLeft = this.wrapper.scrollLeft;\n        const half = ~~(this.wrapper.clientWidth / 2);\n        const maxScroll = this.wrapper.scrollWidth - this.wrapper.clientWidth;\n        let target = position - half;\n        let offset = target - scrollLeft;\n\n        if (maxScroll == 0) {\n            // no need to continue if scrollbar is not there\n            return;\n        }\n\n        // if the cursor is currently visible...\n        if (!immediate && -half <= offset && offset < half) {\n            // we'll limit the \"re-center\" rate.\n            const rate = 5;\n            offset = Math.max(-rate, Math.min(rate, offset));\n            target = scrollLeft + offset;\n        }\n\n        // limit target to valid range (0 to maxScroll)\n        target = Math.max(0, Math.min(maxScroll, target));\n        // no use attempting to scroll if we're not moving\n        if (target != scrollLeft) {\n            this.wrapper.scrollLeft = target;\n        }\n    }\n\n    /**\n     * Get the current scroll position in pixels\n     *\n     * @return {number}\n     */\n    getScrollX() {\n        return Math.round(this.wrapper.scrollLeft * this.params.pixelRatio);\n    }\n\n    /**\n     * Get the width of the container\n     *\n     * @return {number}\n     */\n    getWidth() {\n        return Math.round(this.container.clientWidth * this.params.pixelRatio);\n    }\n\n    /**\n     * Set the width of the container\n     *\n     * @param {number} width\n     */\n    setWidth(width) {\n        if (this.width == width) {\n            return;\n        }\n\n        this.width = width;\n\n        if (this.params.fillParent || this.params.scrollParent) {\n            this.style(this.wrapper, {\n                width: ''\n            });\n        } else {\n            this.style(this.wrapper, {\n                width: ~~(this.width / this.params.pixelRatio) + 'px'\n            });\n        }\n\n        this.updateSize();\n    }\n\n    /**\n     * Set the height of the container\n     *\n     * @param {number} height\n     */\n    setHeight(height) {\n        if (height == this.height) { return; }\n        this.height = height;\n        this.style(this.wrapper, {\n            height: ~~(this.height / this.params.pixelRatio) + 'px'\n        });\n        this.updateSize();\n    }\n\n    /**\n     * Called by wavesurfer when progress should be renderered\n     *\n     * @param {number} progress From 0 to 1\n     */\n    progress(progress) {\n        const minPxDelta = 1 / this.params.pixelRatio;\n        const pos = Math.round(progress * this.width) * minPxDelta;\n\n        if (pos < this.lastPos || pos - this.lastPos >= minPxDelta) {\n            this.lastPos = pos;\n\n            if (this.params.scrollParent && this.params.autoCenter) {\n                const newPos = ~~(this.wrapper.scrollWidth * progress);\n                this.recenterOnPosition(newPos);\n            }\n\n            this.updateProgress(pos);\n        }\n    }\n\n    /**\n     * This is called when wavesurfer is destroyed\n     */\n    destroy() {\n        this.unAll();\n        if (this.wrapper) {\n            this.container.removeChild(this.wrapper);\n            this.wrapper = null;\n        }\n    }\n\n    /* Renderer-specific methods */\n    /**\n     * Called when the size of the container changes so the renderer can adjust\n     *\n     * @abstract\n     */\n    updateSize() {}\n\n    /**\n     * Draw a waveform with bars\n     *\n     * @abstract\n     * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n     * rendering\n     * @param {number} channelIndex The index of the current channel. Normally\n     * should be 0\n     * @param {number} start The x-offset of the beginning of the area that\n     * should be rendered\n     * @param {number} end The x-offset of the end of the area that should be\n     * rendered\n     */\n    drawBars(peaks, channelIndex, start, end) {}\n\n    /**\n     * Draw a waveform\n     *\n     * @abstract\n     * @param {number[]|number[][]} peaks Can also be an array of arrays for split channel\n     * rendering\n     * @param {number} channelIndex The index of the current channel. Normally\n     * should be 0\n     * @param {number} start The x-offset of the beginning of the area that\n     * should be rendered\n     * @param {number} end The x-offset of the end of the area that should be\n     * rendered\n     */\n    drawWave(peaks, channelIndex, start, end) {}\n\n    /**\n     * Clear the waveform\n     *\n     * @abstract\n     */\n    clearWave() {}\n\n    /**\n     * Render the new progress\n     *\n     * @abstract\n     * @param {number} position X-Offset of progress position in pixels\n     */\n    updateProgress(position) {}\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/drawer.js","import Observer from './observer';\n\n/**\n * Perform an ajax request\n *\n * @param {Options} options Description\n *\n * @returns {Object} Observer instance\n */\nexport default function ajax (options) {\n    const instance = new Observer();\n    const xhr = new XMLHttpRequest();\n    let fired100 = false;\n    xhr.open(options.method || 'GET', options.url, true);\n    xhr.responseType = options.responseType || 'json';\n    xhr.addEventListener('progress', e => {\n        instance.fireEvent('progress', e);\n        if (e.lengthComputable && e.loaded == e.total) {\n            fired100 = true;\n        }\n    });\n    xhr.addEventListener('load', e => {\n        if (!fired100) {\n            instance.fireEvent('progress', e);\n        }\n        instance.fireEvent('load', e);\n        if (200 == xhr.status || 206 == xhr.status) {\n            instance.fireEvent('success', xhr.response, e);\n        } else {\n            instance.fireEvent('error', e);\n        }\n    });\n    xhr.addEventListener('error', e => instance.fireEvent('error', e));\n    xhr.send();\n    instance.xhr = xhr;\n    return instance;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/util/ajax.js"," /**\n  * Extend an object shallowly with others\n  *\n  * @param {Object} dest The target object\n  * @param {Object[]} sources The objects to use for extending\n  *\n  * @return {Object} Merged object\n  */\nexport default function extend (dest, ...sources) {\n    sources.forEach(source => {\n        Object.keys(source).forEach(key => {\n            dest[key] = source[key];\n        });\n    });\n    return dest;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/util/extend.js","/**\n * Get a random prefixed ID\n *\n * @returns {String} Random ID\n */\nexport default function getId () {\n    return 'wavesurfer_' + Math.random().toString(32).substring(2);\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/util/get-id.js","/**\n * Get the largest value\n *\n * @param   {Array} values Array of numbers\n * @returns {Number} Largest number found\n */\nexport default function max (values) {\n    let largest = -Infinity;\n    Object.keys(values).forEach(i => {\n        if (values[i] > largest) {\n            largest = values[i];\n        }\n    });\n    return largest;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/util/max.js","/**\n * Get the smallest value\n *\n * @param   {Array} values Array of numbers\n * @returns {Number}       Smallest number found\n */\nexport default function min (values) {\n    let smallest = Number(Infinity);\n    Object.keys(values).forEach(i => {\n        if (values[i] < smallest) {\n            smallest = values[i];\n        }\n    });\n    return smallest;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/util/min.js","/**\n * Apply a map of styles to an element\n *\n * @param {HTMLElement} el The element that the styles will be applied to\n * @param {Object} styles The map of propName: attribute, both are used as-is\n *\n * @return {HTMLElement} el\n */\nexport default function style (el, styles) {\n    Object.keys(styles).forEach(prop => {\n        if (el.style[prop] !== styles[prop]) {\n            el.style[prop] = styles[prop];\n        }\n    });\n    return el;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/util/style.js","import * as util from './util';\nimport MultiCanvas from './drawer.multicanvas';\nimport WebAudio from './webaudio';\nimport MediaElement from './mediaelement';\nimport PeakCache from './peakcache';\n\n/** @external {HTMLElement} https://developer.mozilla.org/en/docs/Web/API/HTMLElement */\n/** @external {OfflineAudioContext} https://developer.mozilla.org/en-US/docs/Web/API/OfflineAudioContext */\n/** @external {File} https://developer.mozilla.org/en-US/docs/Web/API/File */\n/** @external {Blob} https://developer.mozilla.org/en-US/docs/Web/API/Blob */\n/** @external {CanvasRenderingContext2D} https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D */\n/** @external {MediaStreamConstraints} https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamConstraints */\n/** @external {AudioNode} https://developer.mozilla.org/de/docs/Web/API/AudioNode */\n\n/**\n * @typedef {Object} WavesurferParams\n * @property {AudioContext} audioContext=null Use your own previously\n * initialized AudioContext or leave blank.\n * @property {number} audioRate=1 Speed at which to play audio. Lower number is\n * slower.\n * @property {boolean} autoCenter=true If a scrollbar is present, center the\n * waveform around the progress\n * @property {string} backend='WebAudio' `'WebAudio'|'MediaElement'` In most cases\n * you don't have to set this manually. MediaElement is a fallback for\n * unsupported browsers.\n * @property {boolean} closeAudioContext=false Close and nullify all audio\n * contexts when the destroy method is called.\n * @property {!string|HTMLElement} container CSS selector or HTML element where\n * the waveform should be drawn. This is the only required parameter.\n * @property {string} cursorColor='#333' The fill color of the cursor indicating\n * the playhead position.\n * @property {number} cursorWidth=1 Measured in pixels.\n * @property {boolean} fillParent=true Whether to fill the entire container or\n * draw only according to `minPxPerSec`.\n * @property {boolean} forceDecode=false Force decoding of audio using web audio\n * when zooming to get a more detailed waveform.\n * @property {number} height=128 The height of the waveform. Measured in\n * pixels.\n * @property {boolean} hideScrollbar=false Whether to hide the horizontal\n * scrollbar when one would normally be shown.\n * @property {boolean} interact=true Whether the mouse interaction will be\n * enabled at initialization. You can switch this parameter at any time later\n * on.\n * @property {boolean} loopSelection=true (Use with regions plugin) Enable\n * looping of selected regions\n * @property {number} maxCanvasWidth=4000 Maximum width of a single canvas in\n * pixels, excluding a small overlap (2 * `pixelRatio`, rounded up to the next\n * even integer). If the waveform is longer than this value, additional canvases\n * will be used to render the waveform, which is useful for very large waveforms\n * that may be too wide for browsers to draw on a single canvas.\n * @property {boolean} mediaControls=false (Use with backend `MediaElement`)\n * this enables the native controls for the media element\n * @property {string} mediaType='audio' (Use with backend `MediaElement`)\n * `'audio'|'video'`\n * @property {number} minPxPerSec=20 Minimum number of pixels per second of\n * audio.\n * @property {boolean} normalize=false If true, normalize by the maximum peak\n * instead of 1.0.\n * @property {boolean} partialRender=false Use the PeakCache to improve\n * rendering speed of large waveforms\n * @property {number} pixelRatio=window.devicePixelRatio The pixel ratio used to\n * calculate display\n * @property {PluginDefinition[]} plugins=[] An array of plugin definitions to\n * register during instantiation, they will be directly initialised unless they\n * are added with the `deferInit` property set to true.\n * @property {string} progressColor='#555' The fill color of the part of the\n * waveform behind the cursor.\n * @property {Object} renderer=MultiCanvas Can be used to inject a custom\n * renderer.\n * @property {boolean|number} responsive=false If set to `true` resize the\n * waveform, when the window is resized. This is debounced with a `100ms`\n * timeout by default. If this parameter is a number it represents that timeout.\n * @property {boolean} scrollParent=false Whether to scroll the container with a\n * lengthy waveform. Otherwise the waveform is shrunk to the container width\n * (see fillParent).\n * @property {number} skipLength=2 Number of seconds to skip with the\n * skipForward() and skipBackward() methods.\n * @property {boolean} splitChannels=false Render with seperate waveforms for\n * the channels of the audio\n * @property {string} waveColor='#999' The fill color of the waveform after the\n * cursor.\n */\n\n/**\n * @typedef {Object} PluginDefinition\n * @desc The Object used to describe a plugin\n * @example wavesurfer.addPlugin(pluginDefinition);\n * @property {string} name The name of the plugin, the plugin instance will be\n * added as a property to the wavesurfer instance under this name\n * @property {?Object} staticProps The properties that should be added to the\n * wavesurfer instance as static properties\n * @property {?boolean} deferInit Don't initialise plugin\n * automatically\n * @property {Object} params={} The plugin parameters, they are the first parameter\n * passed to the plugin class constructor function\n * @property {PluginClass} instance The plugin instance factory, is called with\n * the dependency specified in extends. Returns the plugin class.\n */\n\n/**\n * @interface PluginClass\n *\n * @desc This is the interface which is implemented by all plugin classes. Note\n * that this only turns into an observer after being passed through\n * `wavesurfer.addPlugin`.\n *\n * @extends {Observer}\n */\nclass PluginClass {\n    /**\n     * Plugin definition factory\n     *\n     * This function must be used to create a plugin definition which can be\n     * used by wavesurfer to correctly instantiate the plugin.\n     *\n     * @param  {Object} params={} The plugin params (specific to the plugin)\n     * @return {PluginDefinition} an object representing the plugin\n     */\n    create(params) {}\n    /**\n     * Construct the plugin\n     *\n     * @param {Object} ws The wavesurfer instance\n     * @param {Object} params={} The plugin params (specific to the plugin)\n     */\n    constructor(ws, params) {}\n    /**\n     * Initialise the plugin\n     *\n     * Start doing something. This is called by\n     * `wavesurfer.initPlugin(pluginName)`\n     */\n    init() {}\n    /**\n     * Destroy the plugin instance\n     *\n     * Stop doing something. This is called by\n     * `wavesurfer.destroyPlugin(pluginName)`\n     */\n    destroy() {}\n}\n\n/**\n * WaveSurfer core library class\n *\n * @extends {Observer}\n * @example\n * const params = {\n *   container: '#waveform',\n *   waveColor: 'violet',\n *   progressColor: 'purple'\n * };\n *\n * // initialise like this\n * const wavesurfer = WaveSurfer.create(params);\n *\n * // or like this ...\n * const wavesurfer = new WaveSurfer(params);\n * wavesurfer.init();\n *\n * // load audio file\n * wavesurfer.load('example/media/demo.wav');\n */\nexport default class WaveSurfer extends util.Observer {\n    /** @private */\n    defaultParams = {\n        audioContext  : null,\n        audioRate     : 1,\n        autoCenter    : true,\n        backend       : 'WebAudio',\n        container     : null,\n        cursorColor   : '#333',\n        cursorWidth   : 1,\n        dragSelection : true,\n        fillParent    : true,\n        forceDecode   : true,\n        height        : 128,\n        hideScrollbar : false,\n        interact      : true,\n        loopSelection : true,\n        maxCanvasWidth: 4000,\n        mediaContainer: null,\n        mediaControls : false,\n        mediaType     : 'audio',\n        minPxPerSec   : 20,\n        normalize     : false,\n        partialRender : false,\n        pixelRatio    : window.devicePixelRatio || screen.deviceXDPI / screen.logicalXDPI,\n        plugins       : [],\n        progressColor : '#555',\n        renderer      : MultiCanvas,\n        responsive    : false,\n        scrollParent  : false,\n        skipLength    : 2,\n        splitChannels : false,\n        waveColor     : '#999'\n    }\n\n    /** @private */\n    backends = {\n        MediaElement,\n        WebAudio\n    }\n\n    /**\n     * Instantiate this class, call its `init` function and returns it\n     *\n     * @param {WavesurferParams} params\n     * @return {Object} WaveSurfer instance\n     * @example const wavesurfer = WaveSurfer.create(params);\n     */\n    static create(params) {\n        const wavesurfer = new WaveSurfer(params);\n        return wavesurfer.init();\n    }\n\n    /**\n     * Functions in the `util` property are available as a prototype property to\n     * all instances\n     *\n     * @type {Object}\n     * @example\n     * const wavesurfer = WaveSurfer.create(params);\n     * wavesurfer.util.style(myElement, { background: 'blue' });\n     */\n    util = util\n\n    /**\n     * Functions in the `util` property are available as a static property of the\n     * WaveSurfer class\n     *\n     * @type {Object}\n     * @example\n     * WaveSurfer.util.style(myElement, { background: 'blue' });\n     */\n    static util = util\n\n    /**\n     * Initialise wavesurfer instance\n     *\n     * @param {WavesurferParams} params Instantiation options for wavesurfer\n     * @example\n     * const wavesurfer = new WaveSurfer(params);\n     * @returns {this}\n     */\n    constructor(params) {\n        super();\n        /**\n         * Extract relevant parameters (or defaults)\n         * @private\n         */\n        this.params = util.extend({}, this.defaultParams, params);\n\n        /** @private */\n        this.container = 'string' == typeof params.container ?\n            document.querySelector(this.params.container) :\n            this.params.container;\n\n        if (!this.container) {\n            throw new Error('Container element not found');\n        }\n\n        if (this.params.mediaContainer == null) {\n            /** @private */\n            this.mediaContainer = this.container;\n        } else if (typeof this.params.mediaContainer == 'string') {\n            /** @private */\n            this.mediaContainer = document.querySelector(this.params.mediaContainer);\n        } else {\n            /** @private */\n            this.mediaContainer = this.params.mediaContainer;\n        }\n\n        if (!this.mediaContainer) {\n            throw new Error('Media Container element not found');\n        }\n\n        if (this.params.maxCanvasWidth <= 1) {\n            throw new Error('maxCanvasWidth must be greater than 1');\n        } else if (this.params.maxCanvasWidth % 2 == 1) {\n            throw new Error('maxCanvasWidth must be an even number');\n        }\n\n        /**\n         * @private Used to save the current volume when muting so we can\n         * restore once unmuted\n         * @type {number}\n         */\n        this.savedVolume = 0;\n\n        /**\n         * @private The current muted state\n         * @type {boolean}\n         */\n        this.isMuted = false;\n\n        /**\n         * @private Will hold a list of event descriptors that need to be\n         * cancelled on subsequent loads of audio\n         * @type {Object[]}\n         */\n        this.tmpEvents = [];\n\n        /**\n         * @private Holds any running audio downloads\n         * @type {Observer}\n         */\n        this.currentAjax = null;\n        /** @private */\n        this.arraybuffer = null;\n        /** @private */\n        this.drawer = null;\n        /** @private */\n        this.backend = null;\n        /** @private */\n        this.peakCache = null;\n\n        // cache constructor objects\n        if (typeof this.params.renderer !== 'function') {\n            throw new Error('Renderer parameter is invalid');\n        }\n        /**\n         * @private The uninitialised Drawer class\n         */\n        this.Drawer = this.params.renderer;\n        /**\n         * @private The uninitialised Backend class\n         */\n        this.Backend = this.backends[this.params.backend];\n\n        /**\n         * @private map of plugin names that are currently initialised\n         */\n        this.initialisedPluginList = {};\n        /** @private */\n        this.isDestroyed = false;\n        /** @private */\n        this.isReady = false;\n\n        // responsive debounced event listener. If this.params.responsive is not\n        // set, this is never called. Use 100ms or this.params.responsive as\n        // timeout for the debounce function.\n        let prevWidth = 0;\n        this._onResize = util.debounce(() => {\n            if (prevWidth != this.drawer.wrapper.clientWidth) {\n                prevWidth = this.drawer.wrapper.clientWidth;\n                this.empty();\n                this.drawBuffer();\n            }\n        }, typeof this.params.responsive === 'number' ? this.params.responsive : 100);\n\n        return this;\n    }\n\n    /**\n     * Initialise the wave\n     *\n     * @example\n     * var wavesurfer = new WaveSurfer(params);\n     * wavesurfer.init();\n     * @return {this}\n     */\n    init() {\n        this.registerPlugins(this.params.plugins);\n        this.createDrawer();\n        this.createBackend();\n        this.createPeakCache();\n        return this;\n    }\n\n    /**\n     * Add and initialise array of plugins (if `plugin.deferInit` is falsey),\n     * this function is called in the init function of wavesurfer\n     *\n     * @param {PluginDefinition[]} plugins An array of plugin definitions\n     * @emits {WaveSurfer#plugins-registered} Called with the array of plugin definitions\n     * @return {this}\n     */\n    registerPlugins(plugins) {\n        // first instantiate all the plugins\n        plugins.forEach(plugin => this.addPlugin(plugin));\n\n        // now run the init functions\n        plugins.forEach(plugin => {\n            // call init function of the plugin if deferInit is falsey\n            // in that case you would manually use initPlugins()\n            if (!plugin.deferInit) {\n                this.initPlugin(plugin.name);\n            }\n        });\n        this.fireEvent('plugins-registered', plugins);\n        return this;\n    }\n\n    /**\n     * Add a plugin object to wavesurfer\n     *\n     * @param {PluginDefinition} plugin A plugin definition\n     * @emits {WaveSurfer#plugin-added} Called with the name of the plugin that was added\n     * @example wavesurfer.addPlugin(WaveSurfer.minimap());\n     * @return {this}\n     */\n    addPlugin(plugin) {\n        if (!plugin.name) {\n            throw new Error('Plugin does not have a name!');\n        }\n        if (!plugin.instance) {\n            throw new Error(`Plugin ${plugin.name} does not have an instance property!`);\n        }\n\n        // staticProps properties are applied to wavesurfer instance\n        if (plugin.staticProps) {\n            Object.keys(plugin.staticProps).forEach(pluginStaticProp => {\n                /**\n                 * Properties defined in a plugin definition's `staticProps` property are added as\n                 * staticProps properties of the WaveSurfer instance\n                 */\n                this[pluginStaticProp] = plugin.staticProps[pluginStaticProp];\n            });\n        }\n\n        const Instance = plugin.instance;\n\n        // turn the plugin instance into an observer\n        const observerPrototypeKeys = Object.getOwnPropertyNames(util.Observer.prototype);\n        observerPrototypeKeys.forEach(key => {\n            Instance.prototype[key] = util.Observer.prototype[key];\n        });\n\n        /**\n         * Instantiated plugin classes are added as a property of the wavesurfer\n         * instance\n         * @type {Object}\n         */\n        this[plugin.name] = new Instance(plugin.params || {}, this);\n        this.fireEvent('plugin-added', plugin.name);\n        return this;\n    }\n\n    /**\n     * Initialise a plugin\n     *\n     * @param {string} name A plugin name\n     * @emits WaveSurfer#plugin-initialised\n     * @example wavesurfer.initPlugin('minimap');\n     * @return {this}\n     */\n    initPlugin(name) {\n        if (!this[name]) {\n            throw new Error(`Plugin ${name} has not been added yet!`);\n        }\n        if (this.initialisedPluginList[name]) {\n            // destroy any already initialised plugins\n            this.destroyPlugin(name);\n        }\n        this[name].init();\n        this.initialisedPluginList[name] = true;\n        this.fireEvent('plugin-initialised', name);\n        return this;\n    }\n\n    /**\n     * Destroy a plugin\n     *\n     * @param {string} name A plugin name\n     * @emits WaveSurfer#plugin-destroyed\n     * @example wavesurfer.destroyPlugin('minimap');\n     * @returns {this}\n     */\n    destroyPlugin(name) {\n        if (!this[name]) {\n            throw new Error(`Plugin ${name} has not been added yet and cannot be destroyed!`);\n        }\n        if (!this.initialisedPluginList[name]) {\n            throw new Error(`Plugin ${name} is not active and cannot be destroyed!`);\n        }\n        if (typeof this[name].destroy !== 'function') {\n            throw new Error(`Plugin ${name} does not have a destroy function!`);\n        }\n\n        this[name].destroy();\n        delete this.initialisedPluginList[name];\n        this.fireEvent('plugin-destroyed', name);\n        return this;\n    }\n\n    /**\n     * Destroy all initialised plugins. Convenience function to use when\n     * wavesurfer is removed\n     *\n     * @private\n     */\n    destroyAllPlugins() {\n        Object.keys(this.initialisedPluginList).forEach(name => this.destroyPlugin(name));\n    }\n\n    /**\n     * Create the drawer and draw the waveform\n     *\n     * @private\n     * @emits WaveSurfer#drawer-created\n     */\n    createDrawer() {\n        this.drawer = new this.Drawer(this.container, this.params);\n        this.drawer.init();\n        this.fireEvent('drawer-created', this.drawer);\n\n        if (this.params.responsive) {\n            window.addEventListener('resize', this._onResize, true);\n        }\n\n        this.drawer.on('redraw', () => {\n            this.drawBuffer();\n            this.drawer.progress(this.backend.getPlayedPercents());\n        });\n\n        // Click-to-seek\n        this.drawer.on('click', (e, progress) => {\n            setTimeout(() => this.seekTo(progress), 0);\n        });\n\n        // Relay the scroll event from the drawer\n        this.drawer.on('scroll', e => {\n            if (this.params.partialRender) {\n                this.drawBuffer();\n            }\n            this.fireEvent('scroll', e);\n        });\n    }\n\n    /**\n     * Create the backend\n     *\n     * @private\n     * @emits WaveSurfer#backend-created\n     */\n    createBackend() {\n        if (this.backend) {\n            this.backend.destroy();\n        }\n\n        // Back compat\n        if (this.params.backend == 'AudioElement') {\n            this.params.backend = 'MediaElement';\n        }\n\n        if (this.params.backend == 'WebAudio' && !this.Backend.prototype.supportsWebAudio.call(null)) {\n            this.params.backend = 'MediaElement';\n        }\n\n        this.backend = new this.Backend(this.params);\n        this.backend.init();\n        this.fireEvent('backend-created', this.backend);\n\n        this.backend.on('finish', () => this.fireEvent('finish'));\n        this.backend.on('play', () => this.fireEvent('play'));\n        this.backend.on('pause', () => this.fireEvent('pause'));\n\n        this.backend.on('audioprocess', time => {\n            this.drawer.progress(this.backend.getPlayedPercents());\n            this.fireEvent('audioprocess', time);\n        });\n    }\n\n    /**\n     * Create the peak cache\n     *\n     * @private\n     */\n    createPeakCache() {\n        if (this.params.partialRender) {\n            this.peakCache = new PeakCache();\n        }\n    }\n\n    /**\n     * Get the duration of the audio clip\n     *\n     * @example const duration = wavesurfer.getDuration();\n     * @return {number} Duration in seconds\n     */\n    getDuration() {\n        return this.backend.getDuration();\n    }\n\n    /**\n     * Get the current playback position\n     *\n     * @example const currentTime = wavesurfer.getCurrentTime();\n     * @return {number} Playback position in seconds\n     */\n    getCurrentTime() {\n        return this.backend.getCurrentTime();\n    }\n\n    /**\n     * Starts playback from the current position. Optional start and end\n     * measured in seconds can be used to set the range of audio to play.\n     *\n     * @param {?number} start Position to start at\n     * @param {?number} end Position to end at\n     * @emits WaveSurfer#interaction\n     * @example\n     * // play from second 1 to 5\n     * wavesurfer.play(1, 5);\n     */\n    play(start, end) {\n        this.fireEvent('interaction', () => this.play(start, end));\n        this.backend.play(start, end);\n    }\n\n    /**\n     * Stops playback\n     *\n     * @example wavesurfer.pause();\n     */\n    pause() {\n        this.backend.isPaused() || this.backend.pause();\n    }\n\n    /**\n     * Toggle playback\n     *\n     * @example wavesurfer.playPause();\n     */\n    playPause() {\n        this.backend.isPaused() ? this.play() : this.pause();\n    }\n\n    /**\n     * Get the current playback state\n     *\n     * @example const isPlaying = wavesurfer.isPlaying();\n     * @return {boolean} False if paused, true if playing\n     */\n    isPlaying() {\n        return !this.backend.isPaused();\n    }\n\n    /**\n     * Skip backward\n     *\n     * @param {?number} seconds Amount to skip back, if not specified `skipLength`\n     * is used\n     * @example wavesurfer.skipBackward();\n     */\n    skipBackward(seconds) {\n        this.skip(-seconds || -this.params.skipLength);\n    }\n\n    /**\n     * Skip forward\n     *\n     * @param {?number} seconds Amount to skip back, if not specified `skipLength`\n     * is used\n     * @example wavesurfer.skipForward();\n     */\n    skipForward(seconds) {\n        this.skip(seconds || this.params.skipLength);\n    }\n\n    /**\n     * Skip a number of seconds from the current position (use a negative value\n     * to go backwards).\n     *\n     * @param {number} offset Amount to skip back or forwards\n     * @example\n     * // go back 2 seconds\n     * wavesurfer.skip(-2);\n     */\n    skip(offset) {\n        const duration = this.getDuration() || 1;\n        let position = this.getCurrentTime() || 0;\n        position = Math.max(0, Math.min(duration, position + (offset || 0)));\n        this.seekAndCenter(position / duration);\n    }\n\n    /**\n     * Seeks to a position and centers the view\n     *\n     * @param {number} progress Between 0 (=beginning) and 1 (=end)\n     * @example\n     * // seek and go to the middle of the audio\n     * wavesurfer.seekTo(0.5);\n     */\n    seekAndCenter(progress) {\n        this.seekTo(progress);\n        this.drawer.recenter(progress);\n    }\n\n    /**\n     * Seeks to a position\n     *\n     * @param {number} progress Between 0 (=beginning) and 1 (=end)\n     * @emits WaveSurfer#interaction\n     * @emits WaveSurfer#seek\n     * @example\n     * // seek to the middle of the audio\n     * wavesurfer.seekTo(0.5);\n     */\n    seekTo(progress) {\n        this.fireEvent('interaction', () => this.seekTo(progress));\n\n        const paused = this.backend.isPaused();\n        // avoid draw wrong position while playing backward seeking\n        if (!paused) {\n            this.backend.pause();\n        }\n        // avoid small scrolls while paused seeking\n        const oldScrollParent = this.params.scrollParent;\n        this.params.scrollParent = false;\n        this.backend.seekTo(progress * this.getDuration());\n        this.drawer.progress(this.backend.getPlayedPercents());\n\n        if (!paused) {\n            this.backend.play();\n        }\n        this.params.scrollParent = oldScrollParent;\n        this.fireEvent('seek', progress);\n    }\n\n    /**\n     * Stops and goes to the beginning.\n     *\n     * @example wavesurfer.stop();\n     */\n    stop() {\n        this.pause();\n        this.seekTo(0);\n        this.drawer.progress(0);\n    }\n\n    /**\n     * Set the playback volume.\n     *\n     * @param {number} newVolume A value between 0 and 1, 0 being no\n     * volume and 1 being full volume.\n     */\n    setVolume(newVolume) {\n        this.backend.setVolume(newVolume);\n    }\n\n    /**\n     * Get the playback volume.\n     *\n     * @return {number} A value between 0 and 1, 0 being no\n     * volume and 1 being full volume.\n     */\n    getVolume () {\n        return this.backend.getVolume();\n    }\n\n    /**\n     * Set the playback rate.\n     *\n     * @param {number} rate A positive number. E.g. 0.5 means half the normal\n     * speed, 2 means double speed and so on.\n     * @example wavesurfer.setPlaybackRate(2);\n     */\n    setPlaybackRate(rate) {\n        this.backend.setPlaybackRate(rate);\n    }\n\n    /**\n     * Get the playback rate.\n     *\n     * @return {number}\n     */\n    getPlaybackRate() {\n        return this.backend.getPlaybackRate();\n    }\n\n    /**\n     * Toggle the volume on and off. It not currenly muted it will save the\n     * current volume value and turn the volume off. If currently muted then it\n     * will restore the volume to the saved value, and then rest the saved\n     * value.\n     *\n     * @example wavesurfer.toggleMute();\n     */\n    toggleMute() {\n        this.setMute(!this.isMuted);\n    }\n\n    /**\n     * Enable or disable muted audio\n     *\n     * @param {boolean} mute\n     * @example\n     * // unmute\n     * wavesurfer.setMute(false);\n     */\n    setMute(mute) {\n        // ignore all muting requests if the audio is already in that state\n        if (mute === this.isMuted) {\n            return;\n        }\n\n        if (mute) {\n            // If currently not muted then save current volume,\n            // turn off the volume and update the mute properties\n            this.savedVolume = this.backend.getVolume();\n            this.backend.setVolume(0);\n            this.isMuted = true;\n        } else {\n            // If currently muted then restore to the saved volume\n            // and update the mute properties\n            this.backend.setVolume(this.savedVolume);\n            this.isMuted = false;\n        }\n    }\n\n    /**\n     * Get the current mute status.\n     *\n     * @example const isMuted = wavesurfer.getMute();\n     * @return {boolean}\n     */\n    getMute() {\n        return this.isMuted;\n    }\n\n    /**\n     * Toggles `scrollParent` and redraws\n     *\n     * @example wavesurfer.toggleScroll();\n     */\n    toggleScroll() {\n        this.params.scrollParent = !this.params.scrollParent;\n        this.drawBuffer();\n    }\n\n    /**\n     * Toggle mouse interaction\n     *\n     * @example wavesurfer.toggleInteraction();\n     */\n    toggleInteraction() {\n        this.params.interact = !this.params.interact;\n    }\n\n    /**\n     * Get the correct peaks for current wave viewport and render wave\n     *\n     * @private\n     * @emits WaveSurfer#redraw\n     */\n    drawBuffer() {\n        const nominalWidth = Math.round(\n            this.getDuration() * this.params.minPxPerSec * this.params.pixelRatio\n        );\n        const parentWidth = this.drawer.getWidth();\n        let width = nominalWidth;\n        let start = this.drawer.getScrollX();\n        let end = Math.min(start + parentWidth, width);\n\n        // Fill container\n        if (this.params.fillParent && (!this.params.scrollParent || nominalWidth < parentWidth)) {\n            width = parentWidth;\n            start = 0;\n            end = width;\n        }\n\n        let peaks;\n        if (this.params.partialRender) {\n            const newRanges = this.peakCache.addRangeToPeakCache(width, start, end);\n            let i;\n            for (i = 0; i < newRanges.length; i++) {\n                peaks = this.backend.getPeaks(width, newRanges[i][0], newRanges[i][1]);\n                this.drawer.drawPeaks(peaks, width, newRanges[i][0], newRanges[i][1]);\n            }\n        } else {\n            start = 0;\n            end = width;\n            peaks = this.backend.getPeaks(width, start, end);\n            this.drawer.drawPeaks(peaks, width, start, end);\n        }\n        this.fireEvent('redraw', peaks, width);\n    }\n\n    /**\n     * Horizontally zooms the waveform in and out. It also changes the parameter\n     * `minPxPerSec` and enables the `scrollParent` option.\n     *\n     * @param {number} pxPerSec Number of horizontal pixels per second of audio\n     * @emits WaveSurfer#zoom\n     * @example wavesurfer.zoom(20);\n     */\n    zoom(pxPerSec) {\n        this.params.minPxPerSec = pxPerSec;\n\n        this.params.scrollParent = true;\n\n        this.drawBuffer();\n        this.drawer.progress(this.backend.getPlayedPercents());\n\n        this.drawer.recenter(\n            this.getCurrentTime() / this.getDuration()\n        );\n        this.fireEvent('zoom', pxPerSec);\n    }\n\n    /**\n     * Decode buffer and load\n     *\n     * @private\n     * @param {ArrayBuffer} arraybuffer\n     */\n    loadArrayBuffer(arraybuffer) {\n        this.decodeArrayBuffer(arraybuffer, data => {\n            if (!this.isDestroyed) {\n                this.loadDecodedBuffer(data);\n            }\n        });\n    }\n\n    /**\n     * Directly load an externally decoded AudioBuffer\n     *\n     * @private\n     * @param {AudioBuffer} buffer\n     * @emits WaveSurfer#ready\n     */\n    loadDecodedBuffer(buffer) {\n        this.backend.load(buffer);\n        this.drawBuffer();\n        this.fireEvent('ready');\n        this.isReady = true;\n    }\n\n    /**\n     * Loads audio data from a Blob or File object\n     *\n     * @param {Blob|File} blob Audio data\n     * @example\n     */\n    loadBlob(blob) {\n        // Create file reader\n        const reader = new FileReader();\n        reader.addEventListener('progress', e => this.onProgress(e));\n        reader.addEventListener('load', e => this.loadArrayBuffer(e.target.result));\n        reader.addEventListener('error', () => this.fireEvent('error', 'Error reading file'));\n        reader.readAsArrayBuffer(blob);\n        this.empty();\n    }\n\n    /**\n     * Loads audio and re-renders the waveform.\n     *\n     * @param {string} url The url of the audio file\n     * @param {?number[]|number[][]} peaks Wavesurfer does not have to decode the audio to\n     * render the waveform if this is specified\n     * @param {?string} preload (Use with backend `MediaElement`)\n     * `'none'|'metadata'|'auto'` Preload attribute for the media element\n     * @example\n     * // using ajax or media element to load (depending on backend)\n     * wavesurfer.load('http://example.com/demo.wav');\n     *\n     * // setting preload attribute with media element backend and supplying\n     * peaks wavesurfer.load(\n     *   'http://example.com/demo.wav',\n     *   [0.0218, 0.0183, 0.0165, 0.0198, 0.2137, 0.2888],\n     *   true,\n     * );\n     */\n    load(url, peaks, preload) {\n        this.empty();\n\n        switch (this.params.backend) {\n            case 'WebAudio': return this.loadBuffer(url, peaks);\n            case 'MediaElement': return this.loadMediaElement(url, peaks, preload);\n        }\n    }\n\n    /**\n     * Loads audio using Web Audio buffer backend.\n     *\n     * @private\n     * @param {string} url\n     * @param {?number[]|number[][]} peaks\n     */\n    loadBuffer(url, peaks) {\n        const load = action => {\n            if (action) {\n                this.tmpEvents.push(this.once('ready', action));\n            }\n            return this.getArrayBuffer(url, (data) => this.loadArrayBuffer(data));\n        };\n\n        if (peaks) {\n            this.backend.setPeaks(peaks);\n            this.drawBuffer();\n            this.tmpEvents.push(this.once('interaction', load));\n        } else {\n            return load();\n        }\n    }\n\n    /**\n     * Either create a media element, or load an existing media element.\n     *\n     * @private\n     * @param {string|HTMLElement} urlOrElt Either a path to a media file, or an\n     * existing HTML5 Audio/Video Element\n     * @param {number[]|number[][]} peaks Array of peaks. Required to bypass web audio\n     * dependency\n     * @param {?boolean} preload Set to true if the preload attribute of the\n     * audio element should be enabled\n     */\n    loadMediaElement(urlOrElt, peaks, preload) {\n        let url = urlOrElt;\n\n        if (typeof urlOrElt === 'string') {\n            this.backend.load(url, this.mediaContainer, peaks, preload);\n        } else {\n            const elt = urlOrElt;\n            this.backend.loadElt(elt, peaks);\n\n            // If peaks are not provided,\n            // url = element.src so we can get peaks with web audio\n            url = elt.src;\n        }\n\n        this.tmpEvents.push(\n            this.backend.once('canplay', () => {\n                this.drawBuffer();\n                this.fireEvent('ready');\n            }),\n            this.backend.once('error', err => this.fireEvent('error', err))\n        );\n\n        // If no pre-decoded peaks provided or pre-decoded peaks are\n        // provided with forceDecode flag, attempt to download the\n        // audio file and decode it with Web Audio.\n        if (peaks) {\n            this.backend.setPeaks(peaks);\n        }\n\n        if ((!peaks || this.params.forceDecode) && this.backend.supportsWebAudio()) {\n            this.getArrayBuffer(url, arraybuffer => {\n                this.decodeArrayBuffer(arraybuffer, buffer => {\n                    this.backend.buffer = buffer;\n                    this.backend.setPeaks(null);\n                    this.drawBuffer();\n                    this.fireEvent('waveform-ready');\n                });\n            });\n        }\n    }\n\n    /**\n     * Decode an array buffer and pass data to a callback\n     *\n     * @private\n     * @param {Object} arraybuffer\n     * @param {function} callback\n     */\n    decodeArrayBuffer(arraybuffer, callback) {\n        this.arraybuffer = arraybuffer;\n\n        this.backend.decodeArrayBuffer(\n            arraybuffer,\n            data => {\n                // Only use the decoded data if we haven't been destroyed or\n                // another decode started in the meantime\n                if (!this.isDestroyed && this.arraybuffer == arraybuffer) {\n                    callback(data);\n                    this.arraybuffer = null;\n                }\n            },\n            () => this.fireEvent('error', 'Error decoding audiobuffer')\n        );\n    }\n\n    /**\n     * Load an array buffer by ajax and pass to a callback\n     *\n     * @param {string} url\n     * @param {function} callback\n     * @private\n     */\n    getArrayBuffer(url, callback) {\n        const ajax = util.ajax({\n            url: url,\n            responseType: 'arraybuffer'\n        });\n\n        this.currentAjax = ajax;\n\n        this.tmpEvents.push(\n            ajax.on('progress', e => {\n                this.onProgress(e);\n            }),\n            ajax.on('success', (data, e) => {\n                callback(data);\n                this.currentAjax = null;\n            }),\n            ajax.on('error', e => {\n                this.fireEvent('error', 'XHR error: ' + e.target.statusText);\n                this.currentAjax = null;\n            })\n        );\n\n        return ajax;\n    }\n\n    /**\n     * Called while the audio file is loading\n     *\n     * @private\n     * @param {Event} e\n     * @emits WaveSurfer#loading\n     */\n    onProgress(e) {\n        let percentComplete;\n        if (e.lengthComputable) {\n            percentComplete = e.loaded / e.total;\n        } else {\n            // Approximate progress with an asymptotic\n            // function, and assume downloads in the 1-3 MB range.\n            percentComplete = e.loaded / (e.loaded + 1000000);\n        }\n        this.fireEvent('loading', Math.round(percentComplete * 100), e.target);\n    }\n\n    /**\n     * Exports PCM data into a JSON array and opens in a new window.\n     *\n     * @param {number} length=1024 The scale in which to export the peaks. (Integer)\n     * @param {number} accuracy=10000 (Integer)\n     * @param {?boolean} noWindow Set to true to disable opening a new\n     * window with the JSON\n     * @todo Update exportPCM to work with new getPeaks signature\n     * @return {JSON} JSON of peaks\n     */\n    exportPCM(length, accuracy, noWindow) {\n        length = length || 1024;\n        accuracy = accuracy || 10000;\n        noWindow = noWindow || false;\n        const peaks = this.backend.getPeaks(length, accuracy);\n        const arr = [].map.call(peaks, val => Math.round(val * accuracy) / accuracy);\n        const json = JSON.stringify(arr);\n        if (!noWindow) {\n            window.open('data:application/json;charset=utf-8,' +\n                encodeURIComponent(json));\n        }\n        return json;\n    }\n\n    /**\n     * Save waveform image as data URI.\n     *\n     * The default format is `image/png`. Other supported types are\n     * `image/jpeg` and `image/webp`.\n     *\n     * @param {string} format='image/png'\n     * @param {number} quality=1\n     * @return {string} data URI of image\n     */\n    exportImage(format, quality) {\n        if (!format) {\n            format = 'image/png';\n        }\n        if (!quality) {\n            quality = 1;\n        }\n\n        return this.drawer.getImage(format, quality);\n    }\n\n    /**\n     * Cancel any ajax request currently in progress\n     */\n    cancelAjax() {\n        if (this.currentAjax) {\n            this.currentAjax.xhr.abort();\n            this.currentAjax = null;\n        }\n    }\n\n    /**\n     * @private\n     */\n    clearTmpEvents() {\n        this.tmpEvents.forEach(e => e.un());\n    }\n\n    /**\n     * Display empty waveform.\n     */\n    empty() {\n        if (!this.backend.isPaused()) {\n            this.stop();\n            this.backend.disconnectSource();\n        }\n        this.cancelAjax();\n        this.clearTmpEvents();\n        this.drawer.progress(0);\n        this.drawer.setWidth(0);\n        this.drawer.drawPeaks({ length: this.drawer.getWidth() }, 0);\n    }\n\n    /**\n     * Remove events, elements and disconnect WebAudio nodes.\n     *\n     * @emits WaveSurfer#destroy\n     */\n    destroy() {\n        this.destroyAllPlugins();\n        this.fireEvent('destroy');\n        this.cancelAjax();\n        this.clearTmpEvents();\n        this.unAll();\n        if (this.params.responsive) {\n            window.removeEventListener('resize', this._onResize, true);\n        }\n        this.backend.destroy();\n        this.drawer.destroy();\n        this.isDestroyed = true;\n        this.arraybuffer = null;\n    }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/wavesurfer.js","/**\n * Returns a function, that, as long as it continues to be invoked, will not\n * be triggered. The function will be called after it stops being called for\n * N milliseconds. If `immediate` is passed, trigger the function on the\n * leading edge, instead of the trailing. The function also has a property 'clear' \n * that is a function which will clear the timer to prevent previously scheduled executions. \n *\n * @source underscore.js\n * @see http://unscriptable.com/2009/03/20/debouncing-javascript-methods/\n * @param {Function} function to wrap\n * @param {Number} timeout in ms (`100`)\n * @param {Boolean} whether to execute at the beginning (`false`)\n * @api public\n */\n\nmodule.exports = function debounce(func, wait, immediate){\n  var timeout, args, context, timestamp, result;\n  if (null == wait) wait = 100;\n\n  function later() {\n    var last = Date.now() - timestamp;\n\n    if (last < wait && last >= 0) {\n      timeout = setTimeout(later, wait - last);\n    } else {\n      timeout = null;\n      if (!immediate) {\n        result = func.apply(context, args);\n        context = args = null;\n      }\n    }\n  };\n\n  var debounced = function(){\n    context = this;\n    args = arguments;\n    timestamp = Date.now();\n    var callNow = immediate && !timeout;\n    if (!timeout) timeout = setTimeout(later, wait);\n    if (callNow) {\n      result = func.apply(context, args);\n      context = args = null;\n    }\n\n    return result;\n  };\n\n  debounced.clear = function() {\n    if (timeout) {\n      clearTimeout(timeout);\n      timeout = null;\n    }\n  };\n\n  return debounced;\n};\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./~/debounce/index.js\n// module id = 14\n// module chunks = 0"],"sourceRoot":""}
\ No newline at end of file
diff --git a/example/angular/index.html b/example/angular/index.html
index baa1fbb0d..a95279919 100644
--- a/example/angular/index.html
+++ b/example/angular/index.html
@@ -88,7 +88,7 @@ <h1 itemprop="name">wavesurfer.js Angular Demo</h1>
                 </div>
 
                 <div class="col-sm-7">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-5">
diff --git a/example/annotation/index.html b/example/annotation/index.html
index dfd7497ce..b21672c35 100644
--- a/example/annotation/index.html
+++ b/example/annotation/index.html
@@ -226,11 +226,11 @@ <h5>Region Events</h5>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-8">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-4">
diff --git a/example/audio-element/index.html b/example/audio-element/index.html
index 7ab368335..68d2a5c18 100644
--- a/example/audio-element/index.html
+++ b/example/audio-element/index.html
@@ -97,11 +97,11 @@ <h3>Pre-rendered Peaks</h3>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-7">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-5">
diff --git a/example/elan-wave-segment/index.html b/example/elan-wave-segment/index.html
new file mode 100644
index 000000000..93ab49627
--- /dev/null
+++ b/example/elan-wave-segment/index.html
@@ -0,0 +1,194 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+        <title>wavesurfer.js | ELAN Wave Segment player</title>
+
+        <link href="data:image/gif;" rel="icon" type="image/x-icon" />
+
+        <!-- Bootstrap -->
+        <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
+
+        <link rel="stylesheet" href="../css/style.css" />
+        <link rel="stylesheet" href="../css/ribbon.css" />
+        <link rel="stylesheet" href="css/elan.css" />
+        <link rel="screenshot" itemprop="screenshot" href="https://katspaugh.github.io/wavesurfer.js/example/screenshot.png" />
+
+        <!-- wavesurfer.js -->
+        <script src="../../dist/wavesurfer.min.js"></script>
+
+        <!-- regions plugin -->
+        <script src="../../dist/plugin/wavesurfer.regions.min.js"></script>
+
+        <!-- ELAN format renderer -->
+        <script src="../../dist/plugin/wavesurfer.elan.min.js"></script>
+
+        <!-- ELAN wave segment renderer -->
+        <script src="../../plugin/wavesurfer.elan-wave-segment.js"></script>
+
+        <!-- App -->
+        <script src="app.js"></script>
+        <script src="../trivia.js"></script>
+    </head>
+
+    <body itemscope itemtype="http://schema.org/WebApplication">
+        <div class="container">
+            <div class="header">
+                <noindex>
+                <ul class="nav nav-pills pull-right">
+                    <li><a href="?fill">Fill</a></li>
+                    <li><a href="?scroll">Scroll</a></li>
+                </ul>
+                </noindex>
+
+                <h1 itemprop="name"><a href="http://wavesurfer-js.org">wavesurfer.js</a><noindex> + <a rel="nofollow" href="http://spokencorpora.ru/showelan.py">ELAN</a> + Wave Segment</noindex></h1>
+            </div>
+            <div><p>The Elan Wave Segment Plugin uses the table and the time values created by the
+                <a href="../elan/index.html">ELAN plugin</a> to insert a wave form column for each row.
+            </p></div>
+
+            <div id="demo">
+                <div id="waveform">
+                    <div class="progress progress-striped active" id="progress-bar">
+                        <div class="progress-bar progress-bar-info"></div>
+                    </div>
+
+                    <!-- Here be waveform -->
+                </div>
+
+                <div class="controls">
+                    <button class="btn btn-primary" data-action="play">
+                        <i class="glyphicon glyphicon-play"></i>
+                        Play
+                        /
+                        <i class="glyphicon glyphicon-pause"></i>
+                        Pause
+                    </button>
+                </div>
+            </div>
+
+            <div id="annotations" class="table-responsive">
+                <!-- Here be transcript -->
+            </div>
+
+            <h2>How to Enable Elan Wave Segment</h2>
+
+            <h3>Javascript Dependencies</h3>
+            <ul>
+                <li>Wavesufer <code></code></li>
+                <li>Region Plugin <code></code></li></li>
+                <li>ElAN Plugin <code></code></li></li>
+                <li>ELAN Wave Segment</li>
+                <pre><code>&lt;script src="[path_to]/wavesurfer.min.js"&gt;&lt;/script&gt;
+&lt;script src="[path_to]/plugin/wavesurfer.region.min.js"&gt;&lt;/script&gt;
+&lt;script src="[path_to]/plugin/wavesurfer.elan.min.js"&gt;&lt;/script&gt;
+&lt;script src="[path_to]/plugin/wavesurfer.elan-wave-segment.min.js"&gt;&lt;/script&gt; </code></pre>
+
+            </ul>
+
+            <h2>Javascript Initialization</h2>
+            <pre><code>// Create the wave surfer instance
+var wavesurfer = Object.create(WaveSurfer);
+
+// Create elan instance
+var elan = Object.create(WaveSurfer.ELAN);
+
+// Create Elan Wave Segment instance
+var elanWaveSegment = Object.create(WaveSurfer.ELANWaveSegment);
+
+document.addEventListener('DOMContentLoaded', function () {
+    var options = {
+        container     : '#waveform',
+    };
+
+    //################## set up some listeners ####################
+
+    //set up listener for when elan is done
+    elan.on('ready', function (data) {
+        wavesurfer.load('../elan/transcripts/001z.mp3');
+    });
+
+    //set up listener for playing when clicked on
+    elan.on('select', function (start, end) {
+        wavesurfer.backend.play(start, end);
+    });
+    //############################## initialize wavesurfer and related plugins###############
+
+    // Init wavesurfer
+    wavesurfer.init(options);
+
+    //init elan
+    elan.init({
+        url: '../elan/transcripts/001z.xml',
+        container: '#annotations',
+        tiers: {
+            Text: true,
+            Comments: true
+        }
+    });
+
+    //int elanWaveSegment when wavesurfer is done loading the sound file
+    wavesurfer.on('ready', function() {
+        options.plotTimeEnd = wavesurfer.backend.getDuration();
+        options.wavesurfer = wavesurfer;
+        options.ELAN = elan;
+        elanWaveSegment.init(options);
+    });
+
+    //update waveSegments when time advances
+    var onProgress = function (time) {
+        elanWaveSegment.onProgress(time);
+        //code for scrolling Elan goes here
+    };
+    wavesurfer.on('audioprocess', onProgress);
+}); </code></pre>
+            <h2>Options</h2>
+            <ul>
+                <li><code>ELAN:</code>                       required - The ELAN instance used to parse the elan data</li>
+                <li><code>wafesurver:</code>                 required - The wavesurfer instance used to draw the original waveform</li>
+                <li><code>waveSegmentWidth:</code>           optional - The width of each wave segment (defaults to 200)</li>
+                <li><code>waveSegmentPeaksPerSegment:</code> optional - The number of peaks that should be drawn (defaults to 400)</li>
+                <li><code>waveSegmentHeight:</code>          optional - The height of each wave segment (defaults to 30)</li>
+                <li><code>waveSegmentRenderer:</code>        optional - The renderer (drawer) to be used for the wave segments</li>
+                <li><code>waveSegmentNormalizeTo:</code>     optional - What to normalize each wave segment to [whole, segment,none]</li>
+                <li><code>waveSegmentBorderWidth:</code>     optional - The width of the border of the container element</li>
+                <li><code>waveSegmentBarHeight:</code>       optional - the height of the peaks/bars (defaults to 1)</li>
+            </ul>
+            <div class="footer row">
+                <div class="col-sm-12">
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
+                </div>
+
+                <div class="col-sm-8">
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
+                </div>
+
+                <div class="col-sm-4">
+                    <p>
+                        The ELAN program and format were developed by <a href="http://tla.mpi.nl/tools/tla-tools/elan/">Max Planck Institute</a>.
+                    </p>
+
+                    <p>
+                        The sample ELAN file and audio are from <a rel="nofollow" href="http://spokencorpora.ru/">spokencorpora.ru</a>, used with permission.
+                    </p>
+                </div>
+            </div>
+        </div>
+
+        <div class="github-fork-ribbon-wrapper right">
+            <div class="github-fork-ribbon">
+                <a itemprop="isBasedOnUrl" href="https://github.com/katspaugh/wavesurfer.js">Fork me on GitHub</a>
+            </div>
+        </div>
+
+        <script>
+            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+            (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+            })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+            ga('create', 'UA-50026819-1', 'wavesurfer.fm');
+            ga('send', 'pageview');
+        </script>
+    </body>
+</html>
diff --git a/example/elan/index.html b/example/elan/index.html
index 5abb44f8b..b2893a21d 100644
--- a/example/elan/index.html
+++ b/example/elan/index.html
@@ -67,11 +67,11 @@ <h1 itemprop="name"><a href="http://wavesurfer-js.org">wavesurfer.js</a><noindex
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-8">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-4">
diff --git a/example/equalizer/index.html b/example/equalizer/index.html
index cbb1ba8b0..e173b8059 100644
--- a/example/equalizer/index.html
+++ b/example/equalizer/index.html
@@ -56,11 +56,11 @@ <h1 itemprop="name">Equalizer Example</h1>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-7">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-5">
diff --git a/example/media-session/index.html b/example/media-session/index.html
new file mode 100644
index 000000000..f9d70d106
--- /dev/null
+++ b/example/media-session/index.html
@@ -0,0 +1,168 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+        <title>wavesurfer.js | Media Sesssion plugin</title>
+
+        <link href="data:image/gif;" rel="icon" type="image/x-icon" />
+
+        <!-- Bootstrap -->
+        <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
+
+        <link rel="stylesheet" href="../css/style.css" />
+        <link rel="stylesheet" href="../css/ribbon.css" />
+
+        <!-- wavesurfer.js -->
+        <script src="../../dist/wavesurfer.min.js"></script>
+
+        <!-- media session plugin -->
+        <script src="../../dist/plugin/wavesurfer.mediasession.min.js"></script>
+
+        <!-- App -->
+        <script src="app.js"></script>
+    </head>
+
+    <body itemscope itemtype="http://schema.org/WebApplication">
+        <div class="container">
+            <div class="header">
+                <h1 itemprop="name"><a href="http://wavesurfer-js.org">wavesurfer.js</a><noindex> + Media Session API</noindex></h1>
+            </div>
+
+            <div id="demo">
+                <div id="waveform"></div>
+
+                <div class="controls">
+                    <button class="btn btn-primary" data-action="play">
+                        <i class="glyphicon glyphicon-play"></i>
+                        Play
+                        /
+                        <i class="glyphicon glyphicon-pause"></i>
+                        Pause
+                    </button>
+                </div>
+
+                <audio src='../media/demo.wav' controls />
+            </div>
+
+            <div class="row marketing">
+                <div class="col-lg-4">
+                    <h4>wavesurfer.js Media Session Plugin</h4>
+
+                    <p itemprop="about">The <a href='https://wicg.github.io/mediasession/' target='blank'>Media Session API</a> plugin for <strong>wavesurfer.js</strong> allows you to customize media notifications
+                    by providing metadata for the media your web app is playing. It also allows you to handle media related events such as
+                    seeking or playback which may come from notifications or media keys.</p>
+
+                    <p><strong>Note</strong>: this plugin only works in Chrome 57 and newer (Firefox is <a href='https://bugzilla.mozilla.org/show_bug.cgi?id=1112032' target='blank'>working on it</a>).</p>
+
+                    <h4>Installation</h4>
+
+                    <p>
+                      <ol>
+                        <li>add the MediaSession plugin script tag</li>
+                        <li>create a <code>WaveSurfer</code> instance and supply an object for the <code>metadata</code> property</li>
+                        <li>create a <code>MediaSession</code> instance</li>
+                        <li>control playback from the notification screen on a mobile device</li>
+                      </ol>
+                    </p>
+                    <p>
+                        <a class="btn btn-large btn-success" href="../../plugin/wavesurfer.mediasession.js" itemprop="downloadUrl">Download <strong>the plugin</strong> (1.2 KB)</a>
+                    </p>
+                </div>
+
+                <div class="col-lg-8">
+                    <h4>Quick Start</h4>
+
+                    <noindex><p>
+<pre><code>var wavesurfer = Object.create(WaveSurfer);
+
+wavesurfer.init({
+  container     : '#waveform',
+  waveColor     : 'black',
+  backend       : 'MediaElement'
+});
+
+var msPlugin = Object.create(WaveSurfer.MediaSession);
+
+msPlugin.init({
+    wavesurfer: wavesurfer,
+    metadata: {
+        title: 'Wavesurfer.js Example',
+        artist: 'The Wavesurfer.js Project',
+        album: 'Media Session Example',
+        artwork: [
+          {src: 'https://dummyimage.com/96x96',   sizes: '96x96',   type: 'image/png'},
+          {src: 'https://dummyimage.com/128x128', sizes: '128x128', type: 'image/png'},
+          {src: 'https://dummyimage.com/192x192', sizes: '192x192', type: 'image/png'},
+          {src: 'https://dummyimage.com/256x256', sizes: '256x256', type: 'image/png'},
+          {src: 'https://dummyimage.com/384x384', sizes: '384x384', type: 'image/png'},
+          {src: 'https://dummyimage.com/512x512', sizes: '512x512', type: 'image/png'},
+        ]
+    }
+});
+
+// load audio from existing media element
+var mediaElt = document.querySelector('audio');
+wavesurfer.load(mediaElt);
+</code></pre>
+                    </p></noindex>
+
+                    <br />
+
+                    <h4>Options</h4>
+
+                    <table class="table table-striped table-bordered">
+                      <thead>
+                        <tr>
+                          <th>Name</th>
+                          <th>Required</th>
+                          <th>Default</th>
+                          <th>Description</th>
+                        </tr>
+                      </thead>
+                      <tbody>
+                        <tr>
+                          <td><code>wavesurfer</code></td>
+                          <td>yes</td>
+                          <td></td>
+                          <td>A WaveSurfer instance.</td>
+                        </tr>
+                        <tr>
+                          <td><code>metadata</code></td>
+                          <td>yes</td>
+                          <td></td>
+                          <td>A <a href='https://wicg.github.io/mediasession/#mediametadata' target='blank'>MediaMetadata</a> object: a representation of the metadata associated with a MediaSession that can be used by
+                          user agents to provide customized user interface.</td>
+                        </tr>
+                      </tbody>
+                    </table>
+                </div>
+            </div>
+
+            <div class="footer row">
+                <div class="col-sm-12">
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
+                </div>
+
+                <div class="col-sm-12">
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
+                </div>
+            </div>
+        </div>
+
+        <div class="github-fork-ribbon-wrapper right">
+            <div class="github-fork-ribbon">
+                <a itemprop="isBasedOnUrl" href="https://github.com/katspaugh/wavesurfer.js">Fork me on GitHub</a>
+            </div>
+        </div>
+
+        <script>
+            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+            (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+            })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+            ga('create', 'UA-50026819-1', 'wavesurfer.fm');
+            ga('send', 'pageview');
+        </script>
+    </body>
+</html>
diff --git a/example/microphone/index.html b/example/microphone/index.html
index 7f0d785d1..c7b86a54e 100644
--- a/example/microphone/index.html
+++ b/example/microphone/index.html
@@ -170,11 +170,11 @@ <h4>Events</h4>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-12">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
             </div>
         </div>
diff --git a/example/mute/index.html b/example/mute/index.html
index 839cba711..f72d5916f 100644
--- a/example/mute/index.html
+++ b/example/mute/index.html
@@ -43,15 +43,15 @@ <h1>
                 </div>
             </div>
 
-            
+
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-12">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
             </div>
         </div>
@@ -61,7 +61,7 @@ <h1>
                 <a itemprop="isBasedOnUrl" href="https://github.com/katspaugh/wavesurfer.js">Fork me on GitHub</a>
             </div>
         </div>
-        
+
         <script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
diff --git a/example/panner/index.html b/example/panner/index.html
index 9b3c10b25..d5aa96bc8 100644
--- a/example/panner/index.html
+++ b/example/panner/index.html
@@ -130,11 +130,11 @@ <h4>4. Bind the Range Slider</h4>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-7">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-5">
diff --git a/example/playlist/index.html b/example/playlist/index.html
index a442d378f..8a60d532c 100644
--- a/example/playlist/index.html
+++ b/example/playlist/index.html
@@ -80,7 +80,7 @@ <h1 itemprop="name">wavesurfer.js Playlist Demo</h1>
                 </div>
 
                 <div class="col-sm-7">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-5">
diff --git a/example/regions/index.html b/example/regions/index.html
index aec03d0a8..2ae1a358e 100644
--- a/example/regions/index.html
+++ b/example/regions/index.html
@@ -86,11 +86,11 @@ <h1 itemprop="name">wavesurfer.js Regions</h1>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-8">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-4">
diff --git a/example/spectrogram/index.html b/example/spectrogram/index.html
index b63d051eb..f9e93ce43 100644
--- a/example/spectrogram/index.html
+++ b/example/spectrogram/index.html
@@ -110,11 +110,11 @@ <h4>Options</h4>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-12">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
             </div>
         </div>
diff --git a/example/split-channels/index.html b/example/split-channels/index.html
index 091a81bcd..1cd1706a5 100644
--- a/example/split-channels/index.html
+++ b/example/split-channels/index.html
@@ -73,11 +73,11 @@ <h3>How to Enable Split Channels</h3>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-7">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-5">
diff --git a/example/split-wave-point-plot/index.html b/example/split-wave-point-plot/index.html
new file mode 100644
index 000000000..aea2404f5
--- /dev/null
+++ b/example/split-wave-point-plot/index.html
@@ -0,0 +1,157 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+        <title>wavesurfer.js | Split Wave Point Plot Example</title>
+
+        <link href="data:image/gif;" rel="icon" type="image/x-icon" />
+
+        <!-- Bootstrap -->
+        <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
+
+        <link rel="stylesheet" href="../css/style.css" />
+        <link rel="stylesheet" href="../css/ribbon.css" />
+        <link rel="screenshot" itemprop="screenshot" href="https://katspaugh.github.io/wavesurfer.js/example/screenshot.png" />
+
+        <!-- wavesurfer.js -->
+        <script src="../../dist/wavesurfer.min.js"></script>
+
+        <script src="../../plugin/wavesurfer.regions.js"></script>
+
+        <!-- Demo -->
+        <script src="app.js"></script>
+    </head>
+
+    <body itemscope itemtype="http://schema.org/WebApplication">
+        <div class="container">
+            <div class="header">
+                <ul class="nav nav-pills pull-right">
+                    <li><a href="/"><i class="glyphicon glyphicon-home"></i></a></li>
+                </ul>
+
+                <h1 itemprop="name">Split Wave / Point Plot </h1>
+            </div>
+            <div>
+                <p>
+                The Split Wave Point Plot drawer splits the graphic in two, with the upper half being a plot of
+                points defined by time and a range of values. The following example shows the calculated pitch
+                at each point in time.
+                </p>
+            </div>
+
+            <div id="demo">
+                <div id="waveform">
+                    <!-- Here be the waveform -->
+                </div>
+
+                <div class="controls">
+                    <button class="btn btn-primary" data-action="play">
+                        <i class="glyphicon glyphicon-play"></i>
+                        Play
+                        /
+                        <i class="glyphicon glyphicon-pause"></i>
+                        Pause
+                    </button>
+                </div>
+            </div>
+
+
+            <div class="row marketing">
+                <h3>How to Enable Split Wave/Point Plot</h3>
+
+                <p>
+                    Set the <code>renderer</code> option to <code>SplitWavePointPlot</code> and the <code>plotFileUrl</code> to the file containing the time aligned data.
+                </p>
+
+                <p>
+<pre><code>var wavesurfer = WaveSurfer.create({
+    container: document.querySelector('#wave'),
+    renderer: 'SplitWavePointPlot',
+    plotFileUrl: 'data.txt'
+});
+</code></pre>
+                </p>
+
+                <h3>Providing Point Data</h3>
+                <p>The data to be graphed can be provided by either providing a file defined in the <code>plotFileUrl</code> or by passing in an array of data in the <code>plotArray</code> option. The time data does not need to be continous and can have gaps.</p>
+                <strong>Note: if the timing of your data does not span the duration of the sound file you should set <code>plotTimeEnd</code> to the total duration of the sound file or the points may not be aligned correctly</strong></li>
+                <h4>Data File Format</h4>
+                <p>If providing data by loading a file, each line of the file must contain two elements: the time and the value of the point separated by a delimiter (defaults to tab).  E.g.</p>
+<pre><code>0.01 123
+0.02 121
+0.03 127
+0.22 120
+0.23 119</code></pre>
+
+                <h4>Data Array Format</h4>
+                <p>If providing data by a javascript array via the <code>plotArray</code> option the array should have the following form:</p>
+<pre><code>[
+{time: 0.02, value: 121},
+{time: 0.03, value: 127},
+{time: 0.22, value: 120},
+{time: 0.03, value: 119}
+]</code></pre>
+
+                <h3>Options</h3>
+                <p>The following additional options can be set when initializing wavesurfer to control the waveform</p>
+                <ul>
+                    <li><code>plotArray:</code>               array of objects with time and plot (required unless plotFileUrl is set)</li>
+                    <li><code>plotFileUrl:</code>              url of the file that contains the plot information (required unless plotArray is set)</li>
+                    <li><code>plotNormalizeTo:</code>          [whole/segment/none/values] - what value to normalize the plot to (defaults to "whole")</li>
+                    <li><code>plotMin:</code>                  the minimum value to normalize points to.  Any value below this will be ignored (defaults to 0)</li>
+                    <li><code>plotMax:</code>                  the maximum value to normalize points to.  Any value above this will be ignored (defaults to 1)</li>
+                    <li><code>plotTimeStart:</code>            the time included in the plot file which corresponds with the start of the displayed wave (defaults to 0)</li>
+                    <li><code>plotTimeEnd:</code>              the time included in the plot file which corresponds with the end of the displayed wave (defaults maximum plot time)</li>
+                    <li><code>plotColor:</code>                the color of the plot (defaults to #f63)</li>
+                    <li><code>plotProgressColor:</code>       the color of the progress plot (defaults to '#F00')</li>
+                    <li><code>plotFileDelimiter:</code>        the delimiter which separates the time from the value in the plot file (defaults to tab characater = "\t")</li>
+                    <li><code>plotPointHeight:</code>          the canvas height of each plot point (defaults to 2)</li>
+                    <li><code>plotPointWidth:</code>           the canvas width of each plot point (defaults to 2)</li>
+                    <li><code>plotSeparator:</code>            boolean indicating a separator should be included between the wave and point plot</li>
+                    <li><code>plotRangeDisplay:</code>         boolean indicating if the min and max range should be displayed (defaults to false)</li>
+                    <li><code>plotRangePrecision:</code>       integer determining the precision of the displayed plot range</li>
+                    <li><code>plotRangeUnits:</code>           units appended to the range</li>
+                    <li><code>plotRangeFontSize:</code>        the font for displaying the range - defaults to 20</li>
+                    <li><code>plotRangeFontType:</code>        the font type for displaying range - defaults to Ariel</li>
+                    <li><code>plotRangeIgnoreOutliers:</code>  boolean indicating if values outside of range should be ignored or plotted at min/max</li>
+                </ul>
+            </div>
+
+
+            <div class="footer row">
+                <div class="col-sm-12">
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
+                </div>
+
+                <div class="col-sm-7">
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
+                </div>
+
+                <div class="col-sm-5">
+                    <noindex>
+                        Demo is selection of from The Hobbit by J.R.R. Tolkien
+                    </noindex>
+
+                </div>
+            </div>
+        </div>
+
+        <div class="github-fork-ribbon-wrapper right">
+            <div class="github-fork-ribbon">
+                <a itemprop="isBasedOnUrl" href="https://github.com/katspaugh/wavesurfer.js">Fork me on GitHub</a>
+            </div>
+        </div>
+
+        <script>
+            /*
+            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+            (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+            })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+            ga('create', 'UA-50026819-1', 'wavesurfer.fm');
+            ga('send', 'pageview');
+            */
+        </script>
+    </body>
+</html>
diff --git a/example/timeline/index.html b/example/timeline/index.html
index 3fd8d56cd..5804e27c1 100644
--- a/example/timeline/index.html
+++ b/example/timeline/index.html
@@ -108,11 +108,11 @@ <h4>Options</h4>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-12">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
             </div>
         </div>
diff --git a/example/video-element/index.html b/example/video-element/index.html
index 595c32069..57c6abaa7 100644
--- a/example/video-element/index.html
+++ b/example/video-element/index.html
@@ -109,11 +109,11 @@ <h3>Pre-rendered Peaks</h3>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-7">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-5">
diff --git a/example/zoom/index.html b/example/zoom/index.html
index 876e156e3..2ba4e4130 100644
--- a/example/zoom/index.html
+++ b/example/zoom/index.html
@@ -82,11 +82,11 @@ <h3>How to Zoom</h3>
 
             <div class="footer row">
                 <div class="col-sm-12">
-                    <a rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/3.0/80x15.png" /></a>
+                    <a rel="license" href="https://opensource.org/licenses/BSD-3-Clause"><img alt="BSD-3-Clause License" style="border-width:0" src="https://img.shields.io/badge/License-BSD%203--Clause-blue.svg" /></a>
                 </div>
 
                 <div class="col-sm-7">
-                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://github.com/katspaugh/wavesurfer.js" property="cc:attributionName" rel="cc:attributionURL">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons Attribution 3.0 Unported License</a>.
+                    <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">wavesurfer.js</span> by <a href="https://github.com/katspaugh/wavesurfer.js">katspaugh</a> is licensed under a&nbsp;<a style="white-space: nowrap" rel="license" href="https://opensource.org/licenses/BSD-3-Clause">BSD-3-Clause License</a>.
                 </div>
 
                 <div class="col-sm-5">
diff --git a/package.json b/package.json
index 76358e262..89ee996af 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,7 @@
     "url": "git://github.com/katspaugh/wavesurfer.js.git"
   },
   "author": "",
-  "license": "CC-BY-3.0",
+  "license": "BSD-3-Clause",
   "bugs": {
     "url": "https://github.com/katspaugh/wavesurfer.js/issues"
   },
diff --git a/src/wavesurfer.js b/src/wavesurfer.js
index bb093a41d..16d854792 100755
--- a/src/wavesurfer.js
+++ b/src/wavesurfer.js
@@ -4,6 +4,10 @@ import WebAudio from './webaudio';
 import MediaElement from './mediaelement';
 import PeakCache from './peakcache';
 
+/*
+ * This work is licensed under a BSD-3-Clause License.
+ */
+
 /** @external {HTMLElement} https://developer.mozilla.org/en/docs/Web/API/HTMLElement */
 /** @external {OfflineAudioContext} https://developer.mozilla.org/en-US/docs/Web/API/OfflineAudioContext */
 /** @external {File} https://developer.mozilla.org/en-US/docs/Web/API/File */

From c5a2237ec61cf8c06b4518676c4ef794e0fbd8ae Mon Sep 17 00:00:00 2001
From: Enton Biba <entonbiba@users.noreply.github.com>
Date: Fri, 7 Apr 2017 06:06:46 -0400
Subject: [PATCH 15/16] set isMuted to false on load method (#1045)

---
 src/wavesurfer.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/wavesurfer.js b/src/wavesurfer.js
index 16d854792..772285ab1 100755
--- a/src/wavesurfer.js
+++ b/src/wavesurfer.js
@@ -983,6 +983,7 @@ export default class WaveSurfer extends util.Observer {
      */
     load(url, peaks, preload) {
         this.empty();
+        this.isMuted = false;
 
         switch (this.params.backend) {
             case 'WebAudio': return this.loadBuffer(url, peaks);

From 423cd49ec3e932ea161e622292c4b3fd6813b5db Mon Sep 17 00:00:00 2001
From: Anton Skshidlevsky <meefik@gmail.com>
Date: Sun, 19 Mar 2017 20:47:48 +0300
Subject: [PATCH 16/16] Fixed overlap of time labels for large duration (#1049)

Time labels overlaps occur if the duration of audio is more than a few hours.
---
 src/plugin/timeline.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/plugin/timeline.js b/src/plugin/timeline.js
index 2b2b166da..249ca5ca3 100644
--- a/src/plugin/timeline.js
+++ b/src/plugin/timeline.js
@@ -100,7 +100,7 @@ export default class TimelinePlugin {
                 } else if (pxPerSec * 15 >= 25) {
                     return 15;
                 }
-                return 60;
+                return Math.ceil(0.5 / pxPerSec) * 60;
             },
             primaryLabelInterval(pxPerSec) {
                 if (pxPerSec >= 25) {