cloudinary-video-player 1.5.8 → 1.5.9

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+1.5.9 / 2021-11-02
+==================
+
+Fixes:
+--------
+Fix: Be able to go back if zoom into a video with an error.
+Fix: ie11 support fix
+
+Changes:
+----------
+Rename player interactionAreas config property to interactionDisplay
+
 1.5.8 / 2021-10-20
 ==================
 

package/dist/cld-video-player.js

@@ -3901,7 +3901,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.interactionAreaService = void 0;\n\nvar _video = _interopRequireDefault(__webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/video.es.js-exposed\"));\n\nvar _interactionArea = __webpack_require__(/*! ./interaction-area.const */ \"./components/interaction-area/interaction-area.const.js\");\n\nvar _interactionArea2 = __webpack_require__(/*! ./interaction-area.utils */ \"./components/interaction-area/interaction-area.utils.js\");\n\nvar _dom = __webpack_require__(/*! ../../utils/dom */ \"./utils/dom.js\");\n\nvar _time = __webpack_require__(/*! ../../utils/time */ \"./utils/time.js\");\n\nvar _object = __webpack_require__(/*! ../../utils/object */ \"./utils/object.js\");\n\nvar _typeInference = __webpack_require__(/*! ../../utils/type-inference */ \"./utils/type-inference.js\");\n\nvar _videoPlayer = __webpack_require__(/*! ../../video-player.utils */ \"./video-player.utils.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar interactionAreaService = function interactionAreaService(player, playerOptions, videojsOptions) {\n  var firstPlayed = false;\n  var isZoomed = false;\n  var currentTrack = null;\n  var unZoom = _typeInference.noop;\n\n  var shouldLayoutMessage = function shouldLayoutMessage() {\n    return (0, _interactionArea2.shouldShowAreaLayoutMessage)(videojsOptions.interactionAreas);\n  };\n\n  function isInteractionAreasEnabled() {\n    var enabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n    var interactionAreasConfig = getInteractionAreasConfig();\n    return enabled || interactionAreasConfig && interactionAreasConfig.enable;\n  }\n\n  function setAreasPositionListener() {\n    currentTrack && player.videojs.removeRemoteTextTrack(currentTrack);\n    var isEnabled = isInteractionAreasEnabled();\n    var interactionAreasConfig = getInteractionAreasConfig();\n\n    if (!isEnabled || isZoomed) {\n      return null;\n    }\n\n    if (Array.isArray(interactionAreasConfig.template)) {\n      addInteractionAreasItems(interactionAreasConfig.template);\n      setContainerSize();\n    } else {\n      var vttUrl = interactionAreasConfig.vttUrl || _interactionArea.TEMPLATE_INTERACTION_AREAS_VTT[interactionAreasConfig.template];\n\n      if (vttUrl) {\n        currentTrack = (0, _videoPlayer.addMetadataTrack)(player.videojs, vttUrl);\n        addCueListener(currentTrack);\n      }\n    }\n  }\n\n  function setGoBackButton() {\n    var button = (0, _dom.createElement)('div', {\n      'class': 'go-back-button'\n    });\n    button.addEventListener('click', function () {\n      unZoom();\n    }, false);\n    var tracksContainer = (0, _dom.createElement)('div', {\n      'class': _interactionArea.INTERACTION_AREAS_CONTAINER_CLASS_NAME\n    }, button);\n    (0, _interactionArea2.setInteractionAreasContainer)(player.videojs, tracksContainer);\n  }\n\n  function getInteractionAreasConfig() {\n    var _player$videojs$curre = player.videojs.currentSource(),\n        cldSrc = _player$videojs$curre.cldSrc;\n\n    return cldSrc && cldSrc.getInteractionAreas();\n  }\n\n  function removeLayoutMessage() {\n    (0, _interactionArea2.removeInteractionAreasContainer)(player.videojs);\n    setAreasPositionListener();\n    player.play();\n  }\n\n  function setLayoutMessage() {\n    if (!isInteractionAreasEnabled()) {\n      return;\n    }\n\n    if (shouldLayoutMessage()) {\n      var layoutMessageTimout = null;\n      var showItAgainCheckbox = (0, _object.get)(videojsOptions, 'interactionAreas.layout.showAgain', false);\n      player.pause();\n      (0, _interactionArea2.createInteractionAreaLayoutMessage)(player.videojs, function () {\n        clearTimeout(layoutMessageTimout);\n        removeLayoutMessage();\n      }, showItAgainCheckbox);\n\n      if (!showItAgainCheckbox) {\n        layoutMessageTimout = setTimeout(removeLayoutMessage, _interactionArea.CLOSE_INTERACTION_AREA_LAYOUT_DELAY);\n      }\n    } else {\n      removeLayoutMessage();\n    }\n  }\n\n  function init() {\n    if (isInteractionAreasEnabled()) {\n      player.videojs.el().classList.add('interaction-areas');\n      player.videojs.one('play', function () {\n        firstPlayed = true;\n        setLayoutMessage();\n      });\n      player.videojs.on('sourcechanged', function () {\n        firstPlayed && setAreasPositionListener();\n      });\n\n      var _setInteractionAreasContainerSize = (0, _time.throttle)(setContainerSize, 100);\n\n      player.videojs.on('fullscreenchange', function () {\n        // waiting for fullscreen will end\n        setTimeout(_setInteractionAreasContainerSize, 100);\n      });\n      var resizeDestroy = (0, _dom.addEventListener)(window, 'resize', setContainerSize, false);\n      player.videojs.on('dispose', resizeDestroy);\n    }\n\n    player.videojs.on('ended', function () {\n      unZoom();\n    });\n  }\n\n  function onZoom(src, newOption, item) {\n    var currentSource = player.videojs.currentSource();\n    var cldSrc = currentSource.cldSrc;\n    var currentSrcOptions = cldSrc.getInitOptions();\n    var option = newOption || {\n      transformation: currentSrcOptions.transformation.toOptions()\n    };\n    var transformation = !src && (0, _interactionArea2.getZoomTransformation)(player.videoElement, item);\n    var sourceOptions = transformation ? _video.default.mergeOptions({\n      transformation: transformation\n    }, option) : option;\n    var newSource = cldSrc.isRawUrl ? currentSource.src : {\n      publicId: cldSrc.publicId()\n    };\n    player.source(transformation ? {\n      publicId: cldSrc.publicId()\n    } : src, sourceOptions).play();\n    isZoomed = true;\n    setGoBackButton();\n\n    unZoom = function unZoom() {\n      if (isZoomed) {\n        isZoomed = false;\n        player.source(newSource, currentSrcOptions).play();\n      }\n    };\n  }\n\n  function onInteractionAreasClick(_ref) {\n    var event = _ref.event,\n        item = _ref.item,\n        index = _ref.index;\n    var interactionAreasConfig = getInteractionAreasConfig();\n    interactionAreasConfig.onClick && interactionAreasConfig.onClick({\n      item: item,\n      index: index,\n      event: event,\n      zoom: function zoom(source, option) {\n        onZoom(source, option, item);\n      }\n    });\n  }\n\n  function addInteractionAreasItems(interactionAreasData, previousInteractionAreasData) {\n    var durationTime = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;\n    var configs = {\n      playerOptions: playerOptions,\n      videojsOptions: videojsOptions\n    };\n\n    if (previousInteractionAreasData) {\n      (0, _interactionArea2.updateInteractionAreasItem)(player.videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onInteractionAreasClick);\n    } else {\n      var interactionAreasItems = interactionAreasData.map(function (item, index) {\n        return (0, _interactionArea2.getInteractionAreaItem)(configs, item, index, durationTime, function (event) {\n          onInteractionAreasClick({\n            event: event,\n            item: item,\n            index: index\n          });\n        });\n      });\n      (0, _interactionArea2.setInteractionAreasContainer)(player.videojs, (0, _dom.createElement)('div', {\n        'class': _interactionArea.INTERACTION_AREAS_CONTAINER_CLASS_NAME\n      }, interactionAreasItems));\n    }\n  }\n\n  function setContainerSize() {\n    if (isInteractionAreasEnabled()) {\n      (0, _interactionArea2.setInteractionAreasContainerSize)(player.videojs, player.videoElement);\n    }\n  }\n\n  function addCueListener(track) {\n    if (!track) {\n      return;\n    }\n\n    var previousTracksData = null;\n    track.addEventListener('cuechange', function () {\n      var activeCue = track.activeCues && track.activeCues[0];\n\n      if (activeCue) {\n        var durationTime = Math.max(Math.floor((activeCue.endTime - activeCue.startTime) * 1000), _interactionArea.DEFAULT_INTERACTION_ARE_TRANSITION);\n        var tracksData = JSON.parse(activeCue.text);\n        addInteractionAreasItems(tracksData, previousTracksData, durationTime);\n        !previousTracksData && setContainerSize();\n        previousTracksData = tracksData;\n      } else {\n        (0, _interactionArea2.removeInteractionAreasContainer)(player.videojs);\n        previousTracksData = null;\n      }\n    });\n  }\n\n  return {\n    init: init\n  };\n};\n\nexports.interactionAreaService = interactionAreaService;\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./components/interaction-area/interaction-area.service.js?");
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.interactionAreaService = void 0;\n\nvar _video = _interopRequireDefault(__webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/video.es.js-exposed\"));\n\nvar _interactionArea = __webpack_require__(/*! ./interaction-area.const */ \"./components/interaction-area/interaction-area.const.js\");\n\nvar _interactionArea2 = __webpack_require__(/*! ./interaction-area.utils */ \"./components/interaction-area/interaction-area.utils.js\");\n\nvar _dom = __webpack_require__(/*! ../../utils/dom */ \"./utils/dom.js\");\n\nvar _time = __webpack_require__(/*! ../../utils/time */ \"./utils/time.js\");\n\nvar _object = __webpack_require__(/*! ../../utils/object */ \"./utils/object.js\");\n\nvar _typeInference = __webpack_require__(/*! ../../utils/type-inference */ \"./utils/type-inference.js\");\n\nvar _videoPlayer = __webpack_require__(/*! ../../video-player.utils */ \"./video-player.utils.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar interactionAreaService = function interactionAreaService(player, playerOptions, videojsOptions) {\n  var firstPlayed = false;\n  var isZoomed = false;\n  var currentTrack = null;\n  var unZoom = _typeInference.noop;\n\n  var shouldLayoutMessage = function shouldLayoutMessage() {\n    return (0, _interactionArea2.shouldShowAreaLayoutMessage)(videojsOptions.interactionDisplay);\n  };\n\n  function isInteractionAreasEnabled() {\n    var enabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n    var interactionAreasConfig = getInteractionAreasConfig();\n    return enabled || interactionAreasConfig && interactionAreasConfig.enable;\n  }\n\n  function setAreasPositionListener() {\n    currentTrack && player.videojs.removeRemoteTextTrack(currentTrack);\n    var isEnabled = isInteractionAreasEnabled();\n    var interactionAreasConfig = getInteractionAreasConfig();\n\n    if (!isEnabled || isZoomed) {\n      return null;\n    }\n\n    if (Array.isArray(interactionAreasConfig.template)) {\n      addInteractionAreasItems(interactionAreasConfig.template);\n      setContainerSize();\n    } else {\n      var vttUrl = interactionAreasConfig.vttUrl || _interactionArea.TEMPLATE_INTERACTION_AREAS_VTT[interactionAreasConfig.template];\n\n      if (vttUrl) {\n        currentTrack = (0, _videoPlayer.addMetadataTrack)(player.videojs, vttUrl);\n        addCueListener(currentTrack);\n      }\n    }\n  }\n\n  function setGoBackButton() {\n    var button = (0, _dom.createElement)('div', {\n      'class': 'go-back-button'\n    });\n    button.addEventListener('click', function () {\n      unZoom();\n    }, false);\n    var tracksContainer = (0, _dom.createElement)('div', {\n      'class': _interactionArea.INTERACTION_AREAS_CONTAINER_CLASS_NAME\n    }, button);\n    (0, _interactionArea2.setInteractionAreasContainer)(player.videojs, tracksContainer);\n  }\n\n  function getInteractionAreasConfig() {\n    var _player$videojs$curre = player.videojs.currentSource(),\n        cldSrc = _player$videojs$curre.cldSrc;\n\n    return cldSrc && cldSrc.getInteractionAreas();\n  }\n\n  function removeLayoutMessage() {\n    (0, _interactionArea2.removeInteractionAreasContainer)(player.videojs);\n    setAreasPositionListener();\n    player.play();\n  }\n\n  function setLayoutMessage() {\n    if (!isInteractionAreasEnabled()) {\n      return;\n    }\n\n    if (shouldLayoutMessage()) {\n      var layoutMessageTimout = null;\n      var showItAgainCheckbox = (0, _object.get)(videojsOptions, 'interactionDisplay.layout.showAgain', false);\n      player.pause();\n      (0, _interactionArea2.createInteractionAreaLayoutMessage)(player.videojs, function () {\n        clearTimeout(layoutMessageTimout);\n        removeLayoutMessage();\n      }, showItAgainCheckbox);\n\n      if (!showItAgainCheckbox) {\n        layoutMessageTimout = setTimeout(removeLayoutMessage, _interactionArea.CLOSE_INTERACTION_AREA_LAYOUT_DELAY);\n      }\n    } else {\n      removeLayoutMessage();\n    }\n  }\n\n  function init() {\n    if (isInteractionAreasEnabled()) {\n      player.videojs.el().classList.add('interaction-areas');\n      player.videojs.one('play', function () {\n        firstPlayed = true;\n        setLayoutMessage();\n      });\n      player.videojs.on('sourcechanged', function () {\n        firstPlayed && setAreasPositionListener();\n      });\n\n      var _setInteractionAreasContainerSize = (0, _time.throttle)(setContainerSize, 100);\n\n      player.videojs.on('fullscreenchange', function () {\n        // waiting for fullscreen will end\n        setTimeout(_setInteractionAreasContainerSize, 100);\n      });\n      var resizeDestroy = (0, _dom.addEventListener)(window, 'resize', setContainerSize, false);\n      player.videojs.on('dispose', resizeDestroy);\n    }\n\n    player.videojs.on('ended', function () {\n      unZoom();\n    });\n  }\n\n  function onZoom(src, newOption, item) {\n    var currentSource = player.videojs.currentSource();\n    var cldSrc = currentSource.cldSrc;\n    var currentSrcOptions = cldSrc.getInitOptions();\n    var option = newOption || {\n      transformation: currentSrcOptions.transformation.toOptions()\n    };\n    var transformation = !src && (0, _interactionArea2.getZoomTransformation)(player.videoElement, item);\n    var sourceOptions = transformation ? _video.default.mergeOptions({\n      transformation: transformation\n    }, option) : option;\n    var newSource = cldSrc.isRawUrl ? currentSource.src : {\n      publicId: cldSrc.publicId()\n    };\n    player.source(transformation ? {\n      publicId: cldSrc.publicId()\n    } : src, sourceOptions).play();\n    isZoomed = true;\n    setGoBackButton();\n\n    unZoom = function unZoom() {\n      if (isZoomed) {\n        isZoomed = false;\n        player.source(newSource, currentSrcOptions).play();\n      }\n    };\n  }\n\n  function onInteractionAreasClick(_ref) {\n    var event = _ref.event,\n        item = _ref.item,\n        index = _ref.index;\n    var interactionAreasConfig = getInteractionAreasConfig();\n    interactionAreasConfig.onClick && interactionAreasConfig.onClick({\n      item: item,\n      index: index,\n      event: event,\n      zoom: function zoom(source, option) {\n        onZoom(source, option, item);\n      }\n    });\n  }\n\n  function addInteractionAreasItems(interactionAreasData, previousInteractionAreasData) {\n    var durationTime = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;\n    var configs = {\n      playerOptions: playerOptions,\n      videojsOptions: videojsOptions\n    };\n\n    if (previousInteractionAreasData) {\n      (0, _interactionArea2.updateInteractionAreasItem)(player.videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onInteractionAreasClick);\n    } else {\n      var interactionAreasItems = interactionAreasData.map(function (item, index) {\n        return (0, _interactionArea2.getInteractionAreaItem)(configs, item, index, durationTime, function (event) {\n          onInteractionAreasClick({\n            event: event,\n            item: item,\n            index: index\n          });\n        });\n      });\n      (0, _interactionArea2.setInteractionAreasContainer)(player.videojs, (0, _dom.createElement)('div', {\n        'class': _interactionArea.INTERACTION_AREAS_CONTAINER_CLASS_NAME\n      }, interactionAreasItems));\n    }\n  }\n\n  function setContainerSize() {\n    if (isInteractionAreasEnabled()) {\n      (0, _interactionArea2.setInteractionAreasContainerSize)(player.videojs, player.videoElement);\n    }\n  }\n\n  function addCueListener(track) {\n    if (!track) {\n      return;\n    }\n\n    var previousTracksData = null;\n    track.addEventListener('cuechange', function () {\n      var activeCue = track.activeCues && track.activeCues[0];\n\n      if (activeCue) {\n        var durationTime = Math.max(Math.floor((activeCue.endTime - activeCue.startTime) * 1000), _interactionArea.DEFAULT_INTERACTION_ARE_TRANSITION);\n        var tracksData = JSON.parse(activeCue.text);\n        addInteractionAreasItems(tracksData, previousTracksData, durationTime);\n        !previousTracksData && setContainerSize();\n        previousTracksData = tracksData;\n      } else {\n        (0, _interactionArea2.removeInteractionAreasContainer)(player.videojs);\n        previousTracksData = null;\n      }\n    });\n  }\n\n  return {\n    init: init\n  };\n};\n\nexports.interactionAreaService = interactionAreaService;\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./components/interaction-area/interaction-area.service.js?");
 
 /***/ }),
 
