cloudinary-video-player/dist/playlist.js

Cloudinary Video Player

/*!
 * Cloudinary Video Player v3.2.1
 * Built on 2025-08-12T18:54:00.175Z
 * https://github.com/cloudinary/cloudinary-video-player
 */
/*
 * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
 * This devtool is neither made for production nor for readable output files.
 * It uses "eval()" calls to create a separate source file in the browser devtools.
 * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
 * or disable the default devtool with "devtool: false".
 * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
 */
(self["cloudinaryVideoPlayerChunkLoading"] = self["cloudinaryVideoPlayerChunkLoading"] || []).push([["playlist"],{

/***/ "./plugins/playlist/playlist.js":
/*!**************************************!*\
  !*** ./plugins/playlist/playlist.js ***!
  \**************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var utils_slicing__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! utils/slicing */ \"./utils/slicing.js\");\n/* harmony import */ var utils_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! utils/consts */ \"./utils/consts.js\");\n/* harmony import */ var plugins_cloudinary_common__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! plugins/cloudinary/common */ \"./plugins/cloudinary/common.js\");\n/* harmony import */ var _utils_api__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils/api */ \"./plugins/playlist/utils/api.js\");\n/* harmony import */ var _ui_playlist__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ui/playlist */ \"./plugins/playlist/ui/playlist.js\");\n/* harmony import */ var _ui_playlist_widget__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./ui/playlist-widget */ \"./plugins/playlist/ui/playlist-widget.js\");\n/* harmony import */ var _ui_panel_playlist_panel__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./ui/panel/playlist-panel */ \"./plugins/playlist/ui/panel/playlist-panel.js\");\n\n\n\n\n\n\n\nconst LIST_BY_TAG_PARAMS = {\n  format: 'json',\n  resource_type: 'video',\n  type: 'list'\n};\nconst playlist = function (player) {\n  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n  const chainTarget = (0,utils_slicing__WEBPACK_IMPORTED_MODULE_0__.sliceProperties)(options, 'chainTarget').chainTarget;\n  let playlistInstance = null;\n  let playlistDisposer = null;\n  let playlistWidget = null;\n  const initPlaylistWidget = () => {\n    player.on(utils_consts__WEBPACK_IMPORTED_MODULE_1__.PLAYER_EVENT.PLAYLIST_CREATED, () => {\n      if (playlistWidget) {\n        playlistWidget.dispose();\n      }\n      if (options.playlistWidget?.show != false) {\n        if (player.fluid_) {\n          options.playlistWidget.fluid = true;\n        }\n        if (player.cloudinary.fontFace) {\n          options.playlistWidget.fontFace = player.cloudinary.fontFace;\n        }\n        playlistWidget = new _ui_playlist_widget__WEBPACK_IMPORTED_MODULE_5__[\"default\"](player, options.playlistWidget);\n      }\n    });\n  };\n  const disposePlaylist = () => {\n    player.removeClass('vjs-playlist');\n    playlistInstance = undefined;\n    player.playlist().dispose();\n    player.off('cldsourcechanged', playlistDisposer);\n  };\n  const addPlaylistDisposer = () => {\n    const disposer = () => {\n      if (playlistInstance && !playlistInstance.currentSource().contains(player.currentSource())) {\n        player.disposePlaylist();\n      }\n    };\n    player.on('cldsourcechanged', disposer);\n    return disposer;\n  };\n  const createPlaylist = (sources, options) => {\n    if (sources instanceof _ui_playlist__WEBPACK_IMPORTED_MODULE_4__[\"default\"]) {\n      playlistInstance = sources;\n      playlistInstance.resetState();\n      playlistInstance.currentIndex(playlistInstance.currentIndex());\n    } else {\n      playlistInstance = new _ui_playlist__WEBPACK_IMPORTED_MODULE_4__[\"default\"](player.cloudinary, sources, options);\n      playlistInstance.currentIndex(0);\n    }\n    initPlaylistWidget();\n    playlistDisposer = addPlaylistDisposer();\n    player.addClass('vjs-playlist');\n  };\n  player.cloudinary.sourcesByTag = async function (tag) {\n    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n    const url = (0,plugins_cloudinary_common__WEBPACK_IMPORTED_MODULE_2__.getCloudinaryUrl)(tag, Object.assign({}, player.cloudinary.cloudinaryConfig(), LIST_BY_TAG_PARAMS));\n    const result = await fetch(url);\n    const json = await result.json();\n    const resources = (0,_utils_api__WEBPACK_IMPORTED_MODULE_3__.normalizeJsonResponse)(json.resources);\n    if (options.sorter) {\n      resources.sort(options.sorter);\n    }\n    const sources = resources.map(resource => {\n      let sourceParams = options.sourceParams || {};\n      if (typeof sourceParams === 'function') {\n        sourceParams = sourceParams(resource);\n      }\n      const info = resource.context && resource.context.custom || {};\n      const source = Object.assign({\n        info\n      }, sourceParams, {\n        publicId: resource.publicId\n      });\n      return player.cloudinary.buildSource(source);\n    });\n    return sources;\n  };\n  return function (sources) {\n    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n    if (sources === undefined) {\n      return playlistInstance;\n    }\n    if (playlistInstance) {\n      disposePlaylist();\n    }\n    createPlaylist(sources, options);\n    player.trigger('playlistcreated');\n    return chainTarget;\n  };\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (playlist);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/playlist.js?");

/***/ }),

