@gcorevideo/player 2.26.2 → 2.26.4

package/dist/index.embed.js

@@ -49865,8 +49865,10 @@ class SpinnerThreeBounce extends UIContainerPlugin {
      */
     render() {
         this.$el.html(this.template());
-        this.el.firstElementChild?.addEventListener('animationiteration', () => {
-            this.trigger(SpinnerEvents.SYNC);
+        this.el.firstElementChild?.addEventListener('animationiteration', (event) => {
+            this.trigger(SpinnerEvents.SYNC, {
+                elapsedTime: event.elapsedTime,
+            });
         });
         this.container.$el.append(this.$el[0]);
         if (this.container.buffering) {
@@ -50065,20 +50067,29 @@ class SourceController extends CorePlugin {
                     break;
             }
         });
-        this.core.activePlayback.on(Events$1.PLAYBACK_PLAY, () => {
-            trace(`${T$1} on PLAYBACK_PLAY`, {
+        // this.core.activePlayback.on(Events.PLAYBACK_PLAY, () => {
+        //   trace(`${T} on PLAYBACK_PLAY`, {
+        //     currentSource: this.sourcesList[this.currentSourceIndex],
+        //     retrying: this.active,
+        //   })
+        //   if (this.active) {
+        //     this.reset()
+        //     this.core.activeContainer?.getPlugin('poster')?.enable()
+        //     this.core.activeContainer?.getPlugin('spinner')?.hide()
+        //   }
+        // })
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAY, (_, { autoPlay }) => {
+            trace(`${T$1} onContainerPlay`, {
                 currentSource: this.sourcesList[this.currentSourceIndex],
                 retrying: this.active,
             });
+            this.autoPlay = !!autoPlay;
             if (this.active) {
                 this.reset();
                 this.core.activeContainer?.getPlugin('poster')?.enable();
                 this.core.activeContainer?.getPlugin('spinner')?.hide();
             }
         });
-        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAY, (_, { autoPlay }) => {
-            this.autoPlay = !!autoPlay;
-        });
     }
     reset() {
         this.active = false;
@@ -50099,8 +50110,7 @@ class SourceController extends CorePlugin {
                 this.core.load(nextSource.source, nextSource.mimeType);
                 setTimeout(() => {
                     trace(`${T$1} retryPlayback playing`, {
-                        autoPlay: this.autoPlay,
-                    });
+                        autoPlay: this.autoPlay});
                     this.core.activeContainer.play({
                         autoPlay: this.autoPlay,
                     });

package/dist/index.js

@@ -43259,7 +43259,7 @@ class Player {
     }
 }
 
-var version$1 = "2.26.2";
+var version$1 = "2.26.4";
 
 var packages = {
 	"node_modules/@clappr/core": {
@@ -51214,8 +51214,10 @@ class SpinnerThreeBounce extends UIContainerPlugin {
      */
     render() {
         this.$el.html(this.template());
-        this.el.firstElementChild?.addEventListener('animationiteration', () => {
-            this.trigger(SpinnerEvents.SYNC);
+        this.el.firstElementChild?.addEventListener('animationiteration', (event) => {
+            this.trigger(SpinnerEvents.SYNC, {
+                elapsedTime: event.elapsedTime,
+            });
         });
         this.container.$el.append(this.$el[0]);
         if (this.container.buffering) {
@@ -51414,23 +51416,30 @@ class SourceController extends CorePlugin {
                     break;
             }
         });
-        this.core.activePlayback.on(Events$1.PLAYBACK_PLAY, () => {
-            trace(`${T$4} on PLAYBACK_PLAY`, {
+        // this.core.activePlayback.on(Events.PLAYBACK_PLAY, () => {
+        //   trace(`${T} on PLAYBACK_PLAY`, {
+        //     currentSource: this.sourcesList[this.currentSourceIndex],
+        //     retrying: this.active,
+        //   })
+        //   if (this.active) {
+        //     this.reset()
+        //     this.core.activeContainer?.getPlugin('poster')?.enable()
+        //     this.core.activeContainer?.getPlugin('spinner')?.hide()
+        //   }
+        // })
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAY, (_, { autoPlay }) => {
+            trace(`${T$4} onContainerPlay`, {
+                autoPlay,
                 currentSource: this.sourcesList[this.currentSourceIndex],
                 retrying: this.active,
             });
+            this.autoPlay = !!autoPlay;
             if (this.active) {
                 this.reset();
                 this.core.activeContainer?.getPlugin('poster')?.enable();
                 this.core.activeContainer?.getPlugin('spinner')?.hide();
             }
         });
-        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAY, (_, { autoPlay }) => {
-            trace(`${T$4} onContainerPlay`, {
-                autoPlay,
-            });
-            this.autoPlay = !!autoPlay;
-        });
     }
     reset() {
         this.active = false;
@@ -51458,6 +51467,7 @@ class SourceController extends CorePlugin {
                 setTimeout(() => {
                     trace(`${T$4} retryPlayback playing`, {
                         autoPlay: this.autoPlay,
+                        nextSource,
                     });
                     this.core.activeContainer.play({
                         autoPlay: this.autoPlay,

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;IAInB,OAAO,CAAC,wBAAwB;IAgBhC,OAAO,CAAC,2BAA2B;IAqDnC,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;IAInB,OAAO,CAAC,wBAAwB;IAgBhC,OAAO,CAAC,2BAA2B;IA4DnC,OAAO,CAAC,KAAK;IAKb,OAAO,CAAC,aAAa;IAgCrB,OAAO,CAAC,kBAAkB;IAe1B;;OAEG;IACH,MAAM,KAAK,OAAO,WAEjB;CACF"}

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

@@ -191,23 +191,30 @@ export class SourceController extends CorePlugin {
                     break;
             }
         });
-        this.core.activePlayback.on(Events.PLAYBACK_PLAY, () => {
-            trace(`${T} on PLAYBACK_PLAY`, {
+        // this.core.activePlayback.on(Events.PLAYBACK_PLAY, () => {
+        //   trace(`${T} on PLAYBACK_PLAY`, {
+        //     currentSource: this.sourcesList[this.currentSourceIndex],
+        //     retrying: this.active,
+        //   })
+        //   if (this.active) {
+        //     this.reset()
+        //     this.core.activeContainer?.getPlugin('poster')?.enable()
+        //     this.core.activeContainer?.getPlugin('spinner')?.hide()
+        //   }
+        // })
+        this.listenTo(this.core.activeContainer, Events.CONTAINER_PLAY, (_, { autoPlay }) => {
+            trace(`${T} onContainerPlay`, {
+                autoPlay,
                 currentSource: this.sourcesList[this.currentSourceIndex],
                 retrying: this.active,
             });
+            this.autoPlay = !!autoPlay;
             if (this.active) {
                 this.reset();
                 this.core.activeContainer?.getPlugin('poster')?.enable();
                 this.core.activeContainer?.getPlugin('spinner')?.hide();
             }
         });
-        this.listenTo(this.core.activeContainer, Events.CONTAINER_PLAY, (_, { autoPlay }) => {
-            trace(`${T} onContainerPlay`, {
-                autoPlay,
-            });
-            this.autoPlay = !!autoPlay;
-        });
     }
     reset() {
         this.active = false;
@@ -235,6 +242,7 @@ export class SourceController extends CorePlugin {
                 setTimeout(() => {
                     trace(`${T} retryPlayback playing`, {
                         autoPlay: this.autoPlay,
+                        nextSource,
                     });
                     this.core.activeContainer.play({
                         autoPlay: this.autoPlay,

package/lib/plugins/spinner-three-bounce/SpinnerThreeBounce.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SpinnerThreeBounce.d.ts","sourceRoot":"","sources":["../../../src/plugins/spinner-three-bounce/SpinnerThreeBounce.ts"],"names":[],"mappings":"AAMA,OAAO,EACL,SAAS,EAET,iBAAiB,EAElB,MAAM,cAAc,CAAA;AAKrB,OAAO,mDAAmD,CAAA;AAM1D;;;GAGG;AACH,oBAAY,aAAa;IACvB;;;OAGG;IACH,IAAI,yBAAyB;CAC9B;AAED;;;;;;;;GAQG;AACH,qBAAa,kBAAmB,SAAQ,iBAAiB;IACvD,OAAO,CAAC,SAAS,CAAQ;IAEzB;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED;;OAEG;IACH,IAAa,UAAU;;;MAKtB;IAED,OAAO,CAAC,WAAW,CAAuB;IAE1C,OAAO,CAAC,QAAQ,CAAwB;IAExC,OAAO,CAAC,aAAa,CAAQ;IAE7B,OAAO,CAAC,YAAY,CAAQ;gBAEhB,SAAS,EAAE,SAAS;IAmBhC,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,MAAM;IAId,OAAO,CAAC,MAAM;IAId,OAAO,CAAC,OAAO;IAKf;;;;;;OAMG;IACH,IAAI,CAAC,KAAK,SAAM;IAKhB;;OAEG;IACH,IAAI;IAKJ,OAAO,CAAC,KAAK;IASb,OAAO,CAAC,KAAK;IAYb;;OAEG;IACM,MAAM;CAchB"}
+{"version":3,"file":"SpinnerThreeBounce.d.ts","sourceRoot":"","sources":["../../../src/plugins/spinner-three-bounce/SpinnerThreeBounce.ts"],"names":[],"mappings":"AAMA,OAAO,EACL,SAAS,EAET,iBAAiB,EAElB,MAAM,cAAc,CAAA;AAKrB,OAAO,mDAAmD,CAAA;AAM1D;;;GAGG;AACH,oBAAY,aAAa;IACvB;;;OAGG;IACH,IAAI,yBAAyB;CAC9B;AAED;;;;;;;;GAQG;AACH,qBAAa,kBAAmB,SAAQ,iBAAiB;IACvD,OAAO,CAAC,SAAS,CAAQ;IAEzB;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED;;OAEG;IACH,IAAa,UAAU;;;MAKtB;IAED,OAAO,CAAC,WAAW,CAAuB;IAE1C,OAAO,CAAC,QAAQ,CAAwB;IAExC,OAAO,CAAC,aAAa,CAAQ;IAE7B,OAAO,CAAC,YAAY,CAAQ;gBAEhB,SAAS,EAAE,SAAS;IAmBhC,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,MAAM;IAId,OAAO,CAAC,MAAM;IAId,OAAO,CAAC,OAAO;IAKf;;;;;;OAMG;IACH,IAAI,CAAC,KAAK,SAAM;IAKhB;;OAEG;IACH,IAAI;IAKJ,OAAO,CAAC,KAAK;IASb,OAAO,CAAC,KAAK;IAYb;;OAEG;IACM,MAAM;CAgBhB"}

package/lib/plugins/spinner-three-bounce/SpinnerThreeBounce.js

@@ -130,8 +130,10 @@ export class SpinnerThreeBounce extends UIContainerPlugin {
      */
     render() {
         this.$el.html(this.template());
-        this.el.firstElementChild?.addEventListener('animationiteration', () => {
-            this.trigger(SpinnerEvents.SYNC);
+        this.el.firstElementChild?.addEventListener('animationiteration', (event) => {
+            this.trigger(SpinnerEvents.SYNC, {
+                elapsedTime: event.elapsedTime,
+            });
         });
         this.container.$el.append(this.$el[0]);
         if (this.container.buffering) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gcorevideo/player",
-  "version": "2.26.2",
+  "version": "2.26.4",
   "description": "Gcore JavaScript video player",
   "main": "dist/index.js",
   "type": "module",

package/src/plugins/source-controller/SourceController.ts

@@ -225,25 +225,32 @@ export class SourceController extends CorePlugin {
         }
       },
     )
-    this.core.activePlayback.on(Events.PLAYBACK_PLAY, () => {
-      trace(`${T} on PLAYBACK_PLAY`, {
-        currentSource: this.sourcesList[this.currentSourceIndex],
-        retrying: this.active,
-      })
-      if (this.active) {
-        this.reset()
-        this.core.activeContainer?.getPlugin('poster')?.enable()
-        this.core.activeContainer?.getPlugin('spinner')?.hide()
-      }
-    })
+    // this.core.activePlayback.on(Events.PLAYBACK_PLAY, () => {
+    //   trace(`${T} on PLAYBACK_PLAY`, {
+    //     currentSource: this.sourcesList[this.currentSourceIndex],
+    //     retrying: this.active,
+    //   })
+    //   if (this.active) {
+    //     this.reset()
+    //     this.core.activeContainer?.getPlugin('poster')?.enable()
+    //     this.core.activeContainer?.getPlugin('spinner')?.hide()
+    //   }
+    // })
     this.listenTo(
       this.core.activeContainer,
       Events.CONTAINER_PLAY,
       (_: string, { autoPlay }: { autoPlay?: boolean }) => {
         trace(`${T} onContainerPlay`, {
           autoPlay,
+          currentSource: this.sourcesList[this.currentSourceIndex],
+          retrying: this.active,
         })
         this.autoPlay = !!autoPlay
+        if (this.active) {
+          this.reset()
+          this.core.activeContainer?.getPlugin('poster')?.enable()
+          this.core.activeContainer?.getPlugin('spinner')?.hide()
+        }
       },
     )
   }
@@ -275,6 +282,7 @@ export class SourceController extends CorePlugin {
         setTimeout(() => {
           trace(`${T} retryPlayback playing`, {
             autoPlay: this.autoPlay,
+            nextSource,
           })
           this.core.activeContainer.play({
             autoPlay: this.autoPlay,

package/src/plugins/source-controller/__tests__/SourceController.test.ts

@@ -4,11 +4,14 @@ import FakeTimers from '@sinonjs/fake-timers'
 import { SourceController } from '../SourceController'
 import { PlaybackErrorCode } from '../../../playback.types.js'
 import {
+  createMockContainer,
   createMockCore,
   createMockPlayback,
   createMockPlugin,
   createSpinnerPlugin,
 } from '../../../testUtils.js'
+import { Events } from '@clappr/core'
+import { SpinnerEvents } from '../../spinner-three-bounce/SpinnerThreeBounce.js'
 
 // import { LogTracer, Logger, setTracer } from '@gcorevideo/utils'
 
@@ -77,19 +80,22 @@ describe('SourceController', () => {
   describe('on fatal playback failure', () => {
     let core: any
     let nextPlayback: any
+    let nextContainer: any
     describe('basically', () => {
       beforeEach(() => {
         core = createMockCore({
           sources: MOCK_SOURCES,
         })
         const _ = new SourceController(core)
-        core.emit('core:ready')
-        core.emit('core:active:container:changed')
-        core.activePlayback.emit('playback:error', {
+        core.emit(Events.CORE_READY)
+        core.emit(Events.CORE_ACTIVE_CONTAINER_CHANGED)
+        core.activePlayback.emit(Events.PLAYBACK_ERROR, {
           code: PlaybackErrorCode.MediaSourceUnavailable,
         })
-        nextPlayback = createMockPlayback()
+        nextContainer = createMockContainer()
+        nextPlayback = nextContainer.playback
         core.activePlayback = nextPlayback
+        core.activeContainer = nextContainer
       })
       it('should load the next source after a delay', async () => {
         expect(core.load).not.toHaveBeenCalled()
@@ -124,7 +130,7 @@ describe('SourceController', () => {
               return spinner
             }
           })
-          core.emit('core:active:container:changed')
+          core.emit(Events.CORE_ACTIVE_CONTAINER_CHANGED)
         })
         it('should disable the poster', async () => {
           expect(poster.disable).toHaveBeenCalled()
@@ -147,18 +153,22 @@ describe('SourceController', () => {
           }
         })
         const _ = new SourceController(core)
-        core.emit('core:ready')
-        core.emit('core:active:container:changed')
-        core.activePlayback.emit('playback:error', {
+        core.emit(Events.CORE_READY)
+        core.emit(Events.CORE_ACTIVE_CONTAINER_CHANGED)
+        core.activePlayback.emit(Events.PLAYBACK_ERROR, {
           code: PlaybackErrorCode.MediaSourceUnavailable,
         })
-        nextPlayback = createMockPlayback()
+        nextContainer = createMockContainer()
+        nextPlayback = nextContainer.playback
         core.activePlayback = nextPlayback
+        core.activeContainer = nextContainer
       })
       it('should sync with the spinner before reloading the source', async () => {
         await clock.tickAsync(1000)
         expect(core.load).not.toHaveBeenCalled()
-        spinner.emit('plugins:spinner:sync')
+        spinner.emit(SpinnerEvents.SYNC, {
+          elapsedTime: 1000,
+        })
         expect(core.load).toHaveBeenCalled()
       })
     })
@@ -171,14 +181,16 @@ describe('SourceController', () => {
           sources: MOCK_SOURCES,
         })
         const _ = new SourceController(core)
-        core.emit('core:ready')
-        core.emit('core:active:container:changed')
-        core.activePlayback.emit('playback:error', {
+        core.emit(Events.CORE_READY)
+        core.emit(Events.CORE_ACTIVE_CONTAINER_CHANGED)
+        core.activePlayback.emit(Events.PLAYBACK_ERROR, {
           code: PlaybackErrorCode.MediaSourceUnavailable,
         })
         await clock.tickAsync(1000)
-        nextPlayback = createMockPlayback()
+        nextContainer = createMockContainer()
+        nextPlayback = nextContainer.playback
         core.activePlayback = nextPlayback
+        core.activeContainer = nextContainer
         poster = createMockPlugin()
         spinner = createSpinnerPlugin()
         core.activeContainer.getPlugin.mockImplementation((name: string) => {
@@ -189,9 +201,10 @@ describe('SourceController', () => {
             return spinner
           }
         })
-        core.emit('core:ready')
-        core.emit('core:active:container:changed')
-        nextPlayback.emit('playback:play')
+        core.emit(Events.CORE_READY)
+        core.emit(Events.CORE_ACTIVE_CONTAINER_CHANGED)
+        nextPlayback.emit(Events.PLAYBACK_PLAY)
+        nextContainer.emit(Events.CONTAINER_PLAY, 'Container', {})
       })
       it('should enable the poster', async () => {
         expect(poster.enable).toHaveBeenCalled()
@@ -206,7 +219,7 @@ describe('SourceController', () => {
         it('should do nothing', async () => {
           nextPlayback.emit(event)
           await clock.tickAsync(1000)
-          nextPlayback.emit('playback:play')
+          nextPlayback.emit(Events.PLAYBACK_PLAY)
           await clock.tickAsync(1000)
           expect(poster.enable).toHaveBeenCalledTimes(1)
           expect(spinner.hide).toHaveBeenCalledTimes(1)

package/src/plugins/spinner-three-bounce/SpinnerThreeBounce.ts

@@ -166,8 +166,10 @@ export class SpinnerThreeBounce extends UIContainerPlugin {
    */
   override render() {
     this.$el.html(this.template())
-    this.el.firstElementChild?.addEventListener('animationiteration', () => {
-      this.trigger(SpinnerEvents.SYNC)
+    this.el.firstElementChild?.addEventListener('animationiteration', (event) => {
+      this.trigger(SpinnerEvents.SYNC, {
+        elapsedTime: (event as AnimationEvent).elapsedTime,
+      })
     })
     this.container.$el.append(this.$el[0])
     if (this.container.buffering) {