cloudinary-video-player 3.12.1 → 3.12.2-edge.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (86) hide show
  1. package/dist/134.min.js +8 -0
  2. package/dist/309.min.js +6 -0
  3. package/dist/adaptive-streaming.js +9 -9
  4. package/dist/adaptive-streaming.min.js +2 -2
  5. package/dist/chapters.js +4 -4
  6. package/dist/chapters.min.js +3 -3
  7. package/dist/cld-player-core.js +37 -0
  8. package/dist/cld-player-core.min.js +6 -0
  9. package/dist/cld-video-player-lazy.js +494 -0
  10. package/dist/cld-video-player-lazy.min.js +6 -0
  11. package/dist/cld-video-player.css +2 -2
  12. package/dist/cld-video-player.js +366 -332
  13. package/dist/cld-video-player.light.js +366 -332
  14. package/dist/cld-video-player.light.min.js +4 -4
  15. package/dist/cld-video-player.min.css +2 -2
  16. package/dist/cld-video-player.min.js +4 -4
  17. package/dist/colors.js +4 -4
  18. package/dist/colors.min.js +2 -2
  19. package/dist/dash.js +6 -6
  20. package/dist/dash.min.js +2 -2
  21. package/dist/debug.js +8 -8
  22. package/dist/debug.min.js +3 -3
  23. package/dist/ima.js +9 -9
  24. package/dist/ima.min.js +2 -2
  25. package/dist/interaction-areas.js +11 -11
  26. package/dist/interaction-areas.min.js +2 -2
  27. package/dist/node_modules_lodash_throttle_js.js +8 -8
  28. package/dist/playlist.js +31 -31
  29. package/dist/playlist.min.js +3 -3
  30. package/dist/recommendations-overlay.js +10 -10
  31. package/dist/recommendations-overlay.min.js +2 -2
  32. package/dist/schema.json +19 -0
  33. package/dist/share.js +5 -5
  34. package/dist/share.min.js +3 -3
  35. package/dist/shoppable.js +12 -12
  36. package/dist/shoppable.min.js +2 -2
  37. package/dist/utils_fetch-config_js.js +81 -0
  38. package/dist/video-player_js.js +3111 -0
  39. package/dist/visual-search.js +7 -7
  40. package/dist/visual-search.min.js +2 -2
  41. package/lib/_commonjsHelpers.js +7 -0
  42. package/lib/_videojs-proxy.js +30294 -0
  43. package/lib/abr-strategies.js +31 -0
  44. package/lib/adaptive-streaming.js +468 -2
  45. package/lib/all.js +25 -2
  46. package/lib/chapters.js +205 -1
  47. package/lib/cld-video-player.min.css +5 -22
  48. package/lib/colors.js +59 -1
  49. package/lib/{schema.json → config/configSchema.json} +19 -0
  50. package/lib/dash.js +69943 -2
  51. package/lib/debug.js +322 -1
  52. package/lib/document.js +770 -0
  53. package/lib/download-button.js +48 -0
  54. package/lib/fetch-config.js +93 -0
  55. package/lib/ima.js +6851 -1
  56. package/lib/index.js +27 -0
  57. package/lib/interaction-areas.const.js +24 -0
  58. package/lib/interaction-areas.service.js +469 -0
  59. package/lib/lazy.js +20 -0
  60. package/lib/noop.js +33 -0
  61. package/lib/player-api.js +469 -0
  62. package/lib/player.js +7 -2
  63. package/lib/playlist-panel.js +602 -0
  64. package/lib/playlist.js +637 -1
  65. package/lib/querystring.js +81 -0
  66. package/lib/recommendations-overlay.js +320 -1
  67. package/lib/share.js +129 -1
  68. package/lib/shoppable-post-widget.js +572 -0
  69. package/lib/shoppable-widget.js +77 -0
  70. package/lib/throttle.js +318 -0
  71. package/lib/toNumber.js +134 -0
  72. package/lib/validators-functions.js +485 -0
  73. package/lib/video-player.js +16241 -0
  74. package/lib/videoPlayer.js +7 -2
  75. package/lib/videojs-contrib-hlsjs.js +37638 -0
  76. package/lib/visual-search.js +235 -1
  77. package/package.json +31 -15
  78. package/lib/adaptive-streaming.js.LICENSE.txt +0 -3
  79. package/lib/all.js.LICENSE.txt +0 -25
  80. package/lib/cld-video-player.js +0 -2
  81. package/lib/cld-video-player.js.LICENSE.txt +0 -21
  82. package/lib/dash.js.LICENSE.txt +0 -1842
  83. package/lib/interaction-areas.js +0 -1
  84. package/lib/player.js.LICENSE.txt +0 -21
  85. package/lib/shoppable.js +0 -1
  86. package/lib/videoPlayer.js.LICENSE.txt +0 -21