@@ -3913,7 +3913,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.setInteractionAreasContainerSize = exports.removeInteractionAreasContainer = exports.createInteractionAreaLayoutMessage = exports.shouldShowAreaLayoutMessage = exports.updateInteractionAreasItem = exports.setInteractionAreasContainer = exports.getZoomTransformation = exports.percentageToFixedValue = exports.getInteractionAreaItem = void 0;\n\nvar _dom = __webpack_require__(/*! ../../utils/dom */ \"./utils/dom.js\");\n\nvar _object = __webpack_require__(/*! ../../utils/object */ \"./utils/object.js\");\n\nvar _interactionArea = __webpack_require__(/*! ./interaction-area.const */ \"./components/interaction-area/interaction-area.const.js\");\n\nvar _typeInference = __webpack_require__(/*! ../../utils/type-inference */ \"./utils/type-inference.js\");\n\nvar _colors = __webpack_require__(/*! ../../plugins/colors */ \"./plugins/colors/index.js\");\n\nvar _array = __webpack_require__(/*! ../../utils/array */ \"./utils/array.js\");\n\nvar _themedButton = __webpack_require__(/*! ../themeButton/themedButton */ \"./components/themeButton/themedButton.js\");\n\nvar _themedButton2 = __webpack_require__(/*! ../themeButton/themedButton.const */ \"./components/themeButton/themedButton.const.js\");\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar getInteractionAreaItemId = function getInteractionAreaItemId(item, index) {\n  return item.id || item.type || \"id_\".concat(index);\n};\n\nvar getInteractionAreaItem = function getInteractionAreaItem(_ref, item, index, durationTime, onClick) {\n  var playerOptions = _ref.playerOptions,\n      videojsOptions = _ref.videojsOptions;\n  var defaultColor = (0, _colors.getDefaultPlayerColor)(videojsOptions);\n  var accentColor = playerOptions && playerOptions.colors ? playerOptions.colors.accent : defaultColor.accent; // theme = 'pulsing' / 'shadowed'\n\n  var theme = (0, _object.get)(videojsOptions, 'interactionAreas.theme.template', _interactionArea.INTERACTION_AREAS_THEME.PULSING);\n  return (0, _dom.elementsCreator)({\n    tag: 'div',\n    attr: {\n      class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-item theme-\").concat(theme),\n      'data-id': getInteractionAreaItemId(item, index)\n    },\n    style: {\n      left: \"\".concat(item.left, \"%\"),\n      top: \"\".concat(item.top, \"%\"),\n      width: \"\".concat(item.width, \"%\"),\n      height: \"\".concat(item.height, \"%\"),\n      transitionDuration: \"\".concat(durationTime, \"ms\")\n    },\n    event: {\n      name: 'click',\n      callback: onClick\n    },\n    children: [{\n      tag: 'div',\n      attr: {\n        class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-area-marker\")\n      },\n      children: [{\n        tag: 'div',\n        attr: {\n          class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-marker-shadow\")\n        },\n        style: _defineProperty({}, theme === _interactionArea.INTERACTION_AREAS_THEME.SHADOWED ? 'backgroundColor' : 'borderColor', accentColor)\n      }, {\n        tag: 'div',\n        attr: {\n          class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-marker-main\")\n        },\n        style: {\n          borderColor: accentColor\n        }\n      }]\n    }]\n  });\n};\n\nexports.getInteractionAreaItem = getInteractionAreaItem;\n\nvar percentageToFixedValue = function percentageToFixedValue(outOf, value) {\n  return outOf / (100 / +value);\n};\n\nexports.percentageToFixedValue = percentageToFixedValue;\n\nvar getZoomTransformation = function getZoomTransformation(videoElement, interactionAreaItem) {\n  var videoHeight = videoElement.videoHeight,\n      videoWidth = videoElement.videoWidth;\n  var itemX = percentageToFixedValue(videoWidth, interactionAreaItem.left);\n  var itemY = percentageToFixedValue(videoHeight, interactionAreaItem.top);\n  var itemWidth = percentageToFixedValue(videoWidth, interactionAreaItem.width);\n  var itemHeight = percentageToFixedValue(videoHeight, interactionAreaItem.height);\n  var videoAspectRatio = videoWidth / videoHeight;\n  var itemAspectRatio = itemWidth / itemHeight;\n  var width = Math.round(itemAspectRatio > 1 || videoAspectRatio > 1 ? itemHeight * itemAspectRatio : itemWidth);\n  var height = Math.round(width / videoAspectRatio);\n  var x = Math.round(itemX - (width - itemWidth) / 2);\n  var y = Math.round(itemY - (height - itemHeight) / 2);\n  return {\n    width: width,\n    height: height,\n    x: Math.min(Math.max(x, 0), videoWidth - width),\n    y: Math.min(Math.max(y, 0), videoHeight - height),\n    crop: 'crop'\n  };\n};\n\nexports.getZoomTransformation = getZoomTransformation;\n\nvar setInteractionAreasContainer = function setInteractionAreasContainer(videojs, newInteractionAreasContainer) {\n  var currentInteractionAreasContainer = getInteractionAreasContainer(videojs);\n\n  if (currentInteractionAreasContainer) {\n    currentInteractionAreasContainer.replaceWith(newInteractionAreasContainer);\n  } else {\n    // do not use element.append for ie11 support\n    videojs.el().appendChild(newInteractionAreasContainer);\n  }\n};\n\nexports.setInteractionAreasContainer = setInteractionAreasContainer;\n\nvar getInteractionAreaElementById = function getInteractionAreaElementById(interactionAreasContainer, item, index) {\n  return interactionAreasContainer.querySelector(\"[data-id=\".concat(getInteractionAreaItemId(item, index), \"]\"));\n};\n\nvar updateInteractionAreasItem = function updateInteractionAreasItem(videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onClick) {\n  var interactionAreasContainer = getInteractionAreasContainer(videojs);\n  (0, _array.forEach)(interactionAreasData, function (item, index) {\n    var itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);\n    var itemId = getInteractionAreaItemId(item);\n    var isExistItem = (0, _array.some)(previousInteractionAreasData, function (i) {\n      return getInteractionAreaItemId(i) === itemId;\n    }); // in case the element of the item is in the dom and exist in the previous data , it update the element position\n\n    if (isExistItem && itemElement) {\n      (0, _dom.styleElement)(itemElement, {\n        left: \"\".concat(item.left, \"%\"),\n        top: \"\".concat(item.top, \"%\"),\n        width: \"\".concat(item.width, \"%\"),\n        height: \"\".concat(item.height, \"%\"),\n        transitionDuration: \"\".concat(durationTime, \"ms\")\n      }); // if the element did not exist before , not in the dom and not in the previous data , it add a new element\n    } else if (!isExistItem && !itemElement) {\n      // do not use element.append for ie11 support\n      interactionAreasContainer.appendChild(getInteractionAreaItem(configs, item, index, durationTime, function (event) {\n        onClick({\n          event: event,\n          item: item,\n          index: index\n        });\n      }));\n    }\n  }); // checking the previous data for element that should be removed if not exist in the new data object.\n\n  (0, _array.forEach)(previousInteractionAreasData, function (item, index) {\n    var itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);\n    var itemId = getInteractionAreaItemId(item);\n    var shouldBeRemoved = !(0, _array.some)(interactionAreasData, function (i) {\n      return getInteractionAreaItemId(i) === itemId;\n    });\n\n    if (itemElement && shouldBeRemoved) {\n      // do not use element.remove for ie11 support\n      itemElement.parentNode.removeChild(itemElement);\n    }\n  });\n};\n\nexports.updateInteractionAreasItem = updateInteractionAreasItem;\n\nvar shouldShowAreaLayoutMessage = function shouldShowAreaLayoutMessage(interactionAreasConfig) {\n  var isLayoutEnabled = (0, _object.get)(interactionAreasConfig, 'layout.enable', true);\n  return isLayoutEnabled && localStorage.getItem(_interactionArea.INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME) !== 'true';\n};\n\nexports.shouldShowAreaLayoutMessage = shouldShowAreaLayoutMessage;\n\nvar onClickInteractionAreaLayoutClick = function onClickInteractionAreaLayoutClick(checked) {\n  var onClick = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _typeInference.noop;\n  localStorage.setItem(_interactionArea.INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME, JSON.parse(checked));\n  onClick();\n};\n\nvar createInteractionAreaLayoutMessage = function createInteractionAreaLayoutMessage(videojs, onClick) {\n  var showItAgainCheckbox = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;\n  var checked = false;\n  var id = \"checkbox_\".concat(Math.round(Math.random() * 10000));\n  var tracksContainer = (0, _dom.elementsCreator)({\n    tag: 'div',\n    attr: {\n      class: \"\".concat(_interactionArea.INTERACTION_AREAS_CONTAINER_CLASS_NAME, \" \").concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message \").concat(showItAgainCheckbox ? '' : 'clickable')\n    },\n    onClick: !showItAgainCheckbox ? function () {\n      return onClickInteractionAreaLayoutClick(checked, onClick);\n    } : null,\n    children: [{\n      tag: 'img',\n      attr: {\n        class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-icon\"),\n        src: _interactionArea.INTERACTION_AREA_HAND_ICON\n      }\n    }, {\n      tag: 'h3',\n      attr: {\n        class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message-title\")\n      },\n      children: 'Tap on dots to zoom for a product.'\n    }, (0, _themedButton.themedButton)({\n      text: 'Got it',\n      theme: _themedButton2.BUTTON_THEME.TRANSPARENT_WHITE,\n      loadingDelay: showItAgainCheckbox ? 0 : _interactionArea.CLOSE_INTERACTION_AREA_LAYOUT_DELAY,\n      onClick: showItAgainCheckbox ? function () {\n        return onClickInteractionAreaLayoutClick(checked, onClick);\n      } : null\n    }), showItAgainCheckbox && {\n      tag: 'div',\n      attr: {\n        class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message-do-not-show\")\n      },\n      children: [{\n        tag: 'input',\n        attr: {\n          type: 'checkbox',\n          class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message-checkbox\"),\n          id: id\n        },\n        event: {\n          name: 'input',\n          callback: function callback(event) {\n            checked = event.target.checked;\n          }\n        }\n      }, {\n        tag: 'label',\n        attr: {\n          class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message-checkbox-title\"),\n          for: id\n        },\n        children: 'Don׳t show it again'\n      }]\n    }].filter(function (i) {\n      return i;\n    })\n  });\n  setInteractionAreasContainer(videojs, tracksContainer);\n};\n\nexports.createInteractionAreaLayoutMessage = createInteractionAreaLayoutMessage;\n\nvar getInteractionAreasContainer = function getInteractionAreasContainer(videojs) {\n  return videojs.el().querySelector(\".\".concat(_interactionArea.INTERACTION_AREAS_CONTAINER_CLASS_NAME));\n};\n\nvar removeInteractionAreasContainer = function removeInteractionAreasContainer(videojs) {\n  var interactionAreasContainer = getInteractionAreasContainer(videojs); // do not use element.remove for ie11 support\n\n  interactionAreasContainer && interactionAreasContainer.parentNode.removeChild(interactionAreasContainer);\n};\n\nexports.removeInteractionAreasContainer = removeInteractionAreasContainer;\n\nvar setInteractionAreasContainerSize = function setInteractionAreasContainerSize(videojs, videoElement) {\n  var interactionAreasContainer = getInteractionAreasContainer(videojs);\n\n  if (!interactionAreasContainer) {\n    return;\n  }\n\n  var videoHeight = videoElement.videoHeight,\n      videoWidth = videoElement.videoWidth;\n  var videoAspectRatio = videoWidth / videoHeight;\n  var width = videoAspectRatio * videoElement.clientHeight;\n  interactionAreasContainer.style.width = \"\".concat(videoElement.clientWidth < width ? '100%' : width, \"px\");\n  interactionAreasContainer.style.height = videoElement.clientWidth < width ? \"\".concat(videoElement.clientWidth / videoAspectRatio, \"px\") : '100%';\n};\n\nexports.setInteractionAreasContainerSize = setInteractionAreasContainerSize;\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./components/interaction-area/interaction-area.utils.js?");
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.setInteractionAreasContainerSize = exports.removeInteractionAreasContainer = exports.createInteractionAreaLayoutMessage = exports.shouldShowAreaLayoutMessage = exports.updateInteractionAreasItem = exports.setInteractionAreasContainer = exports.getZoomTransformation = exports.percentageToFixedValue = exports.getInteractionAreaItem = void 0;\n\nvar _dom = __webpack_require__(/*! ../../utils/dom */ \"./utils/dom.js\");\n\nvar _object = __webpack_require__(/*! ../../utils/object */ \"./utils/object.js\");\n\nvar _interactionArea = __webpack_require__(/*! ./interaction-area.const */ \"./components/interaction-area/interaction-area.const.js\");\n\nvar _typeInference = __webpack_require__(/*! ../../utils/type-inference */ \"./utils/type-inference.js\");\n\nvar _colors = __webpack_require__(/*! ../../plugins/colors */ \"./plugins/colors/index.js\");\n\nvar _array = __webpack_require__(/*! ../../utils/array */ \"./utils/array.js\");\n\nvar _themedButton = __webpack_require__(/*! ../themeButton/themedButton */ \"./components/themeButton/themedButton.js\");\n\nvar _themedButton2 = __webpack_require__(/*! ../themeButton/themedButton.const */ \"./components/themeButton/themedButton.const.js\");\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar getInteractionAreaItemId = function getInteractionAreaItemId(item, index) {\n  return item.id || item.type || \"id_\".concat(index);\n};\n\nvar getInteractionAreaItem = function getInteractionAreaItem(_ref, item, index, durationTime, onClick) {\n  var playerOptions = _ref.playerOptions,\n      videojsOptions = _ref.videojsOptions;\n  var defaultColor = (0, _colors.getDefaultPlayerColor)(videojsOptions);\n  var accentColor = playerOptions && playerOptions.colors ? playerOptions.colors.accent : defaultColor.accent; // theme = 'pulsing' / 'shadowed'\n\n  var theme = (0, _object.get)(videojsOptions, 'interactionDisplay.theme.template', _interactionArea.INTERACTION_AREAS_THEME.PULSING);\n  return (0, _dom.elementsCreator)({\n    tag: 'div',\n    attr: {\n      class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-item theme-\").concat(theme),\n      'data-id': getInteractionAreaItemId(item, index)\n    },\n    style: {\n      left: \"\".concat(item.left, \"%\"),\n      top: \"\".concat(item.top, \"%\"),\n      width: \"\".concat(item.width, \"%\"),\n      height: \"\".concat(item.height, \"%\"),\n      transitionDuration: \"\".concat(durationTime, \"ms\")\n    },\n    event: {\n      name: 'click',\n      callback: onClick\n    },\n    children: [{\n      tag: 'div',\n      attr: {\n        class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-area-marker\")\n      },\n      children: [{\n        tag: 'div',\n        attr: {\n          class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-marker-shadow\")\n        },\n        style: _defineProperty({}, theme === _interactionArea.INTERACTION_AREAS_THEME.SHADOWED ? 'backgroundColor' : 'borderColor', accentColor)\n      }, {\n        tag: 'div',\n        attr: {\n          class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-marker-main\")\n        },\n        style: {\n          borderColor: accentColor\n        }\n      }]\n    }]\n  });\n};\n\nexports.getInteractionAreaItem = getInteractionAreaItem;\n\nvar percentageToFixedValue = function percentageToFixedValue(outOf, value) {\n  return outOf / (100 / +value);\n};\n\nexports.percentageToFixedValue = percentageToFixedValue;\n\nvar getZoomTransformation = function getZoomTransformation(videoElement, interactionAreaItem) {\n  var videoHeight = videoElement.videoHeight,\n      videoWidth = videoElement.videoWidth;\n  var itemX = percentageToFixedValue(videoWidth, interactionAreaItem.left);\n  var itemY = percentageToFixedValue(videoHeight, interactionAreaItem.top);\n  var itemWidth = percentageToFixedValue(videoWidth, interactionAreaItem.width);\n  var itemHeight = percentageToFixedValue(videoHeight, interactionAreaItem.height);\n  var videoAspectRatio = videoWidth / videoHeight;\n  var itemAspectRatio = itemWidth / itemHeight;\n  var width = Math.round(itemAspectRatio > 1 || videoAspectRatio > 1 ? itemHeight * itemAspectRatio : itemWidth);\n  var height = Math.round(width / videoAspectRatio);\n  var x = Math.round(itemX - (width - itemWidth) / 2);\n  var y = Math.round(itemY - (height - itemHeight) / 2);\n  return {\n    width: width,\n    height: height,\n    x: Math.min(Math.max(x, 0), videoWidth - width),\n    y: Math.min(Math.max(y, 0), videoHeight - height),\n    crop: 'crop'\n  };\n};\n\nexports.getZoomTransformation = getZoomTransformation;\n\nvar setInteractionAreasContainer = function setInteractionAreasContainer(videojs, newInteractionAreasContainer) {\n  var currentInteractionAreasContainer = getInteractionAreasContainer(videojs);\n\n  if (currentInteractionAreasContainer) {\n    currentInteractionAreasContainer.replaceWith(newInteractionAreasContainer);\n  } else {\n    // do not use element.append for ie11 support\n    videojs.el().appendChild(newInteractionAreasContainer);\n  }\n};\n\nexports.setInteractionAreasContainer = setInteractionAreasContainer;\n\nvar getInteractionAreaElementById = function getInteractionAreaElementById(interactionAreasContainer, item, index) {\n  return interactionAreasContainer.querySelector(\"[data-id=\".concat(getInteractionAreaItemId(item, index), \"]\"));\n};\n\nvar updateInteractionAreasItem = function updateInteractionAreasItem(videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onClick) {\n  var interactionAreasContainer = getInteractionAreasContainer(videojs);\n  (0, _array.forEach)(interactionAreasData, function (item, index) {\n    var itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);\n    var itemId = getInteractionAreaItemId(item);\n    var isExistItem = (0, _array.some)(previousInteractionAreasData, function (i) {\n      return getInteractionAreaItemId(i) === itemId;\n    }); // in case the element of the item is in the dom and exist in the previous data , it update the element position\n\n    if (isExistItem && itemElement) {\n      (0, _dom.styleElement)(itemElement, {\n        left: \"\".concat(item.left, \"%\"),\n        top: \"\".concat(item.top, \"%\"),\n        width: \"\".concat(item.width, \"%\"),\n        height: \"\".concat(item.height, \"%\"),\n        transitionDuration: \"\".concat(durationTime, \"ms\")\n      }); // if the element did not exist before , not in the dom and not in the previous data , it add a new element\n    } else if (!isExistItem && !itemElement) {\n      // do not use element.append for ie11 support\n      interactionAreasContainer.appendChild(getInteractionAreaItem(configs, item, index, durationTime, function (event) {\n        onClick({\n          event: event,\n          item: item,\n          index: index\n        });\n      }));\n    }\n  }); // checking the previous data for element that should be removed if not exist in the new data object.\n\n  (0, _array.forEach)(previousInteractionAreasData, function (item, index) {\n    var itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);\n    var itemId = getInteractionAreaItemId(item);\n    var shouldBeRemoved = !(0, _array.some)(interactionAreasData, function (i) {\n      return getInteractionAreaItemId(i) === itemId;\n    });\n\n    if (itemElement && shouldBeRemoved) {\n      // do not use element.remove for ie11 support\n      itemElement.parentNode.removeChild(itemElement);\n    }\n  });\n};\n\nexports.updateInteractionAreasItem = updateInteractionAreasItem;\n\nvar shouldShowAreaLayoutMessage = function shouldShowAreaLayoutMessage(interactionAreasConfig) {\n  var isLayoutEnabled = (0, _object.get)(interactionAreasConfig, 'layout.enable', true);\n  return isLayoutEnabled && localStorage.getItem(_interactionArea.INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME) !== 'true';\n};\n\nexports.shouldShowAreaLayoutMessage = shouldShowAreaLayoutMessage;\n\nvar onClickInteractionAreaLayoutClick = function onClickInteractionAreaLayoutClick(checked) {\n  var onClick = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _typeInference.noop;\n  localStorage.setItem(_interactionArea.INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME, JSON.parse(checked));\n  onClick();\n};\n\nvar createInteractionAreaLayoutMessage = function createInteractionAreaLayoutMessage(videojs, onClick) {\n  var showItAgainCheckbox = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;\n  var checked = false;\n  var id = \"checkbox_\".concat(Math.round(Math.random() * 10000));\n  var tracksContainer = (0, _dom.elementsCreator)({\n    tag: 'div',\n    attr: {\n      class: \"\".concat(_interactionArea.INTERACTION_AREAS_CONTAINER_CLASS_NAME, \" \").concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message \").concat(showItAgainCheckbox ? '' : 'clickable')\n    },\n    onClick: !showItAgainCheckbox ? function () {\n      return onClickInteractionAreaLayoutClick(checked, onClick);\n    } : null,\n    children: [{\n      tag: 'img',\n      attr: {\n        class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-icon\"),\n        src: _interactionArea.INTERACTION_AREA_HAND_ICON\n      }\n    }, {\n      tag: 'h3',\n      attr: {\n        class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message-title\")\n      },\n      children: 'Tap on dots to zoom for a product.'\n    }, (0, _themedButton.themedButton)({\n      text: 'Got it',\n      theme: _themedButton2.BUTTON_THEME.TRANSPARENT_WHITE,\n      loadingDelay: showItAgainCheckbox ? 0 : _interactionArea.CLOSE_INTERACTION_AREA_LAYOUT_DELAY,\n      onClick: showItAgainCheckbox ? function () {\n        return onClickInteractionAreaLayoutClick(checked, onClick);\n      } : null\n    }), showItAgainCheckbox && {\n      tag: 'div',\n      attr: {\n        class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message-do-not-show\")\n      },\n      children: [{\n        tag: 'input',\n        attr: {\n          type: 'checkbox',\n          class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message-checkbox\"),\n          id: id\n        },\n        event: {\n          name: 'input',\n          callback: function callback(event) {\n            checked = event.target.checked;\n          }\n        }\n      }, {\n        tag: 'label',\n        attr: {\n          class: \"\".concat(_interactionArea.INTERACTION_AREAS_PREFIX, \"-layout-message-checkbox-title\"),\n          for: id\n        },\n        children: 'Don׳t show it again'\n      }]\n    }].filter(function (i) {\n      return i;\n    })\n  });\n  setInteractionAreasContainer(videojs, tracksContainer);\n};\n\nexports.createInteractionAreaLayoutMessage = createInteractionAreaLayoutMessage;\n\nvar getInteractionAreasContainer = function getInteractionAreasContainer(videojs) {\n  return videojs.el().querySelector(\".\".concat(_interactionArea.INTERACTION_AREAS_CONTAINER_CLASS_NAME));\n};\n\nvar removeInteractionAreasContainer = function removeInteractionAreasContainer(videojs) {\n  var interactionAreasContainer = getInteractionAreasContainer(videojs); // do not use element.remove for ie11 support\n\n  interactionAreasContainer && interactionAreasContainer.parentNode.removeChild(interactionAreasContainer);\n};\n\nexports.removeInteractionAreasContainer = removeInteractionAreasContainer;\n\nvar setInteractionAreasContainerSize = function setInteractionAreasContainerSize(videojs, videoElement) {\n  var interactionAreasContainer = getInteractionAreasContainer(videojs);\n\n  if (!interactionAreasContainer) {\n    return;\n  }\n\n  var videoHeight = videoElement.videoHeight,\n      videoWidth = videoElement.videoWidth;\n  var videoAspectRatio = videoWidth / videoHeight;\n  var width = videoAspectRatio * videoElement.clientHeight;\n  interactionAreasContainer.style.width = \"\".concat(videoElement.clientWidth < width ? '100%' : width, \"px\");\n  interactionAreasContainer.style.height = videoElement.clientWidth < width ? \"\".concat(videoElement.clientWidth / videoAspectRatio, \"px\") : '100%';\n};\n\nexports.setInteractionAreasContainerSize = setInteractionAreasContainerSize;\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./components/interaction-area/interaction-area.utils.js?");
 
 /***/ }),
 