/***/ "./plugins/playlist/ui/components/playlist-button.js":
/*!***********************************************************!*\
  !*** ./plugins/playlist/ui/components/playlist-button.js ***!
  \***********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n\n\n// Get the ClickableComponent base class from Video.js\nconst ClickableComponent = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('ClickableComponent');\n\n// Create a common class for playlist buttons\nclass PlaylistButton extends ClickableComponent {\n  constructor(player, options) {\n    // It is important to invoke the superclass before anything else,\n    // to get all the features of components out of the box!\n    super(player, options);\n    const type = options.type;\n    if (!type && type !== 'previous' && type !== 'next') {\n      throw new Error('Type must be either \\'previous\\' or \\'next\\'');\n    }\n  }\n\n  // The `createEl` function of a component creates its DOM element.\n  createEl() {\n    const type = this.options_.type;\n    const typeCssClass = `vjs-icon-${type}-item`;\n    return video_js__WEBPACK_IMPORTED_MODULE_0___default().dom.createEl('button', {\n      // Prefixing classes of elements within a player with \"vjs-\"\n      // is a convention used in Video.js.\n      className: `vjs-control vjs-playlist-button vjs-button ${typeCssClass}`,\n      ariaLabel: `Playlist ${type} item`\n    });\n  }\n}\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistButton);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/components/playlist-button.js?");

/***/ }),

/***/ "./plugins/playlist/ui/components/playlist-buttons.js":
/*!************************************************************!*\
  !*** ./plugins/playlist/ui/components/playlist-buttons.js ***!
  \************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   PlaylistNextButton: () => (/* reexport safe */ _playlist_next_button__WEBPACK_IMPORTED_MODULE_0__[\"default\"]),\n/* harmony export */   PlaylistPreviousButton: () => (/* reexport safe */ _playlist_previous_button__WEBPACK_IMPORTED_MODULE_1__[\"default\"])\n/* harmony export */ });\n/* harmony import */ var _playlist_next_button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./playlist-next-button */ \"./plugins/playlist/ui/components/playlist-next-button.js\");\n/* harmony import */ var _playlist_previous_button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./playlist-previous-button */ \"./plugins/playlist/ui/components/playlist-previous-button.js\");\n/* harmony import */ var _playlist_buttons_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./playlist-buttons.scss */ \"./plugins/playlist/ui/components/playlist-buttons.scss\");\n\n\n\n\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/components/playlist-buttons.js?");

/***/ }),

/***/ "./plugins/playlist/ui/components/playlist-next-button.js":
/*!****************************************************************!*\
  !*** ./plugins/playlist/ui/components/playlist-next-button.js ***!
  \****************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _playlist_button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./playlist-button */ \"./plugins/playlist/ui/components/playlist-button.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_1__);\n\n\nclass PlaylistNextButton extends _playlist_button__WEBPACK_IMPORTED_MODULE_0__[\"default\"] {\n  constructor(player) {\n    super(player, {\n      type: 'next'\n    });\n  }\n  handleClick(event) {\n    event.stopPropagation();\n    super.handleClick(event);\n    this.player().cloudinary.playlist().playNext();\n  }\n}\nvideo_js__WEBPACK_IMPORTED_MODULE_1___default().registerComponent('PlaylistNextButton', PlaylistNextButton);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistNextButton);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/components/playlist-next-button.js?");

/***/ }),

/***/ "./plugins/playlist/ui/components/playlist-previous-button.js":
/*!********************************************************************!*\
  !*** ./plugins/playlist/ui/components/playlist-previous-button.js ***!
  \********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _playlist_button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./playlist-button */ \"./plugins/playlist/ui/components/playlist-button.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_1__);\n\n\nclass PlaylistPreviousButton extends _playlist_button__WEBPACK_IMPORTED_MODULE_0__[\"default\"] {\n  constructor(player) {\n    super(player, {\n      type: 'previous'\n    });\n  }\n  handleClick(event) {\n    super.handleClick(event);\n    this.player().cloudinary.playlist().playPrevious();\n  }\n}\nvideo_js__WEBPACK_IMPORTED_MODULE_1___default().registerComponent('PlaylistPreviousButton', PlaylistPreviousButton);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistPreviousButton);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/components/playlist-previous-button.js?");

/***/ }),

