wavesurfer.js 5.0.1 → 5.1.0

package/CHANGES.md

@@ -1,9 +1,19 @@
 wavesurfer.js changelog
 =======================
 
-5.0.1 (05.05.2021)
+5.1.0 (20.06.2021)
 ------------------
+- Markers plugin:
+  - Add the ability to use custom HTML elements in place of the default marker icon by
+    passing the new `markerElement` parameter to the marker constructor (#2269)
+  - Custom HTML elements are now centered over the marker line (#2298)
+  - Trigger `marker-click` event on wavesurfer (#2287)
+- Regions plugin: handle rollover cursor bug fix (#2293)
+- Timeline plugin: prevent calling `Canvas` context methods on `null` values (#2299)
+- Spectrogram plugin: prevent calling `Canvas` context methods on `null` values (#2299)
 
+5.0.1 (05.05.2021)
+------------------
 - Fix removing DOM element on `destroy()` (#2258)
 
 5.0.0 (02.05.2021)

package/dist/plugin/wavesurfer.cursor.js

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js cursor plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js cursor plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

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

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js cursor plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js cursor plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

package/dist/plugin/wavesurfer.elan.js

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js elan plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js elan plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

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

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js elan plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js elan plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

package/dist/plugin/wavesurfer.markers.js

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js markers plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js markers plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */
@@ -41,9 +41,10 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
  * @desc The parameters used to describe a marker.
  * @example wavesurfer.addMarker(regionParams);
  * @property {number} time The time to set the marker at
- * @property {?label} string an optional marker label
- * @property {?color} string background color for marker
+ * @property {?label} string An optional marker label
+ * @property {?color} string Background color for marker
  * @property {?position} string "top" or "bottom", defaults to "bottom"
+ * @property {?markerElement} element An HTML element to display instead of the default marker image
  */
 
 /**
@@ -150,7 +151,13 @@ var MarkersPlugin = /*#__PURE__*/function () {
         color: params.color || DEFAULT_FILL_COLOR,
         position: params.position || DEFAULT_POSITION
       };
-      marker.el = this._createMarkerElement(marker);
+
+      if (params.markerElement) {
+        this.markerWidth = params.markerElement.width;
+        this.markerHeight = params.markerElement.height;
+      }
+
+      marker.el = this._createMarkerElement(marker, params.markerElement);
       this.wrapper.appendChild(marker.el);
       this.markers.push(marker);
 
@@ -204,7 +211,7 @@ var MarkersPlugin = /*#__PURE__*/function () {
     }
   }, {
     key: "_createMarkerElement",
-    value: function _createMarkerElement(marker) {
+    value: function _createMarkerElement(marker, markerElement) {
       var _this2 = this;
 
       var label = marker.label;
@@ -229,7 +236,7 @@ var MarkersPlugin = /*#__PURE__*/function () {
       el.appendChild(line);
       var labelDiv = document.createElement('div');
 
-      var point = this._createPointerSVG(marker.color, marker.position);
+      var point = markerElement || this._createPointerSVG(marker.color, marker.position);
 
       labelDiv.appendChild(point);
 
@@ -253,6 +260,8 @@ var MarkersPlugin = /*#__PURE__*/function () {
         e.stopPropagation();
 
         _this2.wavesurfer.setCurrentTime(time);
+
+        _this2.wavesurfer.fireEvent("marker-click", marker, e);
       });
       return el;
     }
@@ -289,6 +298,7 @@ var MarkersPlugin = /*#__PURE__*/function () {
     /**
      * @typedef {Object} MarkersPluginParams
      * @property {?MarkerParams[]} markers Initial set of markers
+     * @fires MarkersPlugin#marker-click
      */
 
     /**

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

@@ -1 +1 @@
-{"version":3,"sources":["webpack://WaveSurfer.[name]/webpack/universalModuleDefinition","webpack://WaveSurfer.[name]/./src/plugin/markers/index.js","webpack://WaveSurfer.[name]/webpack/bootstrap","webpack://WaveSurfer.[name]/webpack/startup"],"names":["DEFAULT_FILL_COLOR","DEFAULT_POSITION","MarkersPlugin","params","ws","wavesurfer","util","style","markerWidth","markerHeight","_onResize","_updateMarkerPositions","_onBackendCreated","wrapper","drawer","markers","forEach","marker","add","window","addEventListener","on","_onReady","isReady","once","un","removeEventListener","clear","time","label","color","position","el","_createMarkerElement","appendChild","push","index","removeChild","splice","svgNS","document","createElementNS","polygon","setAttribute","width","height","createElement","className","display","overflow","line","background","opacity","labelDiv","point","_createPointerSVG","labelEl","innerText","cursor","e","stopPropagation","setCurrentTime","duration","getDuration","i","length","elementWidth","pixelRatio","positionPct","Math","min","leftPx","remove","name","deferInit","staticProps","addMarker","options","initialisedPluginList","initPlugin","clearMarkers","instance"],"mappings":"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","file":"wavesurfer.markers.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\"][\"markers\"] = factory();\n})(this, function() {\nreturn ","\n/**\n * @typedef {Object} MarkerParams\n * @desc The parameters used to describe a marker.\n * @example wavesurfer.addMarker(regionParams);\n * @property {number} time The time to set the marker at\n * @property {?label} string an optional marker label\n * @property {?color} string background color for marker\n * @property {?position} string \"top\" or \"bottom\", defaults to \"bottom\"\n */\n\n\n/**\n * Markers are points in time in the audio that can be jumped to.\n *\n * @implements {PluginClass}\n *\n * @example\n * import MarkersPlugin from 'wavesurfer.markers.js';\n *\n * // if you are using <script> tags\n * var MarkerPlugin = window.WaveSurfer.markers;\n *\n * // ... initialising wavesurfer with the plugin\n * var wavesurfer = WaveSurfer.create({\n *   // wavesurfer options ...\n *   plugins: [\n *     MarkersPlugin.create({\n *       // plugin options ...\n *     })\n *   ]\n * });\n */\n\nconst DEFAULT_FILL_COLOR = \"#D8D8D8\";\nconst DEFAULT_POSITION = \"bottom\";\n\nexport default class MarkersPlugin {\n    /**\n     * @typedef {Object} MarkersPluginParams\n     * @property {?MarkerParams[]} markers Initial set of markers\n     */\n\n    /**\n     * Markers 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 {MarkersPluginParams} params parameters use to initialise the plugin\n     * @since 4.6.0\n     * @return {PluginDefinition} an object representing the plugin\n     */\n    static create(params) {\n        return {\n            name: 'markers',\n            deferInit: params && params.deferInit ? params.deferInit : false,\n            params: params,\n            staticProps: {\n                addMarker(options) {\n                    if (!this.initialisedPluginList.markers) {\n                        this.initPlugin('markers');\n                    }\n                    return this.markers.add(options);\n                },\n                clearMarkers() {\n                    this.markers && this.markers.clear();\n                }\n            },\n            instance: MarkersPlugin\n        };\n    }\n\n    constructor(params, ws) {\n        this.params = params;\n        this.wavesurfer = ws;\n        this.util = ws.util;\n        this.style = this.util.style;\n        this.markerWidth = 11;\n        this.markerHeight = 22;\n\n\n        this._onResize = () => {\n            this._updateMarkerPositions();\n        };\n\n        this._onBackendCreated = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            if (this.params.markers) {\n                this.params.markers.forEach(marker => this.add(marker));\n            }\n            window.addEventListener('resize', this._onResize, true);\n            window.addEventListener('orientationchange', this._onResize, true);\n            this.wavesurfer.on('zoom', this._onResize);\n        };\n\n        this.markers = [];\n        this._onReady = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            this._updateMarkerPositions();\n        };\n    }\n\n    init() {\n        // Check if ws is ready\n        if (this.wavesurfer.isReady) {\n            this._onBackendCreated();\n            this._onReady();\n        } else {\n            this.wavesurfer.once('ready', this._onReady);\n            this.wavesurfer.once('backend-created', this._onBackendCreated);\n        }\n    }\n\n    destroy() {\n        this.wavesurfer.un('ready', this._onReady);\n        this.wavesurfer.un('backend-created', this._onBackendCreated);\n\n        this.wavesurfer.un('zoom', this._onResize);\n\n        window.removeEventListener('resize', this._onResize, true);\n        window.removeEventListener('orientationchange', this._onResize, true);\n\n        this.clear();\n    }\n\n    /**\n     * Add a marker\n     *\n     * @param {MarkerParams} params Marker definition\n     * @return {object} The created marker\n     */\n    add(params) {\n        let marker = {\n            time: params.time,\n            label: params.label,\n            color: params.color || DEFAULT_FILL_COLOR,\n            position: params.position || DEFAULT_POSITION\n        };\n\n        marker.el = this._createMarkerElement(marker);\n\n        this.wrapper.appendChild(marker.el);\n        this.markers.push(marker);\n        this._updateMarkerPositions();\n\n        return marker;\n    }\n\n    /**\n     * Remove a marker\n     *\n     * @param {number} index Index of the marker to remove\n     */\n    remove(index) {\n        let marker = this.markers[index];\n        if (!marker) {\n            return;\n        }\n\n        this.wrapper.removeChild(marker.el);\n        this.markers.splice(index, 1);\n    }\n\n    _createPointerSVG(color, position) {\n        const svgNS = \"http://www.w3.org/2000/svg\";\n\n        const el = document.createElementNS(svgNS, \"svg\");\n        const polygon = document.createElementNS(svgNS, \"polygon\");\n\n        el.setAttribute(\"viewBox\", \"0 0 40 80\");\n\n        polygon.setAttribute(\"id\", \"polygon\");\n        polygon.setAttribute(\"stroke\", \"#979797\");\n        polygon.setAttribute(\"fill\", color);\n        polygon.setAttribute(\"points\", \"20 0 40 30 40 80 0 80 0 30\");\n        if ( position == \"top\" ) {\n            polygon.setAttribute(\"transform\", \"rotate(180, 20 40)\");\n        }\n\n        el.appendChild(polygon);\n\n        this.style(el, {\n            width: this.markerWidth + \"px\",\n            height: this.markerHeight + \"px\",\n            \"min-width\": this.markerWidth + \"px\",\n            \"margin-right\": \"5px\",\n            \"z-index\": 4\n        });\n        return el;\n    }\n\n    _createMarkerElement(marker) {\n        let label = marker.label;\n        let time = marker.time;\n\n        const el = document.createElement('marker');\n        el.className = \"wavesurfer-marker\";\n\n        this.style(el, {\n            position: \"absolute\",\n            height: \"100%\",\n            display: \"flex\",\n            overflow: \"hidden\",\n            \"flex-direction\": (marker.position == \"top\" ? \"column-reverse\" : \"column\")\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        el.appendChild(line);\n\n        const labelDiv = document.createElement('div');\n        const point = this._createPointerSVG(marker.color, marker.position);\n        labelDiv.appendChild(point);\n\n        if ( label ) {\n            const labelEl = document.createElement('span');\n            labelEl.innerText = label;\n            this.style(labelEl, {\n                \"font-family\": \"monospace\",\n                \"font-size\": \"90%\"\n            });\n            labelDiv.appendChild(labelEl);\n        }\n\n        this.style(labelDiv, {\n            display: \"flex\",\n            \"align-items\": \"center\",\n            cursor: \"pointer\"\n        });\n\n        el.appendChild(labelDiv);\n\n        labelDiv.addEventListener(\"click\", e => {\n            e.stopPropagation();\n            this.wavesurfer.setCurrentTime(time);\n        });\n\n        return el;\n    }\n\n    _updateMarkerPositions() {\n        const duration = this.wavesurfer.getDuration();\n\n        for ( let i = 0 ; i < this.markers.length; i++ ) {\n            let marker = this.markers[i];\n            const elementWidth =\n                this.wavesurfer.drawer.width /\n                this.wavesurfer.params.pixelRatio;\n\n            const positionPct = Math.min(marker.time / duration, 1);\n            const leftPx = ((elementWidth * positionPct) - (this.markerWidth / 2));\n            this.style(marker.el, {\n                \"left\":  leftPx + \"px\",\n                \"max-width\": (elementWidth - leftPx) + \"px\"\n            });\n        }\n    }\n\n    /**\n     * Remove all markers\n     */\n    clear() {\n        while ( this.markers.length > 0 ) {\n            this.remove(0);\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/markers/index.js\");\n"],"sourceRoot":""}
+{"version":3,"sources":["webpack://WaveSurfer.[name]/webpack/universalModuleDefinition","webpack://WaveSurfer.[name]/./src/plugin/markers/index.js","webpack://WaveSurfer.[name]/webpack/bootstrap","webpack://WaveSurfer.[name]/webpack/startup"],"names":["DEFAULT_FILL_COLOR","DEFAULT_POSITION","MarkersPlugin","params","ws","wavesurfer","util","style","markerWidth","markerHeight","_onResize","_updateMarkerPositions","_onBackendCreated","wrapper","drawer","markers","forEach","marker","add","window","addEventListener","on","_onReady","isReady","once","un","removeEventListener","clear","time","label","color","position","markerElement","width","height","el","_createMarkerElement","appendChild","push","index","removeChild","splice","svgNS","document","createElementNS","polygon","setAttribute","createElement","className","display","overflow","line","background","opacity","labelDiv","point","_createPointerSVG","labelEl","innerText","cursor","e","stopPropagation","setCurrentTime","fireEvent","duration","getDuration","i","length","elementWidth","pixelRatio","positionPct","Math","min","leftPx","remove","name","deferInit","staticProps","addMarker","options","initialisedPluginList","initPlugin","clearMarkers","instance"],"mappings":"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","file":"wavesurfer.markers.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\"][\"markers\"] = factory();\n})(this, function() {\nreturn ","\n/**\n * @typedef {Object} MarkerParams\n * @desc The parameters used to describe a marker.\n * @example wavesurfer.addMarker(regionParams);\n * @property {number} time The time to set the marker at\n * @property {?label} string An optional marker label\n * @property {?color} string Background color for marker\n * @property {?position} string \"top\" or \"bottom\", defaults to \"bottom\"\n * @property {?markerElement} element An HTML element to display instead of the default marker image\n */\n\n\n/**\n * Markers are points in time in the audio that can be jumped to.\n *\n * @implements {PluginClass}\n *\n * @example\n * import MarkersPlugin from 'wavesurfer.markers.js';\n *\n * // if you are using <script> tags\n * var MarkerPlugin = window.WaveSurfer.markers;\n *\n * // ... initialising wavesurfer with the plugin\n * var wavesurfer = WaveSurfer.create({\n *   // wavesurfer options ...\n *   plugins: [\n *     MarkersPlugin.create({\n *       // plugin options ...\n *     })\n *   ]\n * });\n */\n\nconst DEFAULT_FILL_COLOR = \"#D8D8D8\";\nconst DEFAULT_POSITION = \"bottom\";\n\nexport default class MarkersPlugin {\n    /**\n     * @typedef {Object} MarkersPluginParams\n     * @property {?MarkerParams[]} markers Initial set of markers\n     * @fires MarkersPlugin#marker-click\n     */\n\n    /**\n     * Markers 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 {MarkersPluginParams} params parameters use to initialise the plugin\n     * @since 4.6.0\n     * @return {PluginDefinition} an object representing the plugin\n     */\n    static create(params) {\n        return {\n            name: 'markers',\n            deferInit: params && params.deferInit ? params.deferInit : false,\n            params: params,\n            staticProps: {\n                addMarker(options) {\n                    if (!this.initialisedPluginList.markers) {\n                        this.initPlugin('markers');\n                    }\n                    return this.markers.add(options);\n                },\n                clearMarkers() {\n                    this.markers && this.markers.clear();\n                }\n            },\n            instance: MarkersPlugin\n        };\n    }\n\n    constructor(params, ws) {\n        this.params = params;\n        this.wavesurfer = ws;\n        this.util = ws.util;\n        this.style = this.util.style;\n        this.markerWidth = 11;\n        this.markerHeight = 22;\n\n\n        this._onResize = () => {\n            this._updateMarkerPositions();\n        };\n\n        this._onBackendCreated = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            if (this.params.markers) {\n                this.params.markers.forEach(marker => this.add(marker));\n            }\n            window.addEventListener('resize', this._onResize, true);\n            window.addEventListener('orientationchange', this._onResize, true);\n            this.wavesurfer.on('zoom', this._onResize);\n        };\n\n        this.markers = [];\n        this._onReady = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            this._updateMarkerPositions();\n        };\n    }\n\n    init() {\n        // Check if ws is ready\n        if (this.wavesurfer.isReady) {\n            this._onBackendCreated();\n            this._onReady();\n        } else {\n            this.wavesurfer.once('ready', this._onReady);\n            this.wavesurfer.once('backend-created', this._onBackendCreated);\n        }\n    }\n\n    destroy() {\n        this.wavesurfer.un('ready', this._onReady);\n        this.wavesurfer.un('backend-created', this._onBackendCreated);\n\n        this.wavesurfer.un('zoom', this._onResize);\n\n        window.removeEventListener('resize', this._onResize, true);\n        window.removeEventListener('orientationchange', this._onResize, true);\n\n        this.clear();\n    }\n\n    /**\n     * Add a marker\n     *\n     * @param {MarkerParams} params Marker definition\n     * @return {object} The created marker\n     */\n    add(params) {\n        let marker = {\n            time: params.time,\n            label: params.label,\n            color: params.color || DEFAULT_FILL_COLOR,\n            position: params.position || DEFAULT_POSITION\n        };\n\n        if (params.markerElement) {\n            this.markerWidth = params.markerElement.width;\n            this.markerHeight = params.markerElement.height;\n        }\n\n        marker.el = this._createMarkerElement(marker, params.markerElement);\n\n        this.wrapper.appendChild(marker.el);\n        this.markers.push(marker);\n        this._updateMarkerPositions();\n\n        return marker;\n    }\n\n    /**\n     * Remove a marker\n     *\n     * @param {number} index Index of the marker to remove\n     */\n    remove(index) {\n        let marker = this.markers[index];\n        if (!marker) {\n            return;\n        }\n\n        this.wrapper.removeChild(marker.el);\n        this.markers.splice(index, 1);\n    }\n\n    _createPointerSVG(color, position) {\n        const svgNS = \"http://www.w3.org/2000/svg\";\n\n        const el = document.createElementNS(svgNS, \"svg\");\n        const polygon = document.createElementNS(svgNS, \"polygon\");\n\n        el.setAttribute(\"viewBox\", \"0 0 40 80\");\n\n        polygon.setAttribute(\"id\", \"polygon\");\n        polygon.setAttribute(\"stroke\", \"#979797\");\n        polygon.setAttribute(\"fill\", color);\n        polygon.setAttribute(\"points\", \"20 0 40 30 40 80 0 80 0 30\");\n        if ( position == \"top\" ) {\n            polygon.setAttribute(\"transform\", \"rotate(180, 20 40)\");\n        }\n\n        el.appendChild(polygon);\n\n        this.style(el, {\n            width: this.markerWidth + \"px\",\n            height: this.markerHeight + \"px\",\n            \"min-width\": this.markerWidth + \"px\",\n            \"margin-right\": \"5px\",\n            \"z-index\": 4\n        });\n        return el;\n    }\n\n    _createMarkerElement(marker, markerElement) {\n        let label = marker.label;\n        let time = marker.time;\n\n        const el = document.createElement('marker');\n        el.className = \"wavesurfer-marker\";\n\n        this.style(el, {\n            position: \"absolute\",\n            height: \"100%\",\n            display: \"flex\",\n            overflow: \"hidden\",\n            \"flex-direction\": (marker.position == \"top\" ? \"column-reverse\" : \"column\")\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        el.appendChild(line);\n\n        const labelDiv = document.createElement('div');\n        const point = markerElement || this._createPointerSVG(marker.color, marker.position);\n        labelDiv.appendChild(point);\n\n        if ( label ) {\n            const labelEl = document.createElement('span');\n            labelEl.innerText = label;\n            this.style(labelEl, {\n                \"font-family\": \"monospace\",\n                \"font-size\": \"90%\"\n            });\n            labelDiv.appendChild(labelEl);\n        }\n\n        this.style(labelDiv, {\n            display: \"flex\",\n            \"align-items\": \"center\",\n            cursor: \"pointer\"\n        });\n\n        el.appendChild(labelDiv);\n\n        labelDiv.addEventListener(\"click\", e => {\n            e.stopPropagation();\n            this.wavesurfer.setCurrentTime(time);\n            this.wavesurfer.fireEvent(\"marker-click\", marker, e);\n        });\n\n        return el;\n    }\n\n    _updateMarkerPositions() {\n        const duration = this.wavesurfer.getDuration();\n\n        for ( let i = 0 ; i < this.markers.length; i++ ) {\n            let marker = this.markers[i];\n            const elementWidth =\n                this.wavesurfer.drawer.width /\n                this.wavesurfer.params.pixelRatio;\n\n            const positionPct = Math.min(marker.time / duration, 1);\n            const leftPx = ((elementWidth * positionPct) - (this.markerWidth / 2));\n            this.style(marker.el, {\n                \"left\":  leftPx + \"px\",\n                \"max-width\": (elementWidth - leftPx) + \"px\"\n            });\n        }\n    }\n\n    /**\n     * Remove all markers\n     */\n    clear() {\n        while ( this.markers.length > 0 ) {\n            this.remove(0);\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/markers/index.js\");\n"],"sourceRoot":""}

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

@@ -1,7 +1,7 @@
 /*!
- * wavesurfer.js markers plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js markers plugin 5.1.0 (2021-06-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.markers=t())}(this,(function(){return(()=>{"use strict";var e={188:(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.wavesurfer=r,this.util=r.util,this.style=this.util.style,this.markerWidth=11,this.markerHeight=22,this._onResize=function(){i._updateMarkerPositions()},this._onBackendCreated=function(){i.wrapper=i.wavesurfer.drawer.wrapper,i.params.markers&&i.params.markers.forEach((function(e){return i.add(e)})),window.addEventListener("resize",i._onResize,!0),window.addEventListener("orientationchange",i._onResize,!0),i.wavesurfer.on("zoom",i._onResize)},this.markers=[],this._onReady=function(){i.wrapper=i.wavesurfer.drawer.wrapper,i._updateMarkerPositions()}}var t,i,a;return t=e,a=[{key:"create",value:function(t){return{name:"markers",deferInit:!(!t||!t.deferInit)&&t.deferInit,params:t,staticProps:{addMarker:function(e){return this.initialisedPluginList.markers||this.initPlugin("markers"),this.markers.add(e)},clearMarkers:function(){this.markers&&this.markers.clear()}},instance:e}}}],(i=[{key:"init",value:function(){this.wavesurfer.isReady?(this._onBackendCreated(),this._onReady()):(this.wavesurfer.once("ready",this._onReady),this.wavesurfer.once("backend-created",this._onBackendCreated))}},{key:"destroy",value:function(){this.wavesurfer.un("ready",this._onReady),this.wavesurfer.un("backend-created",this._onBackendCreated),this.wavesurfer.un("zoom",this._onResize),window.removeEventListener("resize",this._onResize,!0),window.removeEventListener("orientationchange",this._onResize,!0),this.clear()}},{key:"add",value:function(e){var t={time:e.time,label:e.label,color:e.color||"#D8D8D8",position:e.position||"bottom"};return t.el=this._createMarkerElement(t),this.wrapper.appendChild(t.el),this.markers.push(t),this._updateMarkerPositions(),t}},{key:"remove",value:function(e){var t=this.markers[e];t&&(this.wrapper.removeChild(t.el),this.markers.splice(e,1))}},{key:"_createPointerSVG",value:function(e,t){var r="http://www.w3.org/2000/svg",i=document.createElementNS(r,"svg"),a=document.createElementNS(r,"polygon");return i.setAttribute("viewBox","0 0 40 80"),a.setAttribute("id","polygon"),a.setAttribute("stroke","#979797"),a.setAttribute("fill",e),a.setAttribute("points","20 0 40 30 40 80 0 80 0 30"),"top"==t&&a.setAttribute("transform","rotate(180, 20 40)"),i.appendChild(a),this.style(i,{width:this.markerWidth+"px",height:this.markerHeight+"px","min-width":this.markerWidth+"px","margin-right":"5px","z-index":4}),i}},{key:"_createMarkerElement",value:function(e){var t=this,r=e.label,i=e.time,a=document.createElement("marker");a.className="wavesurfer-marker",this.style(a,{position:"absolute",height:"100%",display:"flex",overflow:"hidden","flex-direction":"top"==e.position?"column-reverse":"column"});var n=document.createElement("div");this.style(n,{"flex-grow":1,"margin-left":this.markerWidth/2-.5+"px",background:"black",width:"1px",opacity:.1}),a.appendChild(n);var s=document.createElement("div"),o=this._createPointerSVG(e.color,e.position);if(s.appendChild(o),r){var u=document.createElement("span");u.innerText=r,this.style(u,{"font-family":"monospace","font-size":"90%"}),s.appendChild(u)}return this.style(s,{display:"flex","align-items":"center",cursor:"pointer"}),a.appendChild(s),s.addEventListener("click",(function(e){e.stopPropagation(),t.wavesurfer.setCurrentTime(i)})),a}},{key:"_updateMarkerPositions",value:function(){for(var e=this.wavesurfer.getDuration(),t=0;t<this.markers.length;t++){var r=this.markers[t],i=this.wavesurfer.drawer.width/this.wavesurfer.params.pixelRatio,a=i*Math.min(r.time/e,1)-this.markerWidth/2;this.style(r.el,{left:a+"px","max-width":i-a+"px"})}}},{key:"clear",value:function(){for(;this.markers.length>0;)this.remove(0)}}])&&r(t.prototype,i),a&&r(t,a),e}();t.default=i,e.exports=t.default}},t={};return function r(i){var a=t[i];if(void 0!==a)return a.exports;var n=t[i]={exports:{}};return e[i](n,n.exports,r),n.exports}(188)})()}));
+!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.markers=t())}(this,(function(){return(()=>{"use strict";var e={188:(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.wavesurfer=r,this.util=r.util,this.style=this.util.style,this.markerWidth=11,this.markerHeight=22,this._onResize=function(){i._updateMarkerPositions()},this._onBackendCreated=function(){i.wrapper=i.wavesurfer.drawer.wrapper,i.params.markers&&i.params.markers.forEach((function(e){return i.add(e)})),window.addEventListener("resize",i._onResize,!0),window.addEventListener("orientationchange",i._onResize,!0),i.wavesurfer.on("zoom",i._onResize)},this.markers=[],this._onReady=function(){i.wrapper=i.wavesurfer.drawer.wrapper,i._updateMarkerPositions()}}var t,i,a;return t=e,a=[{key:"create",value:function(t){return{name:"markers",deferInit:!(!t||!t.deferInit)&&t.deferInit,params:t,staticProps:{addMarker:function(e){return this.initialisedPluginList.markers||this.initPlugin("markers"),this.markers.add(e)},clearMarkers:function(){this.markers&&this.markers.clear()}},instance:e}}}],(i=[{key:"init",value:function(){this.wavesurfer.isReady?(this._onBackendCreated(),this._onReady()):(this.wavesurfer.once("ready",this._onReady),this.wavesurfer.once("backend-created",this._onBackendCreated))}},{key:"destroy",value:function(){this.wavesurfer.un("ready",this._onReady),this.wavesurfer.un("backend-created",this._onBackendCreated),this.wavesurfer.un("zoom",this._onResize),window.removeEventListener("resize",this._onResize,!0),window.removeEventListener("orientationchange",this._onResize,!0),this.clear()}},{key:"add",value:function(e){var t={time:e.time,label:e.label,color:e.color||"#D8D8D8",position:e.position||"bottom"};return e.markerElement&&(this.markerWidth=e.markerElement.width,this.markerHeight=e.markerElement.height),t.el=this._createMarkerElement(t,e.markerElement),this.wrapper.appendChild(t.el),this.markers.push(t),this._updateMarkerPositions(),t}},{key:"remove",value:function(e){var t=this.markers[e];t&&(this.wrapper.removeChild(t.el),this.markers.splice(e,1))}},{key:"_createPointerSVG",value:function(e,t){var r="http://www.w3.org/2000/svg",i=document.createElementNS(r,"svg"),a=document.createElementNS(r,"polygon");return i.setAttribute("viewBox","0 0 40 80"),a.setAttribute("id","polygon"),a.setAttribute("stroke","#979797"),a.setAttribute("fill",e),a.setAttribute("points","20 0 40 30 40 80 0 80 0 30"),"top"==t&&a.setAttribute("transform","rotate(180, 20 40)"),i.appendChild(a),this.style(i,{width:this.markerWidth+"px",height:this.markerHeight+"px","min-width":this.markerWidth+"px","margin-right":"5px","z-index":4}),i}},{key:"_createMarkerElement",value:function(e,t){var r=this,i=e.label,a=e.time,n=document.createElement("marker");n.className="wavesurfer-marker",this.style(n,{position:"absolute",height:"100%",display:"flex",overflow:"hidden","flex-direction":"top"==e.position?"column-reverse":"column"});var s=document.createElement("div");this.style(s,{"flex-grow":1,"margin-left":this.markerWidth/2-.5+"px",background:"black",width:"1px",opacity:.1}),n.appendChild(s);var o=document.createElement("div"),u=t||this._createPointerSVG(e.color,e.position);if(o.appendChild(u),i){var d=document.createElement("span");d.innerText=i,this.style(d,{"font-family":"monospace","font-size":"90%"}),o.appendChild(d)}return this.style(o,{display:"flex","align-items":"center",cursor:"pointer"}),n.appendChild(o),o.addEventListener("click",(function(t){t.stopPropagation(),r.wavesurfer.setCurrentTime(a),r.wavesurfer.fireEvent("marker-click",e,t)})),n}},{key:"_updateMarkerPositions",value:function(){for(var e=this.wavesurfer.getDuration(),t=0;t<this.markers.length;t++){var r=this.markers[t],i=this.wavesurfer.drawer.width/this.wavesurfer.params.pixelRatio,a=i*Math.min(r.time/e,1)-this.markerWidth/2;this.style(r.el,{left:a+"px","max-width":i-a+"px"})}}},{key:"clear",value:function(){for(;this.markers.length>0;)this.remove(0)}}])&&r(t.prototype,i),a&&r(t,a),e}();t.default=i,e.exports=t.default}},t={};return function r(i){var a=t[i];if(void 0!==a)return a.exports;var n=t[i]={exports:{}};return e[i](n,n.exports,r),n.exports}(188)})()}));
 //# sourceMappingURL=wavesurfer.markers.min.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["webpack://WaveSurfer.[name]/webpack/universalModuleDefinition","webpack://WaveSurfer.[name]/./src/plugin/markers/index.js","webpack://WaveSurfer.[name]/webpack/bootstrap","webpack://WaveSurfer.[name]/webpack/startup"],"names":["root","factory","exports","module","define","amd","this","MarkersPlugin","params","ws","wavesurfer","util","style","markerWidth","markerHeight","_onResize","_updateMarkerPositions","_onBackendCreated","wrapper","drawer","markers","forEach","marker","add","window","addEventListener","on","_onReady","name","deferInit","staticProps","addMarker","options","initialisedPluginList","initPlugin","clearMarkers","clear","instance","isReady","once","un","removeEventListener","time","label","color","position","el","_createMarkerElement","appendChild","push","index","removeChild","splice","svgNS","document","createElementNS","polygon","setAttribute","width","height","createElement","className","display","overflow","line","background","opacity","labelDiv","point","_createPointerSVG","labelEl","innerText","cursor","e","stopPropagation","setCurrentTime","duration","getDuration","i","length","elementWidth","pixelRatio","leftPx","Math","min","remove","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__"],"mappings":"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","file":"wavesurfer.markers.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\"][\"markers\"] = factory();\n})(this, function() {\nreturn ","\n/**\n * @typedef {Object} MarkerParams\n * @desc The parameters used to describe a marker.\n * @example wavesurfer.addMarker(regionParams);\n * @property {number} time The time to set the marker at\n * @property {?label} string an optional marker label\n * @property {?color} string background color for marker\n * @property {?position} string \"top\" or \"bottom\", defaults to \"bottom\"\n */\n\n\n/**\n * Markers are points in time in the audio that can be jumped to.\n *\n * @implements {PluginClass}\n *\n * @example\n * import MarkersPlugin from 'wavesurfer.markers.js';\n *\n * // if you are using <script> tags\n * var MarkerPlugin = window.WaveSurfer.markers;\n *\n * // ... initialising wavesurfer with the plugin\n * var wavesurfer = WaveSurfer.create({\n *   // wavesurfer options ...\n *   plugins: [\n *     MarkersPlugin.create({\n *       // plugin options ...\n *     })\n *   ]\n * });\n */\n\nconst DEFAULT_FILL_COLOR = \"#D8D8D8\";\nconst DEFAULT_POSITION = \"bottom\";\n\nexport default class MarkersPlugin {\n    /**\n     * @typedef {Object} MarkersPluginParams\n     * @property {?MarkerParams[]} markers Initial set of markers\n     */\n\n    /**\n     * Markers 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 {MarkersPluginParams} params parameters use to initialise the plugin\n     * @since 4.6.0\n     * @return {PluginDefinition} an object representing the plugin\n     */\n    static create(params) {\n        return {\n            name: 'markers',\n            deferInit: params && params.deferInit ? params.deferInit : false,\n            params: params,\n            staticProps: {\n                addMarker(options) {\n                    if (!this.initialisedPluginList.markers) {\n                        this.initPlugin('markers');\n                    }\n                    return this.markers.add(options);\n                },\n                clearMarkers() {\n                    this.markers && this.markers.clear();\n                }\n            },\n            instance: MarkersPlugin\n        };\n    }\n\n    constructor(params, ws) {\n        this.params = params;\n        this.wavesurfer = ws;\n        this.util = ws.util;\n        this.style = this.util.style;\n        this.markerWidth = 11;\n        this.markerHeight = 22;\n\n\n        this._onResize = () => {\n            this._updateMarkerPositions();\n        };\n\n        this._onBackendCreated = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            if (this.params.markers) {\n                this.params.markers.forEach(marker => this.add(marker));\n            }\n            window.addEventListener('resize', this._onResize, true);\n            window.addEventListener('orientationchange', this._onResize, true);\n            this.wavesurfer.on('zoom', this._onResize);\n        };\n\n        this.markers = [];\n        this._onReady = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            this._updateMarkerPositions();\n        };\n    }\n\n    init() {\n        // Check if ws is ready\n        if (this.wavesurfer.isReady) {\n            this._onBackendCreated();\n            this._onReady();\n        } else {\n            this.wavesurfer.once('ready', this._onReady);\n            this.wavesurfer.once('backend-created', this._onBackendCreated);\n        }\n    }\n\n    destroy() {\n        this.wavesurfer.un('ready', this._onReady);\n        this.wavesurfer.un('backend-created', this._onBackendCreated);\n\n        this.wavesurfer.un('zoom', this._onResize);\n\n        window.removeEventListener('resize', this._onResize, true);\n        window.removeEventListener('orientationchange', this._onResize, true);\n\n        this.clear();\n    }\n\n    /**\n     * Add a marker\n     *\n     * @param {MarkerParams} params Marker definition\n     * @return {object} The created marker\n     */\n    add(params) {\n        let marker = {\n            time: params.time,\n            label: params.label,\n            color: params.color || DEFAULT_FILL_COLOR,\n            position: params.position || DEFAULT_POSITION\n        };\n\n        marker.el = this._createMarkerElement(marker);\n\n        this.wrapper.appendChild(marker.el);\n        this.markers.push(marker);\n        this._updateMarkerPositions();\n\n        return marker;\n    }\n\n    /**\n     * Remove a marker\n     *\n     * @param {number} index Index of the marker to remove\n     */\n    remove(index) {\n        let marker = this.markers[index];\n        if (!marker) {\n            return;\n        }\n\n        this.wrapper.removeChild(marker.el);\n        this.markers.splice(index, 1);\n    }\n\n    _createPointerSVG(color, position) {\n        const svgNS = \"http://www.w3.org/2000/svg\";\n\n        const el = document.createElementNS(svgNS, \"svg\");\n        const polygon = document.createElementNS(svgNS, \"polygon\");\n\n        el.setAttribute(\"viewBox\", \"0 0 40 80\");\n\n        polygon.setAttribute(\"id\", \"polygon\");\n        polygon.setAttribute(\"stroke\", \"#979797\");\n        polygon.setAttribute(\"fill\", color);\n        polygon.setAttribute(\"points\", \"20 0 40 30 40 80 0 80 0 30\");\n        if ( position == \"top\" ) {\n            polygon.setAttribute(\"transform\", \"rotate(180, 20 40)\");\n        }\n\n        el.appendChild(polygon);\n\n        this.style(el, {\n            width: this.markerWidth + \"px\",\n            height: this.markerHeight + \"px\",\n            \"min-width\": this.markerWidth + \"px\",\n            \"margin-right\": \"5px\",\n            \"z-index\": 4\n        });\n        return el;\n    }\n\n    _createMarkerElement(marker) {\n        let label = marker.label;\n        let time = marker.time;\n\n        const el = document.createElement('marker');\n        el.className = \"wavesurfer-marker\";\n\n        this.style(el, {\n            position: \"absolute\",\n            height: \"100%\",\n            display: \"flex\",\n            overflow: \"hidden\",\n            \"flex-direction\": (marker.position == \"top\" ? \"column-reverse\" : \"column\")\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        el.appendChild(line);\n\n        const labelDiv = document.createElement('div');\n        const point = this._createPointerSVG(marker.color, marker.position);\n        labelDiv.appendChild(point);\n\n        if ( label ) {\n            const labelEl = document.createElement('span');\n            labelEl.innerText = label;\n            this.style(labelEl, {\n                \"font-family\": \"monospace\",\n                \"font-size\": \"90%\"\n            });\n            labelDiv.appendChild(labelEl);\n        }\n\n        this.style(labelDiv, {\n            display: \"flex\",\n            \"align-items\": \"center\",\n            cursor: \"pointer\"\n        });\n\n        el.appendChild(labelDiv);\n\n        labelDiv.addEventListener(\"click\", e => {\n            e.stopPropagation();\n            this.wavesurfer.setCurrentTime(time);\n        });\n\n        return el;\n    }\n\n    _updateMarkerPositions() {\n        const duration = this.wavesurfer.getDuration();\n\n        for ( let i = 0 ; i < this.markers.length; i++ ) {\n            let marker = this.markers[i];\n            const elementWidth =\n                this.wavesurfer.drawer.width /\n                this.wavesurfer.params.pixelRatio;\n\n            const positionPct = Math.min(marker.time / duration, 1);\n            const leftPx = ((elementWidth * positionPct) - (this.markerWidth / 2));\n            this.style(marker.el, {\n                \"left\":  leftPx + \"px\",\n                \"max-width\": (elementWidth - leftPx) + \"px\"\n            });\n        }\n    }\n\n    /**\n     * Remove all markers\n     */\n    clear() {\n        while ( this.markers.length > 0 ) {\n            this.remove(0);\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__(188);\n"],"sourceRoot":""}
+{"version":3,"sources":["webpack://WaveSurfer.[name]/webpack/universalModuleDefinition","webpack://WaveSurfer.[name]/./src/plugin/markers/index.js","webpack://WaveSurfer.[name]/webpack/bootstrap","webpack://WaveSurfer.[name]/webpack/startup"],"names":["root","factory","exports","module","define","amd","this","MarkersPlugin","params","ws","wavesurfer","util","style","markerWidth","markerHeight","_onResize","_updateMarkerPositions","_onBackendCreated","wrapper","drawer","markers","forEach","marker","add","window","addEventListener","on","_onReady","name","deferInit","staticProps","addMarker","options","initialisedPluginList","initPlugin","clearMarkers","clear","instance","isReady","once","un","removeEventListener","time","label","color","position","markerElement","width","height","el","_createMarkerElement","appendChild","push","index","removeChild","splice","svgNS","document","createElementNS","polygon","setAttribute","createElement","className","display","overflow","line","background","opacity","labelDiv","point","_createPointerSVG","labelEl","innerText","cursor","e","stopPropagation","setCurrentTime","fireEvent","duration","getDuration","i","length","elementWidth","pixelRatio","leftPx","Math","min","remove","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__"],"mappings":"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","file":"wavesurfer.markers.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\"][\"markers\"] = factory();\n})(this, function() {\nreturn ","\n/**\n * @typedef {Object} MarkerParams\n * @desc The parameters used to describe a marker.\n * @example wavesurfer.addMarker(regionParams);\n * @property {number} time The time to set the marker at\n * @property {?label} string An optional marker label\n * @property {?color} string Background color for marker\n * @property {?position} string \"top\" or \"bottom\", defaults to \"bottom\"\n * @property {?markerElement} element An HTML element to display instead of the default marker image\n */\n\n\n/**\n * Markers are points in time in the audio that can be jumped to.\n *\n * @implements {PluginClass}\n *\n * @example\n * import MarkersPlugin from 'wavesurfer.markers.js';\n *\n * // if you are using <script> tags\n * var MarkerPlugin = window.WaveSurfer.markers;\n *\n * // ... initialising wavesurfer with the plugin\n * var wavesurfer = WaveSurfer.create({\n *   // wavesurfer options ...\n *   plugins: [\n *     MarkersPlugin.create({\n *       // plugin options ...\n *     })\n *   ]\n * });\n */\n\nconst DEFAULT_FILL_COLOR = \"#D8D8D8\";\nconst DEFAULT_POSITION = \"bottom\";\n\nexport default class MarkersPlugin {\n    /**\n     * @typedef {Object} MarkersPluginParams\n     * @property {?MarkerParams[]} markers Initial set of markers\n     * @fires MarkersPlugin#marker-click\n     */\n\n    /**\n     * Markers 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 {MarkersPluginParams} params parameters use to initialise the plugin\n     * @since 4.6.0\n     * @return {PluginDefinition} an object representing the plugin\n     */\n    static create(params) {\n        return {\n            name: 'markers',\n            deferInit: params && params.deferInit ? params.deferInit : false,\n            params: params,\n            staticProps: {\n                addMarker(options) {\n                    if (!this.initialisedPluginList.markers) {\n                        this.initPlugin('markers');\n                    }\n                    return this.markers.add(options);\n                },\n                clearMarkers() {\n                    this.markers && this.markers.clear();\n                }\n            },\n            instance: MarkersPlugin\n        };\n    }\n\n    constructor(params, ws) {\n        this.params = params;\n        this.wavesurfer = ws;\n        this.util = ws.util;\n        this.style = this.util.style;\n        this.markerWidth = 11;\n        this.markerHeight = 22;\n\n\n        this._onResize = () => {\n            this._updateMarkerPositions();\n        };\n\n        this._onBackendCreated = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            if (this.params.markers) {\n                this.params.markers.forEach(marker => this.add(marker));\n            }\n            window.addEventListener('resize', this._onResize, true);\n            window.addEventListener('orientationchange', this._onResize, true);\n            this.wavesurfer.on('zoom', this._onResize);\n        };\n\n        this.markers = [];\n        this._onReady = () => {\n            this.wrapper = this.wavesurfer.drawer.wrapper;\n            this._updateMarkerPositions();\n        };\n    }\n\n    init() {\n        // Check if ws is ready\n        if (this.wavesurfer.isReady) {\n            this._onBackendCreated();\n            this._onReady();\n        } else {\n            this.wavesurfer.once('ready', this._onReady);\n            this.wavesurfer.once('backend-created', this._onBackendCreated);\n        }\n    }\n\n    destroy() {\n        this.wavesurfer.un('ready', this._onReady);\n        this.wavesurfer.un('backend-created', this._onBackendCreated);\n\n        this.wavesurfer.un('zoom', this._onResize);\n\n        window.removeEventListener('resize', this._onResize, true);\n        window.removeEventListener('orientationchange', this._onResize, true);\n\n        this.clear();\n    }\n\n    /**\n     * Add a marker\n     *\n     * @param {MarkerParams} params Marker definition\n     * @return {object} The created marker\n     */\n    add(params) {\n        let marker = {\n            time: params.time,\n            label: params.label,\n            color: params.color || DEFAULT_FILL_COLOR,\n            position: params.position || DEFAULT_POSITION\n        };\n\n        if (params.markerElement) {\n            this.markerWidth = params.markerElement.width;\n            this.markerHeight = params.markerElement.height;\n        }\n\n        marker.el = this._createMarkerElement(marker, params.markerElement);\n\n        this.wrapper.appendChild(marker.el);\n        this.markers.push(marker);\n        this._updateMarkerPositions();\n\n        return marker;\n    }\n\n    /**\n     * Remove a marker\n     *\n     * @param {number} index Index of the marker to remove\n     */\n    remove(index) {\n        let marker = this.markers[index];\n        if (!marker) {\n            return;\n        }\n\n        this.wrapper.removeChild(marker.el);\n        this.markers.splice(index, 1);\n    }\n\n    _createPointerSVG(color, position) {\n        const svgNS = \"http://www.w3.org/2000/svg\";\n\n        const el = document.createElementNS(svgNS, \"svg\");\n        const polygon = document.createElementNS(svgNS, \"polygon\");\n\n        el.setAttribute(\"viewBox\", \"0 0 40 80\");\n\n        polygon.setAttribute(\"id\", \"polygon\");\n        polygon.setAttribute(\"stroke\", \"#979797\");\n        polygon.setAttribute(\"fill\", color);\n        polygon.setAttribute(\"points\", \"20 0 40 30 40 80 0 80 0 30\");\n        if ( position == \"top\" ) {\n            polygon.setAttribute(\"transform\", \"rotate(180, 20 40)\");\n        }\n\n        el.appendChild(polygon);\n\n        this.style(el, {\n            width: this.markerWidth + \"px\",\n            height: this.markerHeight + \"px\",\n            \"min-width\": this.markerWidth + \"px\",\n            \"margin-right\": \"5px\",\n            \"z-index\": 4\n        });\n        return el;\n    }\n\n    _createMarkerElement(marker, markerElement) {\n        let label = marker.label;\n        let time = marker.time;\n\n        const el = document.createElement('marker');\n        el.className = \"wavesurfer-marker\";\n\n        this.style(el, {\n            position: \"absolute\",\n            height: \"100%\",\n            display: \"flex\",\n            overflow: \"hidden\",\n            \"flex-direction\": (marker.position == \"top\" ? \"column-reverse\" : \"column\")\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        el.appendChild(line);\n\n        const labelDiv = document.createElement('div');\n        const point = markerElement || this._createPointerSVG(marker.color, marker.position);\n        labelDiv.appendChild(point);\n\n        if ( label ) {\n            const labelEl = document.createElement('span');\n            labelEl.innerText = label;\n            this.style(labelEl, {\n                \"font-family\": \"monospace\",\n                \"font-size\": \"90%\"\n            });\n            labelDiv.appendChild(labelEl);\n        }\n\n        this.style(labelDiv, {\n            display: \"flex\",\n            \"align-items\": \"center\",\n            cursor: \"pointer\"\n        });\n\n        el.appendChild(labelDiv);\n\n        labelDiv.addEventListener(\"click\", e => {\n            e.stopPropagation();\n            this.wavesurfer.setCurrentTime(time);\n            this.wavesurfer.fireEvent(\"marker-click\", marker, e);\n        });\n\n        return el;\n    }\n\n    _updateMarkerPositions() {\n        const duration = this.wavesurfer.getDuration();\n\n        for ( let i = 0 ; i < this.markers.length; i++ ) {\n            let marker = this.markers[i];\n            const elementWidth =\n                this.wavesurfer.drawer.width /\n                this.wavesurfer.params.pixelRatio;\n\n            const positionPct = Math.min(marker.time / duration, 1);\n            const leftPx = ((elementWidth * positionPct) - (this.markerWidth / 2));\n            this.style(marker.el, {\n                \"left\":  leftPx + \"px\",\n                \"max-width\": (elementWidth - leftPx) + \"px\"\n            });\n        }\n    }\n\n    /**\n     * Remove all markers\n     */\n    clear() {\n        while ( this.markers.length > 0 ) {\n            this.remove(0);\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__(188);\n"],"sourceRoot":""}

package/dist/plugin/wavesurfer.mediasession.js

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js mediasession plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js mediasession plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

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

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js mediasession plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js mediasession plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

package/dist/plugin/wavesurfer.microphone.js

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js microphone plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js microphone plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

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

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js microphone plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js microphone plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

package/dist/plugin/wavesurfer.minimap.js

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js minimap plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js minimap plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

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

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js minimap plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js minimap plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

package/dist/plugin/wavesurfer.playhead.js

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js playhead plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js playhead plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

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

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js playhead plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js playhead plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */

package/dist/plugin/wavesurfer.regions.js

@@ -1,5 +1,5 @@
 /*!
- * wavesurfer.js regions plugin 5.0.1 (2021-05-05)
+ * wavesurfer.js regions plugin 5.1.0 (2021-06-20)
  * https://wavesurfer-js.org
  * @license BSD-3-Clause
  */
@@ -719,7 +719,7 @@ var Region = /*#__PURE__*/function () {
         this.handleRightEl.className = 'wavesurfer-handle wavesurfer-handle-end'; // Default CSS properties for both handles.
 
         var css = {
-          cursor: 'row-resize',
+          cursor: this.vertical ? 'row-resize' : 'col-resize',
           position: 'absolute',
           top: '0px',
           width: '2px',
@@ -1185,7 +1185,9 @@ var Region = /*#__PURE__*/function () {
       this.element.addEventListener('mousedown', onDown);
       this.element.addEventListener('touchstart', onDown);
       document.body.addEventListener('mousemove', onMove);
-      document.body.addEventListener('touchmove', onMove);
+      document.body.addEventListener('touchmove', onMove, {
+        passive: false
+      });
       document.addEventListener('mouseup', onUp);
       document.body.addEventListener('touchend', onUp);
       this.on('remove', function () {