@gcorevideo/player 2.24.2 → 2.24.5

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 (69) hide show
  1. package/assets/big-mute-button/big-mute-button.ejs +2 -2
  2. package/dist/core.js +2 -2
  3. package/dist/index.css +418 -418
  4. package/dist/index.js +135 -112
  5. package/dist/player.d.ts +76 -30
  6. package/docs/api/player.bigmutebutton.md +13 -1
  7. package/docs/api/player.clapprstatssettings.md +51 -4
  8. package/docs/api/player.clapprstatssettings.runeach.md +16 -0
  9. package/docs/api/player.clipspluginsettings.md +1 -1
  10. package/docs/api/player.clipspluginsettings.text.md +1 -1
  11. package/docs/api/player.cmcdconfig.exportids.md +4 -0
  12. package/docs/api/player.cmcdconfig.md +19 -105
  13. package/docs/api/{player.cmcdconfig.version.md → player.cmcdconfigoptions.contentid.md} +5 -3
  14. package/docs/api/player.cmcdconfigoptions.md +79 -0
  15. package/docs/api/{player.cmcdconfigpluginsettings.md → player.cmcdconfigoptions.sessionid.md} +4 -6
  16. package/docs/api/player.extendedevents.md +9 -0
  17. package/docs/api/player.md +37 -31
  18. package/docs/api/player.mediacontrol.getavailableheight.md +24 -0
  19. package/docs/api/player.mediacontrol.md +14 -0
  20. package/docs/api/{player.cmcdconfig.name.md → player.posterpluginsettings.custom.md} +4 -3
  21. package/docs/api/player.posterpluginsettings.md +108 -7
  22. package/docs/api/player.posterpluginsettings.showfornoop.md +16 -0
  23. package/docs/api/player.posterpluginsettings.showonvideoend.md +16 -0
  24. package/docs/api/{player.cmcdconfig.bindevents.md → player.posterpluginsettings.url.md} +4 -7
  25. package/lib/Player.js +1 -1
  26. package/lib/index.embed.d.ts +30 -0
  27. package/lib/index.embed.d.ts.map +1 -0
  28. package/lib/index.embed.js +29 -0
  29. package/lib/plugins/big-mute-button/BigMuteButton.d.ts +18 -13
  30. package/lib/plugins/big-mute-button/BigMuteButton.d.ts.map +1 -1
  31. package/lib/plugins/big-mute-button/BigMuteButton.js +77 -83
  32. package/lib/plugins/clappr-stats/ClapprStats.d.ts +6 -2
  33. package/lib/plugins/clappr-stats/ClapprStats.d.ts.map +1 -1
  34. package/lib/plugins/click-to-pause/ClickToPause.js +1 -1
  35. package/lib/plugins/clips/Clips.d.ts +1 -1
  36. package/lib/plugins/clips/Clips.d.ts.map +1 -1
  37. package/lib/plugins/clips/Clips.js +2 -1
  38. package/lib/plugins/cmcd-config/CmcdConfig.d.ts +34 -11
  39. package/lib/plugins/cmcd-config/CmcdConfig.d.ts.map +1 -1
  40. package/lib/plugins/cmcd-config/CmcdConfig.js +28 -18
  41. package/lib/plugins/media-control/MediaControl.d.ts +4 -0
  42. package/lib/plugins/media-control/MediaControl.d.ts.map +1 -1
  43. package/lib/plugins/media-control/MediaControl.js +6 -1
  44. package/lib/plugins/poster/Poster.d.ts +7 -3
  45. package/lib/plugins/poster/Poster.d.ts.map +1 -1
  46. package/lib/plugins/source-controller/SourceController.d.ts +1 -0
  47. package/lib/plugins/source-controller/SourceController.d.ts.map +1 -1
  48. package/lib/plugins/source-controller/SourceController.js +22 -9
  49. package/lib/testUtils.d.ts +1 -0
  50. package/lib/testUtils.d.ts.map +1 -1
  51. package/lib/testUtils.js +1 -0
  52. package/package.json +1 -1
  53. package/src/Player.ts +1 -1
  54. package/src/index.embed.ts +29 -0
  55. package/src/plugins/big-mute-button/BigMuteButton.ts +84 -108
  56. package/src/plugins/big-mute-button/__tests__/BigMuteButton.test.ts +86 -0
  57. package/src/plugins/big-mute-button/__tests__/__snapshots__/BigMuteButton.test.ts.snap +8 -0
  58. package/src/plugins/clappr-stats/ClapprStats.ts +5 -1
  59. package/src/plugins/click-to-pause/ClickToPause.ts +1 -1
  60. package/src/plugins/clips/Clips.ts +3 -2
  61. package/src/plugins/cmcd-config/CmcdConfig.ts +33 -27
  62. package/src/plugins/media-control/MediaControl.ts +6 -1
  63. package/src/plugins/poster/Poster.ts +6 -2
  64. package/src/plugins/source-controller/SourceController.ts +27 -9
  65. package/src/plugins/source-controller/__tests__/SourceController.test.ts +28 -8
  66. package/src/testUtils.ts +5 -1
  67. package/temp/player.api.json +229 -154
  68. package/tsconfig.tsbuildinfo +1 -1
  69. package/docs/api/player.cmcdconfig.supportedversion.md +0 -14
