wavesurfer.js 5.1.0 → 6.0.2

package/dist/plugin/wavesurfer.playhead.js.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack://WaveSurfer.[name]/webpack/universalModuleDefinition","webpack://WaveSurfer.[name]/./src/plugin/playhead/index.js","webpack://WaveSurfer.[name]/webpack/bootstrap","webpack://WaveSurfer.[name]/webpack/startup"],"names":["DEFAULT_FILL_COLOR","PlayheadPlugin","params","ws","options","forEach","opt","wavesurfer","util","style","markerWidth","markerHeight","playheadTime","unFuns","_onResize","_updatePlayheadPosition","_onReady","wrapper","drawer","draw","_createPlayheadElement","window","addEventListener","wavesurferOn","returnOnPause","setCurrentTime","moveOnSeek","getCurrentTime","ev","fn","ret","on","push","un","isReady","_onBackendCreated","r","once","f","removeChild","element","removeEventListener","time","isPlaying","svgNS","el","document","createElementNS","path","setAttribute","appendChild","width","height","cursor","createElement","className","position","display","pointer","_createPointerSVG","e","stopPropagation","line","background","opacity","duration","getDuration","elementWidth","pixelRatio","positionPct","left","name","deferInit","instance"],"mappings":";;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+C;AAC/C,CAAC;AACD,O;;;;;;;;;;;;;;;;;;;;;;;ACTA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,IAAMA,kBAAkB,GAAG,SAA3B;;IAEqBC,c;AA2BjB,0BAAYC,MAAZ,EAAoBC,EAApB,EAAwB;AAAA;;AAAA;;AACpB,SAAKD,MAAL,GAAcA,MAAd;AACA,SAAKE,OAAL,GAAe,EAAf;AAEA,KAAC,MAAD,EAAS,YAAT,EAAuB,eAAvB,EAAwCC,OAAxC,CAAgD,UAAAC,GAAG,EAAI;AACnD,UAAIA,GAAG,IAAIJ,MAAX,EAAmB;AACf,aAAI,CAACE,OAAL,CAAaE,GAAb,IAAoBJ,MAAM,CAACI,GAAD,CAA1B;AACH,OAFD,MAEO;AACH,aAAI,CAACF,OAAL,CAAaE,GAAb,IAAoB,IAApB;AACH;AACJ,KAND;AASA,SAAKC,UAAL,GAAkBJ,EAAlB;AACA,SAAKK,IAAL,GAAYL,EAAE,CAACK,IAAf;AACA,SAAKC,KAAL,GAAa,KAAKD,IAAL,CAAUC,KAAvB;AACA,SAAKC,WAAL,GAAmB,EAAnB;AACA,SAAKC,YAAL,GAAoB,EAApB;AACA,SAAKC,YAAL,GAAoB,CAApB;AACA,SAAKC,MAAL,GAAc,EAAd;;AAEA,SAAKC,SAAL,GAAiB,YAAM;AACnB,WAAI,CAACC,uBAAL;AACH,KAFD;;AAIA,SAAKC,QAAL,GAAgB,YAAM;AAClB,WAAI,CAACC,OAAL,GAAe,KAAI,CAACV,UAAL,CAAgBW,MAAhB,CAAuBD,OAAtC;;AACA,WAAI,CAACF,uBAAL;AACH,KAHD;AAIH;;;;WAED,6BAAoB;AAAA;;AAChB,WAAKE,OAAL,GAAe,KAAKV,UAAL,CAAgBW,MAAhB,CAAuBD,OAAtC;;AAEA,UAAI,KAAKb,OAAL,CAAae,IAAjB,EAAuB;AACnB,aAAKC,sBAAL;;AACAC,cAAM,CAACC,gBAAP,CAAwB,QAAxB,EAAkC,KAAKR,SAAvC,EAAkD,IAAlD;AACAO,cAAM,CAACC,gBAAP,CAAwB,mBAAxB,EAA6C,KAAKR,SAAlD,EAA6D,IAA7D;AAEA,aAAKS,YAAL,CAAkB,MAAlB,EAA0B,KAAKT,SAA/B;AACH;;AAED,WAAKS,YAAL,CAAkB,OAAlB,EAA2B,YAAM;AAC7B,YAAK,MAAI,CAACnB,OAAL,CAAaoB,aAAlB,EAAkC;AAC9B,gBAAI,CAACjB,UAAL,CAAgBkB,cAAhB,CAA+B,MAAI,CAACb,YAApC;AACH;AACJ,OAJD;AAMA,WAAKW,YAAL,CAAkB,MAAlB,EAA0B,YAAM;AAC5B,YAAK,MAAI,CAACnB,OAAL,CAAasB,UAAlB,EAA+B;AAC3B,gBAAI,CAACd,YAAL,GAAoB,MAAI,CAACL,UAAL,CAAgBoB,cAAhB,EAApB;;AACA,gBAAI,CAACZ,uBAAL;AACH;AACJ,OALD;AAOA,WAAKH,YAAL,GAAoB,KAAKL,UAAL,CAAgBoB,cAAhB,EAApB;AACH;;;WAED,sBAAaC,EAAb,EAAiBC,EAAjB,EAAqB;AAAA;;AACjB,UAAIC,GAAG,GAAG,KAAKvB,UAAL,CAAgBwB,EAAhB,CAAmBH,EAAnB,EAAuBC,EAAvB,CAAV;AACA,WAAKhB,MAAL,CAAYmB,IAAZ,CAAiB,YAAM;AACnB,cAAI,CAACzB,UAAL,CAAgB0B,EAAhB,CAAmBL,EAAnB,EAAuBC,EAAvB;AACH,OAFD;AAGA,aAAOC,GAAP;AACH;;;WAED,gBAAO;AAAA;;AACH,UAAI,KAAKvB,UAAL,CAAgB2B,OAApB,EAA6B;AACzB,aAAKC,iBAAL;;AACA,aAAKnB,QAAL;AACH,OAHD,MAGO;AACH,YAAIoB,CAAJ;AAEA,aAAK7B,UAAL,CAAgB8B,IAAhB,CAAqB,OAArB,EAA8B;AAAA,iBAAM,MAAI,CAACrB,QAAL,EAAN;AAAA,SAA9B;AACA,aAAKT,UAAL,CAAgB8B,IAAhB,CAAqB,iBAArB,EAAwC;AAAA,iBAAM,MAAI,CAACF,iBAAL,EAAN;AAAA,SAAxC;AACH;AACJ;;;WAED,mBAAU;AACN,WAAKtB,MAAL,CAAYR,OAAZ,CAAoB,UAAAiC,CAAC;AAAA,eAAIA,CAAC,EAAL;AAAA,OAArB;AACA,WAAKzB,MAAL,GAAc,EAAd;AAEA,WAAKI,OAAL,CAAasB,WAAb,CAAyB,KAAKC,OAA9B;AAEAnB,YAAM,CAACoB,mBAAP,CAA2B,QAA3B,EAAqC,KAAK3B,SAA1C,EAAqD,IAArD;AACAO,YAAM,CAACoB,mBAAP,CAA2B,mBAA3B,EAAgD,KAAK3B,SAArD,EAAgE,IAAhE;AACH;;;WAED,yBAAgB4B,IAAhB,EAAsB;AAClB,WAAK9B,YAAL,GAAoB8B,IAApB;;AAEA,UAAI,CAAC,KAAKnC,UAAL,CAAgBoC,SAAhB,EAAL,EAAkC;AAC9B,aAAKpC,UAAL,CAAgBkB,cAAhB,CAA+BiB,IAA/B;AACH;;AACD,WAAK3B,uBAAL;AACH;;;WAED,6BAAoB;AAChB,UAAM6B,KAAK,GAAG,4BAAd;AAEA,UAAMC,EAAE,GAAGC,QAAQ,CAACC,eAAT,CAAyBH,KAAzB,EAAgC,KAAhC,CAAX;AACA,UAAMI,IAAI,GAAGF,QAAQ,CAACC,eAAT,CAAyBH,KAAzB,EAAgC,MAAhC,CAAb;AAEAC,QAAE,CAACI,YAAH,CAAgB,SAAhB,EAA2B,WAA3B;AACAD,UAAI,CAACC,YAAL,CAAkB,GAAlB,EAAuB,gFAAvB;AACAD,UAAI,CAACC,YAAL,CAAkB,QAAlB,EAA4B,SAA5B;AACAD,UAAI,CAACC,YAAL,CAAkB,MAAlB,EAA0BjD,kBAA1B;AAEA6C,QAAE,CAACK,WAAH,CAAeF,IAAf;AAEA,WAAKvC,KAAL,CAAWoC,EAAX,EAAe;AACXM,aAAK,EAAE,KAAKzC,WAAL,GAAmB,IADf;AAEX0C,cAAM,EAAE,KAAKzC,YAAL,GAAoB,IAFjB;AAGX0C,cAAM,EAAE,SAHG;AAIX,mBAAW;AAJA,OAAf;AAMA,aAAOR,EAAP;AACH;;;WAED,kCAAyB;AAAA;;AACrB,UAAMA,EAAE,GAAGC,QAAQ,CAACQ,aAAT,CAAuB,UAAvB,CAAX;AACAT,QAAE,CAACU,SAAH,GAAe,qBAAf;AAEA,WAAK9C,KAAL,CAAWoC,EAAX,EAAe;AACXW,gBAAQ,EAAE,UADC;AAEXJ,cAAM,EAAE,MAFG;AAGXK,eAAO,EAAE,MAHE;AAIX,0BAAkB;AAJP,OAAf;;AAOA,UAAMC,OAAO,GAAG,KAAKC,iBAAL,EAAhB;;AACAd,QAAE,CAACK,WAAH,CAAeQ,OAAf;AAEAA,aAAO,CAACpC,gBAAR,CAAyB,OAAzB,EAAkC,UAAAsC,CAAC,EAAI;AACnCA,SAAC,CAACC,eAAF;;AACA,cAAI,CAACtD,UAAL,CAAgBkB,cAAhB,CAA+B,MAAI,CAACb,YAApC;AACH,OAHD;AAKA,UAAMkD,IAAI,GAAGhB,QAAQ,CAACQ,aAAT,CAAuB,KAAvB,CAAb;AACA,WAAK7C,KAAL,CAAWqD,IAAX,EAAiB;AACb,qBAAa,CADA;AAEb,uBAAgB,KAAKpD,WAAL,GAAmB,CAAnB,GAAuB,GAAxB,GAA+B,IAFjC;AAGbqD,kBAAU,EAAE,OAHC;AAIbZ,aAAK,EAAE,KAJM;AAKba,eAAO,EAAE;AALI,OAAjB;AAQAnB,QAAE,CAACK,WAAH,CAAeY,IAAf;AAEA,WAAKtB,OAAL,GAAeK,EAAf;AACA,WAAK5B,OAAL,CAAaiC,WAAb,CAAyBL,EAAzB;AACH;;;WAED,mCAA0B;AACtB,UAAI,CAAC,KAAKL,OAAV,EAAmB;AACf;AACH;;AAED,UAAMyB,QAAQ,GAAG,KAAK1D,UAAL,CAAgB2D,WAAhB,EAAjB;AACA,UAAMC,YAAY,GACd,KAAK5D,UAAL,CAAgBW,MAAhB,CAAuBiC,KAAvB,GACA,KAAK5C,UAAL,CAAgBL,MAAhB,CAAuBkE,UAF3B;AAIA,UAAMC,WAAW,GAAG,KAAKzD,YAAL,GAAoBqD,QAAxC;AACA,WAAKxD,KAAL,CAAW,KAAK+B,OAAhB,EAAyB;AACrB8B,YAAI,EAAIH,YAAY,GAAGE,WAAhB,GAAgC,KAAK3D,WAAL,GAAmB,CAApD,GAA0D;AAD3C,OAAzB;AAGH;;;;AAjMD;AACJ;AACA;AACA;AACA;AACA;;AAEI;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACI,oBAAcR,MAAd,EAAsB;AAClB,aAAO;AACHqE,YAAI,EAAE,UADH;AAEHC,iBAAS,EAAEtE,MAAM,IAAIA,MAAM,CAACsE,SAAjB,GAA6BtE,MAAM,CAACsE,SAApC,GAAgD,KAFxD;AAGHtE,cAAM,EAAEA,MAHL;AAIHuE,gBAAQ,EAAExE;AAJP,OAAP;AAMH;;;;;;;;;;;;;UCvDL;UACA;;UAEA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;;UAEA;UACA;;UAEA;UACA;UACA;;;;UCtBA;UACA;UACA;UACA","file":"wavesurfer.playhead.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\"] = root[\"WaveSurfer\"] || {}, root[\"WaveSurfer\"][\"playhead\"] = factory();\n})(this, function() {\nreturn ","\n/**\n * The playhead plugin separates the notion of the currently playing position from\n * a 'play-start' position.  Having a playhead enables a listening pattern\n * (commonly found in DAWs) that involves listening to a section of a track\n * repeatedly, rather than listening to an entire track in a linear fashion.\n *\n * @implements {PluginClass}\n *\n * @example\n * import PlayheadPlugin from 'wavesurfer.playhead.js';\n *\n * // if you are using <script> tags\n * var PlayheadPlugin = window.WaveSurfer.playhead;\n *\n * // ... initialising wavesurfer with the plugin\n * var wavesurfer = WaveSurfer.create({\n *   // wavesurfer options ...\n *   plugins: [\n *     PlayheadPlugin.create({\n *        movePlayheadOnSeek: true,\n *        drawPlayhead: false,\n *        movePlayheadOnPause: false\n *     })\n *   ]\n * });\n */\n\nconst DEFAULT_FILL_COLOR = '#CF2F00';\n\nexport default class PlayheadPlugin {\n    /**\n     * @typedef {Object} PlayheadPluginParams\n     * @property {?boolean} draw=true Draw the playhead as a triangle/line\n     * @property {?boolean} moveOnSeek=true Seeking (via clicking) while playing moves the playhead\n     * @property {?boolean} returnOnPause=true Pausing the track returns the seek position to the playhead\n     */\n\n    /**\n     * Playhead 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 {PlayheadPluginParams} params parameters use to initialise the plugin\n     * @since 5.0.0\n     * @return {PluginDefinition} an object representing the plugin\n     */\n    static create(params) {\n        return {\n            name: 'playhead',\n            deferInit: params && params.deferInit ? params.deferInit : false,\n            params: params,\n            instance: PlayheadPlugin\n        };\n    }\n\n    constructor(params, ws) {\n        this.params = params;\n        this.options = {};\n\n        ['draw', 'moveOnSeek', 'returnOnPause'].forEach(opt => {\n            if (opt in params) {\n                this.options[opt] = params[opt];\n            } else {\n                this.options[opt] = true;\n            }\n        });\n\n\n        this.wavesurfer = ws;\n        this.util = ws.util;\n        this.style = this.util.style;\n        this.markerWidth = 21;\n        this.markerHeight = 16;\n        this.playheadTime = 0;\n        this.unFuns = [];\n\n        this._onResize = () => {\n            this._updatePlayheadPosition();\n        };\n\n        this._onReady = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            this._updatePlayheadPosition();\n        };\n    }\n\n    _onBackendCreated() {\n        this.wrapper = this.wavesurfer.drawer.wrapper;\n\n        if (this.options.draw) {\n            this._createPlayheadElement();\n            window.addEventListener('resize', this._onResize, true);\n            window.addEventListener('orientationchange', this._onResize, true);\n\n            this.wavesurferOn('zoom', this._onResize);\n        }\n\n        this.wavesurferOn('pause', () => {\n            if ( this.options.returnOnPause ) {\n                this.wavesurfer.setCurrentTime(this.playheadTime);\n            }\n        });\n\n        this.wavesurferOn('seek', () => {\n            if ( this.options.moveOnSeek ) {\n                this.playheadTime = this.wavesurfer.getCurrentTime();\n                this._updatePlayheadPosition();\n            }\n        });\n\n        this.playheadTime = this.wavesurfer.getCurrentTime();\n    }\n\n    wavesurferOn(ev, fn) {\n        let ret = this.wavesurfer.on(ev, fn);\n        this.unFuns.push(() => {\n            this.wavesurfer.un(ev, fn);\n        });\n        return ret;\n    }\n\n    init() {\n        if (this.wavesurfer.isReady) {\n            this._onBackendCreated();\n            this._onReady();\n        } else {\n            let r;\n\n            this.wavesurfer.once('ready', () => this._onReady());\n            this.wavesurfer.once('backend-created', () => this._onBackendCreated());\n        }\n    }\n\n    destroy() {\n        this.unFuns.forEach(f => f());\n        this.unFuns = [];\n\n        this.wrapper.removeChild(this.element);\n\n        window.removeEventListener('resize', this._onResize, true);\n        window.removeEventListener('orientationchange', this._onResize, true);\n    }\n\n    setPlayheadTime(time) {\n        this.playheadTime = time;\n\n        if (!this.wavesurfer.isPlaying()) {\n            this.wavesurfer.setCurrentTime(time);\n        }\n        this._updatePlayheadPosition();\n    }\n\n    _createPointerSVG() {\n        const svgNS = 'http://www.w3.org/2000/svg';\n\n        const el = document.createElementNS(svgNS, 'svg');\n        const path = document.createElementNS(svgNS, 'path');\n\n        el.setAttribute('viewBox', '0 0 33 30');\n        path.setAttribute('d', 'M16.75 31 31.705 5.566A3 3 0 0 0 29.146 1H4.354a3 3 0 0 0-2.56 4.566L16.75 31z');\n        path.setAttribute('stroke', '#979797');\n        path.setAttribute('fill', DEFAULT_FILL_COLOR);\n\n        el.appendChild(path);\n\n        this.style(el, {\n            width: this.markerWidth + 'px',\n            height: this.markerHeight + 'px',\n            cursor: 'pointer',\n            'z-index': 5\n        });\n        return el;\n    }\n\n    _createPlayheadElement() {\n        const el = document.createElement('playhead');\n        el.className = 'wavesurfer-playhead';\n\n        this.style(el, {\n            position: 'absolute',\n            height: '100%',\n            display: 'flex',\n            'flex-direction': 'column'\n        });\n\n        const pointer = this._createPointerSVG();\n        el.appendChild(pointer);\n\n        pointer.addEventListener('click', e => {\n            e.stopPropagation();\n            this.wavesurfer.setCurrentTime(this.playheadTime);\n        });\n\n        const line = document.createElement('div');\n        this.style(line, {\n            'flex-grow': 1,\n            'margin-left': (this.markerWidth / 2 - 0.5) + 'px',\n            background: 'black',\n            width: '1px',\n            opacity: 0.1\n        });\n\n        el.appendChild(line);\n\n        this.element = el;\n        this.wrapper.appendChild(el);\n    }\n\n    _updatePlayheadPosition() {\n        if (!this.element) {\n            return;\n        }\n\n        const duration = this.wavesurfer.getDuration();\n        const elementWidth =\n            this.wavesurfer.drawer.width /\n            this.wavesurfer.params.pixelRatio;\n\n        const positionPct = this.playheadTime / duration;\n        this.style(this.element, {\n            left: ((elementWidth * positionPct) - (this.markerWidth / 2)) + 'px'\n        });\n    }\n}\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// startup\n// Load entry module and return exports\n// This entry module is referenced by other modules so it can't be inlined\nvar __webpack_exports__ = __webpack_require__(\"./src/plugin/playhead/index.js\");\n"],"sourceRoot":""}
+{"version":3,"file":"wavesurfer.playhead.js","mappings":"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","sources":["webpack://WaveSurfer.[name]/webpack/universalModuleDefinition","webpack://WaveSurfer.[name]/./src/plugin/playhead/index.js","webpack://WaveSurfer.[name]/webpack/bootstrap","webpack://WaveSurfer.[name]/webpack/before-startup","webpack://WaveSurfer.[name]/webpack/startup","webpack://WaveSurfer.[name]/webpack/after-startup"],"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\"] = root[\"WaveSurfer\"] || {}, root[\"WaveSurfer\"][\"playhead\"] = factory();\n})(self, function() {\nreturn ","\n/**\n * The playhead plugin separates the notion of the currently playing position from\n * a 'play-start' position.  Having a playhead enables a listening pattern\n * (commonly found in DAWs) that involves listening to a section of a track\n * repeatedly, rather than listening to an entire track in a linear fashion.\n *\n * @implements {PluginClass}\n *\n * @example\n * import PlayheadPlugin from 'wavesurfer.playhead.js';\n *\n * // if you are using <script> tags\n * var PlayheadPlugin = window.WaveSurfer.playhead;\n *\n * // ... initialising wavesurfer with the plugin\n * var wavesurfer = WaveSurfer.create({\n *   // wavesurfer options ...\n *   plugins: [\n *     PlayheadPlugin.create({\n *        movePlayheadOnSeek: true,\n *        drawPlayhead: false,\n *        movePlayheadOnPause: false\n *     })\n *   ]\n * });\n */\n\nconst DEFAULT_FILL_COLOR = '#CF2F00';\n\nexport default class PlayheadPlugin {\n    /**\n     * @typedef {Object} PlayheadPluginParams\n     * @property {?boolean} draw=true Draw the playhead as a triangle/line\n     * @property {?boolean} moveOnSeek=true Seeking (via clicking) while playing moves the playhead\n     * @property {?boolean} returnOnPause=true Pausing the track returns the seek position to the playhead\n     */\n\n    /**\n     * Playhead 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 {PlayheadPluginParams} params parameters use to initialise the plugin\n     * @since 5.0.0\n     * @return {PluginDefinition} an object representing the plugin\n     */\n    static create(params) {\n        return {\n            name: 'playhead',\n            deferInit: params && params.deferInit ? params.deferInit : false,\n            params: params,\n            instance: PlayheadPlugin\n        };\n    }\n\n    constructor(params, ws) {\n        this.params = params;\n        this.options = {};\n\n        ['draw', 'moveOnSeek', 'returnOnPause'].forEach(opt => {\n            if (opt in params) {\n                this.options[opt] = params[opt];\n            } else {\n                this.options[opt] = true;\n            }\n        });\n\n\n        this.wavesurfer = ws;\n        this.util = ws.util;\n        this.style = this.util.style;\n        this.markerWidth = 21;\n        this.markerHeight = 16;\n        this.playheadTime = 0;\n        this.unFuns = [];\n\n        this._onResize = () => {\n            this._updatePlayheadPosition();\n        };\n\n        this._onReady = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            this._updatePlayheadPosition();\n        };\n    }\n\n    _onBackendCreated() {\n        this.wrapper = this.wavesurfer.drawer.wrapper;\n\n        if (this.options.draw) {\n            this._createPlayheadElement();\n            window.addEventListener('resize', this._onResize, true);\n            window.addEventListener('orientationchange', this._onResize, true);\n\n            this.wavesurferOn('zoom', this._onResize);\n        }\n\n        this.wavesurferOn('pause', () => {\n            if ( this.options.returnOnPause ) {\n                this.wavesurfer.setCurrentTime(this.playheadTime);\n            }\n        });\n\n        this.wavesurferOn('seek', () => {\n            if ( this.options.moveOnSeek ) {\n                this.playheadTime = this.wavesurfer.getCurrentTime();\n                this._updatePlayheadPosition();\n            }\n        });\n\n        this.playheadTime = this.wavesurfer.getCurrentTime();\n    }\n\n    wavesurferOn(ev, fn) {\n        let ret = this.wavesurfer.on(ev, fn);\n        this.unFuns.push(() => {\n            this.wavesurfer.un(ev, fn);\n        });\n        return ret;\n    }\n\n    init() {\n        if (this.wavesurfer.isReady) {\n            this._onBackendCreated();\n            this._onReady();\n        } else {\n            let r;\n\n            this.wavesurfer.once('ready', () => this._onReady());\n            this.wavesurfer.once('backend-created', () => this._onBackendCreated());\n        }\n    }\n\n    destroy() {\n        this.unFuns.forEach(f => f());\n        this.unFuns = [];\n\n        this.wrapper.removeChild(this.element);\n\n        window.removeEventListener('resize', this._onResize, true);\n        window.removeEventListener('orientationchange', this._onResize, true);\n    }\n\n    setPlayheadTime(time) {\n        this.playheadTime = time;\n\n        if (!this.wavesurfer.isPlaying()) {\n            this.wavesurfer.setCurrentTime(time);\n        }\n        this._updatePlayheadPosition();\n    }\n\n    _createPointerSVG() {\n        const svgNS = 'http://www.w3.org/2000/svg';\n\n        const el = document.createElementNS(svgNS, 'svg');\n        const path = document.createElementNS(svgNS, 'path');\n\n        el.setAttribute('viewBox', '0 0 33 30');\n        path.setAttribute('d', 'M16.75 31 31.705 5.566A3 3 0 0 0 29.146 1H4.354a3 3 0 0 0-2.56 4.566L16.75 31z');\n        path.setAttribute('stroke', '#979797');\n        path.setAttribute('fill', DEFAULT_FILL_COLOR);\n\n        el.appendChild(path);\n\n        this.style(el, {\n            width: this.markerWidth + 'px',\n            height: this.markerHeight + 'px',\n            cursor: 'pointer',\n            'z-index': 5\n        });\n        return el;\n    }\n\n    _createPlayheadElement() {\n        const el = document.createElement('playhead');\n        el.className = 'wavesurfer-playhead';\n\n        this.style(el, {\n            position: 'absolute',\n            height: '100%',\n            display: 'flex',\n            'flex-direction': 'column'\n        });\n\n        const pointer = this._createPointerSVG();\n        el.appendChild(pointer);\n\n        pointer.addEventListener('click', e => {\n            e.stopPropagation();\n            this.wavesurfer.setCurrentTime(this.playheadTime);\n        });\n\n        const line = document.createElement('div');\n        this.style(line, {\n            'flex-grow': 1,\n            'margin-left': (this.markerWidth / 2 - 0.5) + 'px',\n            background: 'black',\n            width: '1px',\n            opacity: 0.1\n        });\n\n        el.appendChild(line);\n\n        this.element = el;\n        this.wrapper.appendChild(el);\n    }\n\n    _updatePlayheadPosition() {\n        if (!this.element) {\n            return;\n        }\n\n        const duration = this.wavesurfer.getDuration();\n        const elementWidth =\n            this.wavesurfer.drawer.width /\n            this.wavesurfer.params.pixelRatio;\n\n        const positionPct = this.playheadTime / duration;\n        this.style(this.element, {\n            left: ((elementWidth * positionPct) - (this.markerWidth / 2)) + 'px'\n        });\n    }\n}\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","","// startup\n// Load entry module and return exports\n// This entry module is referenced by other modules so it can't be inlined\nvar __webpack_exports__ = __webpack_require__(\"./src/plugin/playhead/index.js\");\n",""],"names":["DEFAULT_FILL_COLOR","PlayheadPlugin","params","ws","options","forEach","opt","wavesurfer","util","style","markerWidth","markerHeight","playheadTime","unFuns","_onResize","_updatePlayheadPosition","_onReady","wrapper","drawer","draw","_createPlayheadElement","window","addEventListener","wavesurferOn","returnOnPause","setCurrentTime","moveOnSeek","getCurrentTime","ev","fn","ret","on","push","un","isReady","_onBackendCreated","r","once","f","removeChild","element","removeEventListener","time","isPlaying","svgNS","el","document","createElementNS","path","setAttribute","appendChild","width","height","cursor","createElement","className","position","display","pointer","_createPointerSVG","e","stopPropagation","line","background","opacity","duration","getDuration","elementWidth","pixelRatio","positionPct","left","name","deferInit","instance"],"sourceRoot":""}