/***/ "./plugins/playlist/ui/components/upcoming-video-overlay.js":
/*!******************************************************************!*\
  !*** ./plugins/playlist/ui/components/upcoming-video-overlay.js ***!
  \******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _upcoming_video_overlay_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./upcoming-video-overlay.scss */ \"./plugins/playlist/ui/components/upcoming-video-overlay.scss\");\n/* harmony import */ var utils_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! utils/consts */ \"./utils/consts.js\");\n\n\n\n\n// support VJS5 & VJS6 at the same time\nconst dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());\nconst Component = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('Component');\nconst ClickableComponent = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('ClickableComponent');\nclass UpcomingVideoOverlay extends ClickableComponent {\n  static DISABLE_TRANSITION_CLASS = 'disable-transition';\n  static VJS_UPCOMING_VIDEO_SHOW = 'vjs-upcoming-video-show';\n  constructor(player) {\n    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n      args[_key - 1] = arguments[_key];\n    }\n    super(player, ...args);\n    this._setEvents(player);\n  }\n  _setEvents(player) {\n    player.on(utils_consts__WEBPACK_IMPORTED_MODULE_2__.PLAYER_EVENT.UP_COMING_VIDEO_SHOW, this._show);\n    player.on(utils_consts__WEBPACK_IMPORTED_MODULE_2__.PLAYER_EVENT.UP_COMING_VIDEO_HIDE, this._hide);\n    player.on(utils_consts__WEBPACK_IMPORTED_MODULE_2__.PLAYER_EVENT.PLAYLIST_ITEM_CHANGED, this._onPlaylistItemChange);\n  }\n  _hide = () => {\n    this.removeClass(UpcomingVideoOverlay.VJS_UPCOMING_VIDEO_SHOW);\n  };\n  _disableTransition(block) {\n    this.addClass(UpcomingVideoOverlay.DISABLE_TRANSITION_CLASS);\n    block();\n    this.removeClass(UpcomingVideoOverlay.DISABLE_TRANSITION_CLASS);\n  }\n  _onPlaylistItemChange = (_, event) => {\n    this._hide();\n    this._disableTransition(() => {\n      if (event.next) {\n        this.setItem(event.next);\n      }\n    });\n  };\n  _show = () => {\n    const ima = this.player().ima;\n    const adsManager = ima === 'object' && ima.getAdsManager();\n    if (adsManager) {\n      if (!adsManager.getCurrentAd() || adsManager.getCurrentAd().isLinear()) {\n        this.addClass(UpcomingVideoOverlay.VJS_UPCOMING_VIDEO_SHOW);\n      }\n    } else {\n      this.addClass(UpcomingVideoOverlay.VJS_UPCOMING_VIDEO_SHOW);\n    }\n  };\n  setTitle(source) {\n    const title = this.getChild('upcomingVideoOverlayContent').getChild('upcomingVideoOverlayBar').getChild('upcomingVideoOverlayTitle');\n    title.setContent(source.info().title || source.publicId());\n  }\n  setItem(source) {\n    this._source = source;\n    const maxWidth = parseInt(window.getComputedStyle(this.el(), null).getPropertyValue('max-width'), 10);\n    const maxHeight = Math.round(maxWidth * (9 / 16.0));\n    const transformation = {\n      crop: 'pad',\n      background: 'auto:predominant',\n      width: maxWidth,\n      height: maxHeight\n    };\n    const content = this.getChild('upcomingVideoOverlayContent');\n    this.setTitle(source);\n    content.el().style.backgroundImage = `url(\"${this._source.poster().url({\n      transformation\n    })}\")`;\n  }\n  handleClick() {\n    super.handleClick(event);\n    this.player().cloudinary.playlist().playNext();\n  }\n  createEl() {\n    return super.createEl('div', {\n      className: 'vjs-upcoming-video'\n    });\n  }\n}\nclass UpcomingVideoOverlayContent extends Component {\n  createEl() {\n    // Content wraps image and bar\n    return super.createEl('div', {\n      className: 'upcoming-video-overlay aspect-ratio-content'\n    });\n  }\n}\nclass UpcomingVideoOverlayTitle extends Component {\n  setContent(title) {\n    this._contentSpan.innerText = title;\n  }\n  createEl() {\n    const el = super.createEl('div', {\n      className: 'vjs-control vjs-upcoming-video-title'\n    });\n    const container = dom.createEl('div', {\n      className: 'vjs-upcoming-video-title-display',\n      innerHTML: '<span class=\"vjs-control-text\">Next up</span>Next up: '\n    });\n    this._contentSpan = dom.createEl('span', {\n      className: 'vjs-upcoming-video-title-display-label'\n    });\n    container.appendChild(this._contentSpan);\n    el.appendChild(container);\n    return el;\n  }\n}\nclass UpcomingVideoOverlayBar extends Component {\n  createEl() {\n    return super.createEl('div', {\n      className: 'vjs-upcoming-video-bar'\n    });\n  }\n}\nUpcomingVideoOverlay.prototype.options_ = {\n  children: ['upcomingVideoOverlayContent']\n};\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('upcomingVideoOverlay', UpcomingVideoOverlay);\nUpcomingVideoOverlayContent.prototype.options_ = {\n  children: ['upcomingVideoOverlayBar']\n};\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('upcomingVideoOverlayContent', UpcomingVideoOverlayContent);\nUpcomingVideoOverlayBar.prototype.options_ = {\n  children: ['upcomingVideoOverlayTitle', 'playlistNextButton']\n};\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('upcomingVideoOverlayBar', UpcomingVideoOverlayBar);\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('upcomingVideoOverlayTitle', UpcomingVideoOverlayTitle);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (UpcomingVideoOverlay);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/components/upcoming-video-overlay.js?");