package/lib/index.js ADDED
@@ -0,0 +1,27 @@
1
+ export { _ as videojs } from './_videojs-proxy.js';
2
+ import { n as createPlayerWithConfig, q as createVideoPlayer } from './video-player.js';
3
+ import { s as setupCloudinaryGlobal, a as createAsyncPlayer, c as createMultiplePlayers, f as createMultipleSync } from './player-api.js';
4
+ import './_commonjsHelpers.js';
5
+ import './validators-functions.js';
6
+ import './querystring.js';
7
+
8
+ const videoPlayer = function (id) {
9
+ let playerOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
10
+ let ready = arguments.length > 2 ? arguments[2] : undefined;
11
+ return createVideoPlayer(id, playerOptions, ready);
12
+ };
13
+ const videoPlayers = (selector, playerOptions, ready) => createMultipleSync(selector, playerOptions, ready, videoPlayer);
14
+ const player = function (id) {
15
+ let playerOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
16
+ let ready = arguments.length > 2 ? arguments[2] : undefined;
17
+ return createAsyncPlayer(id, playerOptions, ready, createPlayerWithConfig);
18
+ };
19
+ const players = (selector, playerOptions, ready) => createMultiplePlayers(selector, playerOptions, ready, player);
20
+ var cloudinary = setupCloudinaryGlobal({
21
+ videoPlayer,
22
+ videoPlayers,
23
+ player,
24
+ players
25
+ });
26
+
27
+ export { cloudinary as default, player, players, videoPlayer, videoPlayers };
@@ -0,0 +1,24 @@
1
+ const INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME = 'cld-ia-layout-state';
2
+ const INTERACTION_AREAS_PREFIX = 'vp-ia';
3
+ const INTERACTION_AREAS_CONTAINER_CLASS_NAME = 'interaction-areas-container';
4
+ const INTERACTION_AREAS_TEMPLATE = {
5
+ PORTRAIT: 'portrait',
6
+ LANDSCAPE: 'landscape',
7
+ All: 'all',
8
+ CENTER: 'center'
9
+ };
10
+ const INTERACTION_AREAS_THEME = {
11
+ PULSING: 'pulsing',
12
+ SHADOWED: 'shadowed'
13
+ };
14
+ const TEMPLATE_INTERACTION_AREAS_VTT = {
15
+ [INTERACTION_AREAS_TEMPLATE.PORTRAIT]: 'https://res.cloudinary.com/prod/raw/upload/v1623772481/video-player/vtts/portrait.vtt',
16
+ [INTERACTION_AREAS_TEMPLATE.LANDSCAPE]: 'https://res.cloudinary.com/prod/raw/upload/v1623772303/video-player/vtts/landscape.vtt',
17
+ [INTERACTION_AREAS_TEMPLATE.All]: 'https://res.cloudinary.com/prod/raw/upload/v1623250266/video-player/vtts/all.vtt',
18
+ [INTERACTION_AREAS_TEMPLATE.CENTER]: 'https://res.cloudinary.com/prod/raw/upload/v1623250265/video-player/vtts/center.vtt'
19
+ };
20
+ const INTERACTION_AREA_HAND_ICON = 'https://res.cloudinary.com/prod/image/upload/v1626764643/video-player/interaction-area-hand.svg';
21
+ const CLOSE_INTERACTION_AREA_LAYOUT_DELAY = 4500;
22
+ const DEFAULT_INTERACTION_ARE_TRANSITION = 250;
23
+
24
+ export { CLOSE_INTERACTION_AREA_LAYOUT_DELAY as C, DEFAULT_INTERACTION_ARE_TRANSITION as D, INTERACTION_AREA_HAND_ICON as I, TEMPLATE_INTERACTION_AREAS_VTT as T, INTERACTION_AREAS_PREFIX as a, INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME as b, INTERACTION_AREAS_CONTAINER_CLASS_NAME as c, INTERACTION_AREAS_THEME as d, INTERACTION_AREAS_TEMPLATE as e };
@@ -0,0 +1,469 @@
1
+ import { _ as _vjs } from './_videojs-proxy.js';
2
+ import { e as elementsCreator, a as get, s as styleElement, P as PLAYER_EVENT, b as addEventListener, c as addMetadataTrack, d as createElement } from './video-player.js';
3
+ import { t as throttle } from './throttle.js';
4
+ import { n as noop } from './noop.js';
5
+ import { I as INTERACTION_AREA_HAND_ICON, a as INTERACTION_AREAS_PREFIX, b as INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME, c as INTERACTION_AREAS_CONTAINER_CLASS_NAME, d as INTERACTION_AREAS_THEME, C as CLOSE_INTERACTION_AREA_LAYOUT_DELAY, T as TEMPLATE_INTERACTION_AREAS_VTT, D as DEFAULT_INTERACTION_ARE_TRANSITION } from './interaction-areas.const.js';
6
+ import { getDefaultPlayerColor } from './colors.js';
7
+ import './_commonjsHelpers.js';
8
+ import './validators-functions.js';
9
+ import './querystring.js';
10
+ import './player-api.js';
11
+ import './toNumber.js';
12
+
13
+ const themedButton = _ref => {
14
+ let {
15
+ text,
16
+ onClick,
17
+ theme = '',
18
+ loadingDelay = 0
19
+ } = _ref;
20
+ return elementsCreator({
21
+ tag: 'button',
22
+ attr: {
23
+ class: `vp-theme-button theme-${theme}`
24
+ },
25
+ onClick,
26
+ children: [{
27
+ tag: 'div',
28
+ attr: {
29
+ class: 'vp-loading-bar'
30
+ },
31
+ style: {
32
+ 'animation-duration': `${loadingDelay}ms`
33
+ }
34
+ }, {
35
+ tag: 'div',
36
+ attr: {
37
+ class: 'content'
38
+ },
39
+ children: text
40
+ }]
41
+ });
42
+ };
43
+
44
+ const BUTTON_THEME = {
45
+ TRANSPARENT_WHITE: 'transparent-white'
46
+ };
47
+
48
+ const getInteractionAreaItemId = (item, index) => item.id || item.type || `id_${index}`;
49
+ const getInteractionAreaItem = (_ref, item, index, durationTime, onClick) => {
50
+ let {
51
+ playerOptions,
52
+ videojsOptions
53
+ } = _ref;
54
+ const defaultColor = getDefaultPlayerColor(videojsOptions);
55
+ const accentColor = playerOptions && playerOptions.colors ? playerOptions.colors.accent : defaultColor.accent;
56
+
57
+ // theme = 'pulsing' / 'shadowed'
58
+ const theme = get(videojsOptions, 'interactionDisplay.theme.template', INTERACTION_AREAS_THEME.PULSING);
59
+ return elementsCreator({
60
+ tag: 'div',
61
+ attr: {
62
+ class: `${INTERACTION_AREAS_PREFIX}-item theme-${theme}`,
63
+ 'data-id': getInteractionAreaItemId(item, index)
64
+ },
65
+ style: {
66
+ left: `${item.left}%`,
67
+ top: `${item.top}%`,
68
+ width: `${item.width}%`,
69
+ height: `${item.height}%`,
70
+ transitionDuration: `${durationTime}ms`
71
+ },
72
+ event: {
73
+ name: 'click',
74
+ callback: onClick
75
+ },
76
+ children: [{
77
+ tag: 'div',
78
+ attr: {
79
+ class: `${INTERACTION_AREAS_PREFIX}-area-marker`
80
+ },
81
+ children: [{
82
+ tag: 'div',
83
+ attr: {
84
+ class: `${INTERACTION_AREAS_PREFIX}-marker-shadow`
85
+ },
86
+ style: {
87
+ [theme === INTERACTION_AREAS_THEME.SHADOWED ? 'backgroundColor' : 'borderColor']: accentColor
88
+ }
89
+ }, {
90
+ tag: 'div',
91
+ attr: {
92
+ class: `${INTERACTION_AREAS_PREFIX}-marker-main`
93
+ },
94
+ style: {
95
+ borderColor: accentColor
96
+ }
97
+ }]
98
+ }]
99
+ });
100
+ };
101
+ const percentageToFixedValue = (outOf, value) => outOf / (100 / +value);
102
+ const getZoomTransformation = (videoElement, interactionAreaItem) => {
103
+ const {
104
+ videoHeight,
105
+ videoWidth
106
+ } = videoElement;
107
+ const itemX = percentageToFixedValue(videoWidth, interactionAreaItem.left);
108
+ const itemY = percentageToFixedValue(videoHeight, interactionAreaItem.top);
109
+ const itemWidth = percentageToFixedValue(videoWidth, interactionAreaItem.width);
110
+ const itemHeight = percentageToFixedValue(videoHeight, interactionAreaItem.height);
111
+ const videoAspectRatio = videoWidth / videoHeight;
112
+ const itemAspectRatio = itemWidth / itemHeight;
113
+ const width = Math.round(itemAspectRatio > 1 || videoAspectRatio > 1 ? itemHeight * itemAspectRatio : itemWidth);
114
+ const height = Math.round(width / videoAspectRatio);
115
+ const x = Math.round(itemX - (width - itemWidth) / 2);
116
+ const y = Math.round(itemY - (height - itemHeight) / 2);
117
+ return {
118
+ width,
119
+ height,
120
+ x: Math.min(Math.max(x, 0), videoWidth - width),
121
+ y: Math.min(Math.max(y, 0), videoHeight - height),
122
+ crop: 'crop'
123
+ };
124
+ };
125
+ const setInteractionAreasContainer = (videojs, newInteractionAreasContainer) => {
126
+ const currentInteractionAreasContainer = getInteractionAreasContainer(videojs);
127
+ if (currentInteractionAreasContainer) {
128
+ currentInteractionAreasContainer.replaceWith(newInteractionAreasContainer);
129
+ } else {
130
+ // do not use element.append for ie11 support
131
+ videojs.el().appendChild(newInteractionAreasContainer);
132
+ }
133
+ };
134
+ const getInteractionAreaElementById = (interactionAreasContainer, item, index) => interactionAreasContainer.querySelector(`[data-id=${getInteractionAreaItemId(item, index)}]`);
135
+ const updateInteractionAreasItem = (videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onClick) => {
136
+ const interactionAreasContainer = getInteractionAreasContainer(videojs);
137
+ interactionAreasData.forEach((item, index) => {
138
+ const itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);
139
+ const itemId = getInteractionAreaItemId(item);
140
+ const isExistItem = previousInteractionAreasData.some(i => getInteractionAreaItemId(i) === itemId);
141
+
142
+ // in case the element of the item is in the dom and exist in the previous data , it update the element position
143
+ if (isExistItem && itemElement) {
144
+ styleElement(itemElement, {
145
+ left: `${item.left}%`,
146
+ top: `${item.top}%`,
147
+ width: `${item.width}%`,
148
+ height: `${item.height}%`,
149
+ transitionDuration: `${durationTime}ms`
150
+ });
151
+ // if the element did not exist before , not in the dom and not in the previous data , it add a new element
152
+ } else if (!isExistItem && !itemElement) {
153
+ // do not use element.append for ie11 support
154
+ interactionAreasContainer.appendChild(getInteractionAreaItem(configs, item, index, durationTime, event => {
155
+ onClick({
156
+ event,
157
+ item,
158
+ index
159
+ });
160
+ }));
161
+ }
162
+ });
163
+
164
+ // checking the previous data for element that should be removed if not exist in the new data object.
165
+ previousInteractionAreasData.forEach((item, index) => {
166
+ const itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);
167
+ const itemId = getInteractionAreaItemId(item);
168
+ const shouldBeRemoved = !interactionAreasData.some(i => getInteractionAreaItemId(i) === itemId);
169
+ if (itemElement && shouldBeRemoved) {
170
+ // do not use element.remove for ie11 support
171
+ itemElement.parentNode.removeChild(itemElement);
172
+ }
173
+ });
174
+ };
175
+ const shouldShowAreaLayoutMessage = interactionAreasConfig => {
176
+ const isLayoutEnabled = get(interactionAreasConfig, 'layout.enable', true);
177
+ return isLayoutEnabled && localStorage.getItem(INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME) !== 'true';
178
+ };
179
+ const onClickInteractionAreaLayoutClick = function (checked) {
180
+ let onClick = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop;
181
+ localStorage.setItem(INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME, JSON.parse(checked));
182
+ onClick();
183
+ };
184
+ const createInteractionAreaLayoutMessage = function (videojs, onClick) {
185
+ let showItAgainCheckbox = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
186
+ let checked = false;
187
+ const id = `checkbox_${Math.round(Math.random() * 10000)}`;
188
+ const tracksContainer = elementsCreator({
189
+ tag: 'div',
190
+ attr: {
191
+ class: `${INTERACTION_AREAS_CONTAINER_CLASS_NAME} ${INTERACTION_AREAS_PREFIX}-layout-message ${showItAgainCheckbox ? '' : 'clickable'}`
192
+ },
193
+ onClick: !showItAgainCheckbox ? () => onClickInteractionAreaLayoutClick(checked, onClick) : null,
194
+ children: [{
195
+ tag: 'img',
196
+ attr: {
197
+ class: `${INTERACTION_AREAS_PREFIX}-layout-icon`,
198
+ src: INTERACTION_AREA_HAND_ICON
199
+ }
200
+ }, {
201
+ tag: 'h3',
202
+ attr: {
203
+ class: `${INTERACTION_AREAS_PREFIX}-layout-message-title`
204
+ },
205
+ children: 'Tap on dots to zoom for a product.'
206
+ }, themedButton({
207
+ text: 'Got it',
208
+ theme: BUTTON_THEME.TRANSPARENT_WHITE,
209
+ loadingDelay: showItAgainCheckbox ? 0 : CLOSE_INTERACTION_AREA_LAYOUT_DELAY,
210
+ onClick: showItAgainCheckbox ? () => onClickInteractionAreaLayoutClick(checked, onClick) : null
211
+ }), showItAgainCheckbox && {
212
+ tag: 'div',
213
+ attr: {
214
+ class: `${INTERACTION_AREAS_PREFIX}-layout-message-do-not-show`
215
+ },
216
+ children: [{
217
+ tag: 'input',
218
+ attr: {
219
+ type: 'checkbox',
220
+ class: `${INTERACTION_AREAS_PREFIX}-layout-message-checkbox`,
221
+ id
222
+ },
223
+ event: {
224
+ name: 'input',
225
+ callback: event => {
226
+ checked = event.target.checked;
227
+ }
228
+ }
229
+ }, {
230
+ tag: 'label',
231
+ attr: {
232
+ class: `${INTERACTION_AREAS_PREFIX}-layout-message-checkbox-title`,
233
+ for: id
234
+ },
235
+ children: 'Don׳t show it again'
236
+ }]
237
+ }].filter(i => i)
238
+ });
239
+ setInteractionAreasContainer(videojs, tracksContainer);
240
+ };
241
+ const getInteractionAreasContainer = videojs => videojs.el().querySelector(`.${INTERACTION_AREAS_CONTAINER_CLASS_NAME}`);
242
+ const removeInteractionAreasContainer = videojs => {
243
+ const interactionAreasContainer = getInteractionAreasContainer(videojs);
244
+
245
+ // do not use element.remove for ie11 support
246
+ interactionAreasContainer && interactionAreasContainer.parentNode.removeChild(interactionAreasContainer);
247
+ };
248
+ const setInteractionAreasContainerSize = (videojs, videoElement) => {
249
+ const interactionAreasContainer = getInteractionAreasContainer(videojs);
250
+ if (!interactionAreasContainer) {
251
+ return;
252
+ }
253
+ const {
254
+ videoHeight,
255
+ videoWidth
256
+ } = videoElement;
257
+ const videoAspectRatio = videoWidth / videoHeight;
258
+ const width = videoAspectRatio * videoElement.clientHeight;
259
+ interactionAreasContainer.style.width = `${videoElement.clientWidth < width ? '100%' : width}px`;
260
+ interactionAreasContainer.style.height = videoElement.clientWidth < width ? `${videoElement.clientWidth / videoAspectRatio}px` : '100%';
261
+ };
262
+
263
+ const interactionAreasService = (player, playerOptions, videojsOptions) => {
264
+ let isZoomed = false;
265
+ let currentSource = null;
266
+ let currentTrack = null;
267
+ let unZoom = noop;
268
+ const shouldLayoutMessage = () => shouldShowAreaLayoutMessage(videojsOptions.interactionDisplay);
269
+ const getIsSyncOffsetTime = () => {
270
+ const interactionAreasConfig = getInteractionAreasConfig();
271
+ return interactionAreasConfig && interactionAreasConfig.syncOffsetTime !== undefined ? interactionAreasConfig.syncOffsetTime : false;
272
+ };
273
+ function isInteractionAreasEnabled() {
274
+ let enabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
275
+ const interactionAreasConfig = getInteractionAreasConfig();
276
+ return enabled || interactionAreasConfig && interactionAreasConfig.enable;
277
+ }
278
+ function setAreasPositionListener() {
279
+ currentTrack && player.videojs.removeRemoteTextTrack(currentTrack);
280
+ const isEnabled = isInteractionAreasEnabled();
281
+ const interactionAreasConfig = getInteractionAreasConfig();
282
+ if (!isEnabled || isZoomed) {
283
+ return null;
284
+ }
285
+ if (Array.isArray(interactionAreasConfig.template)) {
286
+ addInteractionAreasItems(interactionAreasConfig.template);
287
+ setContainerSize();
288
+ } else {
289
+ const vttUrl = interactionAreasConfig.vttUrl || TEMPLATE_INTERACTION_AREAS_VTT[interactionAreasConfig.template];
290
+ if (vttUrl) {
291
+ currentTrack = addMetadataTrack(player.videojs, vttUrl);
292
+ addCueListener(currentTrack);
293
+ }
294
+ }
295
+ }
296
+ function setGoBackButton() {
297
+ const button = createElement('div', {
298
+ 'class': 'go-back-button'
299
+ });
300
+ button.addEventListener('click', () => {
301
+ unZoom();
302
+ }, false);
303
+ const tracksContainer = createElement('div', {
304
+ 'class': INTERACTION_AREAS_CONTAINER_CLASS_NAME
305
+ }, button);
306
+ setInteractionAreasContainer(player.videojs, tracksContainer);
307
+ }
308
+ function getInteractionAreasConfig() {
309
+ const {
310
+ cldSrc
311
+ } = currentSource;
312
+ return cldSrc && cldSrc.interactionAreas();
313
+ }
314
+ function removeLayoutMessage() {
315
+ removeInteractionAreasContainer(player.videojs);
316
+ setAreasPositionListener();
317
+ player.play();
318
+ }
319
+ function setLayoutMessage() {
320
+ if (!isInteractionAreasEnabled()) {
321
+ return;
322
+ }
323
+ if (shouldLayoutMessage()) {
324
+ let layoutMessageTimout = null;
325
+ const showItAgainCheckbox = get(videojsOptions, 'interactionDisplay.layout.showAgain', false);
326
+ player.pause();
327
+ createInteractionAreaLayoutMessage(player.videojs, () => {
328
+ clearTimeout(layoutMessageTimout);
329
+ removeLayoutMessage();
330
+ }, showItAgainCheckbox);
331
+ if (!showItAgainCheckbox) {
332
+ layoutMessageTimout = setTimeout(removeLayoutMessage, CLOSE_INTERACTION_AREA_LAYOUT_DELAY);
333
+ }
334
+ } else {
335
+ removeLayoutMessage();
336
+ }
337
+ }
338
+ function handleAds() {
339
+ player.on('adsready', () => {
340
+ player.videojs.ima.addEventListener(window.google.ima.AdEvent.Type.ALL_ADS_COMPLETED, setLayoutMessage);
341
+ });
342
+ }
343
+ function init() {
344
+ currentSource = currentSource || player.videojs.currentSource();
345
+ if (isInteractionAreasEnabled()) {
346
+ player.videojs.el().classList.add('interaction-areas');
347
+ player.videojs.one(PLAYER_EVENT.PLAY, () => {
348
+ if (typeof player.videojs.ima === 'object') {
349
+ handleAds();
350
+ } else {
351
+ setLayoutMessage();
352
+ }
353
+ });
354
+ const setInteractionAreasContainerSize = throttle(setContainerSize, 100);
355
+ player.videojs.on(PLAYER_EVENT.FULL_SCREEN_CHANGE, () => {
356
+ // waiting for fullscreen will end
357
+ setTimeout(setInteractionAreasContainerSize, 100);
358
+ });
359
+ const resizeDestroy = addEventListener(window, 'resize', setContainerSize);
360
+ player.videojs.on(PLAYER_EVENT.DISPOSE, resizeDestroy);
361
+ }
362
+ player.videojs.on(PLAYER_EVENT.ENDED, () => {
363
+ unZoom();
364
+ });
365
+ player.videojs.on(PLAYER_EVENT.ERROR, () => {
366
+ player.pause();
367
+ });
368
+ }
369
+ function onZoom(src, newOption, item) {
370
+ const originalCurrentTime = player.currentTime();
371
+ const isSyncOffsetTime = getIsSyncOffsetTime();
372
+ const {
373
+ cldSrc
374
+ } = currentSource;
375
+ const currentSrcOptions = cldSrc.getInitOptions();
376
+ const option = newOption || {
377
+ transformation: currentSrcOptions.transformation
378
+ };
379
+ const transformation = !src && getZoomTransformation(player.videoElement, item);
380
+ const sourceOptions = transformation ? _vjs.obj.merge({
381
+ transformation
382
+ }, option) : option;
383
+ const newSource = cldSrc.isRawUrl ? currentSource.src : {
384
+ publicId: cldSrc.publicId()
385
+ };
386
+ player.source(transformation ? {
387
+ publicId: cldSrc.publicId()
388
+ } : src, sourceOptions).play();
389
+ isSyncOffsetTime && player.currentTime(originalCurrentTime);
390
+ isZoomed = true;
391
+ setGoBackButton();
392
+ unZoom = () => {
393
+ if (isZoomed) {
394
+ isZoomed = false;
395
+ const currentZoomedTime = player.currentTime();
396
+ const duration = player.duration();
397
+ player.source(newSource, currentSrcOptions).play();
398
+ isSyncOffsetTime && currentZoomedTime < duration && player.currentTime(currentZoomedTime);
399
+ setAreasPositionListener();
400
+ }
401
+ };
402
+ }
403
+ function onInteractionAreasClick(_ref) {
404
+ let {
405
+ event,
406
+ item,
407
+ index
408
+ } = _ref;
409
+ const interactionAreasConfig = getInteractionAreasConfig();
410
+ interactionAreasConfig.onClick && interactionAreasConfig.onClick({
411
+ item,
412
+ index,
413
+ event,
414
+ zoom: (source, option) => {
415
+ onZoom(source, option, item);
416
+ }
417
+ });
418
+ }
419
+ function addInteractionAreasItems(interactionAreasData, previousInteractionAreasData) {
420
+ let durationTime = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
421
+ const configs = {
422
+ playerOptions: playerOptions,
423
+ videojsOptions: videojsOptions
424
+ };
425
+ if (previousInteractionAreasData) {
426
+ updateInteractionAreasItem(player.videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onInteractionAreasClick);
427
+ } else {
428
+ const interactionAreasItems = interactionAreasData.map((item, index) => {
429
+ return getInteractionAreaItem(configs, item, index, durationTime, event => {
430
+ onInteractionAreasClick({
431
+ event,
432
+ item,
433
+ index
434
+ });
435
+ });
436
+ });
437
+ setInteractionAreasContainer(player.videojs, createElement('div', {
438
+ 'class': INTERACTION_AREAS_CONTAINER_CLASS_NAME
439
+ }, interactionAreasItems));
440
+ }
441
+ }
442
+ function setContainerSize() {
443
+ if (isInteractionAreasEnabled()) {
444
+ setInteractionAreasContainerSize(player.videojs, player.videoElement);
445
+ }
446
+ }
447
+ function addCueListener(track) {
448
+ if (!track) {
449
+ return;
450
+ }
451
+ let previousTracksData = null;
452
+ track.addEventListener('cuechange', () => {
453
+ const activeCue = track.activeCues && track.activeCues[0];
454
+ if (activeCue) {
455
+ const durationTime = Math.max(Math.floor((activeCue.endTime - activeCue.startTime) * 1000), DEFAULT_INTERACTION_ARE_TRANSITION);
456
+ const tracksData = JSON.parse(activeCue.text);
457
+ addInteractionAreasItems(tracksData, previousTracksData, durationTime);
458
+ !previousTracksData && setContainerSize();
459
+ previousTracksData = tracksData;
460
+ } else {
461
+ removeInteractionAreasContainer(player.videojs);
462
+ previousTracksData = null;
463
+ }
464
+ });
465
+ }
466
+ init();
467
+ };
468
+
469
+ export { interactionAreasService };
package/lib/lazy.js ADDED
@@ -0,0 +1,20 @@
1
+ import { s as setupCloudinaryGlobal, c as createMultiplePlayers, a as createAsyncPlayer } from './player-api.js';
2
+ import './_commonjsHelpers.js';
3
+
4
+ /**
5
+ * Lazy entry: tiny initial bundle, player core loads on demand.
6
+ * Only player()/players() are available. For sync videoPlayer(), use the full bundle.
7
+ */
8
+ const player = (id, playerOptions, ready) => createAsyncPlayer(id, playerOptions, ready, async (videoElement, opts, r) => {
9
+ const {
10
+ videoPlayer
11
+ } = await import(/* webpackChunkName: "cld-player-core" */'./index.js');
12
+ return videoPlayer(videoElement, opts, r);
13
+ });
14
+ const players = (selector, playerOptions, ready) => createMultiplePlayers(selector, playerOptions, ready, player);
15
+ var index_lazy = setupCloudinaryGlobal({
16
+ player,
17
+ players
18
+ });
19
+
20
+ export { index_lazy as default, player, players };
package/lib/noop.js ADDED
@@ -0,0 +1,33 @@
1
+ import { g as getDefaultExportFromCjs } from './_commonjsHelpers.js';
2
+
3
+ /**
4
+ * This method returns `undefined`.
5
+ *
6
+ * @static
7
+ * @memberOf _
8
+ * @since 2.3.0
9
+ * @category Util
10
+ * @example
11
+ *
12
+ * _.times(2, _.noop);
13
+ * // => [undefined, undefined]
14
+ */
15
+
16
+ var noop_1;
17
+ var hasRequiredNoop;
18
+
19
+ function requireNoop () {
20
+ if (hasRequiredNoop) return noop_1;
21
+ hasRequiredNoop = 1;
22
+ function noop() {
23
+ // No operation performed.
24
+ }
25
+
26
+ noop_1 = noop;
27
+ return noop_1;
28
+ }
29
+
30
+ var noopExports = requireNoop();
31
+ var noop = /*@__PURE__*/getDefaultExportFromCjs(noopExports);
32
+
33
+ export { noop as n };