@@ -4525,7 +4525,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = _default;\nexports.CONSTRUCTOR_PARAMS = void 0;\n\nvar _cloudinaryCore = _interopRequireDefault(__webpack_require__(/*! cloudinary-core */ \"cloudinary-core\"));\n\nvar _video = _interopRequireDefault(__webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/video.es.js-exposed\"));\n\nvar _mixin2 = __webpack_require__(/*! utils/mixin */ \"./utils/mixin.js\");\n\nvar _applyWithProps = __webpack_require__(/*! utils/apply-with-props */ \"./utils/apply-with-props.js\");\n\nvar _slicing = __webpack_require__(/*! utils/slicing */ \"./utils/slicing.js\");\n\nvar _cloudinary = __webpack_require__(/*! utils/cloudinary */ \"./utils/cloudinary.js\");\n\nvar _assign = __webpack_require__(/*! utils/assign */ \"./utils/assign.js\");\n\nvar _common = __webpack_require__(/*! ./common */ \"./plugins/cloudinary/common.js\");\n\nvar _playlistable = _interopRequireDefault(__webpack_require__(/*! mixins/playlistable */ \"./mixins/playlistable.js\"));\n\nvar _videoSource = _interopRequireDefault(__webpack_require__(/*! ./models/video-source/video-source */ \"./plugins/cloudinary/models/video-source/video-source.js\"));\n\nvar _eventHandlerRegistry = _interopRequireDefault(__webpack_require__(/*! ./event-handler-registry */ \"./plugins/cloudinary/event-handler-registry.js\"));\n\nvar _audioSource = _interopRequireDefault(__webpack_require__(/*! ./models/audio-source/audio-source */ \"./plugins/cloudinary/models/audio-source/audio-source.js\"));\n\nvar _typeInference = __webpack_require__(/*! ../../utils/type-inference */ \"./utils/type-inference.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _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); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nvar DEFAULT_PARAMS = {\n  transformation: {},\n  sourceTypes: [],\n  sourceTransformation: [],\n  posterOptions: {}\n};\nvar CONSTRUCTOR_PARAMS = ['cloudinaryConfig', 'transformation', 'sourceTypes', 'sourceTransformation', 'posterOptions', 'autoShowRecommendations'];\nexports.CONSTRUCTOR_PARAMS = CONSTRUCTOR_PARAMS;\n\nvar CloudinaryContext = /*#__PURE__*/function (_mixin) {\n  _inherits(CloudinaryContext, _mixin);\n\n  var _super = _createSuper(CloudinaryContext);\n\n  function CloudinaryContext(player) {\n    var _this;\n\n    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n    _classCallCheck(this, CloudinaryContext);\n\n    _this = _super.call(this, player, options);\n    _this.player = player;\n    options = (0, _assign.assign)({}, DEFAULT_PARAMS, options);\n    var _source = null;\n    var _sources = null;\n    var _lastSource = null;\n    var _lastPlaylist = null;\n    var _posterOptions = null;\n    var _cloudinaryConfig = null;\n    var _transformation = null;\n    var _sourceTypes = null;\n    var _sourceTransformation = null;\n    var _chainTarget = options.chainTarget;\n    var _playerEvents = null;\n    var _recommendations = null;\n    var _autoShowRecommendations = false;\n\n    _this.source = function (source) {\n      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n      options = (0, _assign.assign)({}, options);\n\n      if (!source) {\n        return _source;\n      }\n\n      var src = null;\n\n      if (source instanceof _videoSource.default) {\n        src = source;\n      } else {\n        var _normalizeOptions = (0, _common.normalizeOptions)(source, options),\n            publicId = _normalizeOptions.publicId,\n            _options = _normalizeOptions.options;\n\n        src = _this.buildSource(publicId, _options);\n      }\n\n      if (src.recommendations()) {\n        var recommendations = src.recommendations();\n        var itemBuilder = null;\n        var disableAutoShow = false;\n\n        if (options.recommendationOptions) {\n          var _sliceAndUnsetPropert = (0, _slicing.sliceAndUnsetProperties)(options.recommendationOptions, 'disableAutoShow', 'itemBuilder');\n\n          disableAutoShow = _sliceAndUnsetPropert.disableAutoShow;\n          itemBuilder = _sliceAndUnsetPropert.itemBuilder;\n        }\n\n        setRecommendations(recommendations, {\n          disableAutoShow: disableAutoShow,\n          itemBuilder: itemBuilder\n        });\n      } else {\n        unsetRecommendations();\n      }\n\n      _source = src;\n\n      if (!options.skipRefresh) {\n        refresh();\n      }\n\n      _this.player.trigger('cldsourcechanged', {\n        source: src\n      });\n\n      return _chainTarget;\n    };\n\n    _this.buildSource = function (publicId) {\n      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n      var builtSrc = null;\n\n      var _normalizeOptions2 = (0, _common.normalizeOptions)(publicId, options);\n\n      publicId = _normalizeOptions2.publicId;\n      options = _normalizeOptions2.options;\n      options.cloudinaryConfig = (0, _common.mergeCloudinaryConfig)(_this.cloudinaryConfig(), options.cloudinaryConfig || {});\n      options.transformation = (0, _common.mergeTransformation)(_this.transformation(), options.transformation || {});\n      options.sourceTransformation = options.sourceTransformation || _this.sourceTransformation();\n      options.sourceTypes = options.sourceTypes || _this.sourceTypes();\n      options.poster = options.poster || posterOptionsForCurrent();\n      options.queryParams = options.usageReport ? {\n        _s: \"vp-\".concat(\"1.5.8\")\n      } : {};\n\n      if (options.sourceTypes.indexOf('audio') > -1) {\n        builtSrc = new _audioSource.default(publicId, options);\n      } else {\n        builtSrc = new _videoSource.default(publicId, options);\n      }\n\n      return builtSrc;\n    };\n\n    _this.posterOptions = function (options) {\n      if (!options) {\n        return _posterOptions;\n      }\n\n      _posterOptions = options;\n      return _chainTarget;\n    };\n\n    _this.cloudinaryConfig = function (config) {\n      if (!config) {\n        return _cloudinaryConfig;\n      }\n\n      _cloudinaryConfig = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Cloudinary, config);\n      return _chainTarget;\n    };\n\n    _this.transformation = function (trans) {\n      if (!trans) {\n        return _transformation;\n      }\n\n      _transformation = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Transformation, trans);\n      return _chainTarget;\n    };\n\n    _this.sourceTypes = function (types) {\n      if (!types) {\n        return _sourceTypes;\n      }\n\n      _sourceTypes = types;\n      return _chainTarget;\n    };\n\n    _this.getCurrentSources = function () {\n      return _sources;\n    };\n\n    _this.sourceTransformation = function (trans) {\n      if (!trans) {\n        return _sourceTransformation;\n      }\n\n      _sourceTransformation = trans;\n      return _chainTarget;\n    };\n\n    _this.on = function () {\n      var _playerEvents2;\n\n      return (_playerEvents2 = _playerEvents).on.apply(_playerEvents2, arguments);\n    };\n\n    _this.one = function () {\n      var _playerEvents3;\n\n      return (_playerEvents3 = _playerEvents).one.apply(_playerEvents3, arguments);\n    };\n\n    _this.off = function () {\n      var _playerEvents4;\n\n      return (_playerEvents4 = _playerEvents).off.apply(_playerEvents4, arguments);\n    };\n\n    _this.autoShowRecommendations = function (autoShow) {\n      if (autoShow === undefined) {\n        return _autoShowRecommendations;\n      }\n\n      _autoShowRecommendations = autoShow;\n      return _chainTarget;\n    };\n\n    _this.dispose = function () {\n      if (_this.playlist()) {\n        _this.disposePlaylist();\n      }\n\n      unsetRecommendations();\n      _source = undefined;\n\n      _playerEvents.removeAllListeners();\n    };\n\n    var setRecommendations = function setRecommendations(recommendations, _ref) {\n      var _ref$disableAutoShow = _ref.disableAutoShow,\n          disableAutoShow = _ref$disableAutoShow === void 0 ? false : _ref$disableAutoShow,\n          _ref$itemBuilder = _ref.itemBuilder,\n          itemBuilder = _ref$itemBuilder === void 0 ? null : _ref$itemBuilder;\n      unsetRecommendations();\n\n      if (!Array.isArray(recommendations) && typeof recommendations !== 'function' && !recommendations.then) {\n        throw new Error('\"recommendations\" must be either an array or a function');\n      }\n\n      _recommendations = {};\n\n      itemBuilder = itemBuilder || function (source) {\n        return {\n          source: source instanceof _videoSource.default ? source : _this.buildSource(source),\n          action: function action() {\n            return _this.source(source);\n          }\n        };\n      };\n\n      _recommendations.sourceChangedHandler = function () {\n        var trigger = function trigger(sources) {\n          if (typeof sources !== 'undefined' && sources.length > 0) {\n            var items = sources.map(function (_source) {\n              return itemBuilder(_source);\n            });\n\n            _this.player.trigger('recommendationschanged', {\n              items: items\n            });\n          } else {\n            _this.player.trigger('recommendationsnoshow');\n          }\n\n          _recommendations.sources = sources;\n        };\n\n        if ((0, _typeInference.isFunction)(recommendations)) {\n          trigger(recommendations());\n        } else if (recommendations.then) {\n          recommendations.then(trigger);\n        } else {\n          trigger(recommendations);\n        }\n      };\n\n      _this.one('cldsourcechanged', _recommendations.sourceChangedHandler);\n\n      _recommendations.endedHandler = function () {\n        if (!disableAutoShow && _this.autoShowRecommendations()) {\n          _this.player.trigger('recommendationsshow');\n        }\n      };\n\n      _this.on('ended', _recommendations.endedHandler);\n    };\n\n    var unsetRecommendations = function unsetRecommendations() {\n      if (_recommendations) {\n        _this.off('cldsourcechanged', _recommendations.sourceChangedHandler);\n\n        _this.off('ended', _recommendations.endedHandler);\n\n        delete _recommendations.endedHandler;\n        delete _recommendations.sourceChangedHandler;\n      }\n\n      _recommendations = null;\n    };\n\n    var refresh = function refresh() {\n      var src = _this.source();\n\n      if (src.poster()) {\n        _this.player.poster(src.poster().url());\n      }\n\n      _sources = src.generateSources().reduce(function (srcs, src) {\n        if (src.isAdaptive) {\n          var codec = src.type.split('; ')[1] || null;\n\n          if (codec && 'MediaSource' in window) {\n            var parts = src.type.split('; ');\n            var typeStr = \"video/mp4; \".concat(parts[1] || '');\n            var canPlay = testCanPlayTypeAndTypeSupported(typeStr);\n\n            if (_video.default.browser.IS_ANY_SAFARI) {\n              // work around safari saying it cant play h265\n              src.type = \"\".concat(parts[0], \"; \").concat((0, _common.codecShorthandTrans)('h264'));\n            }\n\n            if (canPlay) {\n              srcs.push(src);\n            }\n          } else {\n            srcs.push(src);\n          }\n        } else {\n          srcs.push(src);\n        }\n\n        return srcs;\n      }, []);\n\n      _this.player.src(_sources);\n\n      _lastSource = src;\n      _lastPlaylist = _this.playlist();\n    };\n\n    var testCanPlayTypeAndTypeSupported = function testCanPlayTypeAndTypeSupported(codec) {\n      var v = document.createElement('video');\n      return v.canPlayType(codec) || 'MediaSource' in window && MediaSource.isTypeSupported(codec);\n    };\n\n    var posterOptionsForCurrent = function posterOptionsForCurrent() {\n      var opts = (0, _assign.assign)({}, _this.posterOptions());\n\n      if (opts.transformation) {\n        if ((opts.transformation.width || opts.transformation.height) && !opts.transformation.crop) {\n          opts.transformation.crop = 'scale';\n        }\n      }\n\n      opts.transformation = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Transformation, opts.transformation || {}); // Set poster dimensions to player actual size.\n      // (unless they were explicitly set via `posterOptions`)\n\n      var playerEl = _this.player.el();\n\n      if (playerEl && playerEl.clientWidth && playerEl.clientHeight && !(0, _cloudinary.isKeyInTransformation)(opts.transformation, 'width') && !(0, _cloudinary.isKeyInTransformation)(opts.transformation, 'height')) {\n        var roundUp100 = function roundUp100(val) {\n          return 100 * Math.ceil(val / 100);\n        };\n\n        opts.transformation.width(roundUp100(playerEl.clientWidth)).height(roundUp100(playerEl.clientHeight)).crop('limit');\n      }\n\n      return opts;\n    }; // Handle external (non-cloudinary plugin) source changes (e.g. by ad plugins)\n\n\n    var syncState = function syncState(_, data) {\n      var src = data.to; // When source is cloudinary's\n\n      if (_lastSource && _lastSource.contains(src)) {\n        // If plugin state doesn't have an active VideoSource\n        if (!_this.source()) {\n          // We might have been running a playlist, reset playlist's state.\n          if (_lastPlaylist) {\n            _this.playlist(_lastPlaylist);\n          } // Rebuild last source state without calling vjs's 'src' and 'poster'\n\n\n          _this.source(_lastSource, {\n            skipRefresh: true\n          });\n        }\n      } else {\n        // Used by cloudinary-only components\n        _this.player.trigger('cldsourcechanged', {}); // When source isn't cloudinary's - reset the plugin's state.\n\n\n        _this.dispose();\n      }\n    };\n\n    _playerEvents = new _eventHandlerRegistry.default(_this.player);\n\n    var constructorParams = _slicing.sliceAndUnsetProperties.apply(void 0, [options].concat(CONSTRUCTOR_PARAMS));\n\n    (0, _applyWithProps.applyWithProps)(_assertThisInitialized(_this), constructorParams);\n\n    _this.on('sourcechanged', syncState);\n\n    return _this;\n  }\n\n  _createClass(CloudinaryContext, [{\n    key: \"currentSourceType\",\n    value: function currentSourceType() {\n      return this.source().getType();\n    }\n  }, {\n    key: \"currentPublicId\",\n    value: function currentPublicId() {\n      return this.source() && this.source().publicId();\n    }\n  }, {\n    key: \"currentPoster\",\n    value: function currentPoster() {\n      return this.source() && this.source().poster();\n    }\n  }]);\n\n  return CloudinaryContext;\n}((0, _mixin2.mixin)(_playlistable.default));\n\nfunction _default() {\n  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n  options.chainTarget = options.chainTarget || this;\n  this.cloudinary = new CloudinaryContext(this, options);\n}\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./plugins/cloudinary/index.js?");
+eval("\n\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = _default;\nexports.CONSTRUCTOR_PARAMS = void 0;\n\nvar _cloudinaryCore = _interopRequireDefault(__webpack_require__(/*! cloudinary-core */ \"cloudinary-core\"));\n\nvar _video = _interopRequireDefault(__webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/video.es.js-exposed\"));\n\nvar _mixin2 = __webpack_require__(/*! utils/mixin */ \"./utils/mixin.js\");\n\nvar _applyWithProps = __webpack_require__(/*! utils/apply-with-props */ \"./utils/apply-with-props.js\");\n\nvar _slicing = __webpack_require__(/*! utils/slicing */ \"./utils/slicing.js\");\n\nvar _cloudinary = __webpack_require__(/*! utils/cloudinary */ \"./utils/cloudinary.js\");\n\nvar _assign = __webpack_require__(/*! utils/assign */ \"./utils/assign.js\");\n\nvar _common = __webpack_require__(/*! ./common */ \"./plugins/cloudinary/common.js\");\n\nvar _playlistable = _interopRequireDefault(__webpack_require__(/*! mixins/playlistable */ \"./mixins/playlistable.js\"));\n\nvar _videoSource = _interopRequireDefault(__webpack_require__(/*! ./models/video-source/video-source */ \"./plugins/cloudinary/models/video-source/video-source.js\"));\n\nvar _eventHandlerRegistry = _interopRequireDefault(__webpack_require__(/*! ./event-handler-registry */ \"./plugins/cloudinary/event-handler-registry.js\"));\n\nvar _audioSource = _interopRequireDefault(__webpack_require__(/*! ./models/audio-source/audio-source */ \"./plugins/cloudinary/models/audio-source/audio-source.js\"));\n\nvar _typeInference = __webpack_require__(/*! ../../utils/type-inference */ \"./utils/type-inference.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _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); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nvar DEFAULT_PARAMS = {\n  transformation: {},\n  sourceTypes: [],\n  sourceTransformation: [],\n  posterOptions: {}\n};\nvar CONSTRUCTOR_PARAMS = ['cloudinaryConfig', 'transformation', 'sourceTypes', 'sourceTransformation', 'posterOptions', 'autoShowRecommendations'];\nexports.CONSTRUCTOR_PARAMS = CONSTRUCTOR_PARAMS;\n\nvar CloudinaryContext = /*#__PURE__*/function (_mixin) {\n  _inherits(CloudinaryContext, _mixin);\n\n  var _super = _createSuper(CloudinaryContext);\n\n  function CloudinaryContext(player) {\n    var _this;\n\n    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n    _classCallCheck(this, CloudinaryContext);\n\n    _this = _super.call(this, player, options);\n    _this.player = player;\n    options = (0, _assign.assign)({}, DEFAULT_PARAMS, options);\n    var _source = null;\n    var _sources = null;\n    var _lastSource = null;\n    var _lastPlaylist = null;\n    var _posterOptions = null;\n    var _cloudinaryConfig = null;\n    var _transformation = null;\n    var _sourceTypes = null;\n    var _sourceTransformation = null;\n    var _chainTarget = options.chainTarget;\n    var _playerEvents = null;\n    var _recommendations = null;\n    var _autoShowRecommendations = false;\n\n    _this.source = function (source) {\n      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n      options = (0, _assign.assign)({}, options);\n\n      if (!source) {\n        return _source;\n      }\n\n      var src = null;\n\n      if (source instanceof _videoSource.default) {\n        src = source;\n      } else {\n        var _normalizeOptions = (0, _common.normalizeOptions)(source, options),\n            publicId = _normalizeOptions.publicId,\n            _options = _normalizeOptions.options;\n\n        src = _this.buildSource(publicId, _options);\n      }\n\n      if (src.recommendations()) {\n        var recommendations = src.recommendations();\n        var itemBuilder = null;\n        var disableAutoShow = false;\n\n        if (options.recommendationOptions) {\n          var _sliceAndUnsetPropert = (0, _slicing.sliceAndUnsetProperties)(options.recommendationOptions, 'disableAutoShow', 'itemBuilder');\n\n          disableAutoShow = _sliceAndUnsetPropert.disableAutoShow;\n          itemBuilder = _sliceAndUnsetPropert.itemBuilder;\n        }\n\n        setRecommendations(recommendations, {\n          disableAutoShow: disableAutoShow,\n          itemBuilder: itemBuilder\n        });\n      } else {\n        unsetRecommendations();\n      }\n\n      _source = src;\n\n      if (!options.skipRefresh) {\n        refresh();\n      }\n\n      _this.player.trigger('cldsourcechanged', {\n        source: src\n      });\n\n      return _chainTarget;\n    };\n\n    _this.buildSource = function (publicId) {\n      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n      var builtSrc = null;\n\n      var _normalizeOptions2 = (0, _common.normalizeOptions)(publicId, options);\n\n      publicId = _normalizeOptions2.publicId;\n      options = _normalizeOptions2.options;\n      options.cloudinaryConfig = (0, _common.mergeCloudinaryConfig)(_this.cloudinaryConfig(), options.cloudinaryConfig || {});\n      options.transformation = (0, _common.mergeTransformation)(_this.transformation(), options.transformation || {});\n      options.sourceTransformation = options.sourceTransformation || _this.sourceTransformation();\n      options.sourceTypes = options.sourceTypes || _this.sourceTypes();\n      options.poster = options.poster || posterOptionsForCurrent();\n      options.queryParams = options.usageReport ? {\n        _s: \"vp-\".concat(\"1.5.9\")\n      } : {};\n\n      if (options.sourceTypes.indexOf('audio') > -1) {\n        builtSrc = new _audioSource.default(publicId, options);\n      } else {\n        builtSrc = new _videoSource.default(publicId, options);\n      }\n\n      return builtSrc;\n    };\n\n    _this.posterOptions = function (options) {\n      if (!options) {\n        return _posterOptions;\n      }\n\n      _posterOptions = options;\n      return _chainTarget;\n    };\n\n    _this.cloudinaryConfig = function (config) {\n      if (!config) {\n        return _cloudinaryConfig;\n      }\n\n      _cloudinaryConfig = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Cloudinary, config);\n      return _chainTarget;\n    };\n\n    _this.transformation = function (trans) {\n      if (!trans) {\n        return _transformation;\n      }\n\n      _transformation = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Transformation, trans);\n      return _chainTarget;\n    };\n\n    _this.sourceTypes = function (types) {\n      if (!types) {\n        return _sourceTypes;\n      }\n\n      _sourceTypes = types;\n      return _chainTarget;\n    };\n\n    _this.getCurrentSources = function () {\n      return _sources;\n    };\n\n    _this.sourceTransformation = function (trans) {\n      if (!trans) {\n        return _sourceTransformation;\n      }\n\n      _sourceTransformation = trans;\n      return _chainTarget;\n    };\n\n    _this.on = function () {\n      var _playerEvents2;\n\n      return (_playerEvents2 = _playerEvents).on.apply(_playerEvents2, arguments);\n    };\n\n    _this.one = function () {\n      var _playerEvents3;\n\n      return (_playerEvents3 = _playerEvents).one.apply(_playerEvents3, arguments);\n    };\n\n    _this.off = function () {\n      var _playerEvents4;\n\n      return (_playerEvents4 = _playerEvents).off.apply(_playerEvents4, arguments);\n    };\n\n    _this.autoShowRecommendations = function (autoShow) {\n      if (autoShow === undefined) {\n        return _autoShowRecommendations;\n      }\n\n      _autoShowRecommendations = autoShow;\n      return _chainTarget;\n    };\n\n    _this.dispose = function () {\n      if (_this.playlist()) {\n        _this.disposePlaylist();\n      }\n\n      unsetRecommendations();\n      _source = undefined;\n\n      _playerEvents.removeAllListeners();\n    };\n\n    var setRecommendations = function setRecommendations(recommendations, _ref) {\n      var _ref$disableAutoShow = _ref.disableAutoShow,\n          disableAutoShow = _ref$disableAutoShow === void 0 ? false : _ref$disableAutoShow,\n          _ref$itemBuilder = _ref.itemBuilder,\n          itemBuilder = _ref$itemBuilder === void 0 ? null : _ref$itemBuilder;\n      unsetRecommendations();\n\n      if (!Array.isArray(recommendations) && typeof recommendations !== 'function' && !recommendations.then) {\n        throw new Error('\"recommendations\" must be either an array or a function');\n      }\n\n      _recommendations = {};\n\n      itemBuilder = itemBuilder || function (source) {\n        return {\n          source: source instanceof _videoSource.default ? source : _this.buildSource(source),\n          action: function action() {\n            return _this.source(source);\n          }\n        };\n      };\n\n      _recommendations.sourceChangedHandler = function () {\n        var trigger = function trigger(sources) {\n          if (typeof sources !== 'undefined' && sources.length > 0) {\n            var items = sources.map(function (_source) {\n              return itemBuilder(_source);\n            });\n\n            _this.player.trigger('recommendationschanged', {\n              items: items\n            });\n          } else {\n            _this.player.trigger('recommendationsnoshow');\n          }\n\n          _recommendations.sources = sources;\n        };\n\n        if ((0, _typeInference.isFunction)(recommendations)) {\n          trigger(recommendations());\n        } else if (recommendations.then) {\n          recommendations.then(trigger);\n        } else {\n          trigger(recommendations);\n        }\n      };\n\n      _this.one('cldsourcechanged', _recommendations.sourceChangedHandler);\n\n      _recommendations.endedHandler = function () {\n        if (!disableAutoShow && _this.autoShowRecommendations()) {\n          _this.player.trigger('recommendationsshow');\n        }\n      };\n\n      _this.on('ended', _recommendations.endedHandler);\n    };\n\n    var unsetRecommendations = function unsetRecommendations() {\n      if (_recommendations) {\n        _this.off('cldsourcechanged', _recommendations.sourceChangedHandler);\n\n        _this.off('ended', _recommendations.endedHandler);\n\n        delete _recommendations.endedHandler;\n        delete _recommendations.sourceChangedHandler;\n      }\n\n      _recommendations = null;\n    };\n\n    var refresh = function refresh() {\n      var src = _this.source();\n\n      if (src.poster()) {\n        _this.player.poster(src.poster().url());\n      }\n\n      _sources = src.generateSources().reduce(function (srcs, src) {\n        if (src.isAdaptive) {\n          var codec = src.type.split('; ')[1] || null;\n\n          if (codec && 'MediaSource' in window) {\n            var parts = src.type.split('; ');\n            var typeStr = \"video/mp4; \".concat(parts[1] || '');\n            var canPlay = testCanPlayTypeAndTypeSupported(typeStr);\n\n            if (_video.default.browser.IS_ANY_SAFARI) {\n              // work around safari saying it cant play h265\n              src.type = \"\".concat(parts[0], \"; \").concat((0, _common.codecShorthandTrans)('h264'));\n            }\n\n            if (canPlay) {\n              srcs.push(src);\n            }\n          } else {\n            srcs.push(src);\n          }\n        } else {\n          srcs.push(src);\n        }\n\n        return srcs;\n      }, []);\n\n      _this.player.src(_sources);\n\n      _lastSource = src;\n      _lastPlaylist = _this.playlist();\n    };\n\n    var testCanPlayTypeAndTypeSupported = function testCanPlayTypeAndTypeSupported(codec) {\n      var v = document.createElement('video');\n      return v.canPlayType(codec) || 'MediaSource' in window && MediaSource.isTypeSupported(codec);\n    };\n\n    var posterOptionsForCurrent = function posterOptionsForCurrent() {\n      var opts = (0, _assign.assign)({}, _this.posterOptions());\n\n      if (opts.transformation) {\n        if ((opts.transformation.width || opts.transformation.height) && !opts.transformation.crop) {\n          opts.transformation.crop = 'scale';\n        }\n      }\n\n      opts.transformation = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Transformation, opts.transformation || {}); // Set poster dimensions to player actual size.\n      // (unless they were explicitly set via `posterOptions`)\n\n      var playerEl = _this.player.el();\n\n      if (playerEl && playerEl.clientWidth && playerEl.clientHeight && !(0, _cloudinary.isKeyInTransformation)(opts.transformation, 'width') && !(0, _cloudinary.isKeyInTransformation)(opts.transformation, 'height')) {\n        var roundUp100 = function roundUp100(val) {\n          return 100 * Math.ceil(val / 100);\n        };\n\n        opts.transformation.width(roundUp100(playerEl.clientWidth)).height(roundUp100(playerEl.clientHeight)).crop('limit');\n      }\n\n      return opts;\n    }; // Handle external (non-cloudinary plugin) source changes (e.g. by ad plugins)\n\n\n    var syncState = function syncState(_, data) {\n      var src = data.to; // When source is cloudinary's\n\n      if (_lastSource && _lastSource.contains(src)) {\n        // If plugin state doesn't have an active VideoSource\n        if (!_this.source()) {\n          // We might have been running a playlist, reset playlist's state.\n          if (_lastPlaylist) {\n            _this.playlist(_lastPlaylist);\n          } // Rebuild last source state without calling vjs's 'src' and 'poster'\n\n\n          _this.source(_lastSource, {\n            skipRefresh: true\n          });\n        }\n      } else {\n        // Used by cloudinary-only components\n        _this.player.trigger('cldsourcechanged', {}); // When source isn't cloudinary's - reset the plugin's state.\n\n\n        _this.dispose();\n      }\n    };\n\n    _playerEvents = new _eventHandlerRegistry.default(_this.player);\n\n    var constructorParams = _slicing.sliceAndUnsetProperties.apply(void 0, [options].concat(CONSTRUCTOR_PARAMS));\n\n    (0, _applyWithProps.applyWithProps)(_assertThisInitialized(_this), constructorParams);\n\n    _this.on('sourcechanged', syncState);\n\n    return _this;\n  }\n\n  _createClass(CloudinaryContext, [{\n    key: \"currentSourceType\",\n    value: function currentSourceType() {\n      return this.source().getType();\n    }\n  }, {\n    key: \"currentPublicId\",\n    value: function currentPublicId() {\n      return this.source() && this.source().publicId();\n    }\n  }, {\n    key: \"currentPoster\",\n    value: function currentPoster() {\n      return this.source() && this.source().poster();\n    }\n  }]);\n\n  return CloudinaryContext;\n}((0, _mixin2.mixin)(_playlistable.default));\n\nfunction _default() {\n  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n  options.chainTarget = options.chainTarget || this;\n  this.cloudinary = new CloudinaryContext(this, options);\n}\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./plugins/cloudinary/index.js?");
 
 /***/ }),
 
