cloudinary-video-player 2.0.2-edge.2 → 2.0.2

package/dist/interaction-areas.light.js

@@ -131,7 +131,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _utils_dom__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../utils/dom */ "./utils/dom.js");
 /* harmony import */ var _video_player_utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../video-player.utils */ "./video-player.utils.js");
 /* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../utils/consts */ "./utils/consts.js");
-/* harmony import */ var _interaction_areas_scss_style_loader__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./interaction-areas.scss?style-loader */ "./plugins/interaction-areas/interaction-areas.scss?style-loader");
+/* harmony import */ var _interaction_areas_scss__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./interaction-areas.scss */ "./plugins/interaction-areas/interaction-areas.scss");
 
 
 
@@ -600,364 +600,6 @@ const setInteractionAreasContainerSize = (videojs, videoElement) => {
   interactionAreasContainer.style.height = videoElement.clientWidth < width ? "".concat(videoElement.clientWidth / videoAspectRatio, "px") : '100%';
 };
 
-/***/ }),
-
-/***/ "../node_modules/css-loader/dist/cjs.js!../node_modules/sass-loader/dist/cjs.js!./plugins/interaction-areas/interaction-areas.scss?style-loader":
-/*!******************************************************************************************************************************************************!*\
-  !*** ../node_modules/css-loader/dist/cjs.js!../node_modules/sass-loader/dist/cjs.js!./plugins/interaction-areas/interaction-areas.scss?style-loader ***!
-  \******************************************************************************************************************************************************/
-/***/ ((module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../node_modules/css-loader/dist/runtime/sourceMaps.js */ "../node_modules/css-loader/dist/runtime/sourceMaps.js");
-/* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../node_modules/css-loader/dist/runtime/api.js */ "../node_modules/css-loader/dist/runtime/api.js");
-/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);
-// Imports
-
-
-var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
-// Module
-___CSS_LOADER_EXPORT___.push([module.id, `.cld-video-player.vjs-user-active .interaction-areas-container {
-  display: block;
-}
-.cld-video-player.interaction-areas .vjs-big-play-button {
-  display: none !important;
-}
-.cld-video-player .interaction-areas-container {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  display: none;
-  z-index: 1;
-}
-.cld-video-player .interaction-areas-container:hover {
-  display: block;
-}
-.cld-video-player .interaction-areas-container .go-back-button,
-.cld-video-player .interaction-areas-container .vp-ia-item {
-  position: absolute;
-  cursor: pointer;
-}
-.cld-video-player .interaction-areas-container .go-back-button {
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-}
-.cld-video-player .interaction-areas-container .vp-ia-item {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  transition: top, left, width, height;
-  transition-timing-function: linear;
-}
-.cld-video-player .interaction-areas-container .vp-ia-item.theme-shadowed .vp-ia-marker-shadow {
-  opacity: 0.24;
-}
-.cld-video-player .interaction-areas-container .vp-ia-item.theme-pulsing .vp-ia-marker-shadow {
-  -webkit-animation: pulsing-animation 1.3s ease-out;
-  -webkit-animation-iteration-count: infinite;
-  border: solid 2px;
-  opacity: 0;
-}
-.cld-video-player .interaction-areas-container .vp-ia-item:hover .vp-ia-marker-main:before {
-  content: "";
-  width: 20px;
-  height: 20px;
-  border: solid 2px rgba(0, 0, 0, 0.25);
-}
-.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker {
-  position: relative;
-  width: 20px;
-  height: 20px;
-}
-.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-main,
-.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-main:before,
-.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-shadow {
-  position: absolute;
-  border-radius: 50%;
-  transform: translate(-50%, -50%);
-  top: 50%;
-  left: 50%;
-}
-.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-main {
-  background-color: white;
-  border: solid 2px;
-  height: 100%;
-  width: 100%;
-}
-.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-shadow {
-  width: 28px;
-  height: 28px;
-}
-.cld-video-player .interaction-areas-container.vp-ia-layout-message {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-  z-index: 2;
-  background-color: rgba(0, 0, 0, 0.5);
-}
-.cld-video-player .interaction-areas-container.vp-ia-layout-message.clickable {
-  cursor: pointer;
-}
-.cld-video-player .interaction-areas-container.vp-ia-layout-message.clickable:hover .vp-theme-button {
-  background-color: rgba(255, 255, 254, 0.28);
-}
-.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-icon {
-  margin-bottom: 20px;
-  height: 60px;
-}
-.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-message-title {
-  font-size: 24px;
-  line-height: 34px;
-  text-align: center;
-}
-.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-theme-button {
-  margin: 8px 0 18px 0;
-}
-.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-message-do-not-show {
-  display: flex;
-  align-items: center;
-}
-.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-message-do-not-show > * {
-  cursor: pointer;
-}
-.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-message-do-not-show .vp-ia-layout-message-checkbox-title {
-  margin: 0 0 0 5px;
-}
-
-@-webkit-keyframes pulsing-animation {
-  0% {
-    height: 10px;
-    width: 10px;
-    opacity: 0;
-  }
-  50% {
-    height: 20px;
-    width: 20px;
-    opacity: 1;
-  }
-  100% {
-    height: 40px;
-    width: 40px;
-    opacity: 0;
-  }
-}`, "",{"version":3,"sources":["webpack://./plugins/interaction-areas/interaction-areas.scss"],"names":[],"mappings":"AAUI;EACE,cAAA;AATN;AAeI;EACE,wBAAA;AAbN;AAiBE;EACE,kBAAA;EACA,WAAA;EACA,YAAA;EACA,QAAA;EACA,SAAA;EACA,gCAAA;EACA,aAAA;EACA,UAAA;AAfJ;AAiBI;EACE,cAAA;AAfN;AAkBI;;EAEE,kBAAA;EACA,eAAA;AAhBN;AAmBI;EACE,MAAA;EACA,OAAA;EACA,WAAA;EACA,YAAA;AAjBN;AAoBI;EACE,oBAAA;EACA,mBAAA;EACA,uBAAA;EACA,oCAAA;EACA,kCAAA;AAlBN;AAsBQ;EACE,aAAA;AApBV;AA2BQ;EACE,kDAAA;EACA,2CAAA;EACA,iBAAA;EACA,UAAA;AAzBV;AA8BQ;EACE,WAAA;EACA,WA3EqB;EA4ErB,YA5EqB;EA6ErB,qCAAA;AA5BV;AAgCM;EACE,kBAAA;EACA,WAnFuB;EAoFvB,YApFuB;AAsD/B;AAgCQ;;;EAGE,kBAAA;EACA,kBAAA;EACA,gCAAA;EACA,QAAA;EACA,SAAA;AA9BV;AAiCQ;EACE,uBAAA;EACA,iBAAA;EACA,YAAA;EACA,WAAA;AA/BV;AAkCQ;EACE,WAAA;EACA,YAAA;AAhCV;AAqCI;EACE,aAAA;EACA,sBAAA;EACA,mBAAA;EACA,uBAAA;EACA,YAAA;EACA,UAAA;EACA,oCAAA;AAnCN;AAqCM;EACE,eAAA;AAnCR;AAqCQ;EACE,2CAAA;AAnCV;AAwCM;EACE,mBAAA;EACA,YA/H8B;AAyFtC;AAyCM;EACE,eAAA;EACA,iBAAA;EACA,kBAAA;AAvCR;AA0CM;EACE,oBAAA;AAxCR;AA2CM;EACE,aAAA;EACA,mBAAA;AAzCR;AA2CQ;EACE,eAAA;AAzCV;AA4CQ;EACE,iBAAA;AA1CV;;AAkDA;EACE;IAAO,YAAA;IAAoD,WAAA;IAAmD,UAAA;EA5C9G;EA6CA;IAAO,YAlKsB;IAkKiB,WAlKjB;IAkKuD,UAAA;EAxCpF;EAyCA;IAAO,YAAA;IAA2C,WAAA;IAA0C,UAAA;EApC5F;AACF","sourcesContent":["@use \"sass:math\";\n\n$interaction-area-marker-size: 20px;\n$interaction-area-marker-border-size: 2px;\n$interaction-area-marker-box-shadow-extra-size: 4px;\n$interaction-area-layout-icon-height: 60px;\n\n.cld-video-player{\n\n  &.vjs-user-active {\n    .interaction-areas-container {\n      display: block;\n    }\n  }\n\n  &.interaction-areas {\n\n    .vjs-big-play-button {\n      display: none !important;\n    }\n  }\n\n  .interaction-areas-container {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    display: none;\n    z-index: 1;\n\n    &:hover {\n      display: block;\n    }\n\n    .go-back-button,\n    .vp-ia-item {\n      position: absolute;\n      cursor: pointer;\n    }\n\n    .go-back-button {\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n    }\n\n    .vp-ia-item {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      transition: top, left, width, height;\n      transition-timing-function: linear;\n\n      &.theme-shadowed {\n\n        .vp-ia-marker-shadow{\n          opacity: 0.24;\n        }\n\n      }\n\n      &.theme-pulsing {\n\n        .vp-ia-marker-shadow {\n          -webkit-animation: pulsing-animation 1.3s ease-out;\n          -webkit-animation-iteration-count: infinite;\n          border: solid $interaction-area-marker-border-size;\n          opacity: 0;\n        }\n      }\n\n      &:hover {\n        .vp-ia-marker-main:before {\n          content: \"\";\n          width: $interaction-area-marker-size;\n          height: $interaction-area-marker-size;\n          border: solid $interaction-area-marker-border-size rgba(0,0,0,0.25);\n        }\n      }\n\n      .vp-ia-area-marker {\n        position: relative;\n        width: $interaction-area-marker-size;\n        height: $interaction-area-marker-size;\n\n        .vp-ia-marker-main,\n        .vp-ia-marker-main:before,\n        .vp-ia-marker-shadow {\n          position: absolute;\n          border-radius: 50%;\n          transform: translate(-50%, -50%);\n          top: 50%;\n          left: 50%;\n        }\n\n        .vp-ia-marker-main {\n          background-color: white;\n          border:solid $interaction-area-marker-border-size;\n          height: 100%;\n          width: 100%;\n        }\n\n        .vp-ia-marker-shadow {\n          width: 2*$interaction-area-marker-border-size + $interaction-area-marker-size + $interaction-area-marker-box-shadow-extra-size;\n          height:2*$interaction-area-marker-border-size + $interaction-area-marker-size + $interaction-area-marker-box-shadow-extra-size;\n        }\n      }\n    }\n\n    &.vp-ia-layout-message {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      height: 100%;\n      z-index: 2;\n      background-color: rgba(0, 0, 0, 0.5);\n\n      &.clickable {\n        cursor: pointer;\n\n        &:hover .vp-theme-button {\n          background-color: rgba(255, 255, 254, 0.28);\n        }\n\n      }\n\n      .vp-ia-layout-icon {\n        margin-bottom: 20px;\n        height: $interaction-area-layout-icon-height;\n      }\n\n      .vp-ia-layout-message-title {\n        font-size: 24px;\n        line-height: 34px;\n        text-align: center;\n      }\n\n      .vp-theme-button {\n        margin: 8px 0 18px 0;\n      }\n\n      .vp-ia-layout-message-do-not-show {\n        display: flex;\n        align-items: center;\n\n        > * {\n          cursor: pointer;\n        }\n\n        .vp-ia-layout-message-checkbox-title {\n          margin: 0 0 0 5px;\n        }\n\n      }\n    }\n  }\n}\n\n@-webkit-keyframes pulsing-animation {\n  0%   { height: math.div($interaction-area-marker-size, 2); width: math.div($interaction-area-marker-size, 2); opacity: 0}\n  50%  { height: $interaction-area-marker-size; width: $interaction-area-marker-size; opacity: 1}\n  100% { height: 2 * $interaction-area-marker-size; width: 2 * $interaction-area-marker-size; opacity: 0}\n}\n"],"sourceRoot":""}]);
-// Exports
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
-
-
-/***/ }),
-
-/***/ "../node_modules/lodash/debounce.js":
-/*!******************************************!*\
-  !*** ../node_modules/lodash/debounce.js ***!
-  \******************************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-var isObject = __webpack_require__(/*! ./isObject */ "../node_modules/lodash/isObject.js"),
-    now = __webpack_require__(/*! ./now */ "../node_modules/lodash/now.js"),
-    toNumber = __webpack_require__(/*! ./toNumber */ "../node_modules/lodash/toNumber.js");
-
-/** Error message constants. */
-var FUNC_ERROR_TEXT = 'Expected a function';
-
-/* Built-in method references for those with the same name as other `lodash` methods. */
-var nativeMax = Math.max,
-    nativeMin = Math.min;
-
-/**
- * Creates a debounced function that delays invoking `func` until after `wait`
- * milliseconds have elapsed since the last time the debounced function was
- * invoked. The debounced function comes with a `cancel` method to cancel
- * delayed `func` invocations and a `flush` method to immediately invoke them.
- * Provide `options` to indicate whether `func` should be invoked on the
- * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
- * with the last arguments provided to the debounced function. Subsequent
- * calls to the debounced function return the result of the last `func`
- * invocation.
- *
- * **Note:** If `leading` and `trailing` options are `true`, `func` is
- * invoked on the trailing edge of the timeout only if the debounced function
- * is invoked more than once during the `wait` timeout.
- *
- * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
- * until to the next tick, similar to `setTimeout` with a timeout of `0`.
- *
- * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
- * for details over the differences between `_.debounce` and `_.throttle`.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Function
- * @param {Function} func The function to debounce.
- * @param {number} [wait=0] The number of milliseconds to delay.
- * @param {Object} [options={}] The options object.
- * @param {boolean} [options.leading=false]
- *  Specify invoking on the leading edge of the timeout.
- * @param {number} [options.maxWait]
- *  The maximum time `func` is allowed to be delayed before it's invoked.
- * @param {boolean} [options.trailing=true]
- *  Specify invoking on the trailing edge of the timeout.
- * @returns {Function} Returns the new debounced function.
- * @example
- *
- * // Avoid costly calculations while the window size is in flux.
- * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
- *
- * // Invoke `sendMail` when clicked, debouncing subsequent calls.
- * jQuery(element).on('click', _.debounce(sendMail, 300, {
- *   'leading': true,
- *   'trailing': false
- * }));
- *
- * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
- * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
- * var source = new EventSource('/stream');
- * jQuery(source).on('message', debounced);
- *
- * // Cancel the trailing debounced invocation.
- * jQuery(window).on('popstate', debounced.cancel);
- */
-function debounce(func, wait, options) {
-  var lastArgs,
-      lastThis,
-      maxWait,
-      result,
-      timerId,
-      lastCallTime,
-      lastInvokeTime = 0,
-      leading = false,
-      maxing = false,
-      trailing = true;
-
-  if (typeof func != 'function') {
-    throw new TypeError(FUNC_ERROR_TEXT);
-  }
-  wait = toNumber(wait) || 0;
-  if (isObject(options)) {
-    leading = !!options.leading;
-    maxing = 'maxWait' in options;
-    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
-    trailing = 'trailing' in options ? !!options.trailing : trailing;
-  }
-
-  function invokeFunc(time) {
-    var args = lastArgs,
-        thisArg = lastThis;
-
-    lastArgs = lastThis = undefined;
-    lastInvokeTime = time;
-    result = func.apply(thisArg, args);
-    return result;
-  }
-
-  function leadingEdge(time) {
-    // Reset any `maxWait` timer.
-    lastInvokeTime = time;
-    // Start the timer for the trailing edge.
-    timerId = setTimeout(timerExpired, wait);
-    // Invoke the leading edge.
-    return leading ? invokeFunc(time) : result;
-  }
-
-  function remainingWait(time) {
-    var timeSinceLastCall = time - lastCallTime,
-        timeSinceLastInvoke = time - lastInvokeTime,
-        timeWaiting = wait - timeSinceLastCall;
-
-    return maxing
-      ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke)
-      : timeWaiting;
-  }
-
-  function shouldInvoke(time) {
-    var timeSinceLastCall = time - lastCallTime,
-        timeSinceLastInvoke = time - lastInvokeTime;
-
-    // Either this is the first call, activity has stopped and we're at the
-    // trailing edge, the system time has gone backwards and we're treating
-    // it as the trailing edge, or we've hit the `maxWait` limit.
-    return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||
-      (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));
-  }
-
-  function timerExpired() {
-    var time = now();
-    if (shouldInvoke(time)) {
-      return trailingEdge(time);
-    }
-    // Restart the timer.
-    timerId = setTimeout(timerExpired, remainingWait(time));
-  }
-
-  function trailingEdge(time) {
-    timerId = undefined;
-
-    // Only invoke if we have `lastArgs` which means `func` has been
-    // debounced at least once.
-    if (trailing && lastArgs) {
-      return invokeFunc(time);
-    }
-    lastArgs = lastThis = undefined;
-    return result;
-  }
-
-  function cancel() {
-    if (timerId !== undefined) {
-      clearTimeout(timerId);
-    }
-    lastInvokeTime = 0;
-    lastArgs = lastCallTime = lastThis = timerId = undefined;
-  }
-
-  function flush() {
-    return timerId === undefined ? result : trailingEdge(now());
-  }
-
-  function debounced() {
-    var time = now(),
-        isInvoking = shouldInvoke(time);
-
-    lastArgs = arguments;
-    lastThis = this;
-    lastCallTime = time;
-
-    if (isInvoking) {
-      if (timerId === undefined) {
-        return leadingEdge(lastCallTime);
-      }
-      if (maxing) {
-        // Handle invocations in a tight loop.
-        clearTimeout(timerId);
-        timerId = setTimeout(timerExpired, wait);
-        return invokeFunc(lastCallTime);
-      }
-    }
-    if (timerId === undefined) {
-      timerId = setTimeout(timerExpired, wait);
-    }
-    return result;
-  }
-  debounced.cancel = cancel;
-  debounced.flush = flush;
-  return debounced;
-}
-
-module.exports = debounce;
-
-
 /***/ }),
 
 /***/ "../node_modules/lodash/noop.js":