package/dist/plugin/wavesurfer.playhead.min.js

@@ -1,7 +1,7 @@
 /*!
- * wavesurfer.js playhead plugin 5.1.0 (2021-06-20)
+ * wavesurfer.js playhead plugin 6.0.2 (2022-02-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */
-!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=e.WaveSurfer||{},e.WaveSurfer.playhead=t())}(this,(function(){return(()=>{"use strict";var e={374:(e,t)=>{function r(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)}}Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var i=function(){function e(t,r){var i=this;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.params=t,this.options={},["draw","moveOnSeek","returnOnPause"].forEach((function(e){i.options[e]=!(e in t)||t[e]})),this.wavesurfer=r,this.util=r.util,this.style=this.util.style,this.markerWidth=21,this.markerHeight=16,this.playheadTime=0,this.unFuns=[],this._onResize=function(){i._updatePlayheadPosition()},this._onReady=function(){i.wrapper=i.wavesurfer.drawer.wrapper,i._updatePlayheadPosition()}}var t,i,n;return t=e,n=[{key:"create",value:function(t){return{name:"playhead",deferInit:!(!t||!t.deferInit)&&t.deferInit,params:t,instance:e}}}],(i=[{key:"_onBackendCreated",value:function(){var e=this;this.wrapper=this.wavesurfer.drawer.wrapper,this.options.draw&&(this._createPlayheadElement(),window.addEventListener("resize",this._onResize,!0),window.addEventListener("orientationchange",this._onResize,!0),this.wavesurferOn("zoom",this._onResize)),this.wavesurferOn("pause",(function(){e.options.returnOnPause&&e.wavesurfer.setCurrentTime(e.playheadTime)})),this.wavesurferOn("seek",(function(){e.options.moveOnSeek&&(e.playheadTime=e.wavesurfer.getCurrentTime(),e._updatePlayheadPosition())})),this.playheadTime=this.wavesurfer.getCurrentTime()}},{key:"wavesurferOn",value:function(e,t){var r=this,i=this.wavesurfer.on(e,t);return this.unFuns.push((function(){r.wavesurfer.un(e,t)})),i}},{key:"init",value:function(){var e=this;this.wavesurfer.isReady?(this._onBackendCreated(),this._onReady()):(this.wavesurfer.once("ready",(function(){return e._onReady()})),this.wavesurfer.once("backend-created",(function(){return e._onBackendCreated()})))}},{key:"destroy",value:function(){this.unFuns.forEach((function(e){return e()})),this.unFuns=[],this.wrapper.removeChild(this.element),window.removeEventListener("resize",this._onResize,!0),window.removeEventListener("orientationchange",this._onResize,!0)}},{key:"setPlayheadTime",value:function(e){this.playheadTime=e,this.wavesurfer.isPlaying()||this.wavesurfer.setCurrentTime(e),this._updatePlayheadPosition()}},{key:"_createPointerSVG",value:function(){var e="http://www.w3.org/2000/svg",t=document.createElementNS(e,"svg"),r=document.createElementNS(e,"path");return t.setAttribute("viewBox","0 0 33 30"),r.setAttribute("d","M16.75 31 31.705 5.566A3 3 0 0 0 29.146 1H4.354a3 3 0 0 0-2.56 4.566L16.75 31z"),r.setAttribute("stroke","#979797"),r.setAttribute("fill","#CF2F00"),t.appendChild(r),this.style(t,{width:this.markerWidth+"px",height:this.markerHeight+"px",cursor:"pointer","z-index":5}),t}},{key:"_createPlayheadElement",value:function(){var e=this,t=document.createElement("playhead");t.className="wavesurfer-playhead",this.style(t,{position:"absolute",height:"100%",display:"flex","flex-direction":"column"});var r=this._createPointerSVG();t.appendChild(r),r.addEventListener("click",(function(t){t.stopPropagation(),e.wavesurfer.setCurrentTime(e.playheadTime)}));var i=document.createElement("div");this.style(i,{"flex-grow":1,"margin-left":this.markerWidth/2-.5+"px",background:"black",width:"1px",opacity:.1}),t.appendChild(i),this.element=t,this.wrapper.appendChild(t)}},{key:"_updatePlayheadPosition",value:function(){if(this.element){var e=this.wavesurfer.getDuration(),t=this.wavesurfer.drawer.width/this.wavesurfer.params.pixelRatio,r=this.playheadTime/e;this.style(this.element,{left:t*r-this.markerWidth/2+"px"})}}}])&&r(t.prototype,i),n&&r(t,n),e}();t.default=i,e.exports=t.default}},t={};return function r(i){var n=t[i];if(void 0!==n)return n.exports;var a=t[i]={exports:{}};return e[i](a,a.exports,r),a.exports}(374)})()}));
+!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=e.WaveSurfer||{},e.WaveSurfer.playhead=t())}(self,(function(){return(()=>{"use strict";var e={374:(e,t)=>{function r(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)}}Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var i=function(){function e(t,r){var i=this;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.params=t,this.options={},["draw","moveOnSeek","returnOnPause"].forEach((function(e){i.options[e]=!(e in t)||t[e]})),this.wavesurfer=r,this.util=r.util,this.style=this.util.style,this.markerWidth=21,this.markerHeight=16,this.playheadTime=0,this.unFuns=[],this._onResize=function(){i._updatePlayheadPosition()},this._onReady=function(){i.wrapper=i.wavesurfer.drawer.wrapper,i._updatePlayheadPosition()}}var t,i,n;return t=e,n=[{key:"create",value:function(t){return{name:"playhead",deferInit:!(!t||!t.deferInit)&&t.deferInit,params:t,instance:e}}}],(i=[{key:"_onBackendCreated",value:function(){var e=this;this.wrapper=this.wavesurfer.drawer.wrapper,this.options.draw&&(this._createPlayheadElement(),window.addEventListener("resize",this._onResize,!0),window.addEventListener("orientationchange",this._onResize,!0),this.wavesurferOn("zoom",this._onResize)),this.wavesurferOn("pause",(function(){e.options.returnOnPause&&e.wavesurfer.setCurrentTime(e.playheadTime)})),this.wavesurferOn("seek",(function(){e.options.moveOnSeek&&(e.playheadTime=e.wavesurfer.getCurrentTime(),e._updatePlayheadPosition())})),this.playheadTime=this.wavesurfer.getCurrentTime()}},{key:"wavesurferOn",value:function(e,t){var r=this,i=this.wavesurfer.on(e,t);return this.unFuns.push((function(){r.wavesurfer.un(e,t)})),i}},{key:"init",value:function(){var e=this;this.wavesurfer.isReady?(this._onBackendCreated(),this._onReady()):(this.wavesurfer.once("ready",(function(){return e._onReady()})),this.wavesurfer.once("backend-created",(function(){return e._onBackendCreated()})))}},{key:"destroy",value:function(){this.unFuns.forEach((function(e){return e()})),this.unFuns=[],this.wrapper.removeChild(this.element),window.removeEventListener("resize",this._onResize,!0),window.removeEventListener("orientationchange",this._onResize,!0)}},{key:"setPlayheadTime",value:function(e){this.playheadTime=e,this.wavesurfer.isPlaying()||this.wavesurfer.setCurrentTime(e),this._updatePlayheadPosition()}},{key:"_createPointerSVG",value:function(){var e="http://www.w3.org/2000/svg",t=document.createElementNS(e,"svg"),r=document.createElementNS(e,"path");return t.setAttribute("viewBox","0 0 33 30"),r.setAttribute("d","M16.75 31 31.705 5.566A3 3 0 0 0 29.146 1H4.354a3 3 0 0 0-2.56 4.566L16.75 31z"),r.setAttribute("stroke","#979797"),r.setAttribute("fill","#CF2F00"),t.appendChild(r),this.style(t,{width:this.markerWidth+"px",height:this.markerHeight+"px",cursor:"pointer","z-index":5}),t}},{key:"_createPlayheadElement",value:function(){var e=this,t=document.createElement("playhead");t.className="wavesurfer-playhead",this.style(t,{position:"absolute",height:"100%",display:"flex","flex-direction":"column"});var r=this._createPointerSVG();t.appendChild(r),r.addEventListener("click",(function(t){t.stopPropagation(),e.wavesurfer.setCurrentTime(e.playheadTime)}));var i=document.createElement("div");this.style(i,{"flex-grow":1,"margin-left":this.markerWidth/2-.5+"px",background:"black",width:"1px",opacity:.1}),t.appendChild(i),this.element=t,this.wrapper.appendChild(t)}},{key:"_updatePlayheadPosition",value:function(){if(this.element){var e=this.wavesurfer.getDuration(),t=this.wavesurfer.drawer.width/this.wavesurfer.params.pixelRatio,r=this.playheadTime/e;this.style(this.element,{left:t*r-this.markerWidth/2+"px"})}}}])&&r(t.prototype,i),n&&r(t,n),Object.defineProperty(t,"prototype",{writable:!1}),e}();t.default=i,e.exports=t.default}},t={};var r=function r(i){var n=t[i];if(void 0!==n)return n.exports;var a=t[i]={exports:{}};return e[i](a,a.exports,r),a.exports}(374);return r})()}));
 //# sourceMappingURL=wavesurfer.playhead.min.js.map