@@ -4669,7 +4669,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extr
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar contextMenuContent = function contextMenuContent(player) {\n  var isLooping = player.loop();\n  var isPaused = player.paused();\n  var isMuted = player.muted();\n  var isFullscreen = player.isFullscreen();\n  var aboutMenuItem = {\n    label: '<span class=\"player-version\">Cloudinary Player v' + \"1.5.8\" + '</span>'\n  };\n\n  if (!player.controls()) {\n    return [aboutMenuItem];\n  }\n\n  return [{\n    label: isLooping ? 'Unloop' : 'Loop',\n    listener: function listener() {\n      player.loop(!isLooping);\n    }\n  }, {\n    label: isPaused ? 'Play' : 'Pause',\n    listener: function listener() {\n      if (isPaused) {\n        player.play();\n      } else {\n        player.pause();\n      }\n    }\n  }, {\n    label: isMuted ? 'Unmute' : 'Mute',\n    listener: function listener() {\n      player.muted(!isMuted);\n    }\n  }, {\n    label: isFullscreen ? 'Exit Fullscreen' : 'Fullscreen',\n    listener: function listener() {\n      if (isFullscreen) {\n        player.exitFullscreen();\n      } else {\n        player.requestFullscreen();\n      }\n    }\n  }, aboutMenuItem];\n};\n\nvar _default = contextMenuContent;\nexports.default = _default;\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./plugins/context-menu/contextMenuContent.js?");
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar contextMenuContent = function contextMenuContent(player) {\n  var isLooping = player.loop();\n  var isPaused = player.paused();\n  var isMuted = player.muted();\n  var isFullscreen = player.isFullscreen();\n  var aboutMenuItem = {\n    label: '<span class=\"player-version\">Cloudinary Player v' + \"1.5.9\" + '</span>'\n  };\n\n  if (!player.controls()) {\n    return [aboutMenuItem];\n  }\n\n  return [{\n    label: isLooping ? 'Unloop' : 'Loop',\n    listener: function listener() {\n      player.loop(!isLooping);\n    }\n  }, {\n    label: isPaused ? 'Play' : 'Pause',\n    listener: function listener() {\n      if (isPaused) {\n        player.play();\n      } else {\n        player.pause();\n      }\n    }\n  }, {\n    label: isMuted ? 'Unmute' : 'Mute',\n    listener: function listener() {\n      player.muted(!isMuted);\n    }\n  }, {\n    label: isFullscreen ? 'Exit Fullscreen' : 'Fullscreen',\n    listener: function listener() {\n      if (isFullscreen) {\n        player.exitFullscreen();\n      } else {\n        player.requestFullscreen();\n      }\n    }\n  }, aboutMenuItem];\n};\n\nvar _default = contextMenuContent;\nexports.default = _default;\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./plugins/context-menu/contextMenuContent.js?");
 
 /***/ }),
 

