@gcorevideo/player 2.20.11 → 2.20.13

package/dist/index.js

@@ -42266,6 +42266,10 @@ class HlsPlayback extends BasePlayback {
                             details: data.details,
                         });
                         error.level = PlayerError.Levels.WARN;
+                        // TODO check
+                        // if (data.error instanceof MediaError && data.error.code === MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED) {
+                        //   error.code = PlaybackErrorCode.MediaSourceUnavailable
+                        // }
                         this._recover(evt, data, error);
                         break;
                     default:
@@ -42617,6 +42621,26 @@ HlsPlayback.canPlay = function (resource, mimeType) {
 };
 
 class HTML5Video extends BasePlayback {
+    /**
+     * @internal
+     */
+    createError(errorData, options) {
+        const i18n = this.i18n ||
+            // @ts-ignore
+            (this.core && this.core.i18n) ||
+            // @ts-ignore
+            (this.container && this.container.i18n);
+        if (i18n &&
+            !errorData.UI &&
+            errorData.code === MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED) {
+            errorData.UI = {
+                title: i18n.t('no_broadcast'),
+                message: errorData.message,
+            };
+            errorData.code = PlaybackErrorCode.MediaSourceUnavailable;
+        }
+        return super.createError(errorData, { ...options, useCodePrefix: false });
+    }
 }
 
 // TODO consider allowing the variation of the order of playback modules
@@ -42722,7 +42746,7 @@ class Player {
         const coreOpts = this.buildCoreOptions(playerElement);
         const { core, container } = Player.getRegisteredPlugins();
         trace(`${T$g} init`, {
-            registeredPlaybacks: Loader.registeredPlaybacks.map((p) => p.name),
+            registeredPlaybacks: Loader.registeredPlaybacks.map((p) => p.prototype.name),
         });
         coreOpts.plugins = {
             core: Object.values(core),
@@ -43090,7 +43114,7 @@ class Player {
     }
 }
 
-var version$1 = "2.20.11";
+var version$1 = "2.20.13";
 
 var packages = {
 	"node_modules/@clappr/core": {
@@ -43879,17 +43903,10 @@ function orderByOrderPattern(arr, order) {
     return [...ordered, ...rest];
 }
 /**
- * `PLUGIN` that provides a foundation for developing custom media controls UI.
+ * `PLUGIN` that provides basic playback controls UI and a foundation for developing custom UI.
  * @beta
  * @remarks
  * The methods exposed are to be used by the other plugins that extend the media control UI.
- * The plugin registration should be arranged so that MediaControl is initialized before every other `PLUGIN` that depends on it.
- * @example
- * ```ts
- * Player.registerPlugin(MediaControl) // <--- This must go first
- * Player.registerPlugin(LevelSelector) // a media control plugin
- * Player.registerPlugin(NerdStats) // another media control plugin
- * ```
  */
 class MediaControl extends UICorePlugin {
     advertisementPlaying = false;
@@ -44822,7 +44839,6 @@ class MediaControl extends UICorePlugin {
         return super.destroy();
     }
     configure() {
-        // this.advertisementPlaying ? this.disable() : this.enable()
         this.trigger(Events$1.MEDIACONTROL_OPTIONS_CHANGE);
     }
     /**
@@ -47883,10 +47899,6 @@ class ClickToPause extends ContainerPlugin {
     settingsUpdate() {
         const isLivePlayback = this.container.getPlaybackType() === Playback.LIVE;
         const pointerEnabled = !isLivePlayback || this.container.isDvrEnabled();
-        trace(`${T$c} settingsUpdate`, {
-            isLivePlayback,
-            pointerEnabled,
-        });
         if (pointerEnabled === this.pointerEnabled) {
             return;
         }
@@ -48273,7 +48285,6 @@ class DvrControls extends UICorePlugin {
         container.seek(container.getDuration());
     }
     settingsUpdate() {
-        trace(`${T$b} settingsUpdate`);
         this.core.getPlugin('media_control').$el.removeClass('live');
         this.render();
     }
@@ -48411,7 +48422,6 @@ class ErrorScreen extends UICorePlugin {
             ...this.err,
             reloadIcon: this.options.errorScreen?.noReload ? null : reloadIcon,
         }));
-        // TODO append to container instead of core?
         if (!this.el.parentElement) {
             this.core.$el.append(this.el);
         }
@@ -48421,26 +48431,32 @@ class ErrorScreen extends UICorePlugin {
 
 const FAVICON_COLOR = '#567';
 const FAVICON_SELECTOR = 'link[rel="shortcut icon"]';
-// const oldIcon = $(FAVICON_SELECTOR);
 /**
- * `PLUGIN` that adds custom favicon to the player's tab.
+ * `PLUGIN` that changes the favicon according to the player's state.
  * @beta
+ * @remarks
+ * There are three states: stopped, playing and paused.
  */
 class Favicon extends CorePlugin {
-    _container = null;
     oldIcon;
     playIcon = null;
     pauseIcon = null;
     stopIcon = null;
+    /**
+     * @internal
+     */
     get name() {
         return 'favicon';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
-    //   get oldIcon() {
-    //     return oldIcon;
-    //   }
+    /**
+     * @internal
+     */
     constructor(core) {
         super(core);
         this.oldIcon = $(FAVICON_SELECTOR);
@@ -48448,41 +48464,31 @@ class Favicon extends CorePlugin {
             this.stopIcon = this.createIcon(stopIcon);
             this.changeIcon(this.stopIcon);
         }
-        this.configure();
-    }
-    configure() {
-        if (this.core.options.changeFavicon) {
-            if (!this.enabled) {
-                // @ts-ignore
-                this.stopListening(this.core, Events$1.CORE_OPTIONS_CHANGE);
-                this.enable();
-            }
-        }
-        else if (this.enabled) {
-            this.disable();
-            this.listenTo(this.core, Events$1.CORE_OPTIONS_CHANGE, this.configure);
-        }
     }
+    /**
+     * @internal
+     */
     bindEvents() {
-        this.listenTo(this.core, Events$1.CORE_OPTIONS_CHANGE, this.configure);
         this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, this.containerChanged);
-        this.core.activeContainer && this.containerChanged();
     }
     containerChanged() {
-        // @ts-ignore
-        this._container && this.stopListening(this._container);
-        this._container = this.core.activeContainer;
-        this.listenTo(this._container, Events$1.CONTAINER_PLAY, this.setPlayIcon);
-        this.listenTo(this._container, Events$1.CONTAINER_PAUSE, this.setPauseIcon);
-        this.listenTo(this._container, Events$1.CONTAINER_STOP, this.resetIcon);
-        this.listenTo(this._container, Events$1.CONTAINER_ENDED, this.resetIcon);
-        this.listenTo(this._container, Events$1.CONTAINER_ERROR, this.resetIcon);
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAY, this.setPlayIcon);
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PAUSE, this.setPauseIcon);
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_STOP, this.resetIcon);
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_ENDED, this.resetIcon);
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_ERROR, this.resetIcon);
         this.resetIcon();
     }