package/dist/plugin/wavesurfer.playhead.min.js.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack://WaveSurfer.[name]/webpack/universalModuleDefinition","webpack://WaveSurfer.[name]/./src/plugin/playhead/index.js","webpack://WaveSurfer.[name]/webpack/bootstrap","webpack://WaveSurfer.[name]/webpack/startup"],"names":["root","factory","exports","module","define","amd","this","PlayheadPlugin","params","ws","options","forEach","opt","wavesurfer","util","style","markerWidth","markerHeight","playheadTime","unFuns","_onResize","_updatePlayheadPosition","_onReady","wrapper","drawer","name","deferInit","instance","draw","_createPlayheadElement","window","addEventListener","wavesurferOn","returnOnPause","setCurrentTime","moveOnSeek","getCurrentTime","ev","fn","ret","on","push","un","isReady","_onBackendCreated","once","f","removeChild","element","removeEventListener","time","isPlaying","svgNS","el","document","createElementNS","path","setAttribute","appendChild","width","height","cursor","createElement","className","position","display","pointer","_createPointerSVG","e","stopPropagation","line","background","opacity","duration","getDuration","elementWidth","pixelRatio","positionPct","left","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__"],"mappings":"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","file":"wavesurfer.playhead.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\"] = root[\"WaveSurfer\"] || {}, root[\"WaveSurfer\"][\"playhead\"] = factory();\n})(this, function() {\nreturn ","\n/**\n * The playhead plugin separates the notion of the currently playing position from\n * a 'play-start' position.  Having a playhead enables a listening pattern\n * (commonly found in DAWs) that involves listening to a section of a track\n * repeatedly, rather than listening to an entire track in a linear fashion.\n *\n * @implements {PluginClass}\n *\n * @example\n * import PlayheadPlugin from 'wavesurfer.playhead.js';\n *\n * // if you are using <script> tags\n * var PlayheadPlugin = window.WaveSurfer.playhead;\n *\n * // ... initialising wavesurfer with the plugin\n * var wavesurfer = WaveSurfer.create({\n *   // wavesurfer options ...\n *   plugins: [\n *     PlayheadPlugin.create({\n *        movePlayheadOnSeek: true,\n *        drawPlayhead: false,\n *        movePlayheadOnPause: false\n *     })\n *   ]\n * });\n */\n\nconst DEFAULT_FILL_COLOR = '#CF2F00';\n\nexport default class PlayheadPlugin {\n    /**\n     * @typedef {Object} PlayheadPluginParams\n     * @property {?boolean} draw=true Draw the playhead as a triangle/line\n     * @property {?boolean} moveOnSeek=true Seeking (via clicking) while playing moves the playhead\n     * @property {?boolean} returnOnPause=true Pausing the track returns the seek position to the playhead\n     */\n\n    /**\n     * Playhead 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 {PlayheadPluginParams} params parameters use to initialise the plugin\n     * @since 5.0.0\n     * @return {PluginDefinition} an object representing the plugin\n     */\n    static create(params) {\n        return {\n            name: 'playhead',\n            deferInit: params && params.deferInit ? params.deferInit : false,\n            params: params,\n            instance: PlayheadPlugin\n        };\n    }\n\n    constructor(params, ws) {\n        this.params = params;\n        this.options = {};\n\n        ['draw', 'moveOnSeek', 'returnOnPause'].forEach(opt => {\n            if (opt in params) {\n                this.options[opt] = params[opt];\n            } else {\n                this.options[opt] = true;\n            }\n        });\n\n\n        this.wavesurfer = ws;\n        this.util = ws.util;\n        this.style = this.util.style;\n        this.markerWidth = 21;\n        this.markerHeight = 16;\n        this.playheadTime = 0;\n        this.unFuns = [];\n\n        this._onResize = () => {\n            this._updatePlayheadPosition();\n        };\n\n        this._onReady = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            this._updatePlayheadPosition();\n        };\n    }\n\n    _onBackendCreated() {\n        this.wrapper = this.wavesurfer.drawer.wrapper;\n\n        if (this.options.draw) {\n            this._createPlayheadElement();\n            window.addEventListener('resize', this._onResize, true);\n            window.addEventListener('orientationchange', this._onResize, true);\n\n            this.wavesurferOn('zoom', this._onResize);\n        }\n\n        this.wavesurferOn('pause', () => {\n            if ( this.options.returnOnPause ) {\n                this.wavesurfer.setCurrentTime(this.playheadTime);\n            }\n        });\n\n        this.wavesurferOn('seek', () => {\n            if ( this.options.moveOnSeek ) {\n                this.playheadTime = this.wavesurfer.getCurrentTime();\n                this._updatePlayheadPosition();\n            }\n        });\n\n        this.playheadTime = this.wavesurfer.getCurrentTime();\n    }\n\n    wavesurferOn(ev, fn) {\n        let ret = this.wavesurfer.on(ev, fn);\n        this.unFuns.push(() => {\n            this.wavesurfer.un(ev, fn);\n        });\n        return ret;\n    }\n\n    init() {\n        if (this.wavesurfer.isReady) {\n            this._onBackendCreated();\n            this._onReady();\n        } else {\n            let r;\n\n            this.wavesurfer.once('ready', () => this._onReady());\n            this.wavesurfer.once('backend-created', () => this._onBackendCreated());\n        }\n    }\n\n    destroy() {\n        this.unFuns.forEach(f => f());\n        this.unFuns = [];\n\n        this.wrapper.removeChild(this.element);\n\n        window.removeEventListener('resize', this._onResize, true);\n        window.removeEventListener('orientationchange', this._onResize, true);\n    }\n\n    setPlayheadTime(time) {\n        this.playheadTime = time;\n\n        if (!this.wavesurfer.isPlaying()) {\n            this.wavesurfer.setCurrentTime(time);\n        }\n        this._updatePlayheadPosition();\n    }\n\n    _createPointerSVG() {\n        const svgNS = 'http://www.w3.org/2000/svg';\n\n        const el = document.createElementNS(svgNS, 'svg');\n        const path = document.createElementNS(svgNS, 'path');\n\n        el.setAttribute('viewBox', '0 0 33 30');\n        path.setAttribute('d', 'M16.75 31 31.705 5.566A3 3 0 0 0 29.146 1H4.354a3 3 0 0 0-2.56 4.566L16.75 31z');\n        path.setAttribute('stroke', '#979797');\n        path.setAttribute('fill', DEFAULT_FILL_COLOR);\n\n        el.appendChild(path);\n\n        this.style(el, {\n            width: this.markerWidth + 'px',\n            height: this.markerHeight + 'px',\n            cursor: 'pointer',\n            'z-index': 5\n        });\n        return el;\n    }\n\n    _createPlayheadElement() {\n        const el = document.createElement('playhead');\n        el.className = 'wavesurfer-playhead';\n\n        this.style(el, {\n            position: 'absolute',\n            height: '100%',\n            display: 'flex',\n            'flex-direction': 'column'\n        });\n\n        const pointer = this._createPointerSVG();\n        el.appendChild(pointer);\n\n        pointer.addEventListener('click', e => {\n            e.stopPropagation();\n            this.wavesurfer.setCurrentTime(this.playheadTime);\n        });\n\n        const line = document.createElement('div');\n        this.style(line, {\n            'flex-grow': 1,\n            'margin-left': (this.markerWidth / 2 - 0.5) + 'px',\n            background: 'black',\n            width: '1px',\n            opacity: 0.1\n        });\n\n        el.appendChild(line);\n\n        this.element = el;\n        this.wrapper.appendChild(el);\n    }\n\n    _updatePlayheadPosition() {\n        if (!this.element) {\n            return;\n        }\n\n        const duration = this.wavesurfer.getDuration();\n        const elementWidth =\n            this.wavesurfer.drawer.width /\n            this.wavesurfer.params.pixelRatio;\n\n        const positionPct = this.playheadTime / duration;\n        this.style(this.element, {\n            left: ((elementWidth * positionPct) - (this.markerWidth / 2)) + 'px'\n        });\n    }\n}\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// startup\n// Load entry module and return exports\n// This entry module is referenced by other modules so it can't be inlined\nvar __webpack_exports__ = __webpack_require__(374);\n"],"sourceRoot":""}
+{"version":3,"file":"wavesurfer.playhead.min.js","mappings":"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","sources":["webpack://WaveSurfer.[name]/webpack/universalModuleDefinition","webpack://WaveSurfer.[name]/./src/plugin/playhead/index.js","webpack://WaveSurfer.[name]/webpack/bootstrap","webpack://WaveSurfer.[name]/webpack/startup"],"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\"] = root[\"WaveSurfer\"] || {}, root[\"WaveSurfer\"][\"playhead\"] = factory();\n})(self, function() {\nreturn ","\n/**\n * The playhead plugin separates the notion of the currently playing position from\n * a 'play-start' position.  Having a playhead enables a listening pattern\n * (commonly found in DAWs) that involves listening to a section of a track\n * repeatedly, rather than listening to an entire track in a linear fashion.\n *\n * @implements {PluginClass}\n *\n * @example\n * import PlayheadPlugin from 'wavesurfer.playhead.js';\n *\n * // if you are using <script> tags\n * var PlayheadPlugin = window.WaveSurfer.playhead;\n *\n * // ... initialising wavesurfer with the plugin\n * var wavesurfer = WaveSurfer.create({\n *   // wavesurfer options ...\n *   plugins: [\n *     PlayheadPlugin.create({\n *        movePlayheadOnSeek: true,\n *        drawPlayhead: false,\n *        movePlayheadOnPause: false\n *     })\n *   ]\n * });\n */\n\nconst DEFAULT_FILL_COLOR = '#CF2F00';\n\nexport default class PlayheadPlugin {\n    /**\n     * @typedef {Object} PlayheadPluginParams\n     * @property {?boolean} draw=true Draw the playhead as a triangle/line\n     * @property {?boolean} moveOnSeek=true Seeking (via clicking) while playing moves the playhead\n     * @property {?boolean} returnOnPause=true Pausing the track returns the seek position to the playhead\n     */\n\n    /**\n     * Playhead 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 {PlayheadPluginParams} params parameters use to initialise the plugin\n     * @since 5.0.0\n     * @return {PluginDefinition} an object representing the plugin\n     */\n    static create(params) {\n        return {\n            name: 'playhead',\n            deferInit: params && params.deferInit ? params.deferInit : false,\n            params: params,\n            instance: PlayheadPlugin\n        };\n    }\n\n    constructor(params, ws) {\n        this.params = params;\n        this.options = {};\n\n        ['draw', 'moveOnSeek', 'returnOnPause'].forEach(opt => {\n            if (opt in params) {\n                this.options[opt] = params[opt];\n            } else {\n                this.options[opt] = true;\n            }\n        });\n\n\n        this.wavesurfer = ws;\n        this.util = ws.util;\n        this.style = this.util.style;\n        this.markerWidth = 21;\n        this.markerHeight = 16;\n        this.playheadTime = 0;\n        this.unFuns = [];\n\n        this._onResize = () => {\n            this._updatePlayheadPosition();\n        };\n\n        this._onReady = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            this._updatePlayheadPosition();\n        };\n    }\n\n    _onBackendCreated() {\n        this.wrapper = this.wavesurfer.drawer.wrapper;\n\n        if (this.options.draw) {\n            this._createPlayheadElement();\n            window.addEventListener('resize', this._onResize, true);\n            window.addEventListener('orientationchange', this._onResize, true);\n\n            this.wavesurferOn('zoom', this._onResize);\n        }\n\n        this.wavesurferOn('pause', () => {\n            if ( this.options.returnOnPause ) {\n                this.wavesurfer.setCurrentTime(this.playheadTime);\n            }\n        });\n\n        this.wavesurferOn('seek', () => {\n            if ( this.options.moveOnSeek ) {\n                this.playheadTime = this.wavesurfer.getCurrentTime();\n                this._updatePlayheadPosition();\n            }\n        });\n\n        this.playheadTime = this.wavesurfer.getCurrentTime();\n    }\n\n    wavesurferOn(ev, fn) {\n        let ret = this.wavesurfer.on(ev, fn);\n        this.unFuns.push(() => {\n            this.wavesurfer.un(ev, fn);\n        });\n        return ret;\n    }\n\n    init() {\n        if (this.wavesurfer.isReady) {\n            this._onBackendCreated();\n            this._onReady();\n        } else {\n            let r;\n\n            this.wavesurfer.once('ready', () => this._onReady());\n            this.wavesurfer.once('backend-created', () => this._onBackendCreated());\n        }\n    }\n\n    destroy() {\n        this.unFuns.forEach(f => f());\n        this.unFuns = [];\n\n        this.wrapper.removeChild(this.element);\n\n        window.removeEventListener('resize', this._onResize, true);\n        window.removeEventListener('orientationchange', this._onResize, true);\n    }\n\n    setPlayheadTime(time) {\n        this.playheadTime = time;\n\n        if (!this.wavesurfer.isPlaying()) {\n            this.wavesurfer.setCurrentTime(time);\n        }\n        this._updatePlayheadPosition();\n    }\n\n    _createPointerSVG() {\n        const svgNS = 'http://www.w3.org/2000/svg';\n\n        const el = document.createElementNS(svgNS, 'svg');\n        const path = document.createElementNS(svgNS, 'path');\n\n        el.setAttribute('viewBox', '0 0 33 30');\n        path.setAttribute('d', 'M16.75 31 31.705 5.566A3 3 0 0 0 29.146 1H4.354a3 3 0 0 0-2.56 4.566L16.75 31z');\n        path.setAttribute('stroke', '#979797');\n        path.setAttribute('fill', DEFAULT_FILL_COLOR);\n\n        el.appendChild(path);\n\n        this.style(el, {\n            width: this.markerWidth + 'px',\n            height: this.markerHeight + 'px',\n            cursor: 'pointer',\n            'z-index': 5\n        });\n        return el;\n    }\n\n    _createPlayheadElement() {\n        const el = document.createElement('playhead');\n        el.className = 'wavesurfer-playhead';\n\n        this.style(el, {\n            position: 'absolute',\n            height: '100%',\n            display: 'flex',\n            'flex-direction': 'column'\n        });\n\n        const pointer = this._createPointerSVG();\n        el.appendChild(pointer);\n\n        pointer.addEventListener('click', e => {\n            e.stopPropagation();\n            this.wavesurfer.setCurrentTime(this.playheadTime);\n        });\n\n        const line = document.createElement('div');\n        this.style(line, {\n            'flex-grow': 1,\n            'margin-left': (this.markerWidth / 2 - 0.5) + 'px',\n            background: 'black',\n            width: '1px',\n            opacity: 0.1\n        });\n\n        el.appendChild(line);\n\n        this.element = el;\n        this.wrapper.appendChild(el);\n    }\n\n    _updatePlayheadPosition() {\n        if (!this.element) {\n            return;\n        }\n\n        const duration = this.wavesurfer.getDuration();\n        const elementWidth =\n            this.wavesurfer.drawer.width /\n            this.wavesurfer.params.pixelRatio;\n\n        const positionPct = this.playheadTime / duration;\n        this.style(this.element, {\n            left: ((elementWidth * positionPct) - (this.markerWidth / 2)) + 'px'\n        });\n    }\n}\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// startup\n// Load entry module and return exports\n// This entry module is referenced by other modules so it can't be inlined\nvar __webpack_exports__ = __webpack_require__(374);\n"],"names":["root","factory","exports","module","define","amd","self","PlayheadPlugin","params","ws","this","options","forEach","opt","wavesurfer","util","style","markerWidth","markerHeight","playheadTime","unFuns","_onResize","_updatePlayheadPosition","_onReady","wrapper","drawer","name","deferInit","instance","draw","_createPlayheadElement","window","addEventListener","wavesurferOn","returnOnPause","setCurrentTime","moveOnSeek","getCurrentTime","ev","fn","ret","on","push","un","isReady","_onBackendCreated","once","f","removeChild","element","removeEventListener","time","isPlaying","svgNS","el","document","createElementNS","path","setAttribute","appendChild","width","height","cursor","createElement","className","position","display","pointer","_createPointerSVG","e","stopPropagation","line","background","opacity","duration","getDuration","elementWidth","pixelRatio","positionPct","left","__webpack_module_cache__","__webpack_exports__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__"],"sourceRoot":""}

