@gcorevideo/player 2.12.1 → 2.12.2

package/src/Player.ts

@@ -15,9 +15,7 @@ import type {
   CoreOptions,
   CorePluginOptions,
 } from './internal.types.js'
-import type {
-  PlayerPlugin,
-} from './types.js'
+import type { PlayerMediaSourceDesc, PlayerPlugin } from './types.js'
 import { PlayerConfig, PlayerEvent } from './types.js'
 import {
   buildMediaSourcesList,
@@ -74,12 +72,6 @@ export class Player {
 
   private tunedIn = false
 
-  // private sourcesList: PlayerMediaSourceDesc[] = []
-
-  // private currentSourceIndex = 0
-
-  // private sourcesDelay: Record<string, number> = {}
-
   constructor(config: PlayerConfig) {
     this.setConfig(config)
   }
@@ -125,10 +117,6 @@ export class Player {
       Log.setLevel(0)
     }
 
-    trace(`${T} init`, {
-      // TODO selected options
-    })
-
     this.configurePlaybacks()
     const coreOpts = this.buildCoreOptions(playerElement)
     const { core, container } = Loader.registeredPlugins
@@ -400,11 +388,11 @@ export class Player {
   }
 
   private buildCoreOptions(rootNode: HTMLElement): CoreOptions {
-    this.buildMediaSourcesList()
-    const source = this.config.sources[0]
-    if (!source) {
-      trace(`${T} buildCoreOptions no source selected`)
-    }
+    const sources = this.buildMediaSourcesList()
+    const source = sources[0]
+    trace(`${T} buildCoreOptions`, {
+      source
+    })
 
     this.rootNode = rootNode
 
@@ -412,7 +400,7 @@ export class Player {
       ...this.config, // plugin settings
       allowUserInteraction: true,
       autoPlay: false,
-      dash: this.config.dash,
+      dash: this.config.dash, // TODO move this to the playback section
       debug: this.config.debug || 'none',
       events: this.events,
       height: rootNode.clientHeight,
@@ -432,7 +420,7 @@ export class Player {
       playbackType: this.config.playbackType,
       width: rootNode.clientWidth,
       source: source ? unwrapSource(source) : undefined,
-      sources: undefined,
+      sources, // prevent Clappr from loading all sources simultaneously
       strings: this.config.strings,
     }
     return coreOptions
@@ -442,9 +430,10 @@ export class Player {
     registerPlaybacks()
   }
 
-  private buildMediaSourcesList() {
-    return buildMediaSourcesList( // TODO ensure unsupported sources are filtered out
-      this.config.sources.map(s => wrapSource(s)),
+  private buildMediaSourcesList(): PlayerMediaSourceDesc[] {
+    return buildMediaSourcesList(
+      // TODO ensure unsupported sources are filtered out
+      this.config.sources.map((s) => wrapSource(s)),
       this.config.priorityTransport,
     )
   }

package/src/index.ts

@@ -10,7 +10,6 @@
 
 export { setTracer } from '@gcorevideo/utils'
 export * from './Player.js'
-export { PlaybackError } from './internal.types.js'
 export * from './playback.types.js'
 export * from './types.js'
 export * from './version.js'

package/src/internal.types.ts

@@ -5,6 +5,7 @@ import type {
 } from "@clappr/core";
 
 import { PlaybackType, PlayerDebugTag, PlayerMediaSource } from "./types";
+import { PlaybackError } from "./playback.types";
 
 type ExternalTrack = {
   kind?: "subtitles" | "captions";
@@ -56,20 +57,6 @@ export interface CorePlaybackConfig {
   shakaConfiguration?: ShakaConfig;
 }
 
-type ErrorLevel = "FATAL" | "WARN" | "INFO";
-
-/**
- * @beta
- */
-export type PlaybackError = {
-  code?: number | string;
-  description: string;
-  raw?: MediaError;
-  level?: ErrorLevel;
-  message: string;
-  scope?: string;
-}
-
 /**
  * @internal
  */

package/src/playback.types.ts

@@ -1,33 +1,32 @@
-
 /**
  * Playback time in seconds since the beginning of the stream (or a segment for the live streams)
  * For the plugin development
  * @internal
  */
-export type TimeValue = number;
+export type TimeValue = number
 
 /**
  * For the plugin development
  * @internal
  */
 export type TimePosition = {
-  current: TimeValue;
-  total: TimeValue;
+  current: TimeValue
+  total: TimeValue
 }
 
 /**
  * For the plugin development
  * @internal
  */
-export type TimeProgress = TimePosition & { start: number; };
+export type TimeProgress = TimePosition & { start: number }
 
 /**
  * For the plugin development
  * @internal
  */
 export type TimeUpdate = TimePosition & {
-  firstFragDateTime: number;
-};
+  firstFragDateTime: number
+}
 
 /**
  * @beta
@@ -47,3 +46,15 @@ export enum PlaybackErrorCode {
   MediaSourceUnavailable = 1,
   QualityLevelUnavailable = 2,
 }
+
+export type ErrorLevel = 'FATAL' | 'WARN' | 'INFO'
+
+/**
+ * @beta
+ */
+export interface PlaybackError {
+  code: PlaybackErrorCode
+  description: string
+  level: ErrorLevel
+  message: string
+}

package/src/plugins/dash-playback/DashPlayback.ts

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style
 // license that can be found in the LICENSE file.
 
-import { Events, HTML5Video, Log, Playback, Utils } from '@clappr/core'
+import { Events, HTML5Video, Log, Playback, PlayerError, Utils } from '@clappr/core'
 import { trace } from '@gcorevideo/utils'
 import assert from 'assert'
 import DASHJS, {
@@ -14,7 +14,7 @@ import DASHJS, {
   IManifestInfo,
 } from 'dashjs'
 
-import { PlaybackErrorCode, QualityLevel, TimePosition, TimeUpdate, TimeValue } from '../../playback.types.js'
+import { PlaybackError, PlaybackErrorCode, QualityLevel, TimePosition, TimeUpdate, TimeValue } from '../../playback.types.js'
 
 const AUTO = -1
 
@@ -406,7 +406,6 @@ export default class DashPlayback extends HTML5Video {
 
   private _onDASHJSSError = (event: DashErrorEvent) => {
     trace(`${T} _onDASHJSSError`, { event })
-    // TODO figure out what's for
     this._stopTimeUpdateTimer()
 
     const e = (event as MediaPlayerErrorEvent).error
@@ -414,31 +413,32 @@ export default class DashPlayback extends HTML5Video {
       case DASHJS.MediaPlayer.errors.MANIFEST_LOADER_PARSING_FAILURE_ERROR_CODE:
       case DASHJS.MediaPlayer.errors.MANIFEST_LOADER_LOADING_FAILURE_ERROR_CODE:
       case DASHJS.MediaPlayer.errors.DOWNLOAD_ERROR_ID_MANIFEST_CODE:
-        this.trigger(Events.PLAYBACK_ERROR, this.createError({
+      case DASHJS.MediaPlayer.errors.DOWNLOAD_ERROR_ID_CONTENT_CODE:
+        this.triggerError({
           code: PlaybackErrorCode.MediaSourceUnavailable,
           message: e.message,
-        }, {
-          useCodePrefix: false,
-        }))
+          description: e.message,
+          level: PlayerError.Levels.FATAL,
+        })
         break;
       // TODO more cases
       default:
-        this.trigger(Events.PLAYBACK_ERROR, this.createError({
+        this.triggerError({
           code: PlaybackErrorCode.Generic,
           message: e.message,
-        }, {
-          useCodePrefix: false,
-        }))
+          description: e.message,
+          level: PlayerError.Levels.FATAL,
+        })
     }
+  }
 
+  private triggerError(error: PlaybackError) {
+    trace(`${T} triggerError`, { error })
+    this.trigger(Events.PLAYBACK_ERROR, error)
     // only reset the dash player in 10ms async, so that the rest of the
     // calling function finishes
     setTimeout(() => {
-      assert.ok(
-        this._dash,
-        'An instance of dashjs MediaPlayer is required to reset',
-      )
-      this._dash.reset()
+      this.stop()
     }, 10)
   }
 

package/src/plugins/hls-playback/HlsPlayback.ts

@@ -25,7 +25,7 @@ import HLSJS, {
   type LevelSwitchingData,
 } from 'hls.js'
 
-import { PlaybackErrorCode, QualityLevel, TimePosition, TimeUpdate } from '../../playback.types.js'
+import { PlaybackError, PlaybackErrorCode, QualityLevel, TimePosition, TimeUpdate } from '../../playback.types.js'
 import { PlaybackType } from '../../types'
 import { TimerId } from '../../utils/types'
 
@@ -493,7 +493,7 @@ export default class HlsPlayback extends HTML5Video {
     this.trigger(Events.PLAYBACK_READY, this.name)
   }
 
-  _recover(evt: HlsEvents.ERROR, data: HlsErrorData, error: ErrorInfo) {
+  _recover(evt: HlsEvents.ERROR, data: HlsErrorData, error: PlaybackError) {
     assert(this._hls, 'Hls.js instance is not available')
     if (!this._recoveredDecodingError) {
       this._recoveredDecodingError = true
@@ -505,10 +505,8 @@ export default class HlsPlayback extends HTML5Video {
     } else {
       Log.error('hlsjs: failed to recover', { evt, data })
       error.level = PlayerError.Levels.FATAL
-      const formattedError = this.createError(error)
 
-      this.trigger(Events.PLAYBACK_ERROR, formattedError)
-      this.stop()
+      this.triggerError(error)
     }
   }
 
@@ -608,13 +606,12 @@ export default class HlsPlayback extends HTML5Video {
   }
 
   _onHLSJSError(evt: HlsEvents.ERROR, data: HlsErrorData) {
-    const error: Record<string, unknown> = {
-      // code: `${data.type}_${data.details}`,
+    const error: PlaybackError = {
       code: PlaybackErrorCode.Generic,
-      description: `${this.name} error: type: ${data.type}, details: ${data.details}`,
-      raw: data,
+      description: `${this.name} error: type: ${data.type}, details: ${data.details} fatal: ${data.fatal}`,
+      level: data.fatal ? PlayerError.Levels.FATAL : PlayerError.Levels.WARN,
+      message: `${this.name} error: type: ${data.type}, details: ${data.details}`,
     }
-    let formattedError
 
     if (data.response) {
       error.description += `, response: ${JSON.stringify(data.response)}`
@@ -639,18 +636,8 @@ export default class HlsPlayback extends HTML5Video {
                   evt,
                   data,
                 })
-                error.code = [
-                  HLSJS.ErrorDetails.MANIFEST_LOAD_ERROR,
-                  HLSJS.ErrorDetails.MANIFEST_LOAD_TIMEOUT,
-                  HLSJS.ErrorDetails.MANIFEST_PARSING_ERROR
-                ].includes(data.details)
-                  ? PlaybackErrorCode.MediaSourceUnavailable
-                  : PlaybackErrorCode.QualityLevelUnavailable
-                formattedError = this.createError(error, {
-                  useCodePrefix: false,
-                })
-                this.trigger(Events.PLAYBACK_ERROR, formattedError)
-                this.stop()
+                error.code = PlaybackErrorCode.MediaSourceUnavailable;
+                this.triggerError(error)
                 break
               default:
                 Log.warn('hlsjs: trying to recover from network error.', {
@@ -658,8 +645,7 @@ export default class HlsPlayback extends HTML5Video {
                   data,
                 })
                 error.level = PlayerError.Levels.WARN
-                assert(this._hls, 'Hls.js instance is not available')
-                this._hls.startLoad()
+                this._hls?.startLoad()
                 break
             }
             break
@@ -673,11 +659,7 @@ export default class HlsPlayback extends HTML5Video {
             break
           default:
             Log.error('hlsjs: could not recover from error.', { evt, data })
-            formattedError = this.createError(error, {
-              useCodePrefix: false,
-            })
-            this.trigger(Events.PLAYBACK_ERROR, formattedError)
-            this.stop()
+            this.triggerError(error)
             break
         }
       } else {
@@ -686,11 +668,7 @@ export default class HlsPlayback extends HTML5Video {
           { evt, data },
         )
         // TODO
-        formattedError = this.createError(error, {
-          useCodePrefix: false,
-        })
-        this.trigger(Events.PLAYBACK_ERROR, formattedError)
-        this.stop()
+        this.triggerError(error)
       }
     } else {
       // Transforms HLSJS.ErrorDetails.KEY_LOAD_ERROR non-fatal error to
@@ -702,16 +680,11 @@ export default class HlsPlayback extends HTML5Video {
         this._keyIsDenied(data)
       ) {
         Log.error('hlsjs: could not load decrypt key.', { evt, data })
-        formattedError = this.createError(error, {
-          useCodePrefix: false,
-        })
-        this.trigger(Events.PLAYBACK_ERROR, formattedError)
-        this.stop()
+        this.triggerError(error)
 
         return
       }
 
-      error.level = PlayerError.Levels.WARN
       Log.warn('hlsjs: non-fatal error occurred', { evt, data })
     }
   }
@@ -1081,6 +1054,12 @@ export default class HlsPlayback extends HTML5Video {
   isSeekEnabled() {
     return this._playbackType === Playback.VOD || this.dvrEnabled
   }
+
+  private triggerError(error: PlaybackError) {
+    trace(`${T} triggerError`, { error })
+    this.trigger(Events.PLAYBACK_ERROR, error)
+    this.stop()
+  }
 }
 
 HlsPlayback.canPlay = function (resource: string, mimeType?: string): boolean {

package/src/utils/mediaSources.ts

@@ -1,4 +1,8 @@
-import type { PlayerMediaSource, PlayerMediaSourceDesc, TransportPreference } from '../types'
+import type {
+  PlayerMediaSource,
+  PlayerMediaSourceDesc,
+  TransportPreference,
+} from '../types'
 import { canPlayDash, canPlayHls } from '../playback/index.js'
 
 export type SourceVariants = {
@@ -8,10 +12,10 @@ export type SourceVariants = {
 }
 
 /**
- * 
+ *
  * @param sources
  * @deprecated
- * @returns 
+ * @returns
  */
 export function buildSourcesSet(sources: PlayerMediaSource[]): SourceVariants {
   const sv: SourceVariants = {
@@ -38,23 +42,29 @@ export function buildMediaSourcesList(
 ): PlayerMediaSourceDesc[] {
   const [preferred, rest] = sources.reduce(
     priorityTransport === 'dash' || priorityTransport === 'auto'
-    ? (acc: [PlayerMediaSourceDesc[], PlayerMediaSourceDesc[]], item: PlayerMediaSourceDesc) => {
-      if (canPlayDash(item.source, item.mimeType)) {
-        acc[0].push(item)
-      } else if (canPlayHls(item.source, item.mimeType)) {
-        acc[1].push(item)
-      }
-      return acc
-    }
-    : (acc: [PlayerMediaSourceDesc[], PlayerMediaSourceDesc[]], item: PlayerMediaSourceDesc) => {
-      if (canPlayHls(item.source, item.mimeType)) {
-        acc[0].push(item)
-      } else if (canPlayDash(item.source, item.mimeType)) {
-        acc[1].push(item)
-      }
-      return acc
-    },
-    [[], []]
+      ? (
+          acc: [PlayerMediaSourceDesc[], PlayerMediaSourceDesc[]],
+          item: PlayerMediaSourceDesc,
+        ) => {
+          if (canPlayDash(item.source, item.mimeType)) {
+            acc[0].push(item)
+          } else if (canPlayHls(item.source, item.mimeType)) {
+            acc[1].push(item)
+          }
+          return acc
+        }
+      : (
+          acc: [PlayerMediaSourceDesc[], PlayerMediaSourceDesc[]],
+          item: PlayerMediaSourceDesc,
+        ) => {
+          if (canPlayHls(item.source, item.mimeType)) {
+            acc[0].push(item)
+          } else if (canPlayDash(item.source, item.mimeType)) {
+            acc[1].push(item)
+          }
+          return acc
+        },
+    [[], []],
   )
   return preferred.concat(rest)
 }