package/dist/cld-video-player.light.js

@@ -828,7 +828,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = _default;\nexports.CONSTRUCTOR_PARAMS = void 0;\n\nvar _cloudinaryCore = _interopRequireDefault(__webpack_require__(/*! cloudinary-core */ \"cloudinary-core\"));\n\nvar _video = _interopRequireDefault(__webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core.js-exposed\"));\n\nvar _mixin2 = __webpack_require__(/*! utils/mixin */ \"./utils/mixin.js\");\n\nvar _applyWithProps = __webpack_require__(/*! utils/apply-with-props */ \"./utils/apply-with-props.js\");\n\nvar _slicing = __webpack_require__(/*! utils/slicing */ \"./utils/slicing.js\");\n\nvar _cloudinary = __webpack_require__(/*! utils/cloudinary */ \"./utils/cloudinary.js\");\n\nvar _assign = __webpack_require__(/*! utils/assign */ \"./utils/assign.js\");\n\nvar _common = __webpack_require__(/*! ./common */ \"./plugins/cloudinary/common.js\");\n\nvar _playlistable = _interopRequireDefault(__webpack_require__(/*! mixins/playlistable */ \"./mixins/playlistable.js\"));\n\nvar _videoSource = _interopRequireDefault(__webpack_require__(/*! ./models/video-source/video-source */ \"./plugins/cloudinary/models/video-source/video-source.js\"));\n\nvar _eventHandlerRegistry = _interopRequireDefault(__webpack_require__(/*! ./event-handler-registry */ \"./plugins/cloudinary/event-handler-registry.js\"));\n\nvar _audioSource = _interopRequireDefault(__webpack_require__(/*! ./models/audio-source/audio-source */ \"./plugins/cloudinary/models/audio-source/audio-source.js\"));\n\nvar _typeInference = __webpack_require__(/*! ../../utils/type-inference */ \"./utils/type-inference.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _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); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nvar DEFAULT_PARAMS = {\n  transformation: {},\n  sourceTypes: [],\n  sourceTransformation: [],\n  posterOptions: {}\n};\nvar CONSTRUCTOR_PARAMS = ['cloudinaryConfig', 'transformation', 'sourceTypes', 'sourceTransformation', 'posterOptions', 'autoShowRecommendations'];\nexports.CONSTRUCTOR_PARAMS = CONSTRUCTOR_PARAMS;\n\nvar CloudinaryContext = /*#__PURE__*/function (_mixin) {\n  _inherits(CloudinaryContext, _mixin);\n\n  var _super = _createSuper(CloudinaryContext);\n\n  function CloudinaryContext(player) {\n    var _this;\n\n    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n    _classCallCheck(this, CloudinaryContext);\n\n    _this = _super.call(this, player, options);\n    _this.player = player;\n    options = (0, _assign.assign)({}, DEFAULT_PARAMS, options);\n    var _source = null;\n    var _sources = null;\n    var _lastSource = null;\n    var _lastPlaylist = null;\n    var _posterOptions = null;\n    var _cloudinaryConfig = null;\n    var _transformation = null;\n    var _sourceTypes = null;\n    var _sourceTransformation = null;\n    var _chainTarget = options.chainTarget;\n    var _playerEvents = null;\n    var _recommendations = null;\n    var _autoShowRecommendations = false;\n\n    _this.source = function (source) {\n      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n      options = (0, _assign.assign)({}, options);\n\n      if (!source) {\n        return _source;\n      }\n\n      var src = null;\n\n      if (source instanceof _videoSource.default) {\n        src = source;\n      } else {\n        var _normalizeOptions = (0, _common.normalizeOptions)(source, options),\n            publicId = _normalizeOptions.publicId,\n            _options = _normalizeOptions.options;\n\n        src = _this.buildSource(publicId, _options);\n      }\n\n      if (src.recommendations()) {\n        var recommendations = src.recommendations();\n        var itemBuilder = null;\n        var disableAutoShow = false;\n\n        if (options.recommendationOptions) {\n          var _sliceAndUnsetPropert = (0, _slicing.sliceAndUnsetProperties)(options.recommendationOptions, 'disableAutoShow', 'itemBuilder');\n\n          disableAutoShow = _sliceAndUnsetPropert.disableAutoShow;\n          itemBuilder = _sliceAndUnsetPropert.itemBuilder;\n        }\n\n        setRecommendations(recommendations, {\n          disableAutoShow: disableAutoShow,\n          itemBuilder: itemBuilder\n        });\n      } else {\n        unsetRecommendations();\n      }\n\n      _source = src;\n\n      if (!options.skipRefresh) {\n        refresh();\n      }\n\n      _this.player.trigger('cldsourcechanged', {\n        source: src\n      });\n\n      return _chainTarget;\n    };\n\n    _this.buildSource = function (publicId) {\n      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n      var builtSrc = null;\n\n      var _normalizeOptions2 = (0, _common.normalizeOptions)(publicId, options);\n\n      publicId = _normalizeOptions2.publicId;\n      options = _normalizeOptions2.options;\n      options.cloudinaryConfig = (0, _common.mergeCloudinaryConfig)(_this.cloudinaryConfig(), options.cloudinaryConfig || {});\n      options.transformation = (0, _common.mergeTransformation)(_this.transformation(), options.transformation || {});\n      options.sourceTransformation = options.sourceTransformation || _this.sourceTransformation();\n      options.sourceTypes = options.sourceTypes || _this.sourceTypes();\n      options.poster = options.poster || posterOptionsForCurrent();\n      options.queryParams = options.usageReport ? {\n        _s: \"vp-\".concat(\"1.5.8\")\n      } : {};\n\n      if (options.sourceTypes.indexOf('audio') > -1) {\n        builtSrc = new _audioSource.default(publicId, options);\n      } else {\n        builtSrc = new _videoSource.default(publicId, options);\n      }\n\n      return builtSrc;\n    };\n\n    _this.posterOptions = function (options) {\n      if (!options) {\n        return _posterOptions;\n      }\n\n      _posterOptions = options;\n      return _chainTarget;\n    };\n\n    _this.cloudinaryConfig = function (config) {\n      if (!config) {\n        return _cloudinaryConfig;\n      }\n\n      _cloudinaryConfig = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Cloudinary, config);\n      return _chainTarget;\n    };\n\n    _this.transformation = function (trans) {\n      if (!trans) {\n        return _transformation;\n      }\n\n      _transformation = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Transformation, trans);\n      return _chainTarget;\n    };\n\n    _this.sourceTypes = function (types) {\n      if (!types) {\n        return _sourceTypes;\n      }\n\n      _sourceTypes = types;\n      return _chainTarget;\n    };\n\n    _this.getCurrentSources = function () {\n      return _sources;\n    };\n\n    _this.sourceTransformation = function (trans) {\n      if (!trans) {\n        return _sourceTransformation;\n      }\n\n      _sourceTransformation = trans;\n      return _chainTarget;\n    };\n\n    _this.on = function () {\n      var _playerEvents2;\n\n      return (_playerEvents2 = _playerEvents).on.apply(_playerEvents2, arguments);\n    };\n\n    _this.one = function () {\n      var _playerEvents3;\n\n      return (_playerEvents3 = _playerEvents).one.apply(_playerEvents3, arguments);\n    };\n\n    _this.off = function () {\n      var _playerEvents4;\n\n      return (_playerEvents4 = _playerEvents).off.apply(_playerEvents4, arguments);\n    };\n\n    _this.autoShowRecommendations = function (autoShow) {\n      if (autoShow === undefined) {\n        return _autoShowRecommendations;\n      }\n\n      _autoShowRecommendations = autoShow;\n      return _chainTarget;\n    };\n\n    _this.dispose = function () {\n      if (_this.playlist()) {\n        _this.disposePlaylist();\n      }\n\n      unsetRecommendations();\n      _source = undefined;\n\n      _playerEvents.removeAllListeners();\n    };\n\n    var setRecommendations = function setRecommendations(recommendations, _ref) {\n      var _ref$disableAutoShow = _ref.disableAutoShow,\n          disableAutoShow = _ref$disableAutoShow === void 0 ? false : _ref$disableAutoShow,\n          _ref$itemBuilder = _ref.itemBuilder,\n          itemBuilder = _ref$itemBuilder === void 0 ? null : _ref$itemBuilder;\n      unsetRecommendations();\n\n      if (!Array.isArray(recommendations) && typeof recommendations !== 'function' && !recommendations.then) {\n        throw new Error('\"recommendations\" must be either an array or a function');\n      }\n\n      _recommendations = {};\n\n      itemBuilder = itemBuilder || function (source) {\n        return {\n          source: source instanceof _videoSource.default ? source : _this.buildSource(source),\n          action: function action() {\n            return _this.source(source);\n          }\n        };\n      };\n\n      _recommendations.sourceChangedHandler = function () {\n        var trigger = function trigger(sources) {\n          if (typeof sources !== 'undefined' && sources.length > 0) {\n            var items = sources.map(function (_source) {\n              return itemBuilder(_source);\n            });\n\n            _this.player.trigger('recommendationschanged', {\n              items: items\n            });\n          } else {\n            _this.player.trigger('recommendationsnoshow');\n          }\n\n          _recommendations.sources = sources;\n        };\n\n        if ((0, _typeInference.isFunction)(recommendations)) {\n          trigger(recommendations());\n        } else if (recommendations.then) {\n          recommendations.then(trigger);\n        } else {\n          trigger(recommendations);\n        }\n      };\n\n      _this.one('cldsourcechanged', _recommendations.sourceChangedHandler);\n\n      _recommendations.endedHandler = function () {\n        if (!disableAutoShow && _this.autoShowRecommendations()) {\n          _this.player.trigger('recommendationsshow');\n        }\n      };\n\n      _this.on('ended', _recommendations.endedHandler);\n    };\n\n    var unsetRecommendations = function unsetRecommendations() {\n      if (_recommendations) {\n        _this.off('cldsourcechanged', _recommendations.sourceChangedHandler);\n\n        _this.off('ended', _recommendations.endedHandler);\n\n        delete _recommendations.endedHandler;\n        delete _recommendations.sourceChangedHandler;\n      }\n\n      _recommendations = null;\n    };\n\n    var refresh = function refresh() {\n      var src = _this.source();\n\n      if (src.poster()) {\n        _this.player.poster(src.poster().url());\n      }\n\n      _sources = src.generateSources().reduce(function (srcs, src) {\n        if (src.isAdaptive) {\n          var codec = src.type.split('; ')[1] || null;\n\n          if (codec && 'MediaSource' in window) {\n            var parts = src.type.split('; ');\n            var typeStr = \"video/mp4; \".concat(parts[1] || '');\n            var canPlay = testCanPlayTypeAndTypeSupported(typeStr);\n\n            if (_video.default.browser.IS_ANY_SAFARI) {\n              // work around safari saying it cant play h265\n              src.type = \"\".concat(parts[0], \"; \").concat((0, _common.codecShorthandTrans)('h264'));\n            }\n\n            if (canPlay) {\n              srcs.push(src);\n            }\n          } else {\n            srcs.push(src);\n          }\n        } else {\n          srcs.push(src);\n        }\n\n        return srcs;\n      }, []);\n\n      _this.player.src(_sources);\n\n      _lastSource = src;\n      _lastPlaylist = _this.playlist();\n    };\n\n    var testCanPlayTypeAndTypeSupported = function testCanPlayTypeAndTypeSupported(codec) {\n      var v = document.createElement('video');\n      return v.canPlayType(codec) || 'MediaSource' in window && MediaSource.isTypeSupported(codec);\n    };\n\n    var posterOptionsForCurrent = function posterOptionsForCurrent() {\n      var opts = (0, _assign.assign)({}, _this.posterOptions());\n\n      if (opts.transformation) {\n        if ((opts.transformation.width || opts.transformation.height) && !opts.transformation.crop) {\n          opts.transformation.crop = 'scale';\n        }\n      }\n\n      opts.transformation = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Transformation, opts.transformation || {}); // Set poster dimensions to player actual size.\n      // (unless they were explicitly set via `posterOptions`)\n\n      var playerEl = _this.player.el();\n\n      if (playerEl && playerEl.clientWidth && playerEl.clientHeight && !(0, _cloudinary.isKeyInTransformation)(opts.transformation, 'width') && !(0, _cloudinary.isKeyInTransformation)(opts.transformation, 'height')) {\n        var roundUp100 = function roundUp100(val) {\n          return 100 * Math.ceil(val / 100);\n        };\n\n        opts.transformation.width(roundUp100(playerEl.clientWidth)).height(roundUp100(playerEl.clientHeight)).crop('limit');\n      }\n\n      return opts;\n    }; // Handle external (non-cloudinary plugin) source changes (e.g. by ad plugins)\n\n\n    var syncState = function syncState(_, data) {\n      var src = data.to; // When source is cloudinary's\n\n      if (_lastSource && _lastSource.contains(src)) {\n        // If plugin state doesn't have an active VideoSource\n        if (!_this.source()) {\n          // We might have been running a playlist, reset playlist's state.\n          if (_lastPlaylist) {\n            _this.playlist(_lastPlaylist);\n          } // Rebuild last source state without calling vjs's 'src' and 'poster'\n\n\n          _this.source(_lastSource, {\n            skipRefresh: true\n          });\n        }\n      } else {\n        // Used by cloudinary-only components\n        _this.player.trigger('cldsourcechanged', {}); // When source isn't cloudinary's - reset the plugin's state.\n\n\n        _this.dispose();\n      }\n    };\n\n    _playerEvents = new _eventHandlerRegistry.default(_this.player);\n\n    var constructorParams = _slicing.sliceAndUnsetProperties.apply(void 0, [options].concat(CONSTRUCTOR_PARAMS));\n\n    (0, _applyWithProps.applyWithProps)(_assertThisInitialized(_this), constructorParams);\n\n    _this.on('sourcechanged', syncState);\n\n    return _this;\n  }\n\n  _createClass(CloudinaryContext, [{\n    key: \"currentSourceType\",\n    value: function currentSourceType() {\n      return this.source().getType();\n    }\n  }, {\n    key: \"currentPublicId\",\n    value: function currentPublicId() {\n      return this.source() && this.source().publicId();\n    }\n  }, {\n    key: \"currentPoster\",\n    value: function currentPoster() {\n      return this.source() && this.source().poster();\n    }\n  }]);\n\n  return CloudinaryContext;\n}((0, _mixin2.mixin)(_playlistable.default));\n\nfunction _default() {\n  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n  options.chainTarget = options.chainTarget || this;\n  this.cloudinary = new CloudinaryContext(this, options);\n}\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./plugins/cloudinary/index.js?");
+eval("\n\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = _default;\nexports.CONSTRUCTOR_PARAMS = void 0;\n\nvar _cloudinaryCore = _interopRequireDefault(__webpack_require__(/*! cloudinary-core */ \"cloudinary-core\"));\n\nvar _video = _interopRequireDefault(__webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core.js-exposed\"));\n\nvar _mixin2 = __webpack_require__(/*! utils/mixin */ \"./utils/mixin.js\");\n\nvar _applyWithProps = __webpack_require__(/*! utils/apply-with-props */ \"./utils/apply-with-props.js\");\n\nvar _slicing = __webpack_require__(/*! utils/slicing */ \"./utils/slicing.js\");\n\nvar _cloudinary = __webpack_require__(/*! utils/cloudinary */ \"./utils/cloudinary.js\");\n\nvar _assign = __webpack_require__(/*! utils/assign */ \"./utils/assign.js\");\n\nvar _common = __webpack_require__(/*! ./common */ \"./plugins/cloudinary/common.js\");\n\nvar _playlistable = _interopRequireDefault(__webpack_require__(/*! mixins/playlistable */ \"./mixins/playlistable.js\"));\n\nvar _videoSource = _interopRequireDefault(__webpack_require__(/*! ./models/video-source/video-source */ \"./plugins/cloudinary/models/video-source/video-source.js\"));\n\nvar _eventHandlerRegistry = _interopRequireDefault(__webpack_require__(/*! ./event-handler-registry */ \"./plugins/cloudinary/event-handler-registry.js\"));\n\nvar _audioSource = _interopRequireDefault(__webpack_require__(/*! ./models/audio-source/audio-source */ \"./plugins/cloudinary/models/audio-source/audio-source.js\"));\n\nvar _typeInference = __webpack_require__(/*! ../../utils/type-inference */ \"./utils/type-inference.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _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); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nvar DEFAULT_PARAMS = {\n  transformation: {},\n  sourceTypes: [],\n  sourceTransformation: [],\n  posterOptions: {}\n};\nvar CONSTRUCTOR_PARAMS = ['cloudinaryConfig', 'transformation', 'sourceTypes', 'sourceTransformation', 'posterOptions', 'autoShowRecommendations'];\nexports.CONSTRUCTOR_PARAMS = CONSTRUCTOR_PARAMS;\n\nvar CloudinaryContext = /*#__PURE__*/function (_mixin) {\n  _inherits(CloudinaryContext, _mixin);\n\n  var _super = _createSuper(CloudinaryContext);\n\n  function CloudinaryContext(player) {\n    var _this;\n\n    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n    _classCallCheck(this, CloudinaryContext);\n\n    _this = _super.call(this, player, options);\n    _this.player = player;\n    options = (0, _assign.assign)({}, DEFAULT_PARAMS, options);\n    var _source = null;\n    var _sources = null;\n    var _lastSource = null;\n    var _lastPlaylist = null;\n    var _posterOptions = null;\n    var _cloudinaryConfig = null;\n    var _transformation = null;\n    var _sourceTypes = null;\n    var _sourceTransformation = null;\n    var _chainTarget = options.chainTarget;\n    var _playerEvents = null;\n    var _recommendations = null;\n    var _autoShowRecommendations = false;\n\n    _this.source = function (source) {\n      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n      options = (0, _assign.assign)({}, options);\n\n      if (!source) {\n        return _source;\n      }\n\n      var src = null;\n\n      if (source instanceof _videoSource.default) {\n        src = source;\n      } else {\n        var _normalizeOptions = (0, _common.normalizeOptions)(source, options),\n            publicId = _normalizeOptions.publicId,\n            _options = _normalizeOptions.options;\n\n        src = _this.buildSource(publicId, _options);\n      }\n\n      if (src.recommendations()) {\n        var recommendations = src.recommendations();\n        var itemBuilder = null;\n        var disableAutoShow = false;\n\n        if (options.recommendationOptions) {\n          var _sliceAndUnsetPropert = (0, _slicing.sliceAndUnsetProperties)(options.recommendationOptions, 'disableAutoShow', 'itemBuilder');\n\n          disableAutoShow = _sliceAndUnsetPropert.disableAutoShow;\n          itemBuilder = _sliceAndUnsetPropert.itemBuilder;\n        }\n\n        setRecommendations(recommendations, {\n          disableAutoShow: disableAutoShow,\n          itemBuilder: itemBuilder\n        });\n      } else {\n        unsetRecommendations();\n      }\n\n      _source = src;\n\n      if (!options.skipRefresh) {\n        refresh();\n      }\n\n      _this.player.trigger('cldsourcechanged', {\n        source: src\n      });\n\n      return _chainTarget;\n    };\n\n    _this.buildSource = function (publicId) {\n      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n      var builtSrc = null;\n\n      var _normalizeOptions2 = (0, _common.normalizeOptions)(publicId, options);\n\n      publicId = _normalizeOptions2.publicId;\n      options = _normalizeOptions2.options;\n      options.cloudinaryConfig = (0, _common.mergeCloudinaryConfig)(_this.cloudinaryConfig(), options.cloudinaryConfig || {});\n      options.transformation = (0, _common.mergeTransformation)(_this.transformation(), options.transformation || {});\n      options.sourceTransformation = options.sourceTransformation || _this.sourceTransformation();\n      options.sourceTypes = options.sourceTypes || _this.sourceTypes();\n      options.poster = options.poster || posterOptionsForCurrent();\n      options.queryParams = options.usageReport ? {\n        _s: \"vp-\".concat(\"1.5.9\")\n      } : {};\n\n      if (options.sourceTypes.indexOf('audio') > -1) {\n        builtSrc = new _audioSource.default(publicId, options);\n      } else {\n        builtSrc = new _videoSource.default(publicId, options);\n      }\n\n      return builtSrc;\n    };\n\n    _this.posterOptions = function (options) {\n      if (!options) {\n        return _posterOptions;\n      }\n\n      _posterOptions = options;\n      return _chainTarget;\n    };\n\n    _this.cloudinaryConfig = function (config) {\n      if (!config) {\n        return _cloudinaryConfig;\n      }\n\n      _cloudinaryConfig = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Cloudinary, config);\n      return _chainTarget;\n    };\n\n    _this.transformation = function (trans) {\n      if (!trans) {\n        return _transformation;\n      }\n\n      _transformation = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Transformation, trans);\n      return _chainTarget;\n    };\n\n    _this.sourceTypes = function (types) {\n      if (!types) {\n        return _sourceTypes;\n      }\n\n      _sourceTypes = types;\n      return _chainTarget;\n    };\n\n    _this.getCurrentSources = function () {\n      return _sources;\n    };\n\n    _this.sourceTransformation = function (trans) {\n      if (!trans) {\n        return _sourceTransformation;\n      }\n\n      _sourceTransformation = trans;\n      return _chainTarget;\n    };\n\n    _this.on = function () {\n      var _playerEvents2;\n\n      return (_playerEvents2 = _playerEvents).on.apply(_playerEvents2, arguments);\n    };\n\n    _this.one = function () {\n      var _playerEvents3;\n\n      return (_playerEvents3 = _playerEvents).one.apply(_playerEvents3, arguments);\n    };\n\n    _this.off = function () {\n      var _playerEvents4;\n\n      return (_playerEvents4 = _playerEvents).off.apply(_playerEvents4, arguments);\n    };\n\n    _this.autoShowRecommendations = function (autoShow) {\n      if (autoShow === undefined) {\n        return _autoShowRecommendations;\n      }\n\n      _autoShowRecommendations = autoShow;\n      return _chainTarget;\n    };\n\n    _this.dispose = function () {\n      if (_this.playlist()) {\n        _this.disposePlaylist();\n      }\n\n      unsetRecommendations();\n      _source = undefined;\n\n      _playerEvents.removeAllListeners();\n    };\n\n    var setRecommendations = function setRecommendations(recommendations, _ref) {\n      var _ref$disableAutoShow = _ref.disableAutoShow,\n          disableAutoShow = _ref$disableAutoShow === void 0 ? false : _ref$disableAutoShow,\n          _ref$itemBuilder = _ref.itemBuilder,\n          itemBuilder = _ref$itemBuilder === void 0 ? null : _ref$itemBuilder;\n      unsetRecommendations();\n\n      if (!Array.isArray(recommendations) && typeof recommendations !== 'function' && !recommendations.then) {\n        throw new Error('\"recommendations\" must be either an array or a function');\n      }\n\n      _recommendations = {};\n\n      itemBuilder = itemBuilder || function (source) {\n        return {\n          source: source instanceof _videoSource.default ? source : _this.buildSource(source),\n          action: function action() {\n            return _this.source(source);\n          }\n        };\n      };\n\n      _recommendations.sourceChangedHandler = function () {\n        var trigger = function trigger(sources) {\n          if (typeof sources !== 'undefined' && sources.length > 0) {\n            var items = sources.map(function (_source) {\n              return itemBuilder(_source);\n            });\n\n            _this.player.trigger('recommendationschanged', {\n              items: items\n            });\n          } else {\n            _this.player.trigger('recommendationsnoshow');\n          }\n\n          _recommendations.sources = sources;\n        };\n\n        if ((0, _typeInference.isFunction)(recommendations)) {\n          trigger(recommendations());\n        } else if (recommendations.then) {\n          recommendations.then(trigger);\n        } else {\n          trigger(recommendations);\n        }\n      };\n\n      _this.one('cldsourcechanged', _recommendations.sourceChangedHandler);\n\n      _recommendations.endedHandler = function () {\n        if (!disableAutoShow && _this.autoShowRecommendations()) {\n          _this.player.trigger('recommendationsshow');\n        }\n      };\n\n      _this.on('ended', _recommendations.endedHandler);\n    };\n\n    var unsetRecommendations = function unsetRecommendations() {\n      if (_recommendations) {\n        _this.off('cldsourcechanged', _recommendations.sourceChangedHandler);\n\n        _this.off('ended', _recommendations.endedHandler);\n\n        delete _recommendations.endedHandler;\n        delete _recommendations.sourceChangedHandler;\n      }\n\n      _recommendations = null;\n    };\n\n    var refresh = function refresh() {\n      var src = _this.source();\n\n      if (src.poster()) {\n        _this.player.poster(src.poster().url());\n      }\n\n      _sources = src.generateSources().reduce(function (srcs, src) {\n        if (src.isAdaptive) {\n          var codec = src.type.split('; ')[1] || null;\n\n          if (codec && 'MediaSource' in window) {\n            var parts = src.type.split('; ');\n            var typeStr = \"video/mp4; \".concat(parts[1] || '');\n            var canPlay = testCanPlayTypeAndTypeSupported(typeStr);\n\n            if (_video.default.browser.IS_ANY_SAFARI) {\n              // work around safari saying it cant play h265\n              src.type = \"\".concat(parts[0], \"; \").concat((0, _common.codecShorthandTrans)('h264'));\n            }\n\n            if (canPlay) {\n              srcs.push(src);\n            }\n          } else {\n            srcs.push(src);\n          }\n        } else {\n          srcs.push(src);\n        }\n\n        return srcs;\n      }, []);\n\n      _this.player.src(_sources);\n\n      _lastSource = src;\n      _lastPlaylist = _this.playlist();\n    };\n\n    var testCanPlayTypeAndTypeSupported = function testCanPlayTypeAndTypeSupported(codec) {\n      var v = document.createElement('video');\n      return v.canPlayType(codec) || 'MediaSource' in window && MediaSource.isTypeSupported(codec);\n    };\n\n    var posterOptionsForCurrent = function posterOptionsForCurrent() {\n      var opts = (0, _assign.assign)({}, _this.posterOptions());\n\n      if (opts.transformation) {\n        if ((opts.transformation.width || opts.transformation.height) && !opts.transformation.crop) {\n          opts.transformation.crop = 'scale';\n        }\n      }\n\n      opts.transformation = (0, _cloudinary.getCloudinaryInstanceOf)(_cloudinaryCore.default.Transformation, opts.transformation || {}); // Set poster dimensions to player actual size.\n      // (unless they were explicitly set via `posterOptions`)\n\n      var playerEl = _this.player.el();\n\n      if (playerEl && playerEl.clientWidth && playerEl.clientHeight && !(0, _cloudinary.isKeyInTransformation)(opts.transformation, 'width') && !(0, _cloudinary.isKeyInTransformation)(opts.transformation, 'height')) {\n        var roundUp100 = function roundUp100(val) {\n          return 100 * Math.ceil(val / 100);\n        };\n\n        opts.transformation.width(roundUp100(playerEl.clientWidth)).height(roundUp100(playerEl.clientHeight)).crop('limit');\n      }\n\n      return opts;\n    }; // Handle external (non-cloudinary plugin) source changes (e.g. by ad plugins)\n\n\n    var syncState = function syncState(_, data) {\n      var src = data.to; // When source is cloudinary's\n\n      if (_lastSource && _lastSource.contains(src)) {\n        // If plugin state doesn't have an active VideoSource\n        if (!_this.source()) {\n          // We might have been running a playlist, reset playlist's state.\n          if (_lastPlaylist) {\n            _this.playlist(_lastPlaylist);\n          } // Rebuild last source state without calling vjs's 'src' and 'poster'\n\n\n          _this.source(_lastSource, {\n            skipRefresh: true\n          });\n        }\n      } else {\n        // Used by cloudinary-only components\n        _this.player.trigger('cldsourcechanged', {}); // When source isn't cloudinary's - reset the plugin's state.\n\n\n        _this.dispose();\n      }\n    };\n\n    _playerEvents = new _eventHandlerRegistry.default(_this.player);\n\n    var constructorParams = _slicing.sliceAndUnsetProperties.apply(void 0, [options].concat(CONSTRUCTOR_PARAMS));\n\n    (0, _applyWithProps.applyWithProps)(_assertThisInitialized(_this), constructorParams);\n\n    _this.on('sourcechanged', syncState);\n\n    return _this;\n  }\n\n  _createClass(CloudinaryContext, [{\n    key: \"currentSourceType\",\n    value: function currentSourceType() {\n      return this.source().getType();\n    }\n  }, {\n    key: \"currentPublicId\",\n    value: function currentPublicId() {\n      return this.source() && this.source().publicId();\n    }\n  }, {\n    key: \"currentPoster\",\n    value: function currentPoster() {\n      return this.source() && this.source().poster();\n    }\n  }]);\n\n  return CloudinaryContext;\n}((0, _mixin2.mixin)(_playlistable.default));\n\nfunction _default() {\n  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n  options.chainTarget = options.chainTarget || this;\n  this.cloudinary = new CloudinaryContext(this, options);\n}\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./plugins/cloudinary/index.js?");
 
 /***/ }),
 
