Skip to content

Commit 24a65b9

Browse files
authored
fix: refactor and separate source & cloud config (#896)
* fix: refactor and separate source & cloud config * fix: default abrStrategy * fix: styledTextTracks + transcript analytics * fix: missing import in all.js
1 parent 509bfdf commit 24a65b9

File tree

4 files changed

+59
-51
lines changed

4 files changed

+59
-51
lines changed

src/index.all.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ export * from './plugins/playlist/playlist.js';
1616
export * from './plugins/interaction-areas/interaction-areas.service.js';
1717
export * from './plugins/visual-search/visual-search.js';
1818
export * from './plugins/srt-text-tracks/srt-text-tracks.js';
19+
export * from './plugins/share/share.js';
1920
export * from './components/shoppable-bar/shoppable-widget.js';
2021
export * from './components/recommendations-overlay/recommendations-overlay.js';
2122

src/utils/get-analytics-player-options.js

Lines changed: 32 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -11,30 +11,11 @@ const filterDefaultsAndNulls = (obj) => Object.entries(obj).reduce((filtered, [k
1111
return filtered;
1212
}, {});
1313

14-
const getCloudinaryOptions = (cloudinaryOptions = {}) => ({
15-
autoShowRecommendations: cloudinaryOptions.autoShowRecommendations,
16-
fontFace: cloudinaryOptions.fontFace,
17-
posterOptions: hasConfig(cloudinaryOptions.posterOptions),
18-
posterOptionsPublicId: cloudinaryOptions.posterOptions && hasConfig(cloudinaryOptions.posterOptions.publicId)
19-
});
20-
21-
const getTranscriptOptions = (textTracks = {}) => {
22-
const tracksArr = [textTracks.captions, ...(textTracks.subtitles || [])];
23-
return {
24-
textTracks: hasConfig(textTracks),
25-
textTracksLength: tracksArr.length,
26-
textTracksOptions: hasConfig(textTracks.options) && Object.keys(textTracks.options).join(','),
27-
pacedTextTracks: hasConfig(textTracks) && JSON.stringify(textTracks || {}).includes('"maxWords":') || null,
28-
wordHighlight: hasConfig(textTracks) && JSON.stringify(textTracks || {}).includes('"wordHighlight":') || null,
29-
transcriptLanguages: tracksArr.filter((track) => !track.url).map((track) => track.language || '').join(',') || null,
30-
transcriptAutoLoaded: tracksArr.some((track) => !track.url) || null,
31-
transcriptFromURl: tracksArr.some((track) => track.url?.endsWith('.transcript')) || null,
32-
vttFromUrl: tracksArr.some((track) => track.url?.endsWith('.vtt')) || null,
33-
srtFromUrl: tracksArr.some((track) => track.url?.endsWith('.srt')) || null
34-
};
35-
};
36-
3714
const getSourceOptions = (sourceOptions = {}) => ({
15+
posterOptions: hasConfig(sourceOptions.posterOptions),
16+
posterOptionsPublicId: sourceOptions.posterOptions && hasConfig(sourceOptions.posterOptions.publicId),
17+
autoShowRecommendations: sourceOptions.autoShowRecommendations,
18+
fontFace: sourceOptions.fontFace,
3819
sourceTypes: sourceOptions.sourceTypes,
3920
chapters: (() => {
4021
if (sourceOptions.chapters === true) return 'auto';
@@ -46,7 +27,7 @@ const getSourceOptions = (sourceOptions = {}) => ({
4627
download: hasConfig(sourceOptions.download),
4728
recommendations: sourceOptions.recommendations && sourceOptions.recommendations.length,
4829
...(hasConfig(sourceOptions.adaptiveStreaming) ? {
49-
abrStrategy: sourceOptions?.adaptiveStreaming?.strategy,
30+
abrStrategy: sourceOptions?.adaptiveStreaming?.strategy === defaults.adaptiveStreaming.strategy ? undefined : sourceOptions?.adaptiveStreaming?.strategy,
5031
} : {}),
5132
shoppable: hasConfig(sourceOptions.shoppable),
5233
shoppableProductsLength: sourceOptions.shoppable && sourceOptions.shoppable.products && sourceOptions.shoppable.products.length,
@@ -55,20 +36,34 @@ const getSourceOptions = (sourceOptions = {}) => ({
5536
sourceTitle: (typeof sourceOptions.title === 'string' ? sourceOptions.title : sourceOptions.info?.title),
5637
sourceDescription: (typeof sourceOptions.description === 'string' ? sourceOptions.description : sourceOptions.info?.subtitle || sourceOptions.info?.description)
5738
} : {}),
58-
...(sourceOptions.textTracks ? {
59-
...(hasConfig(sourceOptions.textTracks) && getTranscriptOptions(sourceOptions.textTracks)),
60-
...(sourceOptions.textTracks.options ? {
61-
styledTextTracksTheme: sourceOptions.textTracks.options.theme,
62-
styledTextTracksFont: sourceOptions.textTracks.options.fontFace,
63-
styledTextTracksFontSize: sourceOptions.textTracks.options.fontSize,
64-
styledTextTracksGravity: sourceOptions.textTracks.options.gravity,
65-
styledTextTracksBox: hasConfig(sourceOptions.textTracks.options.box),
66-
styledTextTracksStyle: hasConfig(sourceOptions.textTracks.options.style),
67-
styledTextTracksWordHighlightStyle: hasConfig(sourceOptions.textTracks.options.wordHighlightStyle)
68-
} : {})
69-
} : {})
39+
...(hasConfig(sourceOptions.textTracks) ? getTextTracksOptions(sourceOptions.textTracks) : {})
7040
});
7141

42+
const getTextTracksOptions = (textTracks = {}) => {
43+
const tracksArr = [textTracks.captions, ...(textTracks.subtitles || [])];
44+
return {
45+
textTracks: hasConfig(textTracks),
46+
textTracksLength: tracksArr.length,
47+
textTracksOptions: hasConfig(textTracks.options) && Object.keys(textTracks.options).join(','),
48+
pacedTextTracks: hasConfig(textTracks) && JSON.stringify(textTracks || {}).includes('"maxWords":') || null,
49+
wordHighlight: hasConfig(textTracks) && JSON.stringify(textTracks || {}).includes('"wordHighlight":') || null,
50+
transcriptLanguages: tracksArr.filter((track) => !track.url).map((track) => track.language || '').join(',') || null,
51+
transcriptAutoLoaded: tracksArr.some((track) => !track.url) || null,
52+
transcriptFromURl: tracksArr.some((track) => track.url?.endsWith('.transcript')) || null,
53+
vttFromUrl: tracksArr.some((track) => track.url?.endsWith('.vtt')) || null,
54+
srtFromUrl: tracksArr.some((track) => track.url?.endsWith('.srt')) || null,
55+
...(textTracks.options ? {
56+
styledTextTracksTheme: textTracks.options.theme,
57+
styledTextTracksFont: textTracks.options.fontFace,
58+
styledTextTracksFontSize: textTracks.options.fontSize,
59+
styledTextTracksGravity: textTracks.options.gravity,
60+
styledTextTracksBox: hasConfig(textTracks.options.box),
61+
styledTextTracksStyle: hasConfig(textTracks.options.style),
62+
styledTextTracksWordHighlightStyle: hasConfig(textTracks.options.wordHighlightStyle)
63+
} : {})
64+
};
65+
};
66+
7267
const getAdsOptions = (adsOptions = {}) => ({
7368
adsAdTagUrl: adsOptions.adTagUrl,
7469
adsShowCountdown: adsOptions.showCountdown,
@@ -126,8 +121,7 @@ export const getAnalyticsFromPlayerOptions = (playerOptions) => filterDefaultsAn
126121
colors: playerOptions.colors && JSON.stringify(playerOptions.colors),
127122
controlBar: (JSON.stringify(playerOptions.controlBar) !== JSON.stringify(defaults.controlBar)) && JSON.stringify(playerOptions.controlBar),
128123

129-
...getCloudinaryOptions(playerOptions.cloudinary),
130-
...getSourceOptions(playerOptions.sourceOptions),
124+
...getSourceOptions(playerOptions.sourceOptions || {}),
131125
...getAdsOptions(playerOptions.ads),
132126
...getPlaylistOptions(playerOptions.playlistWidget)
133127
});

src/video-player.js

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,6 @@ import { PLAYER_EVENT, SOURCE_TYPE } from './utils/consts';
2424
import { getAnalyticsFromPlayerOptions } from './utils/get-analytics-player-options';
2525
import { extendCloudinaryConfig, normalizeOptions, isRawUrl, ERROR_CODE } from './plugins/cloudinary/common';
2626
import { isVideoInReadyState, checkIfVideoIsAvailable } from './utils/video-retry';
27-
import { SOURCE_PARAMS } from './video-player.const';
2827

2928
const INTERNAL_ANALYTICS_URL = 'https://analytics-api-s.cloudinary.com';
3029

@@ -117,7 +116,7 @@ class VideoPlayer extends Utils.mixin(Eventable) {
117116
const baseParams = new URLSearchParams({
118117
vpVersion: VERSION,
119118
vpInstanceId: this.getVPInstanceId(),
120-
cloudName: options.cloudinary.cloudinaryConfig.cloud_name,
119+
cloudName: options.cloudinary.cloud_name,
121120
...internalAnalyticsMetadata,
122121
}).toString();
123122
fetch(`${INTERNAL_ANALYTICS_URL}/video_player_source?${analyticsParams}&${baseParams}`);
@@ -410,14 +409,20 @@ class VideoPlayer extends Utils.mixin(Eventable) {
410409
}
411410

412411
_initCloudinary() {
413-
const { cloudinaryConfig } = this.playerOptions.cloudinary;
412+
const cloudinaryConfig = this.playerOptions.cloudinary;
414413
cloudinaryConfig.chainTarget = this;
415414

416415
if (cloudinaryConfig.secure !== false) {
417416
extendCloudinaryConfig(cloudinaryConfig, { secure: true });
418417
}
419418

420-
this.videojs.cloudinary(this.playerOptions.cloudinary);
419+
// Merge cloudinary config with source config for the plugin
420+
const cloudinaryOptions = {
421+
cloudinaryConfig,
422+
...this.playerOptions.sourceOptions
423+
};
424+
425+
this.videojs.cloudinary(cloudinaryOptions);
421426
}
422427

423428
_initAnalytics() {
@@ -516,11 +521,11 @@ class VideoPlayer extends Utils.mixin(Eventable) {
516521
this._setExtendedEvents();
517522

518523
// Load first video (mainly to support video tag 'source' and 'public-id' attributes)
519-
// Source parameters are set to playerOptions.cloudinary
520-
const source = this.playerOptions.cloudinary.source || this.playerOptions.cloudinary.publicId;
524+
// Source parameters are set to playerOptions.sourceOptions
525+
const source = this.playerOptions.sourceOptions.source || this.playerOptions.sourceOptions.publicId;
521526

522527
if (source) {
523-
const sourceOptions = Object.assign({}, this.playerOptions.cloudinary);
528+
const sourceOptions = Object.assign({}, this.playerOptions.sourceOptions);
524529

525530
this.source(source, sourceOptions);
526531
}
@@ -597,10 +602,8 @@ class VideoPlayer extends Utils.mixin(Eventable) {
597602
}
598603

599604
// Inherit source parameters from player options (source options take precedence)
600-
const inherited = pick(this.playerOptions, SOURCE_PARAMS);
601-
const inheritedNested = this.playerOptions.cloudinary ? pick(this.playerOptions.cloudinary, SOURCE_PARAMS) : {};
602-
603-
options = { ...inherited, ...inheritedNested, ...options };
605+
const inherited = this.playerOptions.sourceOptions || {};
606+
options = { ...inherited, ...options };
604607

605608
if (options.shoppable && this.videojs.shoppable) {
606609
this.videojs.shoppable(this.videojs, options);

src/video-player.utils.js

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import defaults from './config/defaults';
44
import {
55
PLAYER_PARAMS,
66
SOURCE_PARAMS,
7+
CLOUDINARY_CONFIG_PARAM,
78
FLUID_CLASS_NAME,
89
AUTO_PLAY_MODE
910
} from './video-player.const';
@@ -89,8 +90,17 @@ export const extractOptions = (elem, options) => {
8990
// VideoPlayer specific options
9091
const playerOptions = Utils.sliceAndUnsetProperties(options, ...PLAYER_PARAMS);
9192

92-
// Cloudinary plugin specific options
93-
playerOptions.cloudinary = Utils.sliceAndUnsetProperties(playerOptions, ...SOURCE_PARAMS);
93+
// Cloudinary SDK config (cloud_name, secure, etc.)
94+
playerOptions.cloudinary = Utils.sliceAndUnsetProperties(playerOptions, ...CLOUDINARY_CONFIG_PARAM);
95+
96+
// Merge with cloudinaryConfig from src/index.js (e.g., secureDistribution -> secure_distribution)
97+
if (playerOptions.cloudinaryConfig) {
98+
Object.assign(playerOptions.cloudinary, playerOptions.cloudinaryConfig);
99+
delete playerOptions.cloudinaryConfig;
100+
}
101+
102+
// Source-level config (visualSearch, chapters, etc.)
103+
playerOptions.sourceOptions = Utils.sliceAndUnsetProperties(playerOptions, ...SOURCE_PARAMS);
94104

95105
// Allow explicitly passing options to videojs using the `videojs` namespace, in order
96106
// to avoid param name conflicts:

0 commit comments

Comments
 (0)