+    /**
+     * @internal
+     */
     disable() {
         super.disable();
         this.resetIcon();
     }
+    /**
+     * @internal
+     */
     destroy() {
         super.destroy();
         this.resetIcon();
@@ -48513,15 +48519,12 @@ class Favicon extends CorePlugin {
         this.changeIcon(this.pauseIcon);
     }
     resetIcon() {
-        $(FAVICON_SELECTOR).remove();
         const icon = this.oldIcon.length > 0 ? this.oldIcon : this.stopIcon;
         this.changeIcon(icon);
     }
     changeIcon(icon) {
-        if (icon) {
-            $('link[rel="shortcut icon"]').remove();
-            $('head').append(icon);
-        }
+        $('link[rel="shortcut icon"]').remove();
+        $('head').append(icon);
     }
 }
 
@@ -49852,6 +49855,8 @@ const T$5 = 'plugins.poster';
  * @beta
  * @remarks
  * When the playback is stopped, media control UI is disabled.
+ * Note that the poster image, if specified via the player config, will be used to update video element's poster attribute by the
+ * HTML5-video-based playback module.
  *
  * Configuration options:
  *
@@ -49875,6 +49880,7 @@ const T$5 = 'plugins.poster';
  * ```
  */
 class Poster extends UIContainerPlugin {
+    // TODO merge non-poster related functionality into the ClickToPause plugin
     hasFatalError = false;
     hasStartedPlaying = false;
     playRequested = false;
@@ -50030,9 +50036,6 @@ class Poster extends UIContainerPlugin {
                 this.container.playback.play();
             }
         }
-        else {
-            this.container.trigger('container:start');
-        }
         return false;
     }
     shouldHideOnPlay() {
@@ -50738,6 +50741,9 @@ class SourceController extends CorePlugin {
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
+    /**
+     * @internal
+     */
     constructor(core) {
         super(core);
         this.sourcesList = this.core.options.sources;

package/dist/player.d.ts

@@ -3,7 +3,7 @@
  *
  * @remarks
  * This package provides a video player for the Gcore streaming platform.
- * It is built on top of the Clappr library and provides a framework for building custom integrations.
+ * 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 player with additional features.
@@ -561,7 +561,7 @@ export declare class ContextMenu extends UIContainerPlugin {
 }
 
 /**
- * The plugin adds a context menu to the player.
+ * Context menu plugin settings
  * @beta
  */
 export declare interface ContextMenuPluginSettings {
@@ -703,24 +703,42 @@ export declare type ErrorScreenPluginSettings = {
 };
 
 /**
- * `PLUGIN` that adds custom favicon to the player's tab.
+ * `PLUGIN` that changes the favicon according to the player's state.
  * @beta
+ * @remarks
+ * There are three states: stopped, playing and paused.
  */
 export declare class Favicon extends CorePlugin {
-    private _container;
     private oldIcon;
     private playIcon;
     private pauseIcon;
     private stopIcon;
+    /**
+     * @internal
+     */
     get name(): string;
+    /**
+     * @internal
+     */
     get supportedVersion(): {
         min: string;
     };
+    /**
+     * @internal
+     */
     constructor(core: Core);
-    configure(): void;
+    /**
+     * @internal
+     */
     bindEvents(): void;
     private containerChanged;
+    /**
+     * @internal
+     */
     disable(): void;
+    /**
+     * @internal
+     */
     destroy(): void;
     private createIcon;
     private setPlayIcon;
@@ -729,6 +747,16 @@ export declare class Favicon extends CorePlugin {
     private changeIcon;
 }
 
+/**
+ * @beta
+ */
+export declare interface FaviconPluginSettings {
+    /**
+     * CSS color of the favicon.
+     */
+    faviconColor?: string;
+}
+
 /**
  * An element inside the gear menu
  * @beta
@@ -932,17 +960,10 @@ export declare class Logo extends UIContainerPlugin {
 export { LogTracer }
 
 /**
- * `PLUGIN` that provides a foundation for developing custom media controls UI.
+ * `PLUGIN` that provides basic playback controls UI and a foundation for developing custom UI.
  * @beta
  * @remarks
  * The methods exposed are to be used by the other plugins that extend the media control UI.
- * The plugin registration should be arranged so that MediaControl is initialized before every other `PLUGIN` that depends on it.
- * @example
- * ```ts
- * Player.registerPlugin(MediaControl) // <--- This must go first
- * Player.registerPlugin(LevelSelector) // a media control plugin
- * Player.registerPlugin(NerdStats) // another media control plugin
- * ```
  */
 export declare class MediaControl extends UICorePlugin {
     private advertisementPlaying;
@@ -1158,6 +1179,12 @@ export declare class MediaControl extends UICorePlugin {
      * @returns  ZeptoSelector of the right panel element
      */
     getRightPanel(): any;
+    /**
+     * Get the left panel area to append custom elements to
+     * @returns  ZeptoSelector of the left panel element
+     */
+    getLeftPanel(): any;
+    getCenterPanel(): any;
     private resetIndicators;
     private initializeIcons;
     private setSeekPercentage;
@@ -1378,7 +1405,7 @@ export declare interface PlaybackError {
      */
     message: string;
     /**
-     * Exact component that originated the error.
+     * Name of the component that originated the error.
      * @example
      * - 'core'
      * - 'dash'
@@ -1386,7 +1413,7 @@ export declare interface PlaybackError {
      */
     origin: string;
     /**
-     * Component subsystem of the error origin
+     * Component subsystem of the error origin, together with the `origin` uniquely identifies the originating component.
      */
     scope: PlayerComponentType;
     /**
@@ -1931,6 +1958,8 @@ export declare type PlayerPluginConstructor = CorePluginConstructor | ContainerP
  * @beta
  * @remarks
  * When the playback is stopped, media control UI is disabled.
+ * Note that the poster image, if specified via the player config, will be used to update video element's poster attribute by the
+ * HTML5-video-based playback module.
  *
  * Configuration options:
  *
@@ -2193,6 +2222,9 @@ export declare class SourceController extends CorePlugin {
     get supportedVersion(): {
         min: string;
     };
+    /**
+     * @internal
+     */
     constructor(core: Core);
     /**
      * @internal