@@ -972,7 +972,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extr
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar contextMenuContent = function contextMenuContent(player) {\n  var isLooping = player.loop();\n  var isPaused = player.paused();\n  var isMuted = player.muted();\n  var isFullscreen = player.isFullscreen();\n  var aboutMenuItem = {\n    label: '<span class=\"player-version\">Cloudinary Player v' + \"1.5.8\" + '</span>'\n  };\n\n  if (!player.controls()) {\n    return [aboutMenuItem];\n  }\n\n  return [{\n    label: isLooping ? 'Unloop' : 'Loop',\n    listener: function listener() {\n      player.loop(!isLooping);\n    }\n  }, {\n    label: isPaused ? 'Play' : 'Pause',\n    listener: function listener() {\n      if (isPaused) {\n        player.play();\n      } else {\n        player.pause();\n      }\n    }\n  }, {\n    label: isMuted ? 'Unmute' : 'Mute',\n    listener: function listener() {\n      player.muted(!isMuted);\n    }\n  }, {\n    label: isFullscreen ? 'Exit Fullscreen' : 'Fullscreen',\n    listener: function listener() {\n      if (isFullscreen) {\n        player.exitFullscreen();\n      } else {\n        player.requestFullscreen();\n      }\n    }\n  }, aboutMenuItem];\n};\n\nvar _default = contextMenuContent;\nexports.default = _default;\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./plugins/context-menu/contextMenuContent.js?");
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar contextMenuContent = function contextMenuContent(player) {\n  var isLooping = player.loop();\n  var isPaused = player.paused();\n  var isMuted = player.muted();\n  var isFullscreen = player.isFullscreen();\n  var aboutMenuItem = {\n    label: '<span class=\"player-version\">Cloudinary Player v' + \"1.5.9\" + '</span>'\n  };\n\n  if (!player.controls()) {\n    return [aboutMenuItem];\n  }\n\n  return [{\n    label: isLooping ? 'Unloop' : 'Loop',\n    listener: function listener() {\n      player.loop(!isLooping);\n    }\n  }, {\n    label: isPaused ? 'Play' : 'Pause',\n    listener: function listener() {\n      if (isPaused) {\n        player.play();\n      } else {\n        player.pause();\n      }\n    }\n  }, {\n    label: isMuted ? 'Unmute' : 'Mute',\n    listener: function listener() {\n      player.muted(!isMuted);\n    }\n  }, {\n    label: isFullscreen ? 'Exit Fullscreen' : 'Fullscreen',\n    listener: function listener() {\n      if (isFullscreen) {\n        player.exitFullscreen();\n      } else {\n        player.requestFullscreen();\n      }\n    }\n  }, aboutMenuItem];\n};\n\nvar _default = contextMenuContent;\nexports.default = _default;\n\n//# sourceURL=webpack://cloudinaryVideoPlayer/./plugins/context-menu/contextMenuContent.js?");
 
 /***/ }),