/***/ }),

/***/ "./plugins/playlist/ui/layout/playlist-layout-custom.js":
/*!**************************************************************!*\
  !*** ./plugins/playlist/ui/layout/playlist-layout-custom.js ***!
  \**************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _playlist_layout__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./playlist-layout */ \"./plugins/playlist/ui/layout/playlist-layout.js\");\n\nclass PlaylistLayoutCustom extends _playlist_layout__WEBPACK_IMPORTED_MODULE_0__[\"default\"] {\n  getCls() {\n    let cls = super.getCls();\n    cls.push('cld-plw-custom');\n    return cls;\n  }\n  createEl() {\n    const el = super.createEl();\n    this.options_.renderTo.appendChild(el);\n    return el;\n  }\n}\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistLayoutCustom);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/layout/playlist-layout-custom.js?");

/***/ }),

/***/ "./plugins/playlist/ui/layout/playlist-layout-horizontal.js":
/*!******************************************************************!*\
  !*** ./plugins/playlist/ui/layout/playlist-layout-horizontal.js ***!
  \******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _playlist_layout__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./playlist-layout */ \"./plugins/playlist/ui/layout/playlist-layout.js\");\n\nclass PlaylistLayoutHorizontal extends _playlist_layout__WEBPACK_IMPORTED_MODULE_0__[\"default\"] {\n  constructor(player, options) {\n    options.wrap = true;\n    super(player, options);\n  }\n  getCls() {\n    const cls = super.getCls();\n    cls.push('cld-plw-horizontal');\n    return cls;\n  }\n}\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistLayoutHorizontal);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/layout/playlist-layout-horizontal.js?");

/***/ }),

/***/ "./plugins/playlist/ui/layout/playlist-layout-vertical.js":
/*!****************************************************************!*\
  !*** ./plugins/playlist/ui/layout/playlist-layout-vertical.js ***!
  \****************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _playlist_layout__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./playlist-layout */ \"./plugins/playlist/ui/layout/playlist-layout.js\");\n\nclass PlaylistLayoutVertical extends _playlist_layout__WEBPACK_IMPORTED_MODULE_0__[\"default\"] {\n  constructor(player, options) {\n    options.wrap = true;\n    super(player, options);\n  }\n  getCls() {\n    const cls = super.getCls();\n    cls.push('cld-plw-vertical');\n    return cls;\n  }\n}\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistLayoutVertical);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/layout/playlist-layout-vertical.js?");

/***/ }),

/***/ "./plugins/playlist/ui/layout/playlist-layout.js":
/*!*******************************************************!*\
  !*** ./plugins/playlist/ui/layout/playlist-layout.js ***!
  \*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var utils_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! utils/consts */ \"./utils/consts.js\");\n/* harmony import */ var _utils_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../utils/dom */ \"./plugins/playlist/utils/dom.js\");\n/* harmony import */ var utils_css_prefix__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! utils/css-prefix */ \"./utils/css-prefix.js\");\n\n\n\n\nconst dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());\nconst Component = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('Component');\nconst OPTIONS_DEFAULT = {\n  wrap: false\n};\nclass PlaylistLayout extends Component {\n  constructor(player, options) {\n    const layoutOptions = {\n      ...OPTIONS_DEFAULT,\n      ...options\n    };\n    super(player, layoutOptions);\n    this.player_ = player;\n    const fluidHandler = (e, fluid) => {\n      this.options_.fluid = fluid;\n      this.removeCls();\n      this.setCls();\n    };\n    const wrapVideoWithLayout = () => {\n      const el = this.el();\n      this.videoWrap_ = dom.createEl('div', {\n        className: 'cld-plw-col-player'\n      });\n      this.contentEl_ = this.contentEl_ = dom.createEl('div', {\n        className: 'cld-plw-col-list'\n      });\n      (0,_utils_dom__WEBPACK_IMPORTED_MODULE_2__.wrap)(this.player().el(), el);\n      el.appendChild(this.videoWrap_);\n      el.appendChild(this.contentEl_);\n      (0,_utils_dom__WEBPACK_IMPORTED_MODULE_2__.wrap)(this.player().el(), this.videoWrap_);\n    };\n    if (layoutOptions.wrap) {\n      wrapVideoWithLayout();\n    }\n    player.on(utils_consts__WEBPACK_IMPORTED_MODULE_1__.PLAYER_EVENT.FLUID, fluidHandler);\n    this.addChild(utils_consts__WEBPACK_IMPORTED_MODULE_1__.PLAYER_EVENT.PLAYLIST_PANEL, this.options_);\n    this.setCls();\n    this.dispose = () => {\n      this.removeLayout();\n      super.dispose();\n      player.off(utils_consts__WEBPACK_IMPORTED_MODULE_1__.PLAYER_EVENT.FLUID, fluidHandler);\n    };\n  }\n  getCls() {\n    let cls = ['cld-video-player', 'cld-plw-layout'];\n    cls.push((0,utils_css_prefix__WEBPACK_IMPORTED_MODULE_3__.skinClassPrefix)(this.player()));\n    cls.push((0,utils_css_prefix__WEBPACK_IMPORTED_MODULE_3__.playerClassPrefix)(this.player()));\n    if (this.options_.fluid) {\n      cls.push('cld-plw-layout-fluid');\n    }\n    return cls;\n  }\n  setCls() {\n    this.removeClass((0,utils_css_prefix__WEBPACK_IMPORTED_MODULE_3__.skinClassPrefix)(this.player()));\n    this.getCls().forEach(cls => {\n      this.addClass(cls);\n    });\n  }\n  removeCls() {\n    this.getCls().forEach(cls => {\n      this.removeClass(cls);\n    });\n  }\n  update(optionToChange, options) {\n    this.options(options);\n    this.removeChild('PlaylistPanel');\n    this.addChild('PlaylistPanel', this.options_);\n    this.trigger('playlistlayoutupdate');\n  }\n  removeLayout() {\n    const parentElem = this.el().parentElement;\n    if (parentElem) {\n      parentElem.appendChild(this.player().el());\n    }\n  }\n  createEl() {\n    const el = super.createEl('div');\n\n    // Apply font styles on wrapper div.\n    el.style.fontFamily = this.player().el().style.fontFamily;\n    return el;\n  }\n}\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('playlistLayout', PlaylistLayout);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistLayout);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/layout/playlist-layout.js?");