@@ -987,167 +629,15 @@ module.exports = noop;
 
 /***/ }),
 
-/***/ "../node_modules/lodash/now.js":
-/*!*************************************!*\
-  !*** ../node_modules/lodash/now.js ***!
-  \*************************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-var root = __webpack_require__(/*! ./_root */ "../node_modules/lodash/_root.js");
-
-/**
- * Gets the timestamp of the number of milliseconds that have elapsed since
- * the Unix epoch (1 January 1970 00:00:00 UTC).
- *
- * @static
- * @memberOf _
- * @since 2.4.0
- * @category Date
- * @returns {number} Returns the timestamp.
- * @example
- *
- * _.defer(function(stamp) {
- *   console.log(_.now() - stamp);
- * }, _.now());
- * // => Logs the number of milliseconds it took for the deferred invocation.
- */
-var now = function() {
-  return root.Date.now();
-};
-
-module.exports = now;
-
-
-/***/ }),
-
-/***/ "../node_modules/lodash/throttle.js":
-/*!******************************************!*\
-  !*** ../node_modules/lodash/throttle.js ***!
-  \******************************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-var debounce = __webpack_require__(/*! ./debounce */ "../node_modules/lodash/debounce.js"),
-    isObject = __webpack_require__(/*! ./isObject */ "../node_modules/lodash/isObject.js");
-
-/** Error message constants. */
-var FUNC_ERROR_TEXT = 'Expected a function';
-
-/**
- * Creates a throttled function that only invokes `func` at most once per
- * every `wait` milliseconds. The throttled function comes with a `cancel`
- * method to cancel delayed `func` invocations and a `flush` method to
- * immediately invoke them. Provide `options` to indicate whether `func`
- * should be invoked on the leading and/or trailing edge of the `wait`
- * timeout. The `func` is invoked with the last arguments provided to the
- * throttled function. Subsequent calls to the throttled function return the
- * result of the last `func` invocation.
- *
- * **Note:** If `leading` and `trailing` options are `true`, `func` is
- * invoked on the trailing edge of the timeout only if the throttled function
- * is invoked more than once during the `wait` timeout.
- *
- * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
- * until to the next tick, similar to `setTimeout` with a timeout of `0`.
- *
- * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
- * for details over the differences between `_.throttle` and `_.debounce`.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Function
- * @param {Function} func The function to throttle.
- * @param {number} [wait=0] The number of milliseconds to throttle invocations to.
- * @param {Object} [options={}] The options object.
- * @param {boolean} [options.leading=true]
- *  Specify invoking on the leading edge of the timeout.
- * @param {boolean} [options.trailing=true]
- *  Specify invoking on the trailing edge of the timeout.
- * @returns {Function} Returns the new throttled function.
- * @example
- *
- * // Avoid excessively updating the position while scrolling.
- * jQuery(window).on('scroll', _.throttle(updatePosition, 100));
- *
- * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
- * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
- * jQuery(element).on('click', throttled);
- *
- * // Cancel the trailing throttled invocation.
- * jQuery(window).on('popstate', throttled.cancel);
- */
-function throttle(func, wait, options) {
-  var leading = true,
-      trailing = true;
-
-  if (typeof func != 'function') {
-    throw new TypeError(FUNC_ERROR_TEXT);
-  }
-  if (isObject(options)) {
-    leading = 'leading' in options ? !!options.leading : leading;
-    trailing = 'trailing' in options ? !!options.trailing : trailing;
-  }
-  return debounce(func, wait, {
-    'leading': leading,
-    'maxWait': wait,
-    'trailing': trailing
-  });
-}
-
-module.exports = throttle;
-
-
-/***/ }),
-
-/***/ "./plugins/interaction-areas/interaction-areas.scss?style-loader":
-/*!***********************************************************************!*\
-  !*** ./plugins/interaction-areas/interaction-areas.scss?style-loader ***!
-  \***********************************************************************/
+/***/ "./plugins/interaction-areas/interaction-areas.scss":
+/*!**********************************************************!*\
+  !*** ./plugins/interaction-areas/interaction-areas.scss ***!
+  \**********************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js */ "../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js");
-/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/styleDomAPI.js */ "../node_modules/style-loader/dist/runtime/styleDomAPI.js");
-/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/insertBySelector.js */ "../node_modules/style-loader/dist/runtime/insertBySelector.js");
-/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js */ "../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js");
-/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__);
-/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/insertStyleElement.js */ "../node_modules/style-loader/dist/runtime/insertStyleElement.js");
-/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__);
-/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/styleTagTransform.js */ "../node_modules/style-loader/dist/runtime/styleTagTransform.js");
-/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__);
-/* harmony import */ var _node_modules_css_loader_dist_cjs_js_node_modules_sass_loader_dist_cjs_js_interaction_areas_scss_style_loader__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! !!../../../node_modules/css-loader/dist/cjs.js!../../../node_modules/sass-loader/dist/cjs.js!./interaction-areas.scss?style-loader */ "../node_modules/css-loader/dist/cjs.js!../node_modules/sass-loader/dist/cjs.js!./plugins/interaction-areas/interaction-areas.scss?style-loader");
-
-      
-      
-      
-      
-      
-      
-      
-      
-      
-
-var options = {};
-
-options.styleTagTransform = (_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default());
-options.setAttributes = (_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default());
-options.insert = _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default().bind(null, "head");
-options.domAPI = (_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default());
-options.insertStyleElement = (_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default());
-
-var update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default()(_node_modules_css_loader_dist_cjs_js_node_modules_sass_loader_dist_cjs_js_interaction_areas_scss_style_loader__WEBPACK_IMPORTED_MODULE_6__["default"], options);
-
-
-
-
-       /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_node_modules_sass_loader_dist_cjs_js_interaction_areas_scss_style_loader__WEBPACK_IMPORTED_MODULE_6__["default"] && _node_modules_css_loader_dist_cjs_js_node_modules_sass_loader_dist_cjs_js_interaction_areas_scss_style_loader__WEBPACK_IMPORTED_MODULE_6__["default"].locals ? _node_modules_css_loader_dist_cjs_js_node_modules_sass_loader_dist_cjs_js_interaction_areas_scss_style_loader__WEBPACK_IMPORTED_MODULE_6__["default"].locals : undefined);
+// extracted by mini-css-extract-plugin
 
 
 /***/ })

