@gcorevideo/player 2.24.3 → 2.24.6

package/dist/index.js

@@ -42836,7 +42836,7 @@ function registerPlaybacks() {
     Loader.registerPlayback(DashPlayback);
 }
 
-const T$k = 'GPlayer';
+const T$k = 'gplayer';
 const DEFAULT_OPTIONS = {
     autoPlay: false,
     debug: 'none',
@@ -43303,7 +43303,7 @@ class Player {
     }
 }
 
-var version$1 = "2.24.3";
+var version$1 = "2.24.6";
 
 var packages = {
 	"node_modules/@clappr/core": {
@@ -44061,7 +44061,7 @@ class MediaControl extends UICorePlugin {
         return false;
     }
     togglePlayStop() {
-        this.container.isPlaying() ? this.container.stop() : this.container.play();
+        this.container.isPlaying() ? this.container.stop({ ui: true }) : this.container.play();
     }
     startSeekDrag(event) {
         if (!this.settings.seekEnabled) {
@@ -44964,6 +44964,7 @@ const T$h = 'plugins.big_mute_button';
  * ```
  */
 class BigMuteButton extends UICorePlugin {
+    autoPlay = false;
     hidden = false;
     // TODO get back to the ads-related logic later
     _adIsPlaying = false;
@@ -44985,7 +44986,7 @@ class BigMuteButton extends UICorePlugin {
      */
     get events() {
         return {
-            'click': 'clicked',
+            click: 'clicked',
         };
     }
     /**
@@ -44997,34 +44998,42 @@ class BigMuteButton extends UICorePlugin {
         this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
         this.listenTo(this.core, 'core:advertisement:finish', this.onFinishAd);
     }
-    onCoreReady() {
-    }
+    onCoreReady() { }
     onContainerChanged() {
         this.listenTo(this.core.activeContainer, Events$1.CONTAINER_VOLUME, this.onContainerVolume);
-        // this.listenTo(
-        //   this.core.activeContainer,
-        //   Events.CONTAINER_READY,
-        //   this.onContainerReady,
-        // )
         this.listenTo(this.core.activePlayback, Events$1.PLAYBACK_ENDED, this.onPlaybackEnded);
         this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAY, this.onPlay);
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_STOP, this.onStop);
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PAUSE, this.onPause);
     }
     onPlay(_, { autoPlay }) {
         const container = this.core.activeContainer;
         const { volume } = container;
         const { wasMuted } = this.options;
+        if (autoPlay) {
+            this.autoPlay = true;
+        }
         trace(`${T$h} onPlay`, {
-            autoPlay,
+            autoPlay: this.autoPlay,
             wasMuted,
             volume,
         });
-        if (autoPlay && !wasMuted && volume === 0) {
+        if (this.autoPlay && !wasMuted && volume === 0) {
             this.mount();
         }
         else {
             this.destroy();
         }
     }
+    onStop(_, { ui }) {
+        trace(`${T$h} onStop`, { ui });
+        if (ui) {
+            this.destroy();
+        }
+    }
+    onPause() {
+        this.destroy();
+    }
     onContainerVolume(value) {
         if (value !== 0) {
             this.destroy();
@@ -48392,7 +48401,7 @@ class ClickToPause extends ContainerPlugin {
     togglePlay(useStop) {
         const isPlaying = this.container && this.container.isPlaying();
         if (isPlaying) {
-            useStop ? this.container.stop() : this.container.pause();
+            useStop ? this.container.stop({ ui: true }) : this.container.pause();
         }
         else {
             this.container.play();
@@ -50745,6 +50754,7 @@ class SeekTime extends UICorePlugin {
         this.hoveringOverSeekBar = false;
         this.update();
     }
+    // TODO delegate calculation to the MediaControl plugin
     calculateHoverPosition(event) {
         const mediaControl = this.core.getPlugin('media_control');
         const offset = event.pageX - mediaControl.$seekBarContainer.offset().left;
@@ -51399,7 +51409,9 @@ class SourceController extends CorePlugin {
             if (this.switching) {
                 return;
             }
-            this.autoPlay = !!this.core.activeContainer.actionsMetadata.playEvent?.autoPlay;
+            // The autoPlay metadata flag is set between a call to play and the actual playback start event, after which the flag is cleared.
+            this.autoPlay =
+                !!this.core.activeContainer.actionsMetadata.playEvent?.autoPlay;
             switch (error.code) {
                 case PlaybackErrorCode.MediaSourceUnavailable:
                     this.core.activeContainer?.getPlugin('poster')?.disable();

package/lib/Player.js

@@ -5,7 +5,7 @@ import EventEmitter from 'eventemitter3';
 import { PlayerEvent } from './types.js';
 import { buildMediaSourcesList, wrapSource } from './utils/mediaSources.js';
 import { registerPlaybacks } from './playback/index.js';
-const T = 'GPlayer';
+const T = 'gplayer';
 const DEFAULT_OPTIONS = {
     autoPlay: false,
     debug: 'none',

package/lib/index.embed.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Video player for the Gcore streaming platform
+ *
+ * @remarks
+ * This package provides a video player for the Gcore streaming platform.
+ * It is built on top of the {@link https://github.com/clappr/clappr | Clappr} library and provides a framework for building custom integrations.
+ * Start with {@link Player} for more information.
+ *
+ * Various plugins (marked with `PLUGIN` keyword) are available to extend the core functionality with additional features.
+ * @example
+ * ```ts
+ * import { Player, MediaControl, ErrorScreen } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(MediaControl)
+ * Player.registerPlugin(ErrorScreen)
+ *
+ * const player = new Player({
+ *   autoPlay: true,
+ *   mute: true,
+ *   sources: [{ source: 'https://example.com/a.mpd', mimeType: 'application/dash+xml' }],
+ * })
+ *
+ * player.attachTo(document.getElementById('container'))
+ * ```
+ *
+ * @packageDocumentation
+ */
+import { PlayerMediaSource, PlayerConfig } from './index.core.js';
+type Options = Partial<Omit<PlayerConfig, 'sources'>> & {
+    sources: PlayerMediaSource[];
+};
+export default function init(domNode: HTMLElement, options: Options): void;
+export {};
+//# sourceMappingURL=index.embed.d.ts.map

package/lib/index.embed.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.embed.d.ts","sourceRoot":"","sources":["../src/index.embed.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,OAAO,EAAU,iBAAiB,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AA4BzE,KAAK,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC,GAAG;IACtD,OAAO,EAAE,iBAAiB,EAAE,CAAA;CAC7B,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO,QAelE"}

package/lib/index.embed.js

@@ -0,0 +1,58 @@
+/**
+ * Video player for the Gcore streaming platform
+ *
+ * @remarks
+ * This package provides a video player for the Gcore streaming platform.
+ * It is built on top of the {@link https://github.com/clappr/clappr | Clappr} library and provides a framework for building custom integrations.
+ * Start with {@link Player} for more information.
+ *
+ * Various plugins (marked with `PLUGIN` keyword) are available to extend the core functionality with additional features.
+ * @example
+ * ```ts
+ * import { Player, MediaControl, ErrorScreen } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(MediaControl)
+ * Player.registerPlugin(ErrorScreen)
+ *
+ * const player = new Player({
+ *   autoPlay: true,
+ *   mute: true,
+ *   sources: [{ source: 'https://example.com/a.mpd', mimeType: 'application/dash+xml' }],
+ * })
+ *
+ * player.attachTo(document.getElementById('container'))
+ * ```
+ *
+ * @packageDocumentation
+ */
+import { Player } from './index.core.js';
+import { AudioTracks, BottomGear, MediaControl, ErrorScreen, SourceController, Subtitles, CmcdConfig, ClickToPause, DvrControls, PictureInPicture, Poster, Spinner, } from './index.plugins.js';
+Player.registerPlugin(AudioTracks);
+Player.registerPlugin(BottomGear);
+Player.registerPlugin(ClickToPause);
+Player.registerPlugin(CmcdConfig);
+Player.registerPlugin(DvrControls);
+Player.registerPlugin(ErrorScreen);
+Player.registerPlugin(MediaControl);
+Player.registerPlugin(PictureInPicture);
+Player.registerPlugin(Poster);
+Player.registerPlugin(SourceController);
+Player.registerPlugin(Spinner);
+Player.registerPlugin(Subtitles);
+export default function init(domNode, options) {
+    const player = new Player({
+        autoPlay: true,
+        mute: true,
+        ...options,
+    });
+    if (document.readyState === 'interactive') {
+        setTimeout(() => {
+            player.attachTo(domNode);
+        }, 0);
+    }
+    else {
+        document.addEventListener('DOMContentLoaded', () => {
+            player.attachTo(domNode);
+        });
+    }
+}

package/lib/plugins/big-mute-button/BigMuteButton.d.ts

@@ -12,6 +12,7 @@ import '../../../assets/big-mute-button/big-mute-button.scss';
  * ```
  */
 export declare class BigMuteButton extends UICorePlugin {
+    private autoPlay;
     private hidden;
     private _adIsPlaying;
     /**
@@ -38,6 +39,8 @@ export declare class BigMuteButton extends UICorePlugin {
     private onCoreReady;
     private onContainerChanged;
     private onPlay;
+    private onStop;
+    private onPause;
     private onContainerVolume;
     private onPlaybackEnded;
     private onStartAd;

package/lib/plugins/big-mute-button/BigMuteButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BigMuteButton.d.ts","sourceRoot":"","sources":["../../../src/plugins/big-mute-button/BigMuteButton.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,YAAY,EAAS,MAAM,cAAc,CAAA;AAQpE,OAAO,sDAAsD,CAAA;AAM7D;;;;;;;;;;GAUG;AACH,qBAAa,aAAc,SAAQ,YAAY;IAC7C,OAAO,CAAC,MAAM,CAAQ;IAGtB,OAAO,CAAC,YAAY,CAAQ;IAE5B;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAyB;IAEzD;;OAEG;IACH,IAAa,MAAM;;MAIlB;IAED;;OAEG;IACM,UAAU;IAOnB,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,kBAAkB;IAuB1B,OAAO,CAAC,MAAM;IAgBd,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,SAAS;IAKjB,OAAO,CAAC,UAAU;IAKlB;;OAEG;IACM,MAAM;IAWf,OAAO,CAAC,KAAK;IAKb,OAAO,CAAC,IAAI;IAKZ,OAAO,CAAC,IAAI;IAKZ,OAAO,CAAC,OAAO;CAkBhB"}
+{"version":3,"file":"BigMuteButton.d.ts","sourceRoot":"","sources":["../../../src/plugins/big-mute-button/BigMuteButton.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,YAAY,EAAS,MAAM,cAAc,CAAA;AAQpE,OAAO,sDAAsD,CAAA;AAM7D;;;;;;;;;;GAUG;AACH,qBAAa,aAAc,SAAQ,YAAY;IAC7C,OAAO,CAAC,QAAQ,CAAQ;IAExB,OAAO,CAAC,MAAM,CAAQ;IAGtB,OAAO,CAAC,YAAY,CAAQ;IAE5B;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAyB;IAEzD;;OAEG;IACH,IAAa,MAAM;;MAIlB;IAED;;OAEG;IACM,UAAU;IAWnB,OAAO,CAAC,WAAW;IAEnB,OAAO,CAAC,kBAAkB;IAgB1B,OAAO,CAAC,MAAM;IAmBd,OAAO,CAAC,MAAM;IAOd,OAAO,CAAC,OAAO;IAIf,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,SAAS;IAKjB,OAAO,CAAC,UAAU;IAKlB;;OAEG;IACM,MAAM;IAWf,OAAO,CAAC,KAAK;IAKb,OAAO,CAAC,IAAI;IAKZ,OAAO,CAAC,IAAI;IAKZ,OAAO,CAAC,OAAO;CAkBhB"}

package/lib/plugins/big-mute-button/BigMuteButton.js

@@ -18,6 +18,7 @@ const T = 'plugins.big_mute_button';
  * ```
  */
 export class BigMuteButton extends UICorePlugin {
+    autoPlay = false;
     hidden = false;
     // TODO get back to the ads-related logic later
     _adIsPlaying = false;
@@ -39,7 +40,7 @@ export class BigMuteButton extends UICorePlugin {
      */
     get events() {
         return {
-            'click': 'clicked',
+            click: 'clicked',
         };
     }
     /**
@@ -51,34 +52,42 @@ export class BigMuteButton extends UICorePlugin {
         this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
         this.listenTo(this.core, 'core:advertisement:finish', this.onFinishAd);
     }
-    onCoreReady() {
-    }
+    onCoreReady() { }
     onContainerChanged() {
         this.listenTo(this.core.activeContainer, Events.CONTAINER_VOLUME, this.onContainerVolume);
-        // this.listenTo(
-        //   this.core.activeContainer,
-        //   Events.CONTAINER_READY,
-        //   this.onContainerReady,
-        // )
         this.listenTo(this.core.activePlayback, Events.PLAYBACK_ENDED, this.onPlaybackEnded);
         this.listenTo(this.core.activeContainer, Events.CONTAINER_PLAY, this.onPlay);
+        this.listenTo(this.core.activeContainer, Events.CONTAINER_STOP, this.onStop);
+        this.listenTo(this.core.activeContainer, Events.CONTAINER_PAUSE, this.onPause);
     }
     onPlay(_, { autoPlay }) {
         const container = this.core.activeContainer;
         const { volume } = container;
         const { wasMuted } = this.options;
+        if (autoPlay) {
+            this.autoPlay = true;
+        }
         trace(`${T} onPlay`, {
-            autoPlay,
+            autoPlay: this.autoPlay,
             wasMuted,
             volume,
         });
-        if (autoPlay && !wasMuted && volume === 0) {
+        if (this.autoPlay && !wasMuted && volume === 0) {
             this.mount();
         }
         else {
             this.destroy();
         }
     }
+    onStop(_, { ui }) {
+        trace(`${T} onStop`, { ui });
+        if (ui) {
+            this.destroy();
+        }
+    }
+    onPause() {
+        this.destroy();
+    }
     onContainerVolume(value) {
         if (value !== 0) {
             this.destroy();

package/lib/plugins/click-to-pause/ClickToPause.js

@@ -62,7 +62,7 @@ export class ClickToPause extends ContainerPlugin {
     togglePlay(useStop) {
         const isPlaying = this.container && this.container.isPlaying();
         if (isPlaying) {
-            useStop ? this.container.stop() : this.container.pause();
+            useStop ? this.container.stop({ ui: true }) : this.container.pause();
         }
         else {
             this.container.play();

package/lib/plugins/media-control/MediaControl.js

@@ -483,7 +483,7 @@ export class MediaControl extends UICorePlugin {
         return false;
     }
     togglePlayStop() {
-        this.container.isPlaying() ? this.container.stop() : this.container.play();
+        this.container.isPlaying() ? this.container.stop({ ui: true }) : this.container.play();
     }
     startSeekDrag(event) {
         if (!this.settings.seekEnabled) {

package/lib/plugins/seek-time/SeekTime.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SeekTime.d.ts","sourceRoot":"","sources":["../../../src/plugins/seek-time/SeekTime.ts"],"names":[],"mappings":"AAIA,OAAO,EAAoB,YAAY,EAAmB,MAAM,cAAc,CAAA;AAO9E,OAAO,0CAA0C,CAAA;AAEjD;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAMD;;;;;GAKG;AACH,qBAAa,QAAS,SAAQ,YAAY;IACxC,IAAI,IAAI,WAEP;IAED,IAAI,gBAAgB;;MAEnB;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAyB;IAEzD,IAAa,UAAU;;MAItB;IAED,OAAO,KAAK,mBAAmB,GAM9B;IAED,OAAO,KAAK,YAAY,GAKvB;IAED,OAAO,CAAC,mBAAmB,CAAQ;IAEnC,OAAO,CAAC,aAAa,CAAI;IAEzB,OAAO,CAAC,iBAAiB,CAAsB;IAE/C,OAAO,CAAC,iBAAiB,CAAsB;IAE/C,OAAO,CAAC,QAAQ,CAAI;IAEpB;;OAEG;IACM,UAAU;IASnB,OAAO,CAAC,WAAW;IAmBnB,OAAO,CAAC,kBAAkB;IAa1B,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,QAAQ;IAKhB,OAAO,CAAC,sBAAsB;IAW9B,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,MAAM;IA6Cd,OAAO,CAAC,eAAe;IAUvB;;OAEG;IACM,MAAM;IAQf,OAAO,CAAC,KAAK;CAGd"}
+{"version":3,"file":"SeekTime.d.ts","sourceRoot":"","sources":["../../../src/plugins/seek-time/SeekTime.ts"],"names":[],"mappings":"AAIA,OAAO,EAAoB,YAAY,EAAmB,MAAM,cAAc,CAAA;AAO9E,OAAO,0CAA0C,CAAA;AAEjD;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAMD;;;;;GAKG;AACH,qBAAa,QAAS,SAAQ,YAAY;IACxC,IAAI,IAAI,WAEP;IAED,IAAI,gBAAgB;;MAEnB;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAyB;IAEzD,IAAa,UAAU;;MAItB;IAED,OAAO,KAAK,mBAAmB,GAM9B;IAED,OAAO,KAAK,YAAY,GAKvB;IAED,OAAO,CAAC,mBAAmB,CAAQ;IAEnC,OAAO,CAAC,aAAa,CAAI;IAEzB,OAAO,CAAC,iBAAiB,CAAsB;IAE/C,OAAO,CAAC,iBAAiB,CAAsB;IAE/C,OAAO,CAAC,QAAQ,CAAI;IAEpB;;OAEG;IACM,UAAU;IASnB,OAAO,CAAC,WAAW;IAmBnB,OAAO,CAAC,kBAAkB;IAa1B,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,sBAAsB;IAW9B,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,MAAM;IA6Cd,OAAO,CAAC,eAAe;IAUvB;;OAEG;IACM,MAAM;IAQf,OAAO,CAAC,KAAK;CAGd"}

package/lib/plugins/seek-time/SeekTime.js

@@ -72,6 +72,7 @@ export class SeekTime extends UICorePlugin {
         this.hoveringOverSeekBar = false;
         this.update();
     }
+    // TODO delegate calculation to the MediaControl plugin
     calculateHoverPosition(event) {
         const mediaControl = this.core.getPlugin('media_control');
         const offset = event.pageX - mediaControl.$seekBarContainer.offset().left;

package/lib/plugins/source-controller/SourceController.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SourceController.d.ts","sourceRoot":"","sources":["../../../src/plugins/source-controller/SourceController.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,UAAU,EACV,KAAK,IAAI,IAAI,UAAU,EACxB,MAAM,cAAc,CAAA;AAwBrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,qBAAa,gBAAiB,SAAQ,UAAU;IAwC9C,OAAO,CAAC,WAAW,CAA8B;IAEjD,OAAO,CAAC,kBAAkB,CAAI;IAE9B,OAAO,CAAC,YAAY,CAA6B;IAEjD,OAAO,CAAC,MAAM,CAAQ;IAEtB,OAAO,CAAC,QAAQ,CAAQ;IAExB,OAAO,CAAC,SAAS,CAAQ;IAEzB,OAAO,CAAC,IAAI,CAAiB;IAE7B;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED;;OAEG;gBACS,IAAI,EAAE,UAAU;IAW5B;;OAEG;IACM,UAAU;IAWnB,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,wBAAwB;IAoBhC,OAAO,CAAC,2BAA2B;IAmDnC,OAAO,CAAC,KAAK;IAKb,OAAO,CAAC,aAAa;IA+BrB,OAAO,CAAC,kBAAkB;IAe1B;;OAEG;IACH,MAAM,KAAK,OAAO,WAEjB;CACF"}
+{"version":3,"file":"SourceController.d.ts","sourceRoot":"","sources":["../../../src/plugins/source-controller/SourceController.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,UAAU,EACV,KAAK,IAAI,IAAI,UAAU,EACxB,MAAM,cAAc,CAAA;AAwBrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,qBAAa,gBAAiB,SAAQ,UAAU;IAwC9C,OAAO,CAAC,WAAW,CAA8B;IAEjD,OAAO,CAAC,kBAAkB,CAAI;IAE9B,OAAO,CAAC,YAAY,CAA6B;IAEjD,OAAO,CAAC,MAAM,CAAQ;IAEtB,OAAO,CAAC,QAAQ,CAAQ;IAExB,OAAO,CAAC,SAAS,CAAQ;IAEzB,OAAO,CAAC,IAAI,CAAiB;IAE7B;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED;;OAEG;gBACS,IAAI,EAAE,UAAU;IAW5B;;OAEG;IACM,UAAU;IAWnB,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,wBAAwB;IAoBhC,OAAO,CAAC,2BAA2B;IAqDnC,OAAO,CAAC,KAAK;IAKb,OAAO,CAAC,aAAa;IA+BrB,OAAO,CAAC,kBAAkB;IAe1B;;OAEG;IACH,MAAM,KAAK,OAAO,WAEjB;CACF"}

package/lib/plugins/source-controller/SourceController.js

@@ -184,7 +184,9 @@ export class SourceController extends CorePlugin {
             if (this.switching) {
                 return;
             }
-            this.autoPlay = !!this.core.activeContainer.actionsMetadata.playEvent?.autoPlay;
+            // The autoPlay metadata flag is set between a call to play and the actual playback start event, after which the flag is cleared.
+            this.autoPlay =
+                !!this.core.activeContainer.actionsMetadata.playEvent?.autoPlay;
             switch (error.code) {
                 case PlaybackErrorCode.MediaSourceUnavailable:
                     this.core.activeContainer?.getPlugin('poster')?.disable();

package/lib/testUtils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"testUtils.d.ts","sourceRoot":"","sources":["../src/testUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAK,YAAY,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,MAAM,MAAM,eAAe,CAAA;AAGlC,wBAAgB,cAAc,CAC5B,OAAO,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM,EACrC,SAAS,GAAE,GAAkC;;;;;;;;;;;;;;;;;EAsB9C;AAED,wBAAgB,gBAAgB;;;EAK/B;AAED,wBAAgB,mBAAmB;;;;;;EAKlC;AAED,wBAAgB,kBAAkB,CAAC,IAAI,SAAS,EAAE,OAAO,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCtF;AAED,wBAAgB,mBAAmB,CACjC,OAAO,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM,EACrC,QAAQ,GAAE,GAAgD;;;;;;;;;;;;;;;;;;;;;;;;;EA8B3D;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,GAAG,gBAmB/C;AAED,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,GAAG,OAe7C"}
+{"version":3,"file":"testUtils.d.ts","sourceRoot":"","sources":["../src/testUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAK,YAAY,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,MAAM,MAAM,eAAe,CAAA;AAGlC,wBAAgB,cAAc,CAC5B,OAAO,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM,EACrC,SAAS,GAAE,GAAkC;;;;;;;;;;;;;;;;;EAsB9C;AAED,wBAAgB,gBAAgB;;;EAK/B;AAED,wBAAgB,mBAAmB;;;;;;EAKlC;AAED,wBAAgB,kBAAkB,CAChC,IAAI,SAAS,EACb,OAAO,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqCtC;AAED,wBAAgB,mBAAmB,CACjC,OAAO,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM,EACrC,QAAQ,GAAE,GAAgD;;;;;;;;;;;;;;;;;;;;;;;;;EA8B3D;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,GAAG,gBAmB/C;AAED,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,GAAG,OAe7C"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gcorevideo/player",
-  "version": "2.24.3",
+  "version": "2.24.6",
   "description": "Gcore JavaScript video player",
   "main": "dist/index.js",
   "type": "module",
@@ -11,7 +11,6 @@
   ],
   "scripts": {
     "build": "npm run build:ts && npm run build:bundle",
-    "build:1": "npm run build:ts && npm run build:bundle && date",
     "build:ts": "tsc",
     "build:bundle": "rollup -c",
     "dev": "nodemon --watch src -e ts --exec \"npm run build:ts && npm run docs\"",

package/rollup.config.js

@@ -79,4 +79,33 @@ export default [
       }
     ]
   },
+  {
+    input: 'lib/index.embed.js',
+    plugins: [
+      resolve(), // TODO check which aren't inlined in the bundle and put them here
+      commonjs(),
+      json(),
+      polyfillNode(),
+      sass({
+        // output: 'dist/index.embed.css',
+        insert: true,
+        verbose: true,
+      }),
+      string({
+        include: [
+          '**/*.ejs',
+          '**/*.html',
+          '**/*.svg',
+          '**/*.worker.js',
+        ],
+      }),
+    ],
+    output: [
+      {
+        file: 'dist/index.embed.js',
+        format: 'es',
+        generatedCode: 'es2015',
+      }
+    ]
+  },
 ];

package/src/Player.ts

@@ -52,7 +52,7 @@ export type PlayerEventHandler<E extends PlayerEvent> = (
   ...args: PlayerEventParams<E>
 ) => void
 
-const T = 'GPlayer'
+const T = 'gplayer'
 
 const DEFAULT_OPTIONS: PlayerConfig = {
   autoPlay: false,

package/src/index.embed.ts

@@ -0,0 +1,75 @@
+/**
+ * Video player for the Gcore streaming platform
+ *
+ * @remarks
+ * This package provides a video player for the Gcore streaming platform.
+ * It is built on top of the {@link https://github.com/clappr/clappr | Clappr} library and provides a framework for building custom integrations.
+ * Start with {@link Player} for more information.
+ *
+ * Various plugins (marked with `PLUGIN` keyword) are available to extend the core functionality with additional features.
+ * @example
+ * ```ts
+ * import { Player, MediaControl, ErrorScreen } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(MediaControl)
+ * Player.registerPlugin(ErrorScreen)
+ *
+ * const player = new Player({
+ *   autoPlay: true,
+ *   mute: true,
+ *   sources: [{ source: 'https://example.com/a.mpd', mimeType: 'application/dash+xml' }],
+ * })
+ *
+ * player.attachTo(document.getElementById('container'))
+ * ```
+ *
+ * @packageDocumentation
+ */
+import { Player, PlayerMediaSource, PlayerConfig } from './index.core.js'
+import {
+  AudioTracks,
+  BottomGear,
+  MediaControl,
+  ErrorScreen,
+  SourceController,
+  Subtitles,
+  CmcdConfig,
+  ClickToPause,
+  DvrControls,
+  PictureInPicture,
+  Poster,
+  Spinner,
+} from './index.plugins.js'
+
+Player.registerPlugin(AudioTracks)
+Player.registerPlugin(BottomGear)
+Player.registerPlugin(ClickToPause)
+Player.registerPlugin(CmcdConfig)
+Player.registerPlugin(DvrControls)
+Player.registerPlugin(ErrorScreen)
+Player.registerPlugin(MediaControl)
+Player.registerPlugin(PictureInPicture)
+Player.registerPlugin(Poster)
+Player.registerPlugin(SourceController)
+Player.registerPlugin(Spinner)
+Player.registerPlugin(Subtitles)
+type Options = Partial<Omit<PlayerConfig, 'sources'>> & {
+  sources: PlayerMediaSource[]
+}
+
+export default function init(domNode: HTMLElement, options: Options) {
+  const player = new Player({
+    autoPlay: true,
+    mute: true,
+    ...options,
+  })
+  if (document.readyState === 'interactive') {
+    setTimeout(() => {
+      player.attachTo(domNode)
+    }, 0)
+  } else {
+    document.addEventListener('DOMContentLoaded', () => {
+      player.attachTo(domNode)
+    })
+  }
+}

package/src/plugins/big-mute-button/BigMuteButton.ts

@@ -24,6 +24,8 @@ const T = 'plugins.big_mute_button'
  * ```
  */
 export class BigMuteButton extends UICorePlugin {
+  private autoPlay = false
+
   private hidden = false
 
   // TODO get back to the ads-related logic later
@@ -50,7 +52,7 @@ export class BigMuteButton extends UICorePlugin {
    */
   override get events() {
     return {
-      'click': 'clicked',
+      click: 'clicked',
     }
   }
 
@@ -59,14 +61,16 @@ export class BigMuteButton extends UICorePlugin {
    */
   override bindEvents() {
     this.listenTo(this.core, Events.CORE_READY, this.onCoreReady)
-    this.listenTo(this.core, Events.CORE_ACTIVE_CONTAINER_CHANGED, this.onContainerChanged)
+    this.listenTo(
+      this.core,
+      Events.CORE_ACTIVE_CONTAINER_CHANGED,
+      this.onContainerChanged,
+    )
     this.listenTo(this.core, 'core:advertisement:start', this.onStartAd)
     this.listenTo(this.core, 'core:advertisement:finish', this.onFinishAd)
   }
 
-  private onCoreReady() {
-    
-  }
+  private onCoreReady() {}
 
   private onContainerChanged() {
     this.listenTo(
@@ -74,39 +78,46 @@ export class BigMuteButton extends UICorePlugin {
       Events.CONTAINER_VOLUME,
       this.onContainerVolume,
     )
-    // this.listenTo(
-    //   this.core.activeContainer,
-    //   Events.CONTAINER_READY,
-    //   this.onContainerReady,
-    // )
     this.listenTo(
       this.core.activePlayback,
       Events.PLAYBACK_ENDED,
       this.onPlaybackEnded,
     )
-    this.listenTo(
-      this.core.activeContainer,
-      Events.CONTAINER_PLAY,
-      this.onPlay
-    )
+    this.listenTo(this.core.activeContainer, Events.CONTAINER_PLAY, this.onPlay)
+    this.listenTo(this.core.activeContainer, Events.CONTAINER_STOP, this.onStop)
+    this.listenTo(this.core.activeContainer, Events.CONTAINER_PAUSE, this.onPause)
   }
 
-  private onPlay(_: string, { autoPlay }: { autoPlay?: boolean}) {
+  private onPlay(_: string, { autoPlay }: { autoPlay?: boolean }) {
     const container = this.core.activeContainer
     const { volume } = container
     const { wasMuted } = this.options
+    if (autoPlay) {
+      this.autoPlay = true
+    }
     trace(`${T} onPlay`, {
-      autoPlay,
+      autoPlay: this.autoPlay,
       wasMuted,
       volume,
     })
-    if (autoPlay && !wasMuted && volume === 0) {
+    if (this.autoPlay && !wasMuted && volume === 0) {
       this.mount()
     } else {
       this.destroy()
     }
   }
 
+  private onStop(_: string, { ui }: { ui?: boolean }) {
+    trace(`${T} onStop`, { ui })
+    if (ui) {
+      this.destroy()
+    }
+  }
+
+  private onPause() {
+    this.destroy()
+  }
+
   private onContainerVolume(value: number) {
     if (value !== 0) {
       this.destroy()
@@ -134,7 +145,7 @@ export class BigMuteButton extends UICorePlugin {
     trace(`${T} render`)
     this.$el.html(BigMuteButton.template())
     this.$el.find('#gplayer-big-mute-icon').append(volumeMuteIcon)
-    
+
     // TODO
     // this._adIsPlaying && this.hide()