/***/ }),

/***/ "./plugins/playlist/ui/panel/playlist-panel-item.js":
/*!**********************************************************!*\
  !*** ./plugins/playlist/ui/panel/playlist-panel-item.js ***!
  \**********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _thumbnail_thumbnail__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../thumbnail/thumbnail */ \"./plugins/playlist/ui/thumbnail/thumbnail.js\");\n\n\nconst dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());\nconst DEFAULT_OPTIONS = {\n  source: null,\n  next: false\n};\nclass PlaylistPanelItem extends _thumbnail_thumbnail__WEBPACK_IMPORTED_MODULE_1__[\"default\"] {\n  constructor(player, initOptions) {\n    const options = video_js__WEBPACK_IMPORTED_MODULE_0___default().obj.merge(DEFAULT_OPTIONS, initOptions);\n    super(player, options);\n  }\n  handleClick(event) {\n    super.handleClick(event);\n    this.play();\n  }\n  play() {\n    const item = this.getItem();\n    const list = this.player().cloudinary.playlist().list();\n    const index = list.indexOf(item);\n    if (index === -1) {\n      throw new Error('Invalid playlist item...');\n    }\n    this.player().cloudinary.playlist().playAtIndex(index);\n  }\n  isCurrent() {\n    return this.options_.current;\n  }\n  getTitle() {\n    return super.getTitle();\n  }\n  getDuration() {\n    return super.getDuration();\n  }\n  createEl() {\n    const el = super.createEl();\n    el.classList.add('cld-plw-panel-item');\n    const info = dom.createEl('div', {\n      className: 'cld-plw-item-info-wrap'\n    });\n    const titleWrap = dom.createEl('div', {\n      className: 'cld-plw-item-title'\n    });\n    if (this.isCurrent()) {\n      el.classList.add('cld-plw-panel-item-active');\n      const currEl = dom.createEl('span', {\n        className: 'cld-plw-item-title-curr'\n      }, {}, 'Now Playing: ');\n      titleWrap.appendChild(currEl);\n    }\n    const title = dom.createEl('span', {\n      className: 'cld-plw-item-title'\n    }, {}, this.getTitle());\n    titleWrap.appendChild(title);\n    const duration = dom.createEl('div', {\n      className: 'cld-plw-item-duration'\n    }, {}, this.getDuration());\n    info.appendChild(titleWrap);\n    info.appendChild(duration);\n    if (el) {\n      el.appendChild(info);\n    }\n    el.appendChild(info);\n    return el;\n  }\n}\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('playlistPanelItem', PlaylistPanelItem);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistPanelItem);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/panel/playlist-panel-item.js?");

/***/ }),

