@gcorevideo/player 2.1.12 → 2.1.14

package/dist/index.js

@@ -42243,14 +42243,14 @@ class Player {
     emitter = new EventLite();
     player = null;
     ready = false;
+    rootNode = null;
     tuneInTimerId = null;
     tunedIn = false;
     get activePlayback() {
         if (!this.player?.core.activePlayback) {
             return null;
         }
-        switch (this.player.core.activePlayback
-            .name) {
+        switch (this.player.core.activePlayback.name) {
             case 'dash':
                 return 'dash';
             case 'hls':
@@ -42263,8 +42263,7 @@ class Player {
         return this.bitrateInfo;
     }
     get hd() {
-        return (this.player?.core.activePlayback
-            ?.isHighDefinitionInUse || false);
+        return this.player?.core.activePlayback?.isHighDefinitionInUse || false;
     }
     get playbackType() {
         return this.player?.core.activePlayback?.getPlaybackType();
@@ -42287,8 +42286,7 @@ class Player {
     async init(playerElement) {
         assert.ok(!this.player, 'Player already initialized');
         assert.ok(playerElement, 'Player container element is required');
-        if (this.config.debug === 'all' ||
-            this.config.debug === 'clappr') {
+        if (this.config.debug === 'all' || this.config.debug === 'clappr') {
             Log.setLevel(0);
         }
         trace(`${T} init`, {
@@ -42353,15 +42351,14 @@ class Player {
         const player = new Player$1(coreOptions);
         this.player = player;
         // TODO checks if the whole thing is necessary
-        this.tuneInTimerId =
-            globalThis.setTimeout(() => {
-                trace(`${T} tuneInTimer`, {
-                    ready: this.ready,
-                    tunedIn: this.tunedIn,
-                });
-                this.tuneInTimerId = null;
-                this.tuneIn();
-            }, 4000);
+        this.tuneInTimerId = globalThis.setTimeout(() => {
+            trace(`${T} tuneInTimer`, {
+                ready: this.ready,
+                tunedIn: this.tunedIn,
+            });
+            this.tuneInTimerId = null;
+            this.tuneIn();
+        }, 4000);
     }
     async tuneIn() {
         assert.ok(this.player);
@@ -42386,8 +42383,7 @@ class Player {
         player.core.on(Events$1.CORE_ACTIVE_CONTAINER_CHANGED, () => {
             this.bindBitrateChangeHandler();
         }, null);
-        if (Browser.isiOS &&
-            player.core.activePlayback) {
+        if (Browser.isiOS && player.core.activePlayback) {
             player.core.activePlayback.$el.on('webkitendfullscreen', () => {
                 try {
                     player.core.handleFullscreenChange();
@@ -42397,17 +42393,33 @@ class Player {
                 }
             });
         }
-        player.core.on(Events$1.CORE_SCREEN_ORIENTATION_CHANGED, ({ orientation, }) => {
-            trace(`${T} CORE_SCREEN_ORIENTATION_CHANGED`, { orientation });
+        player.core.on(Events$1.CORE_SCREEN_ORIENTATION_CHANGED, ({ orientation }) => {
+            trace(`${T} CORE_SCREEN_ORIENTATION_CHANGED`, {
+                orientation,
+                rootNode: {
+                    width: this.rootNode?.clientWidth,
+                    height: this.rootNode?.clientHeight,
+                },
+            });
+            if (Browser.isiOS && this.rootNode) {
+                player.core.resize({
+                    width: this.rootNode.clientWidth,
+                    height: this.rootNode.clientHeight,
+                });
+            }
+        }, null);
+        player.core.on(Events$1.CORE_RESIZE, ({ width, height }) => {
+            trace(`${T} CORE_RESIZE`, {
+                width,
+                height,
+            });
         }, null);
         if (this.config.autoPlay) {
             setTimeout(() => {
                 trace(`${T} autoPlay`, {
                     player: !!this.player,
-                    container: !!this.player?.core
-                        .activeContainer,
-                    playback: this.player?.core
-                        .activePlayback.name,
+                    container: !!this.player?.core.activeContainer,
+                    playback: this.player?.core.activePlayback.name,
                 });
                 assert(this.player);
                 this.player.play({
@@ -42432,7 +42444,7 @@ class Player {
             setTimeout(() => this.tuneIn(), 0);
         },
         onResize: (newSize) => {
-            trace(`${T} CORE_RESIZE`, {
+            trace(`${T} onResize`, {
                 newSize,
             });
         },
@@ -42469,46 +42481,41 @@ class Player {
             }
         },
     };
-    buildCoreOptions(playerElement) {
+    buildCoreOptions(rootNode) {
         const multisources = this.config.multisources;
-        const mainSource = this.config.playbackType ===
-            'live'
+        const mainSource = this.config.playbackType === 'live'
             ? multisources.find((ms) => ms.live !== false)
             : multisources[0];
         const mediaSources = mainSource
             ? this.buildMediaSourcesList(mainSource)
             : [];
         // const mainSourceUrl = mediaSources[0];
-        const poster = mainSource?.poster ??
-            this.config.poster;
+        const poster = mainSource?.poster ?? this.config.poster;
+        this.rootNode = rootNode;
         const coreOptions = {
             ...this.config.pluginSettings,
             allowUserInteraction: true,
             autoPlay: false,
             debug: this.config.debug || 'none',
             events: this.events,
-            height: playerElement.clientHeight,
+            height: rootNode.clientHeight,
             loop: this.config.loop,
             multisources,
             mute: this.config.mute,
             playback: {
                 controls: false,
                 playInline: true,
-                preload: Browser.isiOS
-                    ? 'metadata'
-                    : 'none',
+                preload: Browser.isiOS ? 'metadata' : 'none',
                 mute: this.config.mute,
                 crossOrigin: 'anonymous', // TODO
                 hlsjsConfig: {
-                    debug: this.config.debug ===
-                        'all' ||
-                        this.config.debug === 'hls',
+                    debug: this.config.debug === 'all' || this.config.debug === 'hls',
                 },
             },
-            parent: playerElement,
+            parent: rootNode,
             playbackType: this.config.playbackType,
             poster,
-            width: playerElement.clientWidth,
+            width: rootNode.clientWidth,
             // source: mainSourceUrl,
             sources: mediaSources,
             strings: this.config.strings,
@@ -42516,6 +42523,7 @@ class Player {
         return coreOptions;
     }
     configurePlaybacks() {
+        // TODO check if there are DASH and HLS sources and don't register the respective playbacks if not
         Loader.registerPlayback(DashPlayback);
         Loader.registerPlayback(HlsPlayback);
     }
@@ -42560,8 +42568,7 @@ class Player {
             }
         }
         function addHls() {
-            if (sources.hls &&
-                HlsPlayback.canPlay(sources.hls)) {
+            if (sources.hls && HlsPlayback.canPlay(sources.hls)) {
                 msl.push(sources.hls);
                 sources.hls = null;
             }
@@ -42572,8 +42579,7 @@ class Player {
             }
         }
         function addDash() {
-            if (sources.dash &&
-                DashPlayback.canPlay(sources.dash)) {
+            if (sources.dash && DashPlayback.canPlay(sources.dash)) {
                 msl.push(sources.dash);
                 sources.dash = null;
             }
@@ -42703,12 +42709,12 @@ class SentryTracer {
     }
 }
 
-var version$1 = "2.1.12";
+var version$1 = "2.1.14";
 
 var packages = {
 	"": {
 		name: "@gcorevideo/player",
-		version: "2.1.12",
+		version: "2.1.14",
 		license: "Apache-2.0",
 		dependencies: {
 			"@clappr/core": "^0.11.3",

package/lib/Player.d.ts

@@ -12,6 +12,7 @@ export declare class Player {
     private emitter;
     private player;
     private ready;
+    private rootNode;
     private tuneInTimerId;
     private tunedIn;
     get activePlayback(): PlaybackModule | null;

package/lib/Player.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Player.d.ts","sourceRoot":"","sources":["../src/Player.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EACV,WAAW,EACX,YAAY,EACZ,YAAY,EAEb,MAAM,YAAY,CAAA;AAKnB,OAAO,EACL,YAAY,EACZ,WAAW,EACZ,MAAM,YAAY,CAAA;AAInB,OAAO,2BAA2B,CAAA;AAIlC,KAAK,kBAAkB,CACrB,CAAC,SAAS,WAAW,IACnB,MAAM,IAAI,CAAA;AAiBd,MAAM,MAAM,cAAc,GACtB,MAAM,GACN,KAAK,GACL,QAAQ,CAAA;AAOZ;;GAEG;AACH,qBAAa,MAAM;IACjB,OAAO,CAAC,WAAW,CACb;IAEN,OAAO,CAAC,MAAM,CACG;IAEjB,OAAO,CAAC,OAAO,CAAkB;IAEjC,OAAO,CAAC,MAAM,CACR;IAEN,OAAO,CAAC,KAAK,CAAQ;IAErB,OAAO,CAAC,aAAa,CAEN;IAEf,OAAO,CAAC,OAAO,CAAQ;IAEvB,IAAI,cAAc,IAAI,cAAc,GAAG,IAAI,CAiB1C;IAED,IAAI,OAAO,IAAI,WAAW,GAAG,IAAI,CAEhC;IAED,IAAI,EAAE,QAKL;IAED,IAAI,YAAY,IACZ,YAAY,GACZ,SAAS,CAEZ;gBAEW,MAAM,EAAE,YAAY;IAIhC,EAAE,CAAC,CAAC,SAAS,WAAW,EACtB,KAAK,EAAE,CAAC,EACR,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAKhC,GAAG,CAAC,CAAC,SAAS,WAAW,EACvB,KAAK,EAAE,CAAC,EACR,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAKhC,SAAS,CACP,MAAM,EAAE,OAAO,CAAC,YAAY,CAAC;IAK/B,OAAO,CAAC,SAAS;IAUX,IAAI,CACR,aAAa,EAAE,WAAW;IA4C5B,OAAO;IAiBP,KAAK;IAQL,IAAI;IAQJ,MAAM,CAAC,IAAI,EAAE,MAAM;IAQnB,IAAI;IAQJ,MAAM,CAAC,cAAc,CACnB,MAAM,EAAE,YAAY;IAKtB,MAAM,CAAC,gBAAgB,CACrB,MAAM,EAAE,YAAY;IAKtB,OAAO,CAAC,UAAU;YA6BJ,MAAM;IA8EpB,OAAO,CAAC,MAAM,CA2Db;IAED,OAAO,CAAC,gBAAgB;IA8DxB,OAAO,CAAC,kBAAkB;IAO1B,OAAO,CAAC,wBAAwB;IAShC,OAAO,CAAC,qBAAqB;CAkF9B"}
+{"version":3,"file":"Player.d.ts","sourceRoot":"","sources":["../src/Player.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EACV,WAAW,EACX,YAAY,EACZ,YAAY,EAEb,MAAM,YAAY,CAAA;AAEnB,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAItD,OAAO,2BAA2B,CAAA;AAIlC,KAAK,kBAAkB,CAAC,CAAC,SAAS,WAAW,IAAI,MAAM,IAAI,CAAA;AAiB3D,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,CAAA;AAItD;;GAEG;AACH,qBAAa,MAAM;IACjB,OAAO,CAAC,WAAW,CAA2B;IAE9C,OAAO,CAAC,MAAM,CAAgC;IAE9C,OAAO,CAAC,OAAO,CAAkB;IAEjC,OAAO,CAAC,MAAM,CAA4B;IAE1C,OAAO,CAAC,KAAK,CAAQ;IAErB,OAAO,CAAC,QAAQ,CAA2B;IAE3C,OAAO,CAAC,aAAa,CAA6C;IAElE,OAAO,CAAC,OAAO,CAAQ;IAEvB,IAAI,cAAc,IAAI,cAAc,GAAG,IAAI,CAY1C;IAED,IAAI,OAAO,IAAI,WAAW,GAAG,IAAI,CAEhC;IAED,IAAI,EAAE,QAEL;IAED,IAAI,YAAY,IAAI,YAAY,GAAG,SAAS,CAE3C;gBAEW,MAAM,EAAE,YAAY;IAIhC,EAAE,CAAC,CAAC,SAAS,WAAW,EAAE,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAIlE,GAAG,CAAC,CAAC,SAAS,WAAW,EAAE,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAInE,SAAS,CAAC,MAAM,EAAE,OAAO,CAAC,YAAY,CAAC;IAIvC,OAAO,CAAC,SAAS;IAIX,IAAI,CAAC,aAAa,EAAE,WAAW;IAyBrC,OAAO;IAiBP,KAAK;IAKL,IAAI;IAKJ,MAAM,CAAC,IAAI,EAAE,MAAM;IAKnB,IAAI;IAKJ,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,YAAY;IAI1C,MAAM,CAAC,gBAAgB,CAAC,MAAM,EAAE,YAAY;IAI5C,OAAO,CAAC,UAAU;YAqBJ,MAAM;IA+EpB,OAAO,CAAC,MAAM,CAgDb;IAED,OAAO,CAAC,gBAAgB;IA6CxB,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,wBAAwB;IAShC,OAAO,CAAC,qBAAqB;CA2D9B"}

package/lib/Player.js

@@ -1,8 +1,8 @@
 import { Browser, Events as ClapprEvents, Log, Player as PlayerClappr, $, Loader, } from '@clappr/core';
 import assert from 'assert';
 import EventLite from 'event-lite';
-import { reportError, trace, } from './trace/index.js';
-import { PlayerEvent, } from './types.js';
+import { reportError, trace } from './trace/index.js';
+import { PlayerEvent } from './types.js';
 import DashPlayback from './plugins/dash-playback/DashPlayback.js';
 import HlsPlayback from './plugins/hls-playback/HlsPlayback.js';
 import '../assets/style/main.scss'; // TODO check if needed
@@ -28,14 +28,14 @@ export class Player {
     emitter = new EventLite();
     player = null;
     ready = false;
+    rootNode = null;
     tuneInTimerId = null;
     tunedIn = false;
     get activePlayback() {
         if (!this.player?.core.activePlayback) {
             return null;
         }
-        switch (this.player.core.activePlayback
-            .name) {
+        switch (this.player.core.activePlayback.name) {
             case 'dash':
                 return 'dash';
             case 'hls':
@@ -48,8 +48,7 @@ export class Player {
         return this.bitrateInfo;
     }
     get hd() {
-        return (this.player?.core.activePlayback
-            ?.isHighDefinitionInUse || false);
+        return this.player?.core.activePlayback?.isHighDefinitionInUse || false;
     }
     get playbackType() {
         return this.player?.core.activePlayback?.getPlaybackType();
@@ -72,8 +71,7 @@ export class Player {
     async init(playerElement) {
         assert.ok(!this.player, 'Player already initialized');
         assert.ok(playerElement, 'Player container element is required');
-        if (this.config.debug === 'all' ||
-            this.config.debug === 'clappr') {
+        if (this.config.debug === 'all' || this.config.debug === 'clappr') {
             Log.setLevel(0);
         }
         trace(`${T} init`, {
@@ -138,15 +136,14 @@ export class Player {
         const player = new PlayerClappr(coreOptions);
         this.player = player;
         // TODO checks if the whole thing is necessary
-        this.tuneInTimerId =
-            globalThis.setTimeout(() => {
-                trace(`${T} tuneInTimer`, {
-                    ready: this.ready,
-                    tunedIn: this.tunedIn,
-                });
-                this.tuneInTimerId = null;
-                this.tuneIn();
-            }, 4000);
+        this.tuneInTimerId = globalThis.setTimeout(() => {
+            trace(`${T} tuneInTimer`, {
+                ready: this.ready,
+                tunedIn: this.tunedIn,
+            });
+            this.tuneInTimerId = null;
+            this.tuneIn();
+        }, 4000);
     }
     async tuneIn() {
         assert.ok(this.player);
@@ -171,8 +168,7 @@ export class Player {
         player.core.on(ClapprEvents.CORE_ACTIVE_CONTAINER_CHANGED, () => {
             this.bindBitrateChangeHandler();
         }, null);
-        if (Browser.isiOS &&
-            player.core.activePlayback) {
+        if (Browser.isiOS && player.core.activePlayback) {
             player.core.activePlayback.$el.on('webkitendfullscreen', () => {
                 try {
                     player.core.handleFullscreenChange();
@@ -182,17 +178,33 @@ export class Player {
                 }
             });
         }
-        player.core.on(ClapprEvents.CORE_SCREEN_ORIENTATION_CHANGED, ({ orientation, }) => {
-            trace(`${T} CORE_SCREEN_ORIENTATION_CHANGED`, { orientation });
+        player.core.on(ClapprEvents.CORE_SCREEN_ORIENTATION_CHANGED, ({ orientation }) => {
+            trace(`${T} CORE_SCREEN_ORIENTATION_CHANGED`, {
+                orientation,
+                rootNode: {
+                    width: this.rootNode?.clientWidth,
+                    height: this.rootNode?.clientHeight,
+                },
+            });
+            if (Browser.isiOS && this.rootNode) {
+                player.core.resize({
+                    width: this.rootNode.clientWidth,
+                    height: this.rootNode.clientHeight,
+                });
+            }
+        }, null);
+        player.core.on(ClapprEvents.CORE_RESIZE, ({ width, height }) => {
+            trace(`${T} CORE_RESIZE`, {
+                width,
+                height,
+            });
         }, null);
         if (this.config.autoPlay) {
             setTimeout(() => {
                 trace(`${T} autoPlay`, {
                     player: !!this.player,
-                    container: !!this.player?.core
-                        .activeContainer,
-                    playback: this.player?.core
-                        .activePlayback.name,
+                    container: !!this.player?.core.activeContainer,
+                    playback: this.player?.core.activePlayback.name,
                 });
                 assert(this.player);
                 this.player.play({
@@ -217,7 +229,7 @@ export class Player {
             setTimeout(() => this.tuneIn(), 0);
         },
         onResize: (newSize) => {
-            trace(`${T} CORE_RESIZE`, {
+            trace(`${T} onResize`, {
                 newSize,
             });
         },
@@ -254,46 +266,41 @@ export class Player {
             }
         },
     };
-    buildCoreOptions(playerElement) {
+    buildCoreOptions(rootNode) {
         const multisources = this.config.multisources;
-        const mainSource = this.config.playbackType ===
-            'live'
+        const mainSource = this.config.playbackType === 'live'
             ? multisources.find((ms) => ms.live !== false)
             : multisources[0];
         const mediaSources = mainSource
             ? this.buildMediaSourcesList(mainSource)
             : [];
         // const mainSourceUrl = mediaSources[0];
-        const poster = mainSource?.poster ??
-            this.config.poster;
+        const poster = mainSource?.poster ?? this.config.poster;
+        this.rootNode = rootNode;
         const coreOptions = {
             ...this.config.pluginSettings,
             allowUserInteraction: true,
             autoPlay: false,
             debug: this.config.debug || 'none',
             events: this.events,
-            height: playerElement.clientHeight,
+            height: rootNode.clientHeight,
             loop: this.config.loop,
             multisources,
             mute: this.config.mute,
             playback: {
                 controls: false,
                 playInline: true,
-                preload: Browser.isiOS
-                    ? 'metadata'
-                    : 'none',
+                preload: Browser.isiOS ? 'metadata' : 'none',
                 mute: this.config.mute,
                 crossOrigin: 'anonymous', // TODO
                 hlsjsConfig: {
-                    debug: this.config.debug ===
-                        'all' ||
-                        this.config.debug === 'hls',
+                    debug: this.config.debug === 'all' || this.config.debug === 'hls',
                 },
             },
-            parent: playerElement,
+            parent: rootNode,
             playbackType: this.config.playbackType,
             poster,
-            width: playerElement.clientWidth,
+            width: rootNode.clientWidth,
             // source: mainSourceUrl,
             sources: mediaSources,
             strings: this.config.strings,
@@ -301,6 +308,7 @@ export class Player {
         return coreOptions;
     }
     configurePlaybacks() {
+        // TODO check if there are DASH and HLS sources and don't register the respective playbacks if not
         Loader.registerPlayback(DashPlayback);
         Loader.registerPlayback(HlsPlayback);
     }
@@ -345,8 +353,7 @@ export class Player {
             }
         }
         function addHls() {
-            if (sources.hls &&
-                HlsPlayback.canPlay(sources.hls)) {
+            if (sources.hls && HlsPlayback.canPlay(sources.hls)) {
                 msl.push(sources.hls);
                 sources.hls = null;
             }
@@ -357,8 +364,7 @@ export class Player {
             }
         }
         function addDash() {
-            if (sources.dash &&
-                DashPlayback.canPlay(sources.dash)) {
+            if (sources.dash && DashPlayback.canPlay(sources.dash)) {
                 msl.push(sources.dash);
                 sources.dash = null;
             }

package/package.json

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