package/dist/plugin/wavesurfer.regions.js

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js regions plugin 5.1.0 (2021-06-20)
+ * wavesurfer.js regions plugin 6.0.2 (2022-02-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */
@@ -12,7 +12,7 @@
 		exports["WaveSurfer"] = factory();
 	else
 		root["WaveSurfer"] = root["WaveSurfer"] || {}, root["WaveSurfer"]["regions"] = factory();
-})(this, function() {
+})(self, function() {
 return /******/ (() => { // webpackBootstrap
 /******/ 	"use strict";
 /******/ 	var __webpack_modules__ = ({
@@ -28,13 +28,13 @@ return /******/ (() => { // webpackBootstrap
 Object.defineProperty(exports, "__esModule", ({
   value: true
 }));
-exports.default = void 0;
+exports["default"] = void 0;
 
 var _region = __webpack_require__(/*! ./region.js */ "./src/plugin/regions/region.js");
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 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; }
 
@@ -42,7 +42,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 
 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); } }
 
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
 
 /**
  * Regions are visual overlays on waveform that can be used to play and loop
@@ -95,18 +95,17 @@ var RegionsPlugin = /*#__PURE__*/function () {
       _region.Region.prototype[key] = _this.util.Observer.prototype[key];
     });
     this.wavesurfer.Region = _region.Region; // By default, scroll the container if the user drags a region
-    // within 5% of its edge
+    // within 5% (based on its initial size) of its edge
 
     var scrollWidthProportion = 0.05;
 
     this._onBackendCreated = function () {
       _this.wrapper = _this.wavesurfer.drawer.wrapper;
       _this.orientation = _this.wavesurfer.drawer.orientation;
+      _this.defaultEdgeScrollWidth = _this.wrapper.clientWidth * scrollWidthProportion;
 
       if (_this.params.regions) {
         _this.params.regions.forEach(function (region) {
-          region.edgeScrollWidth = _this.params.edgeScrollWidth || _this.wrapper.clientWidth * scrollWidthProportion;
-
           _this.add(region);
         });
       }
@@ -146,7 +145,12 @@ var RegionsPlugin = /*#__PURE__*/function () {
     key: "destroy",
     value: function destroy() {
       this.wavesurfer.un('ready', this._onReady);
-      this.wavesurfer.un('backend-created', this._onBackendCreated);
+      this.wavesurfer.un('backend-created', this._onBackendCreated); // Disabling `region-removed' because destroying the plugin calls
+      // the Region.remove() method that is also used to remove regions based
+      // on user input. This can cause confusion since teardown is not a
+      // user event, but would emit `region-removed` as if it was.
+
+      this.wavesurfer.setDisabledEventEmissions(['region-removed']);
       this.disableDragSelection();
       this.clear();
     }
@@ -177,6 +181,16 @@ var RegionsPlugin = /*#__PURE__*/function () {
         return null;
       }
 
+      params = _objectSpread({
+        edgeScrollWidth: this.params.edgeScrollWidth || this.defaultEdgeScrollWidth
+      }, params); // Take formatTimeCallback from plugin params if not already set
+
+      if (!params.formatTimeCallback && this.params.formatTimeCallback) {
+        params = _objectSpread(_objectSpread({}, params), {}, {
+          formatTimeCallback: this.params.formatTimeCallback
+        });
+      }
+
       if (!params.minLength && this.regionsMinLength) {
         params = _objectSpread(_objectSpread({}, params), {}, {
           minLength: this.regionsMinLength
@@ -256,7 +270,21 @@ var RegionsPlugin = /*#__PURE__*/function () {
         touchId = e.targetTouches ? e.targetTouches[0].identifier : null; // Store for scroll calculations
 
         maxScroll = _this4.wrapper.scrollWidth - _this4.wrapper.clientWidth;
-        wrapperRect = _this4.util.withOrientation(_this4.wrapper.getBoundingClientRect(), _this4.vertical);
+        wrapperRect = _this4.util.withOrientation(_this4.wrapper.getBoundingClientRect(), _this4.vertical); // set the region channel index based on the clicked area
+
+        if (_this4.wavesurfer.params.splitChannels) {
+          var y = (e.touches ? e.touches[0].clientY : e.clientY) - wrapperRect.top;
+          var channelCount = _this4.wavesurfer.backend.buffer != null ? _this4.wavesurfer.backend.buffer.numberOfChannels : 1;
+          var channelHeight = _this4.wrapper.clientHeight / channelCount;
+          var channelIdx = Math.floor(y / channelHeight);
+          params.channelIdx = channelIdx;
+          var channelColors = _this4.wavesurfer.params.splitChannelsOptions.channelColors[channelIdx];
+
+          if (channelColors && channelColors.dragColor) {
+            params.color = channelColors.dragColor;
+          }
+        }
+
         drag = true;
         start = _this4.wavesurfer.drawer.handleEvent(e, true);
         region = null;
@@ -479,7 +507,7 @@ var RegionsPlugin = /*#__PURE__*/function () {
   return RegionsPlugin;
 }();
 
-exports.default = RegionsPlugin;
+exports["default"] = RegionsPlugin;
 module.exports = exports.default;
 
 /***/ }),
@@ -501,7 +529,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 
 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); } }
 
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
 
 /**
  *  @since 4.0.0
@@ -563,6 +591,7 @@ var Region = /*#__PURE__*/function () {
     this.preventContextMenu = params.preventContextMenu === undefined ? false : Boolean(params.preventContextMenu); // select channel ID to set region
 
     var channelIdx = params.channelIdx == null ? -1 : parseInt(params.channelIdx);
+    this.channelIdx = channelIdx;
     this.regionHeight = '100%';
     this.marginTop = '0px';
 
@@ -588,7 +617,7 @@ var Region = /*#__PURE__*/function () {
 
   _createClass(Region, [{
     key: "update",
-    value: function update(params) {
+    value: function update(params, eventParams) {
       if (params.start != null) {
         this.start = Number(params.start);
       }
@@ -636,7 +665,7 @@ var Region = /*#__PURE__*/function () {
 
       this.updateRender();
       this.fireEvent('update');
-      this.wavesurfer.fireEvent('region-updated', this);
+      this.wavesurfer.fireEvent('region-updated', this, eventParams);
     }
     /* Remove a single region. */
 
@@ -706,7 +735,7 @@ var Region = /*#__PURE__*/function () {
 
       this.style(this.element, {
         position: 'absolute',
-        zIndex: 2,
+        zIndex: 3,
         height: this.regionHeight,
         top: this.marginTop
       });
@@ -1214,10 +1243,36 @@ var Region = /*#__PURE__*/function () {
         delta = this.start * -1;
       }
 
+      var eventParams = {
+        direction: this._getDragDirection(delta),
+        action: 'drag'
+      };
       this.update({
         start: this.start + delta,
         end: this.end + delta
-      });
+      }, eventParams);
+    }
+    /**
+     * Returns the direction of dragging region based on delta
+     * Negative delta means region is moving to the left
+     * Positive - to the right
+     * For zero delta the direction is not defined
+     * @param {number} delta Drag offset
+     * @returns {string|null} Direction 'left', 'right' or null
+     */
+
+  }, {
+    key: "_getDragDirection",
+    value: function _getDragDirection(delta) {
+      if (delta < 0) {
+        return 'left';
+      }
+
+      if (delta > 0) {
+        return 'right';
+      }
+
+      return null;
     }
     /**
      * @example
@@ -1232,12 +1287,20 @@ var Region = /*#__PURE__*/function () {
     key: "onResize",
     value: function onResize(delta, direction) {
       var duration = this.wavesurfer.getDuration();
+      var eventParams = {
+        action: 'resize',
+        direction: direction === 'start' ? 'left' : 'right'
+      };
 
       if (direction === 'start') {
         // Check if changing the start by the given delta would result in the region being smaller than minLength
-        // Ignore cases where we are making the region wider rather than shrinking it
         if (delta > 0 && this.end - (this.start + delta) < this.minLength) {
           delta = this.end - this.minLength - this.start;
+        } // Check if changing the start by the given delta would result in the region being larger than maxLength
+
+
+        if (delta < 0 && this.end - (this.start + delta) > this.maxLength) {
+          delta = this.end - this.start - this.maxLength;
         }
 
         if (delta < 0 && this.start + delta < 0) {
@@ -1247,12 +1310,16 @@ var Region = /*#__PURE__*/function () {
         this.update({
           start: Math.min(this.start + delta, this.end),
           end: Math.max(this.start + delta, this.end)
-        });
+        }, eventParams);
       } else {
         // Check if changing the end by the given delta would result in the region being smaller than minLength
-        // Ignore cases where we are making the region wider rather than shrinking it
         if (delta < 0 && this.end + delta - this.start < this.minLength) {
           delta = this.start + this.minLength - this.end;
+        } // Check if changing the end by the given delta would result in the region being larger than maxLength
+
+
+        if (delta > 0 && this.end + delta - this.start > this.maxLength) {
+          delta = this.maxLength - (this.end - this.start);
         }
 
         if (delta > 0 && this.end + delta > duration) {
@@ -1262,7 +1329,7 @@ var Region = /*#__PURE__*/function () {
         this.update({
           start: Math.min(this.end + delta, this.start),
           end: Math.max(this.end + delta, this.start)
-        });
+        }, eventParams);
       }
     }
   }, {