package/dist/interaction-areas.light.min.js

@@ -1,2 +1,2 @@
-(self.cloudinaryVideoPlayerChunkLoading=self.cloudinaryVideoPlayerChunkLoading||[]).push([[404],{9017:(e,t,a)=>{"use strict";a.d(t,{F0:()=>r,Fg:()=>o,IT:()=>c,T$:()=>A,Vv:()=>l,Yx:()=>s,be:()=>i,q3:()=>d,sb:()=>n});const n="cld-ia-layout-state",i="vp-ia",o="interaction-areas-container",r={PORTRAIT:"portrait",LANDSCAPE:"landscape",All:"all",CENTER:"center"},c={PULSING:"pulsing",SHADOWED:"shadowed"},s={[r.PORTRAIT]:"https://res.cloudinary.com/prod/raw/upload/v1623772481/video-player/vtts/portrait.vtt",[r.LANDSCAPE]:"https://res.cloudinary.com/prod/raw/upload/v1623772303/video-player/vtts/landscape.vtt",[r.All]:"https://res.cloudinary.com/prod/raw/upload/v1623250266/video-player/vtts/all.vtt",[r.CENTER]:"https://res.cloudinary.com/prod/raw/upload/v1623250265/video-player/vtts/center.vtt"},A="https://res.cloudinary.com/prod/image/upload/v1626764643/video-player/interaction-area-hand.svg",l=4500,d=250},1749:(e,t,a)=>{"use strict";a.d(t,{interactionAreasService:()=>M});var n=a(6673),i=a.n(n),o=a(2832),r=a.n(o),c=a(2858),s=a.n(c),A=a(5114),l=a.n(A),d=a(9017),p=a(7134),m=a(4500);const h=e=>{let{text:t,onClick:a,theme:n="",loadingDelay:i=0}=e;return(0,p.It)({tag:"button",attr:{class:"vp-theme-button theme-".concat(n)},onClick:a,children:[{tag:"div",attr:{class:"vp-loading-bar"},style:{"animation-duration":"".concat(i,"ms")}},{tag:"div",attr:{class:"content"},children:t}]})},v="transparent-white",u=(e,t)=>e.id||e.type||"id_".concat(t),C=(e,t,a,n,i)=>{let{playerOptions:o,videojsOptions:c}=e;const s=(0,m.w)(c),A=o&&o.colors?o.colors.accent:s.accent,l=r()(c,"interactionDisplay.theme.template",d.IT.PULSING);return(0,p.It)({tag:"div",attr:{class:"".concat(d.be,"-item theme-").concat(l),"data-id":u(t,a)},style:{left:"".concat(t.left,"%"),top:"".concat(t.top,"%"),width:"".concat(t.width,"%"),height:"".concat(t.height,"%"),transitionDuration:"".concat(n,"ms")},event:{name:"click",callback:i},children:[{tag:"div",attr:{class:"".concat(d.be,"-area-marker")},children:[{tag:"div",attr:{class:"".concat(d.be,"-marker-shadow")},style:{[l===d.IT.SHADOWED?"backgroundColor":"borderColor"]:A}},{tag:"div",attr:{class:"".concat(d.be,"-marker-main")},style:{borderColor:A}}]}]})},g=(e,t)=>e/(100/+t),y=(e,t)=>{const a=f(e);a?a.replaceWith(t):e.el().appendChild(t)},b=(e,t,a)=>e.querySelector("[data-id=".concat(u(t,a),"]")),k=function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:l();localStorage.setItem(d.sb,JSON.parse(e)),t()},f=e=>e.el().querySelector(".".concat(d.Fg)),x=e=>{const t=f(e);t&&t.parentNode.removeChild(t)};var w=a(8838),E=a(1104),B=a(5292),j=a.n(B),z=a(9893),T=a.n(z),F=a(9383),S=a.n(F),I=a(6884),D=a.n(I),$=a(9088),G=a.n($),W=a(7997),O=a.n(W),L=a(4913),U={};U.styleTagTransform=O(),U.setAttributes=D(),U.insert=S().bind(null,"head"),U.domAPI=T(),U.insertStyleElement=G();j()(L.A,U);L.A&&L.A.locals&&L.A.locals;const M=(e,t,a)=>{let n=!1,o=null,c=null,A=l();const m=()=>{return e=a.interactionDisplay,r()(e,"layout.enable",!0)&&"true"!==localStorage.getItem(d.sb);var e},B=()=>{const e=T();return!(!e||void 0===e.syncOffsetTime)&&e.syncOffsetTime};function j(){let e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];const t=T();return e||t&&t.enable}function z(){c&&e.videojs.removeRemoteTextTrack(c);const t=j(),a=T();if(!t||n)return null;if(Array.isArray(a.template))$(a.template),G();else{const t=a.vttUrl||d.Yx[a.template];t&&(c=(0,w.eo)(e.videojs,t),function(t){if(!t)return;let a=null;t.addEventListener("cuechange",(()=>{const n=t.activeCues&&t.activeCues[0];if(n){const e=Math.max(Math.floor(1e3*(n.endTime-n.startTime)),d.q3),t=JSON.parse(n.text);$(t,a,e),!a&&G(),a=t}else x(e.videojs),a=null}))}(c))}}function T(){const{cldSrc:e}=o;return e&&e.getInteractionAreas()}function F(){x(e.videojs),z(),e.play()}function S(){if(j())if(m()){let t=null;const n=r()(a,"interactionDisplay.layout.showAgain",!1);e.pause(),function(e,t){let a=arguments.length>2&&void 0!==arguments[2]&&arguments[2],n=!1;const i="checkbox_".concat(Math.round(1e4*Math.random())),o=(0,p.It)({tag:"div",attr:{class:"".concat(d.Fg," ").concat(d.be,"-layout-message ").concat(a?"":"clickable")},onClick:a?null:()=>k(n,t),children:[{tag:"img",attr:{class:"".concat(d.be,"-layout-icon"),src:d.T$}},{tag:"h3",attr:{class:"".concat(d.be,"-layout-message-title")},children:"Tap on dots to zoom for a product."},h({text:"Got it",theme:v,loadingDelay:a?0:d.Vv,onClick:a?()=>k(n,t):null}),a&&{tag:"div",attr:{class:"".concat(d.be,"-layout-message-do-not-show")},children:[{tag:"input",attr:{type:"checkbox",class:"".concat(d.be,"-layout-message-checkbox"),id:i},event:{name:"input",callback:e=>{n=e.target.checked}}},{tag:"label",attr:{class:"".concat(d.be,"-layout-message-checkbox-title"),for:i},children:"Don׳t show it again"}]}].filter((e=>e))});y(e,o)}(e.videojs,(()=>{clearTimeout(t),F()}),n),n||(t=setTimeout(F,d.Vv))}else F()}function I(t,a,r){const c=e.currentTime(),s=B(),{cldSrc:l}=o,m=l.getInitOptions(),h=a||{transformation:m.transformation},v=!t&&((e,t)=>{const{videoHeight:a,videoWidth:n}=e,i=g(n,t.left),o=g(a,t.top),r=g(n,t.width),c=g(a,t.height),s=n/a,A=r/c,l=Math.round(A>1||s>1?c*A:r),d=Math.round(l/s),p=Math.round(i-(l-r)/2),m=Math.round(o-(d-c)/2);return{width:l,height:d,x:Math.min(Math.max(p,0),n-l),y:Math.min(Math.max(m,0),a-d),crop:"crop"}})(e.videoElement,r),u=v?i().obj.merge({transformation:v},h):h,C=l.isRawUrl?o.src:{publicId:l.publicId()};e.source(v?{publicId:l.publicId()}:t,u).play(),s&&e.currentTime(c),n=!0,function(){const t=(0,p.n)("div",{class:"go-back-button"});t.addEventListener("click",(()=>{A()}),!1);const a=(0,p.n)("div",{class:d.Fg},t);y(e.videojs,a)}(),A=()=>{if(n){n=!1;const t=e.currentTime(),a=e.duration();e.source(C,m).play(),s&&t<a&&e.currentTime(t),z()}}}function D(e){let{event:t,item:a,index:n}=e;const i=T();i.onClick&&i.onClick({item:a,index:n,event:t,zoom:(e,t)=>{I(e,t,a)}})}function $(n,i){let o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:0;const r={playerOptions:t,videojsOptions:a};if(i)((e,t,a,n,i,o)=>{const r=f(e);a.forEach(((e,a)=>{const c=b(r,e,a),s=u(e),A=n.some((e=>u(e)===s));A&&c?(0,p.cu)(c,{left:"".concat(e.left,"%"),top:"".concat(e.top,"%"),width:"".concat(e.width,"%"),height:"".concat(e.height,"%"),transitionDuration:"".concat(i,"ms")}):A||c||r.appendChild(C(t,e,a,i,(t=>{o({event:t,item:e,index:a})})))})),n.forEach(((e,t)=>{const n=b(r,e,t),i=u(e),o=!a.some((e=>u(e)===i));n&&o&&n.parentNode.removeChild(n)}))})(e.videojs,r,n,i,o,D);else{const t=n.map(((e,t)=>C(r,e,t,o,(a=>{D({event:a,item:e,index:t})}))));y(e.videojs,(0,p.n)("div",{class:d.Fg},t))}}function G(){j()&&((e,t)=>{const a=f(e);if(!a)return;const{videoHeight:n,videoWidth:i}=t,o=i/n,r=o*t.clientHeight;a.style.width="".concat(t.clientWidth<r?"100%":r,"px"),a.style.height=t.clientWidth<r?"".concat(t.clientWidth/o,"px"):"100%"})(e.videojs,e.videoElement)}!function(){if(o=o||e.videojs.currentSource(),j()){e.videojs.el().classList.add("interaction-areas"),e.videojs.one(E.f.PLAY,(()=>{"object"==typeof e.videojs.ima?e.on("adsready",(()=>{e.videojs.ima.addEventListener(window.google.ima.AdEvent.Type.ALL_ADS_COMPLETED,S)})):S()}));const t=s()(G,100);e.videojs.on(E.f.FULL_SCREEN_CHANGE,(()=>{setTimeout(t,100)}));const a=(0,p.q2)(window,"resize",G,!1);e.videojs.on(E.f.DISPOSE,a)}e.videojs.on(E.f.ENDED,(()=>{A()})),e.videojs.on(E.f.ERROR,(()=>{e.pause()}))}()}},4913:(e,t,a)=>{"use strict";a.d(t,{A:()=>c});var n=a(4942),i=a.n(n),o=a(278),r=a.n(o)()(i());r.push([e.id,'.cld-video-player.vjs-user-active .interaction-areas-container{display:block}.cld-video-player.interaction-areas .vjs-big-play-button{display:none !important}.cld-video-player .interaction-areas-container{position:absolute;width:100%;height:100%;top:50%;left:50%;transform:translate(-50%, -50%);display:none;z-index:1}.cld-video-player .interaction-areas-container:hover{display:block}.cld-video-player .interaction-areas-container .go-back-button,.cld-video-player .interaction-areas-container .vp-ia-item{position:absolute;cursor:pointer}.cld-video-player .interaction-areas-container .go-back-button{top:0;left:0;width:100%;height:100%}.cld-video-player .interaction-areas-container .vp-ia-item{display:inline-flex;align-items:center;justify-content:center;transition:top,left,width,height;transition-timing-function:linear}.cld-video-player .interaction-areas-container .vp-ia-item.theme-shadowed .vp-ia-marker-shadow{opacity:.24}.cld-video-player .interaction-areas-container .vp-ia-item.theme-pulsing .vp-ia-marker-shadow{-webkit-animation:pulsing-animation 1.3s ease-out;-webkit-animation-iteration-count:infinite;border:solid 2px;opacity:0}.cld-video-player .interaction-areas-container .vp-ia-item:hover .vp-ia-marker-main:before{content:"";width:20px;height:20px;border:solid 2px rgba(0,0,0,.25)}.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker{position:relative;width:20px;height:20px}.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-main,.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-main:before,.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-shadow{position:absolute;border-radius:50%;transform:translate(-50%, -50%);top:50%;left:50%}.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-main{background-color:#fff;border:solid 2px;height:100%;width:100%}.cld-video-player .interaction-areas-container .vp-ia-item .vp-ia-area-marker .vp-ia-marker-shadow{width:28px;height:28px}.cld-video-player .interaction-areas-container.vp-ia-layout-message{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;z-index:2;background-color:rgba(0,0,0,.5)}.cld-video-player .interaction-areas-container.vp-ia-layout-message.clickable{cursor:pointer}.cld-video-player .interaction-areas-container.vp-ia-layout-message.clickable:hover .vp-theme-button{background-color:rgba(255,255,254,.28)}.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-icon{margin-bottom:20px;height:60px}.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-message-title{font-size:24px;line-height:34px;text-align:center}.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-theme-button{margin:8px 0 18px 0}.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-message-do-not-show{display:flex;align-items:center}.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-message-do-not-show>*{cursor:pointer}.cld-video-player .interaction-areas-container.vp-ia-layout-message .vp-ia-layout-message-do-not-show .vp-ia-layout-message-checkbox-title{margin:0 0 0 5px}@-webkit-keyframes pulsing-animation{0%{height:10px;width:10px;opacity:0}50%{height:20px;width:20px;opacity:1}100%{height:40px;width:40px;opacity:0}}',"",{version:3,sources:["webpack://./plugins/interaction-areas/interaction-areas.scss"],names:[],mappings:"AAUI,+DACE,aAAA,CAMF,yDACE,uBAAA,CAIJ,+CACE,iBAAA,CACA,UAAA,CACA,WAAA,CACA,OAAA,CACA,QAAA,CACA,+BAAA,CACA,YAAA,CACA,SAAA,CAEA,qDACE,aAAA,CAGF,0HAEE,iBAAA,CACA,cAAA,CAGF,+DACE,KAAA,CACA,MAAA,CACA,UAAA,CACA,WAAA,CAGF,2DACE,mBAAA,CACA,kBAAA,CACA,sBAAA,CACA,gCAAA,CACA,iCAAA,CAIE,+FACE,WAAA,CAOF,8FACE,iDAAA,CACA,0CAAA,CACA,gBAAA,CACA,SAAA,CAKF,2FACE,UAAA,CACA,UA3EqB,CA4ErB,WA5EqB,CA6ErB,gCAAA,CAIJ,8EACE,iBAAA,CACA,UAnFuB,CAoFvB,WApFuB,CAsFvB,4SAGE,iBAAA,CACA,iBAAA,CACA,+BAAA,CACA,OAAA,CACA,QAAA,CAGF,iGACE,qBAAA,CACA,gBAAA,CACA,WAAA,CACA,UAAA,CAGF,mGACE,UAAA,CACA,WAAA,CAKN,oEACE,YAAA,CACA,qBAAA,CACA,kBAAA,CACA,sBAAA,CACA,WAAA,CACA,SAAA,CACA,+BAAA,CAEA,8EACE,cAAA,CAEA,qGACE,sCAAA,CAKJ,uFACE,kBAAA,CACA,WA/H8B,CAkIhC,gGACE,cAAA,CACA,gBAAA,CACA,iBAAA,CAGF,qFACE,mBAAA,CAGF,sGACE,YAAA,CACA,kBAAA,CAEA,wGACE,cAAA,CAGF,2IACE,gBAAA,CAQV,qCACE,GAAA,WAAA,CAAA,UAAA,CAAA,SAAA,CACA,IAAA,WAlK6B,CAkKiB,UAlKjB,CAkKuD,SAAA,CACpF,KAAA,WAAA,CAAA,UAAA,CAAA,SAAA,CAAA",sourcesContent:['@use "sass:math";\n\n$interaction-area-marker-size: 20px;\n$interaction-area-marker-border-size: 2px;\n$interaction-area-marker-box-shadow-extra-size: 4px;\n$interaction-area-layout-icon-height: 60px;\n\n.cld-video-player{\n\n  &.vjs-user-active {\n    .interaction-areas-container {\n      display: block;\n    }\n  }\n\n  &.interaction-areas {\n\n    .vjs-big-play-button {\n      display: none !important;\n    }\n  }\n\n  .interaction-areas-container {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    display: none;\n    z-index: 1;\n\n    &:hover {\n      display: block;\n    }\n\n    .go-back-button,\n    .vp-ia-item {\n      position: absolute;\n      cursor: pointer;\n    }\n\n    .go-back-button {\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n    }\n\n    .vp-ia-item {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      transition: top, left, width, height;\n      transition-timing-function: linear;\n\n      &.theme-shadowed {\n\n        .vp-ia-marker-shadow{\n          opacity: 0.24;\n        }\n\n      }\n\n      &.theme-pulsing {\n\n        .vp-ia-marker-shadow {\n          -webkit-animation: pulsing-animation 1.3s ease-out;\n          -webkit-animation-iteration-count: infinite;\n          border: solid $interaction-area-marker-border-size;\n          opacity: 0;\n        }\n      }\n\n      &:hover {\n        .vp-ia-marker-main:before {\n          content: "";\n          width: $interaction-area-marker-size;\n          height: $interaction-area-marker-size;\n          border: solid $interaction-area-marker-border-size rgba(0,0,0,0.25);\n        }\n      }\n\n      .vp-ia-area-marker {\n        position: relative;\n        width: $interaction-area-marker-size;\n        height: $interaction-area-marker-size;\n\n        .vp-ia-marker-main,\n        .vp-ia-marker-main:before,\n        .vp-ia-marker-shadow {\n          position: absolute;\n          border-radius: 50%;\n          transform: translate(-50%, -50%);\n          top: 50%;\n          left: 50%;\n        }\n\n        .vp-ia-marker-main {\n          background-color: white;\n          border:solid $interaction-area-marker-border-size;\n          height: 100%;\n          width: 100%;\n        }\n\n        .vp-ia-marker-shadow {\n          width: 2*$interaction-area-marker-border-size + $interaction-area-marker-size + $interaction-area-marker-box-shadow-extra-size;\n          height:2*$interaction-area-marker-border-size + $interaction-area-marker-size + $interaction-area-marker-box-shadow-extra-size;\n        }\n      }\n    }\n\n    &.vp-ia-layout-message {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      height: 100%;\n      z-index: 2;\n      background-color: rgba(0, 0, 0, 0.5);\n\n      &.clickable {\n        cursor: pointer;\n\n        &:hover .vp-theme-button {\n          background-color: rgba(255, 255, 254, 0.28);\n        }\n\n      }\n\n      .vp-ia-layout-icon {\n        margin-bottom: 20px;\n        height: $interaction-area-layout-icon-height;\n      }\n\n      .vp-ia-layout-message-title {\n        font-size: 24px;\n        line-height: 34px;\n        text-align: center;\n      }\n\n      .vp-theme-button {\n        margin: 8px 0 18px 0;\n      }\n\n      .vp-ia-layout-message-do-not-show {\n        display: flex;\n        align-items: center;\n\n        > * {\n          cursor: pointer;\n        }\n\n        .vp-ia-layout-message-checkbox-title {\n          margin: 0 0 0 5px;\n        }\n\n      }\n    }\n  }\n}\n\n@-webkit-keyframes pulsing-animation {\n  0%   { height: math.div($interaction-area-marker-size, 2); width: math.div($interaction-area-marker-size, 2); opacity: 0}\n  50%  { height: $interaction-area-marker-size; width: $interaction-area-marker-size; opacity: 1}\n  100% { height: 2 * $interaction-area-marker-size; width: 2 * $interaction-area-marker-size; opacity: 0}\n}\n'],sourceRoot:""}]);const c=r},5114:e=>{e.exports=function(){}}}]);
+(self.cloudinaryVideoPlayerChunkLoading=self.cloudinaryVideoPlayerChunkLoading||[]).push([[404],{9017:(t,e,n)=>{"use strict";n.d(e,{F0:()=>r,Fg:()=>a,IT:()=>c,T$:()=>l,Vv:()=>d,Yx:()=>s,be:()=>i,q3:()=>u,sb:()=>o});const o="cld-ia-layout-state",i="vp-ia",a="interaction-areas-container",r={PORTRAIT:"portrait",LANDSCAPE:"landscape",All:"all",CENTER:"center"},c={PULSING:"pulsing",SHADOWED:"shadowed"},s={[r.PORTRAIT]:"https://res.cloudinary.com/prod/raw/upload/v1623772481/video-player/vtts/portrait.vtt",[r.LANDSCAPE]:"https://res.cloudinary.com/prod/raw/upload/v1623772303/video-player/vtts/landscape.vtt",[r.All]:"https://res.cloudinary.com/prod/raw/upload/v1623250266/video-player/vtts/all.vtt",[r.CENTER]:"https://res.cloudinary.com/prod/raw/upload/v1623250265/video-player/vtts/center.vtt"},l="https://res.cloudinary.com/prod/image/upload/v1626764643/video-player/interaction-area-hand.svg",d=4500,u=250},1066:(t,e,n)=>{"use strict";n.d(e,{interactionAreasService:()=>j});var o=n(6673),i=n.n(o),a=n(2832),r=n.n(a),c=n(2858),s=n.n(c),l=n(5114),d=n.n(l),u=n(9017),v=n(7134),p=n(4500);const h=t=>{let{text:e,onClick:n,theme:o="",loadingDelay:i=0}=t;return(0,v.It)({tag:"button",attr:{class:"vp-theme-button theme-".concat(o)},onClick:n,children:[{tag:"div",attr:{class:"vp-loading-bar"},style:{"animation-duration":"".concat(i,"ms")}},{tag:"div",attr:{class:"content"},children:e}]})},f="transparent-white",m=(t,e)=>t.id||t.type||"id_".concat(e),g=(t,e,n,o,i)=>{let{playerOptions:a,videojsOptions:c}=t;const s=(0,p.w)(c),l=a&&a.colors?a.colors.accent:s.accent,d=r()(c,"interactionDisplay.theme.template",u.IT.PULSING);return(0,v.It)({tag:"div",attr:{class:"".concat(u.be,"-item theme-").concat(d),"data-id":m(e,n)},style:{left:"".concat(e.left,"%"),top:"".concat(e.top,"%"),width:"".concat(e.width,"%"),height:"".concat(e.height,"%"),transitionDuration:"".concat(o,"ms")},event:{name:"click",callback:i},children:[{tag:"div",attr:{class:"".concat(u.be,"-area-marker")},children:[{tag:"div",attr:{class:"".concat(u.be,"-marker-shadow")},style:{[d===u.IT.SHADOWED?"backgroundColor":"borderColor"]:l}},{tag:"div",attr:{class:"".concat(u.be,"-marker-main")},style:{borderColor:l}}]}]})},y=(t,e)=>t/(100/+e),b=(t,e)=>{const n=E(t);n?n.replaceWith(e):t.el().appendChild(e)},T=(t,e,n)=>t.querySelector("[data-id=".concat(m(e,n),"]")),x=function(t){let e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:d();localStorage.setItem(u.sb,JSON.parse(t)),e()},E=t=>t.el().querySelector(".".concat(u.Fg)),w=t=>{const e=E(t);e&&e.parentNode.removeChild(e)};var k=n(8838),C=n(1104);const j=(t,e,n)=>{let o=!1,a=null,c=null,l=d();const p=()=>{return t=n.interactionDisplay,r()(t,"layout.enable",!0)&&"true"!==localStorage.getItem(u.sb);var t},j=()=>{const t=I();return!(!t||void 0===t.syncOffsetTime)&&t.syncOffsetTime};function A(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];const e=I();return t||e&&e.enable}function D(){c&&t.videojs.removeRemoteTextTrack(c);const e=A(),n=I();if(!e||o)return null;if(Array.isArray(n.template))M(n.template),R();else{const e=n.vttUrl||u.Yx[n.template];e&&(c=(0,k.eo)(t.videojs,e),function(e){if(!e)return;let n=null;e.addEventListener("cuechange",(()=>{const o=e.activeCues&&e.activeCues[0];if(o){const t=Math.max(Math.floor(1e3*(o.endTime-o.startTime)),u.q3),e=JSON.parse(o.text);M(e,n,t),!n&&R(),n=e}else w(t.videojs),n=null}))}(c))}}function I(){const{cldSrc:t}=a;return t&&t.getInteractionAreas()}function S(){w(t.videojs),D(),t.play()}function O(){if(A())if(p()){let e=null;const o=r()(n,"interactionDisplay.layout.showAgain",!1);t.pause(),function(t,e){let n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],o=!1;const i="checkbox_".concat(Math.round(1e4*Math.random())),a=(0,v.It)({tag:"div",attr:{class:"".concat(u.Fg," ").concat(u.be,"-layout-message ").concat(n?"":"clickable")},onClick:n?null:()=>x(o,e),children:[{tag:"img",attr:{class:"".concat(u.be,"-layout-icon"),src:u.T$}},{tag:"h3",attr:{class:"".concat(u.be,"-layout-message-title")},children:"Tap on dots to zoom for a product."},h({text:"Got it",theme:f,loadingDelay:n?0:u.Vv,onClick:n?()=>x(o,e):null}),n&&{tag:"div",attr:{class:"".concat(u.be,"-layout-message-do-not-show")},children:[{tag:"input",attr:{type:"checkbox",class:"".concat(u.be,"-layout-message-checkbox"),id:i},event:{name:"input",callback:t=>{o=t.target.checked}}},{tag:"label",attr:{class:"".concat(u.be,"-layout-message-checkbox-title"),for:i},children:"Don׳t show it again"}]}].filter((t=>t))});b(t,a)}(t.videojs,(()=>{clearTimeout(e),S()}),o),o||(e=setTimeout(S,u.Vv))}else S()}function N(e,n,r){const c=t.currentTime(),s=j(),{cldSrc:d}=a,p=d.getInitOptions(),h=n||{transformation:p.transformation},f=!e&&((t,e)=>{const{videoHeight:n,videoWidth:o}=t,i=y(o,e.left),a=y(n,e.top),r=y(o,e.width),c=y(n,e.height),s=o/n,l=r/c,d=Math.round(l>1||s>1?c*l:r),u=Math.round(d/s),v=Math.round(i-(d-r)/2),p=Math.round(a-(u-c)/2);return{width:d,height:u,x:Math.min(Math.max(v,0),o-d),y:Math.min(Math.max(p,0),n-u),crop:"crop"}})(t.videoElement,r),m=f?i().obj.merge({transformation:f},h):h,g=d.isRawUrl?a.src:{publicId:d.publicId()};t.source(f?{publicId:d.publicId()}:e,m).play(),s&&t.currentTime(c),o=!0,function(){const e=(0,v.n)("div",{class:"go-back-button"});e.addEventListener("click",(()=>{l()}),!1);const n=(0,v.n)("div",{class:u.Fg},e);b(t.videojs,n)}(),l=()=>{if(o){o=!1;const e=t.currentTime(),n=t.duration();t.source(g,p).play(),s&&e<n&&t.currentTime(e),D()}}}function L(t){let{event:e,item:n,index:o}=t;const i=I();i.onClick&&i.onClick({item:n,index:o,event:e,zoom:(t,e)=>{N(t,e,n)}})}function M(o,i){let a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:0;const r={playerOptions:e,videojsOptions:n};if(i)((t,e,n,o,i,a)=>{const r=E(t);n.forEach(((t,n)=>{const c=T(r,t,n),s=m(t),l=o.some((t=>m(t)===s));l&&c?(0,v.cu)(c,{left:"".concat(t.left,"%"),top:"".concat(t.top,"%"),width:"".concat(t.width,"%"),height:"".concat(t.height,"%"),transitionDuration:"".concat(i,"ms")}):l||c||r.appendChild(g(e,t,n,i,(e=>{a({event:e,item:t,index:n})})))})),o.forEach(((t,e)=>{const o=T(r,t,e),i=m(t),a=!n.some((t=>m(t)===i));o&&a&&o.parentNode.removeChild(o)}))})(t.videojs,r,o,i,a,L);else{const e=o.map(((t,e)=>g(r,t,e,a,(n=>{L({event:n,item:t,index:e})}))));b(t.videojs,(0,v.n)("div",{class:u.Fg},e))}}function R(){A()&&((t,e)=>{const n=E(t);if(!n)return;const{videoHeight:o,videoWidth:i}=e,a=i/o,r=a*e.clientHeight;n.style.width="".concat(e.clientWidth<r?"100%":r,"px"),n.style.height=e.clientWidth<r?"".concat(e.clientWidth/a,"px"):"100%"})(t.videojs,t.videoElement)}!function(){if(a=a||t.videojs.currentSource(),A()){t.videojs.el().classList.add("interaction-areas"),t.videojs.one(C.f.PLAY,(()=>{"object"==typeof t.videojs.ima?t.on("adsready",(()=>{t.videojs.ima.addEventListener(window.google.ima.AdEvent.Type.ALL_ADS_COMPLETED,O)})):O()}));const e=s()(R,100);t.videojs.on(C.f.FULL_SCREEN_CHANGE,(()=>{setTimeout(e,100)}));const n=(0,v.q2)(window,"resize",R,!1);t.videojs.on(C.f.DISPOSE,n)}t.videojs.on(C.f.ENDED,(()=>{l()})),t.videojs.on(C.f.ERROR,(()=>{t.pause()}))}()}},8812:(t,e,n)=>{var o=n(2140),i=/^\s+/;t.exports=function(t){return t?t.slice(0,o(t)+1).replace(i,""):t}},2140:t=>{var e=/\s/;t.exports=function(t){for(var n=t.length;n--&&e.test(t.charAt(n)););return n}},6177:(t,e,n)=>{var o=n(8953),i=n(3664),a=n(5378),r=Math.max,c=Math.min;t.exports=function(t,e,n){var s,l,d,u,v,p,h=0,f=!1,m=!1,g=!0;if("function"!=typeof t)throw new TypeError("Expected a function");function y(e){var n=s,o=l;return s=l=void 0,h=e,u=t.apply(o,n)}function b(t){var n=t-p;return void 0===p||n>=e||n<0||m&&t-h>=d}function T(){var t=i();if(b(t))return x(t);v=setTimeout(T,function(t){var n=e-(t-p);return m?c(n,d-(t-h)):n}(t))}function x(t){return v=void 0,g&&s?y(t):(s=l=void 0,u)}function E(){var t=i(),n=b(t);if(s=arguments,l=this,p=t,n){if(void 0===v)return function(t){return h=t,v=setTimeout(T,e),f?y(t):u}(p);if(m)return clearTimeout(v),v=setTimeout(T,e),y(p)}return void 0===v&&(v=setTimeout(T,e)),u}return e=a(e)||0,o(n)&&(f=!!n.leading,d=(m="maxWait"in n)?r(a(n.maxWait)||0,e):d,g="trailing"in n?!!n.trailing:g),E.cancel=function(){void 0!==v&&clearTimeout(v),h=0,s=p=l=v=void 0},E.flush=function(){return void 0===v?u:x(i())},E}},5114:t=>{t.exports=function(){}},3664:(t,e,n)=>{var o=n(1433);t.exports=function(){return o.Date.now()}},2858:(t,e,n)=>{var o=n(6177),i=n(8953);t.exports=function(t,e,n){var a=!0,r=!0;if("function"!=typeof t)throw new TypeError("Expected a function");return i(n)&&(a="leading"in n?!!n.leading:a,r="trailing"in n?!!n.trailing:r),o(t,e,{leading:a,maxWait:e,trailing:r})}},5378:(t,e,n)=>{var o=n(8812),i=n(8953),a=n(5414),r=/^[-+]0x[0-9a-f]+$/i,c=/^0b[01]+$/i,s=/^0o[0-7]+$/i,l=parseInt;t.exports=function(t){if("number"==typeof t)return t;if(a(t))return NaN;if(i(t)){var e="function"==typeof t.valueOf?t.valueOf():t;t=i(e)?e+"":e}if("string"!=typeof t)return 0===t?t:+t;t=o(t);var n=c.test(t);return n||s.test(t)?l(t.slice(2),n?2:8):r.test(t)?NaN:+t}}}]);
 //# sourceMappingURL=interaction-areas.light.min.js.map