/***/ "./plugins/playlist/ui/panel/playlist-panel.js":
/*!*****************************************************!*\
  !*** ./plugins/playlist/ui/panel/playlist-panel.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _playlist_panel_item__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./playlist-panel-item */ \"./plugins/playlist/ui/panel/playlist-panel-item.js\");\n/* harmony import */ var utils_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! utils/consts */ \"./utils/consts.js\");\n\n\n\nconst Component = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('Component');\nclass PlaylistPanel extends Component {\n  constructor(player) {\n    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n    super(player, options);\n    const itemChangeHandler = () => {\n      this.render();\n    };\n    player.on(utils_consts__WEBPACK_IMPORTED_MODULE_2__.PLAYER_EVENT.PLAYLIST_ITEM_CHANGED, itemChangeHandler);\n    this.render();\n    this.dispose = () => {\n      super.dispose();\n      player.off(utils_consts__WEBPACK_IMPORTED_MODULE_2__.PLAYER_EVENT.PLAYLIST_ITEM_CHANGED, itemChangeHandler);\n    };\n  }\n  createEl() {\n    const el = super.createEl();\n    el.classList.add('cld-plw-panel');\n    return el;\n  }\n  removeAll() {\n    const children = this.children();\n    for (let i = children.length - 1; i >= 0; --i) {\n      this.removeChild(children[i]);\n    }\n  }\n  getItems() {\n    const playlist = this.player().cloudinary.playlist();\n    const repeat = playlist._repeat;\n    if (this.options_.showAll) {\n      return playlist.list();\n    }\n    const items = [];\n    const numOfItems = this.options_.total;\n    let index = playlist.currentIndex();\n    let source = playlist.list()[index];\n    items.push(source);\n    while (items.length < numOfItems) {\n      index = playlist.nextIndex(index);\n      if (index === -1) {\n        if (!repeat && items.length > 0) {\n          break;\n        }\n        index = 0;\n      }\n      source = playlist.list()[index];\n      items.push(source);\n    }\n    return items;\n  }\n  render() {\n    const items = this.getItems();\n    this.removeAll();\n    items.forEach((source, index) => {\n      const playlistItem = new _playlist_panel_item__WEBPACK_IMPORTED_MODULE_1__[\"default\"](this.player(), video_js__WEBPACK_IMPORTED_MODULE_0___default().obj.merge(this.options_, {\n        item: source,\n        next: index === 1,\n        current: index === 0\n      }));\n      this.addChild(playlistItem);\n    });\n  }\n}\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('playlistPanel', PlaylistPanel);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistPanel);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/panel/playlist-panel.js?");

/***/ }),

/***/ "./plugins/playlist/ui/playlist-widget.js":
/*!************************************************!*\
  !*** ./plugins/playlist/ui/playlist-widget.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var utils_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! utils/consts */ \"./utils/consts.js\");\n/* harmony import */ var _layout_playlist_layout_horizontal__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./layout/playlist-layout-horizontal */ \"./plugins/playlist/ui/layout/playlist-layout-horizontal.js\");\n/* harmony import */ var _layout_playlist_layout_vertical__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./layout/playlist-layout-vertical */ \"./plugins/playlist/ui/layout/playlist-layout-vertical.js\");\n/* harmony import */ var _layout_playlist_layout_custom__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./layout/playlist-layout-custom */ \"./plugins/playlist/ui/layout/playlist-layout-custom.js\");\n/* harmony import */ var _playlist_const__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./playlist.const */ \"./plugins/playlist/ui/playlist.const.js\");\n\n\n\n\n\n\nconst modifyOptions = (player, opt) => {\n  const options = {\n    ..._playlist_const__WEBPACK_IMPORTED_MODULE_5__.PLAYLIST_DEFAULTS_OPTIONS,\n    ...opt\n  };\n  if (options.show && typeof options.selector === 'string') {\n    options.useDefaultLayout = false;\n    options.useCustomLayout = true;\n    options.renderTo = document.querySelector(options.selector);\n    options.showAll = true;\n    if (!options.renderTo.length === 0) {\n      throw new Error(`Couldn't find element(s) by selector '${options.selector}' for playlist`);\n    }\n  }\n  if (options.show && !options.selector) {\n    options.useDefaultLayout = true;\n    options.useCustomLayout = false;\n  }\n  options.direction = options.direction.toLowerCase() === 'horizontal' ? 'horizontal' : 'vertical';\n  options.skin = player.options_.skin;\n  return options;\n};\nclass PlaylistWidget {\n  constructor(player) {\n    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n    options = modifyOptions(player, options);\n    this.options_ = options;\n    this.player_ = player;\n    this.render();\n    const fluidHandler = (e, fluid) => {\n      this.options_.fluid = fluid;\n    };\n    player.on(utils_consts__WEBPACK_IMPORTED_MODULE_1__.PLAYER_EVENT.FLUID, fluidHandler);\n    this.options = options => {\n      if (!options) {\n        return this.options_;\n      }\n      this.options_ = video_js__WEBPACK_IMPORTED_MODULE_0___default().obj.merge(this.options_, options);\n      player.trigger('playlistwidgetoption', this.options_.playlistWidget);\n      return this.options_;\n    };\n    this.dispose = () => {\n      this.layout_.dispose();\n      player.off(utils_consts__WEBPACK_IMPORTED_MODULE_1__.PLAYER_EVENT.FLUID, fluidHandler);\n    };\n  }\n  render() {\n    if (this.options_.useDefaultLayout) {\n      if (this.options_.direction === 'horizontal') {\n        this.layout_ = new _layout_playlist_layout_horizontal__WEBPACK_IMPORTED_MODULE_2__[\"default\"](this.player_, this.options_);\n      } else {\n        this.layout_ = new _layout_playlist_layout_vertical__WEBPACK_IMPORTED_MODULE_3__[\"default\"](this.player_, this.options_);\n      }\n    }\n    if (this.options_.useCustomLayout) {\n      this.layout_ = new _layout_playlist_layout_custom__WEBPACK_IMPORTED_MODULE_4__[\"default\"](this.player_, this.options_);\n    }\n  }\n  getLayout() {\n    return this.layout_;\n  }\n  update(optionName, optionValue) {\n    this.options(optionValue);\n    if (optionName === 'direction') {\n      this.layout_.removeLayout();\n      this.layout_.dispose();\n      this.render();\n    } else {\n      this.layout_.update(optionName, this.options_);\n    }\n  }\n  setSkin() {\n    this.layout_.setCls();\n  }\n  total() {\n    let totalNumber = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _playlist_const__WEBPACK_IMPORTED_MODULE_5__.PLAYLIST_DEFAULTS_OPTIONS.total;\n    const total = parseInt(totalNumber, 10);\n    if (total !== this.options_.total && typeof total === 'number' && total > 0) {\n      this.update('total', {\n        total: total\n      });\n    }\n    return this;\n  }\n  direction() {\n    let direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _playlist_const__WEBPACK_IMPORTED_MODULE_5__.PLAYLIST_DEFAULTS_OPTIONS.direction;\n    if (direction === 'horizontal' || direction === 'vertical') {\n      this.update('direction', {\n        direction: direction\n      });\n    }\n    return this;\n  }\n}\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlaylistWidget);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/playlist-widget.js?");