package/dist/index.js CHANGED
@@ -42836,7 +42836,7 @@ function registerPlaybacks() {
42836
42836
  Loader.registerPlayback(DashPlayback);
42837
42837
  }
42838
42838
 
42839
- const T$k = 'GPlayer';
42839
+ const T$k = 'gplayer';
42840
42840
  const DEFAULT_OPTIONS = {
42841
42841
  autoPlay: false,
42842
42842
  debug: 'none',
@@ -43303,7 +43303,7 @@ class Player {
43303
43303
  }
43304
43304
  }
43305
43305
 
43306
- var version$1 = "2.24.2";
43306
+ var version$1 = "2.24.5";
43307
43307
 
43308
43308
  var packages = {
43309
43309
  "node_modules/@clappr/core": {
@@ -43327,7 +43327,7 @@ function version() {
43327
43327
  };
43328
43328
  }
43329
43329
 
43330
- const pluginHtml$7 = "<button data-audiotracks-button class='gcore-skin-button-color' id=\"audiotracks-button\" aria-haspopup=\"menu\" aria-expanded=\"false\">\n <span class='audio-text'><%= title %></span> <span class=\"audio-arrow\"><%= icon %></span>\n</button>\n<ul class='gcore-skin-bg-color menu hidden' id=\"audiotracks-select\" role=\"menu\">\n <% for (const track of tracks) { %>\n <li>\n <a href=\"#\" class='gcore-skin-text-color' data-audiotracks-select=\"<%= track.id %>\" role=\"menuitemradio\" aria-checked=\"<%= track.id === current %>\">\n <%= track.label %>\n </a>\n </li>\n <% }; %>\n</ul>\n";
43330
+ const pluginHtml$6 = "<button data-audiotracks-button class='gcore-skin-button-color' id=\"audiotracks-button\" aria-haspopup=\"menu\" aria-expanded=\"false\">\n <span class='audio-text'><%= title %></span> <span class=\"audio-arrow\"><%= icon %></span>\n</button>\n<ul class='gcore-skin-bg-color menu hidden' id=\"audiotracks-select\" role=\"menu\">\n <% for (const track of tracks) { %>\n <li>\n <a href=\"#\" class='gcore-skin-text-color' data-audiotracks-select=\"<%= track.id %>\" role=\"menuitemradio\" aria-checked=\"<%= track.id === current %>\">\n <%= track.label %>\n </a>\n </li>\n <% }; %>\n</ul>\n";
43331
43331
 
43332
43332
  const audioArrow = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<svg width=\"9px\" height=\"6px\" viewBox=\"0 0 9 6\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <!-- Generator: Sketch 49 (51002) - http://www.bohemiancoding.com/sketch -->\n <title>quality-arrow</title>\n <desc>Created with Sketch.</desc>\n <defs></defs>\n <g id=\"quality-arrow\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <path\n d=\"M5.07079194,5.78553848 C4.91457318,5.94277844 4.70551573,6.00941824 4.50028717,5.99893557 C4.2950586,6.00941824 4.08676693,5.94277844 3.92978239,5.78553848 L0.221118462,1.2997069 C-0.0737061539,1.00469478 -0.0737061539,0.526236029 0.221118462,0.231972666 C0.515177299,-0.0630394586 1.23500883,0.00734414472 1.64852907,0.00734414472 L7.77475484,0.00734414472 C8.21201421,0.00734414472 8.48539703,-0.0630394586 8.77945587,0.231972666 C9.07351471,0.526236029 9.07351471,1.00469478 8.77945587,1.2997069 L5.07079194,5.78553848 Z\"\n fill=\"#FFFFFE\"></path>\n </g>\n</svg>\n";
43333
43333
 
@@ -43636,6 +43636,10 @@ const LEFT_ORDER = [
43636
43636
  'duration',
43637
43637
  'dvr',
43638
43638
  ];
43639
+ /**
43640
+ * Extended events for the {@link MediaControl} plugin
43641
+ * @beta
43642
+ */
43639
43643
  var ExtendedEvents;
43640
43644
  (function (ExtendedEvents) {
43641
43645
  ExtendedEvents["MEDIACONTROL_VOLUME"] = "mediacontrol:volume";
@@ -43916,6 +43920,7 @@ class MediaControl extends UICorePlugin {
43916
43920
  onVolumeChanged() {
43917
43921
  this.updateVolumeUI();
43918
43922
  }
43923
+ // TODO check if CONTAINER_SETTINGSUPDATE handler is sufficient
43919
43924
  onLoadedMetadata() {
43920
43925
  const video = this.core.activePlayback?.el;
43921
43926
  // video.webkitSupportsFullscreen is deprecated but iOS appears to only use this
@@ -44056,7 +44061,7 @@ class MediaControl extends UICorePlugin {
44056
44061
  return false;
44057
44062
  }
44058
44063
  togglePlayStop() {
44059
- this.container.isPlaying() ? this.container.stop() : this.container.play();
44064
+ this.container.isPlaying() ? this.container.stop({ ui: true }) : this.container.play();
44060
44065
  }
44061
44066
  startSeekDrag(event) {
44062
44067
  if (!this.settings.seekEnabled) {
@@ -44802,7 +44807,7 @@ class AudioTracks extends UICorePlugin {
44802
44807
  static get version() {
44803
44808
  return VERSION$7;
44804
44809
  }
44805
- static template = tmpl(pluginHtml$7);
44810
+ static template = tmpl(pluginHtml$6);
44806
44811
  /**
44807
44812
  * @internal
44808
44813
  */
@@ -44943,20 +44948,26 @@ class AudioTracks extends UICorePlugin {
44943
44948
  }
44944
44949
  }
44945
44950
 
44946
- const pluginHtml$6 = "<div class=\"big-mute-icon-wrapper\" data-big-mute>\n <div class=\"big-mute-icon gcore-skin-border-color\" data-big-mute-icon></div>\n</div>\n";
44951
+ const templateHtml$2 = "<div class=\"big-mute-icon-wrapper\" data-big-mute id=\"gplayer-big-mute-button\">\n <div class=\"big-mute-icon gcore-skin-border-color\" data-big-mute-icon id=\"gplayer-big-mute-icon\"></div>\n</div>\n";
44947
44952
 
44948
44953
  const T$h = 'plugins.big_mute_button';
44949
44954
  // TODO rewrite as a container plugin
44950
44955
  /**
44951
- * `PLUGIN` that displays a big mute button over the video when it's muted.
44952
- * Once pressed, it unmutes the video.
44956
+ * `PLUGIN` that displays a big mute button over the video when it's being played muted.
44953
44957
  * @beta
44958
+ * @remarks
44959
+ * When pressed, it unmutes the video.
44960
+ * @example
44961
+ * ```ts
44962
+ * import { BigMuteButton } from '@gcorevideo/player'
44963
+ * Player.registerPlugin(BigMuteButton)
44964
+ * ```
44954
44965
  */
44955
44966
  class BigMuteButton extends UICorePlugin {
44956
- isBigMuteButtonHidden = false;
44967
+ autoPlay = false;
44968
+ hidden = false;
44969
+ // TODO get back to the ads-related logic later
44957
44970
  _adIsPlaying = false;
44958
- $bigMuteBtnContainer = null;
44959
- $bigMuteButton = null;
44960
44971
  /**
44961
44972
  * @internal
44962
44973
  */
@@ -44969,14 +44980,13 @@ class BigMuteButton extends UICorePlugin {
44969
44980
  get supportedVersion() {
44970
44981
  return { min: CLAPPR_VERSION$1 };
44971
44982
  }
44972
- static template = tmpl(pluginHtml$6);
44983
+ static template = tmpl(templateHtml$2);
44973
44984
  /**
44974
44985
  * @internal
44975
44986
  */
44976
44987
  get events() {
44977
44988
  return {
44978
- 'click .big-mute-icon': 'clicked',
44979
- 'click .big-mute-icon-wrapper': 'destroyBigMuteBtn',
44989
+ click: 'clicked',
44980
44990
  };
44981
44991
  }
44982
44992
  /**
@@ -44984,111 +44994,100 @@ class BigMuteButton extends UICorePlugin {
44984
44994
  */
44985
44995
  bindEvents() {
44986
44996
  this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
44997
+ this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, this.onContainerChanged);
44987
44998
  this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
44988
44999
  this.listenTo(this.core, 'core:advertisement:finish', this.onFinishAd);
44989
- trace(`${T$h} bindEvents`, {
44990
- mediacontrol: !!this.core.mediaControl,
44991
- });
44992
- // TOOD use core.getPlugin('media_control')
44993
- this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.mediaControlRendered);
44994
45000
  }
44995
- onCoreReady() {
45001
+ onCoreReady() { }
45002
+ onContainerChanged() {
44996
45003
  this.listenTo(this.core.activeContainer, Events$1.CONTAINER_VOLUME, this.onContainerVolume);
44997
- this.listenTo(this.core.activeContainer, Events$1.CONTAINER_READY, this.onContainerStart);
44998
45004
  this.listenTo(this.core.activePlayback, Events$1.PLAYBACK_ENDED, this.onPlaybackEnded);
45005
+ this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAY, this.onPlay);
45006
+ this.listenTo(this.core.activeContainer, Events$1.CONTAINER_STOP, this.onStop);
45007
+ this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PAUSE, this.onPause);
44999
45008
  }
45000
- onContainerVolume(value) {
45001
- if (value !== 0) {
45002
- this.destroyBigMuteBtn();
45009
+ onPlay(_, { autoPlay }) {
45010
+ const container = this.core.activeContainer;
45011
+ const { volume } = container;
45012
+ const { wasMuted } = this.options;
45013
+ if (autoPlay) {
45014
+ this.autoPlay = true;
45015
+ }
45016
+ trace(`${T$h} onPlay`, {
45017
+ autoPlay: this.autoPlay,
45018
+ wasMuted,
45019
+ volume,
45020
+ });
45021
+ if (this.autoPlay && !wasMuted && volume === 0) {
45022
+ this.mount();
45023
+ }
45024
+ else {
45025
+ this.destroy();
45003
45026
  }
45004
45027
  }
45005
- onContainerStart() {
45006
- if (this.isBigMuteButtonHidden) {
45007
- this.showBigMuteBtn();
45028
+ onStop(_, { ui }) {
45029
+ trace(`${T$h} onStop`, { ui });
45030
+ if (ui) {
45031
+ this.destroy();
45008
45032
  }
45009
45033
  }
45010
- onPlaybackEnded() {
45011
- this.hideBigMuteBtn();
45034
+ onPause() {
45035
+ this.destroy();
45012
45036
  }
45013
- mediaControlRendered() {
45014
- const container = this.core.activeContainer;
45015
- trace(`${T$h} mediaControlRendered`, {
45016
- container: !!container,
45017
- });
45018
- if (container) {
45019
- this.listenTo(container.playback, Events$1.PLAYBACK_PLAY, () => {
45020
- trace(`${T$h} PLAYBACK_PLAY`);
45021
- this.render();
45022
- });
45037
+ onContainerVolume(value) {
45038
+ if (value !== 0) {
45039
+ this.destroy();
45023
45040
  }
45024
45041
  }
45042
+ onPlaybackEnded() {
45043
+ this.hide();
45044
+ }
45025
45045
  onStartAd() {
45026
45046
  this._adIsPlaying = true;
45027
- if (this.$bigMuteBtnContainer) {
45028
- this.$bigMuteBtnContainer.addClass('hide');
45029
- }
45047
+ this.hide();
45030
45048
  }
45031
45049
  onFinishAd() {
45032
45050
  this._adIsPlaying = false;
45033
- if (this.$bigMuteBtnContainer) {
45034
- this.$bigMuteBtnContainer.removeClass('hide');
45035
- }
45036
- }
45037
- shouldRender() {
45038
- const container = this.core.activeContainer;
45039
- if (!container) {
45040
- return false;
45041
- }
45042
- const { autoPlay, wasMuted } = this.options;
45043
- const volume = container.volume;
45044
- trace(`${T$h} shouldRender`, {
45045
- autoPlay,
45046
- wasMuted,
45047
- volume,
45048
- });
45049
- return autoPlay && !wasMuted && volume === 0;
45051
+ this.show();
45050
45052
  }
45051
45053
  /**
45052
45054
  * @internal
45053
45055
  */
45054
45056
  render() {
45055
- if (this.shouldRender()) {
45056
- trace(`${T$h} render`, {
45057
- el: !!this.$el,
45058
- });
45059
- this.$el.html(BigMuteButton.template());
45060
- this.$bigMuteBtnContainer = this.$el.find('.big-mute-icon-wrapper[data-big-mute]');
45061
- this._adIsPlaying && this.$bigMuteBtnContainer.addClass('hide');
45062
- this.$bigMuteButton = this.$bigMuteBtnContainer.find('.big-mute-icon');
45063
- this.$bigMuteButton.append(volumeMuteIcon);
45064
- const container = this.core.activeContainer;
45065
- container.$el.append(this.$el.get(0));
45066
- }
45057
+ trace(`${T$h} render`);
45058
+ this.$el.html(BigMuteButton.template());
45059
+ this.$el.find('#gplayer-big-mute-icon').append(volumeMuteIcon);
45060
+ // TODO
45061
+ // this._adIsPlaying && this.hide()
45067
45062
  return this;
45068
45063
  }
45069
- hideBigMuteBtn() {
45070
- this.isBigMuteButtonHidden = true;
45071
- this.$bigMuteBtnContainer?.addClass('hide');
45064
+ mount() {
45065
+ this.core.activeContainer.$el.append(this.$el);
45066
+ this.show();
45072
45067
  }
45073
- showBigMuteBtn() {
45074
- this.isBigMuteButtonHidden = false;
45075
- if (this.$bigMuteBtnContainer) {
45076
- this.$bigMuteBtnContainer.removeClass('hide');
45077
- }
45068
+ hide() {
45069
+ this.hidden = true;
45070
+ this.$el.find('#gplayer-big-mute-button')?.addClass('hide');
45078
45071
  }
45079
- destroyBigMuteBtn(e) {
45080
- this.hideBigMuteBtn();
45081
- if (e && e.stopPropagation) {
45082
- e.stopPropagation();
45083
- }
45084
- this.destroy();
45072
+ show() {
45073
+ this.hidden = false;
45074
+ this.$el.find('#gplayer-big-mute-button')?.removeClass('hide');
45085
45075
  }
45086
45076
  clicked(e) {
45077
+ trace(`${T$h} clicked`);
45078
+ const mediaControl = this.core.getPlugin('media_control');
45079
+ // TODO delegate to media_control plugin
45087
45080
  const localVolume = Utils.Config.restore('volume');
45088
45081
  const volume = !isNaN(localVolume) ? localVolume : 100;
45089
- // TODO use container.setVolume() instead
45090
- this.core.mediaControl.setVolume(volume === 0 ? 100 : volume);
45091
- this.destroyBigMuteBtn(e);
45082
+ const unmuted = volume === 0 ? 100 : volume;
45083
+ if (mediaControl) {
45084
+ mediaControl.setVolume(unmuted);
45085
+ }
45086
+ else {
45087
+ this.core.activeContainer.setVolume(unmuted);
45088
+ }
45089
+ e.stopPropagation?.();
45090
+ this.destroy();
45092
45091
  }
45093
45092
  }
45094
45093
 
@@ -45735,24 +45734,42 @@ const CMCD_KEYS = [
45735
45734
  ];
45736
45735
  // const T = 'plugins.cmcd'
45737
45736
  /**
45738
- * A `PLUGIN` that configures CMCD for playback
45737
+ * A `PLUGIN` that configures {@link https://cdn.cta.tech/cta/media/media/resources/standards/pdfs/cta-5004-final.pdf | CMCD} for playback
45739
45738
  * @beta
45740
45739
  * @remarks
45741
- * Configuration options
45742
- * `cmcd`: {@link CmcdConfigPluginSettings}
45740
+ * Configuration options - {@link CmcdConfigOptions}.
45741
+ * @example
45742
+ * ```ts
45743
+ * import { CmcdConfig } from '@gcorevideo/player'
45744
+ * Player.registerPlugin(CmcdConfig)
45745
+ *
45746
+ * const player = new Player({
45747
+ * source: 'https://example.com/video.mp4',
45748
+ * cmcd: {
45749
+ * sessionId: '1234567890',
45750
+ * contentId: 'f572d396fae9206628714fb2ce00f72e94f2258f',
45751
+ * },
45752
+ * })
45753
+ * ```
45743
45754
  */
45744
45755
  class CmcdConfig extends CorePlugin {
45745
45756
  sid;
45746
45757
  cid = '';
45747
45758
  /**
45748
- * @inheritdocs
45759
+ * @internal
45749
45760
  */
45750
45761
  get name() {
45751
45762
  return 'cmcd';
45752
45763
  }
45764
+ /**
45765
+ * @internal
45766
+ */
45753
45767
  get version() {
45754
45768
  return '0.1.0';
45755
45769
  }
45770
+ /**
45771
+ * @internal
45772
+ */
45756
45773
  get supportedVersion() {
45757
45774
  return CLAPPR_VERSION$1;
45758
45775
  }
@@ -45762,11 +45779,16 @@ class CmcdConfig extends CorePlugin {
45762
45779
  this.cid = this.options.cmcd?.contentId ?? this.generateContentId();
45763
45780
  }
45764
45781
  /**
45765
- * @inheritdocs
45782
+ * @internal
45766
45783
  */
45767
45784
  bindEvents() {
45768
45785
  this.listenTo(this.core, Events$1.CORE_CONTAINERS_CREATED, () => this.updateSettings(this.core.containers[0]));
45769
45786
  }
45787
+ /**
45788
+ * Returns the current `sid` and `cid` values.
45789
+ * Useful when the auto-generated values need to be known.
45790
+ * @returns `sid` and `cid` values
45791
+ */
45770
45792
  exportIds() {
45771
45793
  return {
45772
45794
  sid: this.sid,
@@ -45802,19 +45824,6 @@ class CmcdConfig extends CorePlugin {
45802
45824
  break;
45803
45825
  }
45804
45826
  }
45805
- updateHlsjsSettings(options, { cid, sid }) {
45806
- $.extend(true, options, {
45807
- playback: {
45808
- hlsjsConfig: {
45809
- cmcd: {
45810
- includeKeys: CMCD_KEYS,
45811
- sessionId: sid,
45812
- contentId: cid,
45813
- },
45814
- },
45815
- },
45816
- });
45817
- }
45818
45827
  generateContentId() {
45819
45828
  return new URL(this.core.options.source ?? this.core.options.sources[0].source).pathname.slice(0, 64);
45820
45829
  }
@@ -48392,7 +48401,7 @@ class ClickToPause extends ContainerPlugin {
48392
48401
  togglePlay(useStop) {
48393
48402
  const isPlaying = this.container && this.container.isPlaying();
48394
48403
  if (isPlaying) {
48395
- useStop ? this.container.stop() : this.container.pause();
48404
+ useStop ? this.container.stop({ ui: true }) : this.container.pause();
48396
48405
  }
48397
48406
  else {
48398
48407
  this.container.play();
@@ -48526,7 +48535,8 @@ class Clips extends UICorePlugin {
48526
48535
  * @returns The text of the clip at the given time
48527
48536
  */
48528
48537
  getText(time) {
48529
- return this.clips.find((clip) => clip.start <= time && clip.end >= time)?.text;
48538
+ return this.clips.find((clip) => clip.start <= time && clip.end >= time)
48539
+ ?.text;
48530
48540
  }
48531
48541
  onCoreReady() {
48532
48542
  trace(`${T$d} onCoreReady`);
@@ -51322,6 +51332,7 @@ class SourceController extends CorePlugin {
51322
51332
  currentSourceIndex = 0;
51323
51333
  sourcesDelay = {};
51324
51334
  active = false;
51335
+ autoPlay = false;
51325
51336
  switching = false;
51326
51337
  sync = noSync;
51327
51338
  /**
@@ -51397,6 +51408,9 @@ class SourceController extends CorePlugin {
51397
51408
  if (this.switching) {
51398
51409
  return;
51399
51410
  }
51411
+ // The autoPlay metadata flag is set between a call to play and the actual playback start event, after which the flag is cleared.
51412
+ this.autoPlay =
51413
+ !!this.core.activeContainer.actionsMetadata.playEvent?.autoPlay;
51400
51414
  switch (error.code) {
51401
51415
  case PlaybackErrorCode.MediaSourceUnavailable:
51402
51416
  this.core.activeContainer?.getPlugin('poster')?.disable();
@@ -51415,6 +51429,12 @@ class SourceController extends CorePlugin {
51415
51429
  this.core.activeContainer?.getPlugin('spinner')?.hide();
51416
51430
  }
51417
51431
  });
51432
+ this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAY, (_, { autoPlay }) => {
51433
+ trace(`${T$4} onContainerPlay`, {
51434
+ autoPlay,
51435
+ });
51436
+ this.autoPlay = !!autoPlay;
51437
+ });
51418
51438
  }
51419
51439
  reset() {
51420
51440
  this.active = false;
@@ -51432,17 +51452,20 @@ class SourceController extends CorePlugin {
51432
51452
  trace(`${T$4} retryPlayback syncing...`, {
51433
51453
  nextSource,
51434
51454
  });
51435
- const rnd = RETRY_DELAY_BLUR * Math.random();
51455
+ const rnd = Math.round(RETRY_DELAY_BLUR * Math.random());
51436
51456
  this.sync(() => {
51437
- trace(`${T$4} retryPlayback loading...`);
51438
51457
  this.switching = false;
51439
51458
  this.core.load(nextSource.source, nextSource.mimeType);
51440
51459
  trace(`${T$4} retryPlayback loaded`, {
51441
51460
  nextSource,
51442
51461
  });
51443
51462
  setTimeout(() => {
51444
- this.core.activePlayback.play();
51445
- trace(`${T$4} retryPlayback playing`);
51463
+ trace(`${T$4} retryPlayback playing`, {
51464
+ autoPlay: this.autoPlay,
51465
+ });
51466
+ this.core.activeContainer.play({
51467
+ autoPlay: this.autoPlay,
51468
+ });
51446
51469
  }, rnd);
51447
51470
  });
51448
51471
  });
package/dist/player.d.ts CHANGED
@@ -109,15 +109,19 @@ export { AudioTracks as AudioSelector }
109
109
  export { AudioTracks }
110
110
 
111
111
  /**
112
- * `PLUGIN` that displays a big mute button over the video when it's muted.
113
- * Once pressed, it unmutes the video.
112
+ * `PLUGIN` that displays a big mute button over the video when it's being played muted.
114
113
  * @beta
114
+ * @remarks
115
+ * When pressed, it unmutes the video.
116
+ * @example
117
+ * ```ts
118
+ * import { BigMuteButton } from '@gcorevideo/player'
119
+ * Player.registerPlugin(BigMuteButton)
120
+ * ```
115
121
  */
116
122
  export declare class BigMuteButton extends UICorePlugin {
117
- private isBigMuteButtonHidden;
123
+ private hidden;
118
124
  private _adIsPlaying;
119
- private $bigMuteBtnContainer;
120
- private $bigMuteButton;
121
125
  /**
122
126
  * @internal
123
127
  */
@@ -133,28 +137,26 @@ export declare class BigMuteButton extends UICorePlugin {
133
137
  * @internal
134
138
  */
135
139
  get events(): {
136
- 'click .big-mute-icon': string;
137
- 'click .big-mute-icon-wrapper': string;
140
+ click: string;
138
141
  };
139
142
  /**
140
143
  * @internal
141
144
  */
142
145
  bindEvents(): void;
143
146
  private onCoreReady;
147
+ private onContainerChanged;
148
+ private onPlay;
144
149
  private onContainerVolume;
145
- private onContainerStart;
146
150
  private onPlaybackEnded;
147
- private mediaControlRendered;
148
151
  private onStartAd;
149
152
  private onFinishAd;
150
- private shouldRender;
151
153
  /**
152
154
  * @internal
153
155
  */
154
156
  render(): this;
155
- private hideBigMuteBtn;
156
- private showBigMuteBtn;
157
- private destroyBigMuteBtn;
157
+ private mount;
158
+ private hide;
159
+ private show;
158
160
  private clicked;
159
161
  }
160
162
 
@@ -302,6 +304,7 @@ export declare class BottomGear extends UICorePlugin {
302
304
  private onCoreReady;
303
305
  private onMediaControlRendered;
304
306
  private mount;
307
+ private alignSubmenu;
305
308
  }
306
309
 
307
310
  /**
@@ -480,13 +483,17 @@ export declare type ClapprStatsMetrics = {
480
483
  };
481
484
  };
482
485
 
483
- export declare type ClapprStatsSettings = {
486
+ /**
487
+ * Config options for the {@link ClapprStats} plugin
488
+ * @beta
489
+ */
490
+ export declare interface ClapprStatsSettings {
484
491
  /**
485
492
  * The interval in milliseconds of periodic measurements.
486
493
  * The plugin will emit a {@link ClapprStatsEvents.REPORT} event with the collected metrics at the specified interval.
487
494
  */
488
495
  runEach?: number;
489
- };
496
+ }
490
497
 
491
498
  /**
492
499
  * A small `PLUGIN` that toggles the playback state on click over the video container
@@ -578,7 +585,7 @@ export declare class Clips extends UICorePlugin {
578
585
  */
579
586
  export declare interface ClipsPluginSettings {
580
587
  /**
581
- * The compiled text of the clips description, one clip per line in format :
588
+ * The compiled text of the clips description, one clip per line in format:
582
589
  * `HH:MM:SS text` or `MM:SS text` or `SS text`
583
590
  */
584
591
  text: string;
@@ -704,49 +711,72 @@ export declare type ClosedCaptionsPluginSettings = {
704
711
  };
705
712
 
706
713
  /**
707
- * A `PLUGIN` that configures CMCD for playback
714
+ * A `PLUGIN` that configures {@link https://cdn.cta.tech/cta/media/media/resources/standards/pdfs/cta-5004-final.pdf | CMCD} for playback
708
715
  * @beta
709
716
  * @remarks
710
- * Configuration options
711
- * `cmcd`: {@link CmcdConfigPluginSettings}
717
+ * Configuration options - {@link CmcdConfigOptions}.
718
+ * @example
719
+ * ```ts
720
+ * import { CmcdConfig } from '@gcorevideo/player'
721
+ * Player.registerPlugin(CmcdConfig)
722
+ *
723
+ * const player = new Player({
724
+ * source: 'https://example.com/video.mp4',
725
+ * cmcd: {
726
+ * sessionId: '1234567890',
727
+ * contentId: 'f572d396fae9206628714fb2ce00f72e94f2258f',
728
+ * },
729
+ * })
730
+ * ```
712
731
  */
713
732
  export declare class CmcdConfig extends CorePlugin {
714
733
  private sid;
715
734
  private cid;
716
735
  /**
717
- * @inheritdocs
736
+ * @internal
718
737
  */
719
738
  get name(): string;
739
+ /**
740
+ * @internal
741
+ */
720
742
  get version(): string;
743
+ /**
744
+ * @internal
745
+ */
721
746
  get supportedVersion(): string;
722
747
  constructor(core: Core);
723
748
  /**
724
- * @inheritdocs
749
+ * @internal
725
750
  */
726
751
  bindEvents(): void;
752
+ /**
753
+ * Returns the current `sid` and `cid` values.
754
+ * Useful when the auto-generated values need to be known.
755
+ * @returns `sid` and `cid` values
756
+ */
727
757
  exportIds(): {
728
758
  sid: string;
729
759
  cid: string;
730
760
  };
731
761
  private updateSettings;
732
- private updateHlsjsSettings;
733
762
  private generateContentId;
734
763
  }
735
764
 
736
765
  /**
766
+ * Config options for the {@link CmcdConfig} plugin
737
767
  * @beta
738
768
  */
739
- export declare type CmcdConfigPluginSettings = {
769
+ export declare interface CmcdConfigOptions {
740
770
  /**
741
- * Session ID. If ommitted, a random UUID will be generated
771
+ * `sid` value. If ommitted, a random UUID will be generated
742
772
  */
743
- sessionId: string;
773
+ sessionId?: string;
744
774
  /**
745
- * Content ID,
775
+ * `cid` value.
746
776
  * If ommitted, the pathname part of the first source URL will be used
747
777
  */
748
778
  contentId?: string;
749
- };
779
+ }
750
780
 
751
781
  /**
752
782
  * @public
@@ -986,6 +1016,10 @@ export declare type ErrorScreenSettings = {
986
1016
  noReload?: boolean;
987
1017
  };
988
1018
 
1019
+ /**
1020
+ * Extended events for the {@link MediaControl} plugin
1021
+ * @beta
1022
+ */
989
1023
  export declare enum ExtendedEvents {
990
1024
  MEDIACONTROL_VOLUME = "mediacontrol:volume",
991
1025
  MEDIACONTROL_MENU_COLLAPSE = "mediacontrol:menu:collapse"
@@ -1287,6 +1321,13 @@ export declare class MediaControl extends UICorePlugin {
1287
1321
  * Reenables the plugin disabled earlier with the {@link MediaControl.disable} method
1288
1322
  */
1289
1323
  enable(): void;
1324
+ /**
1325
+ *
1326
+ * @returns Vertical space available to render something on top of the container.
1327
+ * @remarks
1328
+ * This takes into account the container height and excludes the height of the controls bar
1329
+ */
1330
+ getAvailableHeight(): number;
1290
1331
  /**
1291
1332
  * Set the initial volume, which is preserved when playback is interrupted by an advertisement
1292
1333
  */
@@ -2348,7 +2389,11 @@ export declare class Poster extends UIContainerPlugin {
2348
2389
  destroy(): this;
2349
2390
  }
2350
2391
 
2351
- export declare type PosterPluginSettings = {
2392
+ /**
2393
+ * Config options for the {@link Poster} plugin
2394
+ * @beta
2395
+ */
2396
+ export declare interface PosterPluginSettings {
2352
2397
  /**
2353
2398
  * Custom CSS background
2354
2399
  */
@@ -2362,10 +2407,10 @@ export declare type PosterPluginSettings = {
2362
2407
  */
2363
2408
  url?: string;
2364
2409
  /**
2365
- * Whether to show the poster after playback has ended @default true
2410
+ * Whether to show the poster after playback has ended, by default `true`
2366
2411
  */
2367
2412
  showOnVideoEnd?: boolean;
2368
- };
2413
+ }
2369
2414
 
2370
2415
  /**
2371
2416
  * A level of quality within a media source/representation.
@@ -2706,6 +2751,7 @@ export declare class SourceController extends CorePlugin {
2706
2751
  private currentSourceIndex;
2707
2752
  private sourcesDelay;
2708
2753
  private active;
2754
+ private autoPlay;
2709
2755
  private switching;
2710
2756
  private sync;
2711
2757
  /**