/***/ }),

/***/ "./plugins/playlist/ui/playlist.const.js":
/*!***********************************************!*\
  !*** ./plugins/playlist/ui/playlist.const.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   DEFAULT_AUTO_ADVANCE: () => (/* binding */ DEFAULT_AUTO_ADVANCE),\n/* harmony export */   DEFAULT_PRESENT_UPCOMING: () => (/* binding */ DEFAULT_PRESENT_UPCOMING),\n/* harmony export */   PLAYLIST_DEFAULTS_OPTIONS: () => (/* binding */ PLAYLIST_DEFAULTS_OPTIONS),\n/* harmony export */   UPCOMING_VIDEO_TRANSITION: () => (/* binding */ UPCOMING_VIDEO_TRANSITION)\n/* harmony export */ });\nconst DEFAULT_AUTO_ADVANCE = 0;\nconst DEFAULT_PRESENT_UPCOMING = 10;\nconst UPCOMING_VIDEO_TRANSITION = 1;\nconst PLAYLIST_DEFAULTS_OPTIONS = {\n  fluid: false,\n  show: true,\n  direction: 'vertical',\n  total: 4,\n  selector: false,\n  renderTo: []\n};\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/playlist/ui/playlist.const.js?");

/***/ }),

/***/ "./plugins/playlist/ui/playlist.js":
/*!*****************************************!*\
  !*** ./plugins/playlist/ui/playlist.js ***!
  \*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var plugins_cloudinary_models_video_source_video_source__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! plugins/cloudinary/models/video-source/video-source */ \"./plugins/cloudinary/models/video-source/video-source.js\");\n/* harmony import */ var lodash_isInteger__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/isInteger */ \"../node_modules/lodash/isInteger.js\");\n/* harmony import */ var lodash_isInteger__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_isInteger__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _components_upcoming_video_overlay__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/upcoming-video-overlay */ \"./plugins/playlist/ui/components/upcoming-video-overlay.js\");\n/* harmony import */ var _components_playlist_buttons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/playlist-buttons */ \"./plugins/playlist/ui/components/playlist-buttons.js\");\n/* harmony import */ var _playlist_const__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./playlist.const */ \"./plugins/playlist/ui/playlist.const.js\");\n/* harmony import */ var _playlist_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./playlist.scss */ \"./plugins/playlist/ui/playlist.scss\");\n\n\n\n\n\n\nclass Playlist {\n  constructor(context) {\n    let sources = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];\n    let {\n      repeat = false,\n      autoAdvance = false,\n      presentUpcoming = false\n    } = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n    this._context = context;\n    this._sources = [];\n    this._defaultRecResolverCache = {};\n    this._currentIndex = null;\n    this._recommendationsHandler = null;\n    this._autoAdvance = null;\n    this._presentUpcoming = null;\n    this.addUiComponents();\n    this.resetState = () => {\n      this.repeat(repeat);\n      this.autoAdvance(autoAdvance);\n      this.presentUpcoming(presentUpcoming);\n    };\n    sources.forEach(source => this.enqueue(source));\n    this.resetState();\n  }\n  list() {\n    return this._sources;\n  }\n  player() {\n    return this._context.player;\n  }\n  addUiComponents() {\n    const controlBar = this.player().getChild('ControlBar');\n    const children = controlBar.children();\n    controlBar.addChild('playlistPreviousButton', {}, children.findIndex(c => c.name_ === 'PlayToggle'));\n    controlBar.addChild('playlistNextButton', {}, children.findIndex(c => c.name_ === 'PlayToggle') + 1);\n    this.player().addChild('upcomingVideoOverlay');\n  }\n  presentUpcoming(delay) {\n    this._presentUpcoming = this._presentUpcoming || {};\n    if (delay === undefined) {\n      return this._presentUpcoming.delay;\n    }\n    if (delay === true) {\n      delay = _playlist_const__WEBPACK_IMPORTED_MODULE_4__.DEFAULT_PRESENT_UPCOMING;\n    } else if (delay === false) {\n      delay = false;\n    } else if (!lodash_isInteger__WEBPACK_IMPORTED_MODULE_1___default()(delay) || delay < 0) {\n      throw new Error('presentUpcoming \\'delay\\' must be either a boolean or a positive integer.');\n    }\n    this._presentUpcoming.delay = delay;\n    this._setupPresentUpcoming();\n    return this._presentUpcoming.delay;\n  }\n  autoAdvance(delay) {\n    this._autoAdvance = this._autoAdvance || {};\n    if (delay === undefined) {\n      return this._autoAdvance.delay;\n    }\n    if (delay === true) {\n      delay = _playlist_const__WEBPACK_IMPORTED_MODULE_4__.DEFAULT_AUTO_ADVANCE;\n    } else if (delay === false) {\n      delay = false;\n    } else if (!lodash_isInteger__WEBPACK_IMPORTED_MODULE_1___default()(delay) || delay < 0) {\n      throw new Error('Auto advance \\'delay\\' must be either a boolean or a positive integer.');\n    }\n    this._autoAdvance.delay = delay;\n    this._setupAutoAdvance();\n    return this._autoAdvance.delay;\n  }\n  _setupAutoAdvance() {\n    this._resetAutoAdvance();\n    const delay = this._autoAdvance.delay;\n    if (delay === false) {\n      return;\n    }\n    const trigger = () => {\n      if (this.player().ended()) {\n        this._autoAdvance.timeout = setTimeout(() => {\n          this.playNext();\n        }, delay * 1000);\n      }\n    };\n    this._autoAdvance = {\n      delay,\n      trigger\n    };\n    this._context.on('ended', this._autoAdvance.trigger);\n  }\n  dispose() {\n    this._resetAutoAdvance();\n    this._resetPresentUpcoming();\n    this._resetRecommendations();\n  }\n  _resetPresentUpcoming() {\n    this.player().trigger('upcomingvideohide');\n    if (!this._presentUpcoming) {\n      this._presentUpcoming = {};\n    }\n    if (this._presentUpcoming.trigger) {\n      this._context.off('timeupdate', this._presentUpcoming.trigger);\n    }\n    this._presentUpcoming.trigger = null;\n    this._presentUpcoming.showTriggered = false;\n  }\n  _setupPresentUpcoming() {\n    this._resetPresentUpcoming();\n    const delay = this._presentUpcoming.delay;\n    if (delay === false) {\n      return;\n    }\n    this._presentUpcoming.trigger = () => {\n      const currentTime = this.player().currentTime();\n      const duration = this.player().duration();\n      const remainingTime = duration - currentTime;\n      if (remainingTime < _playlist_const__WEBPACK_IMPORTED_MODULE_4__.UPCOMING_VIDEO_TRANSITION + 0.5) {\n        if (this._presentUpcoming.showTriggered) {\n          this.player().trigger('upcomingvideohide');\n          this._presentUpcoming.showTriggered = false;\n        }\n      } else if (remainingTime <= this._presentUpcoming.delay && !this._presentUpcoming.showTriggered && !this.player().loop()) {\n        this.player().trigger('upcomingvideoshow');\n        this._presentUpcoming.showTriggered = true;\n      } else if (this._presentUpcoming.showTriggered && (remainingTime > this._presentUpcoming.delay || this.player().loop())) {\n        this.player().trigger('upcomingvideohide');\n        this._presentUpcoming.showTriggered = false;\n      }\n    };\n    this._context.on('timeupdate', this._presentUpcoming.trigger);\n  }\n  _resetAutoAdvance() {\n    if (!this._autoAdvance) {\n      this._autoAdvance = {};\n    }\n    if (this._autoAdvance.timeout) {\n      clearTimeout(this._autoAdvance.timeout);\n    }\n    if (this._autoAdvance.trigger) {\n      this._context.off('ended', this._autoAdvance.trigger);\n    }\n    this._autoAdvance.timeout = null;\n    this._autoAdvance.trigger = null;\n  }\n  _resetRecommendations() {\n    if (this._recommendationsHandler) {\n      this._context.off('ended', this._recommendationsHandler);\n    }\n  }\n  _refreshRecommendations() {\n    this._resetRecommendations();\n    this._recommendationsHandler = () => {\n      if (this.autoAdvance() === false && this._context.autoShowRecommendations()) {\n        this.player().trigger('recommendationsshow');\n      }\n    };\n    this._context.on('ended', this._recommendationsHandler);\n  }\n  _refreshTextTracks() {\n    this.player().trigger('refreshTextTracks', this.currentSource().textTracks());\n  }\n  _recommendationItemBuilder(source) {\n    const defaultResolver = this._defaultRecResolverCache[source.objectId];\n    if (source.recommendations() && (!defaultResolver || source.recommendations() !== defaultResolver)) {\n      return;\n    }\n    return source => ({\n      source,\n      action: () => this.playItem(source)\n    });\n  }\n  currentIndex(index) {\n    if (index === undefined) {\n      return this._currentIndex;\n    }\n    if (index >= this.length() || index < 0) {\n      throw new Error('Invalid playlist index.');\n    }\n    this._currentIndex = index;\n    const current = this.currentSource();\n    const itemBuilder = this._recommendationItemBuilder(current);\n    if (!current.recommendations()) {\n      current.recommendations(this._defaultRecommendationsResolver(current));\n    }\n\n    // Extract source options for analytics\n    const sourc