bigscreen-player 7.1.5 → 7.2.0

package/dist/esm/{msestrategy-f3c61ef4.js → msestrategy-41492b38.js}

@@ -1,5 +1,5 @@
-import { W as WindowTypes, U as Utils, D as DOMHelpers, b as LiveSupport, M as MediaState, a as DebugToolInstance, P as Plugins, c as MediaKinds, d as TimeUtils, e as DynamicWindowUtils } from './main-ef5f7b81.js';
 import { MediaPlayer } from 'dashjs/index_mediaplayerOnly';
+import { W as WindowTypes, U as Utils, D as DOMHelpers, b as LiveSupport, a as DebugToolInstance, M as MediaState, P as Plugins, c as MediaKinds, d as TimeUtils, e as DynamicWindowUtils } from './main-70e914fd.js';
 
 function filter(manifest, representationOptions) {
   const constantFps = representationOptions.constantFps;
@@ -162,6 +162,14 @@ function buildSourceAnchor(
   return wholeSeconds === 0 ? "" : `#t=${wholeSeconds}`
 }
 
+function convertTimeRangesToArray(ranges) {
+    const array = [];
+    for (let rangesSoFar = 0; rangesSoFar < ranges.length; rangesSoFar += 1) {
+        array.push([ranges.start(rangesSoFar), ranges.end(rangesSoFar)]);
+    }
+    return array;
+}
+
 function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD, customPlayerSettings) {
   let mediaPlayer;
   let mediaElement;
@@ -223,19 +231,44 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
     METRIC_ADDED: "metricAdded",
     METRIC_CHANGED: "metricChanged",
     STREAM_INITIALIZED: "streamInitialized",
+    QUOTA_EXCEEDED: "quotaExceeded",
   };
 
+  function onLoadedMetaData() {
+    DebugToolInstance.event("loadedmetadata", "MediaElement");
+    DebugToolInstance.dynamicMetric("ready-state", mediaElement.readyState);
+  }
+
+  function onLoadedData() {
+    DebugToolInstance.event("loadeddata", "MediaElement");
+    DebugToolInstance.dynamicMetric("ready-state", mediaElement.readyState);
+  }
+
+  function onPlay() {
+    DebugToolInstance.event("play", "MediaElement");
+    DebugToolInstance.dynamicMetric("paused", mediaElement.paused);
+  }
+
   function onPlaying() {
+    DebugToolInstance.event("playing", "MediaElement");
+    DebugToolInstance.dynamicMetric("ready-state", mediaElement.readyState);
+
+    getBufferedRanges().map(({ kind, buffered }) => DebugToolInstance.buffered(kind, buffered));
+
     isEnded = false;
     publishMediaState(MediaState.PLAYING);
   }
 
   function onPaused() {
+    DebugToolInstance.event("paused", "MediaElement");
+    DebugToolInstance.dynamicMetric("paused", mediaElement.paused);
+
     publishMediaState(MediaState.PAUSED);
   }
 
   function onBuffering() {
     isEnded = false;
+
     if (!isSeeking || !publishedSeekEvent) {
       publishMediaState(MediaState.WAITING);
       publishedSeekEvent = true;
@@ -243,8 +276,10 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
   }
 
   function onSeeked() {
+    DebugToolInstance.event("seeked", "MediaElement");
+    DebugToolInstance.dynamicMetric("seeking", mediaElement.seeking);
+
     isSeeking = false;
-    DebugToolInstance.info("Seeked Event");
 
     if (isPaused()) {
       if (windowType === WindowTypes.SLIDING) {
@@ -256,12 +291,38 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
     }
   }
 
+  function onSeeking() {
+    DebugToolInstance.event("seeking", "MediaElement");
+    DebugToolInstance.dynamicMetric("seeking", mediaElement.seeking);
+
+    onBuffering();
+  }
+
+  function onWaiting() {
+    DebugToolInstance.event("waiting", "MediaElement");
+    DebugToolInstance.dynamicMetric("ready-state", mediaElement.readyState);
+
+    getBufferedRanges().map(({ kind, buffered }) => DebugToolInstance.buffered(kind, buffered));
+
+    onBuffering();
+  }
+
   function onEnded() {
+    DebugToolInstance.event("ended", "MediaElement");
+    DebugToolInstance.dynamicMetric("ended", mediaElement.ended);
+
     isEnded = true;
+
     publishMediaState(MediaState.ENDED);
   }
 
+  function onRateChange() {
+    DebugToolInstance.dynamicMetric("playback-rate", mediaElement.playbackRate);
+  }
+
   function onTimeUpdate() {
+    DebugToolInstance.updateElementTime(mediaElement.currentTime);
+
     const currentMpdTimeSeconds =
       windowType === WindowTypes.SLIDING
         ? mediaPlayer.getDashMetrics().getCurrentDVRInfo(mediaKind)?.time
@@ -288,7 +349,8 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
     }
 
     if (event.error && event.error.message) {
-      DebugToolInstance.info(`MSE Error: ${event.error.message} Code: ${event.error.code}`);
+      DebugToolInstance.error(`${event.error.message} (code: ${event.error.code})`);
+
       lastError = event.error;
 
       // Don't raise an error on fragment download error
@@ -313,6 +375,14 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
     publishError(event.error);
   }
 
+  function onQuotaExceeded(event) {
+    // Note: criticalBufferLevel (Total buffered ranges * 0.8) is set BEFORE this event is triggered,
+    // therefore it should actually be `criticalBufferLevel * 1.25` to see what the buffer size was on the device when this happened.
+    const bufferLevel = event.criticalBufferLevel * 1.25;
+    DebugToolInstance.quotaExceeded(bufferLevel, event.quotaExceededTime);
+    Plugins.interface.onQuotaExceeded({ criticalBufferLevel: bufferLevel, quotaExceededTime: event.quotaExceededTime });
+  }
+
   function manifestDownloadError(mediaError) {
     const error = () => publishError(mediaError);
 
@@ -366,7 +436,7 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
         ? currentPlaybackBitrate(MediaKinds.VIDEO) + currentPlaybackBitrate(MediaKinds.AUDIO)
         : currentPlaybackBitrate(MediaKinds.AUDIO);
 
-    DebugToolInstance.keyValue({ key: "playback bitrate", value: `${playerMetadata.playbackBitrate} kbps` });
+    DebugToolInstance.dynamicMetric("bitrate", playerMetadata.playbackBitrate);
 
     Plugins.interface.onPlayerInfoUpdated({
       bufferLength: playerMetadata.bufferLength,
@@ -374,6 +444,21 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
     });
   }
 
+  function getBufferedRanges() {
+    if (mediaPlayer == null) {
+      return []
+    }
+
+    return mediaPlayer
+      .getActiveStream()
+      .getProcessors()
+      .filter((processor) => processor.getType() === "audio" || processor.getType() === "video")
+      .map((processor) => ({
+        kind: processor.getType(),
+        buffered: convertTimeRangesToArray(processor.getBuffer().getAllBufferRanges()),
+      }))
+  }
+
   function currentPlaybackBitrate(mediaKind) {
     const representationSwitch = mediaPlayer.getDashMetrics().getCurrentRepresentationSwitch(mediaKind);
     const representation = representationSwitch ? representationSwitch.to : "";
@@ -393,24 +478,24 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
   }
 
   function onQualityChangeRendered(event) {
-    function logBitrate(mediaKind, event) {
-      const oldBitrate = isNaN(event.oldQuality)
-        ? "--"
-        : playbackBitrateForRepresentationIndex(event.oldQuality, mediaKind);
-      const oldRepresentation = isNaN(event.oldQuality) ? "Start" : `${event.oldQuality} (${oldBitrate} kbps)`;
-      const newRepresentation = `${event.newQuality} (${playbackBitrateForRepresentationIndex(
-        event.newQuality,
-        mediaKind
-      )} kbps)`;
-
-      DebugToolInstance.keyValue({ key: `${event.mediaType} Representation`, value: newRepresentation });
+    function logBitrate(event) {
+      const { mediaType, oldQuality, newQuality } = event;
+
+      const oldBitrate = isNaN(oldQuality) ? "--" : playbackBitrateForRepresentationIndex(oldQuality, mediaType);
+      const newBitrate = isNaN(newQuality) ? "--" : playbackBitrateForRepresentationIndex(newQuality, mediaType);
+
+      const oldRepresentation = isNaN(oldQuality) ? "Start" : `${oldQuality} (${oldBitrate} kbps)`;
+      const newRepresentation = `${newQuality} (${newBitrate} kbps)`;
+
+      DebugToolInstance.dynamicMetric(`representation-${mediaType}`, [newQuality, newBitrate]);
+
       DebugToolInstance.info(
-        `${mediaKind} ABR Change Rendered From Representation ${oldRepresentation} To ${newRepresentation}`
+        `${mediaType} ABR Change Rendered From Representation ${oldRepresentation} To ${newRepresentation}`
       );
     }
 
     if (event.newQuality !== undefined) {
-      logBitrate(event.mediaType, event);
+      logBitrate(event);
     }
 
     emitPlayerInfo();
@@ -448,14 +533,14 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
 
   function onMetricAdded(event) {
     if (event.mediaType === "video" && event.metric === "DroppedFrames") {
-      DebugToolInstance.keyValue({ key: "Dropped Frames", value: event.value.droppedFrames });
+      DebugToolInstance.staticMetric("frames-dropped", event.value.droppedFrames);
     }
     if (event.mediaType === mediaKind && event.metric === "BufferLevel") {
       dashMetrics = mediaPlayer.getDashMetrics();
 
       if (dashMetrics) {
         playerMetadata.bufferLength = dashMetrics.getCurrentBufferLevel(event.mediaType);
-        DebugToolInstance.keyValue({ key: "Buffer Length", value: playerMetadata.bufferLength });
+        DebugToolInstance.staticMetric("buffer-length", playerMetadata.bufferLength);
         Plugins.interface.onPlayerInfoUpdated({
           bufferLength: playerMetadata.bufferLength,
           playbackBitrate: playerMetadata.playbackBitrate,
@@ -465,7 +550,7 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
   }
 
   function onDebugLog(event) {
-    DebugToolInstance.verbose(event.message);
+    DebugToolInstance.debug(event.message);
   }
 
   function publishMediaState(mediaState) {
@@ -495,13 +580,13 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
   }
 
   function load(mimeType, playbackTime) {
-    if (!mediaPlayer) {
+    if (mediaPlayer) {
+      modifySource(refreshFailoverTime || failoverTime, failoverZeroPoint);
+    } else {
       failoverTime = playbackTime;
       setUpMediaElement(playbackElement);
       setUpMediaPlayer(playbackTime);
       setUpMediaListeners();
-    } else {
-      modifySource(refreshFailoverTime || failoverTime, failoverZeroPoint);
     }
   }
 
@@ -533,13 +618,23 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
   }
 
   function setUpMediaListeners() {
+    DebugToolInstance.dynamicMetric("ended", mediaElement.ended);
+    DebugToolInstance.dynamicMetric("paused", mediaElement.paused);
+    DebugToolInstance.dynamicMetric("playback-rate", mediaElement.playbackRate);
+    DebugToolInstance.dynamicMetric("ready-state", mediaElement.readyState);
+    DebugToolInstance.dynamicMetric("seeking", mediaElement.seeking);
+
     mediaElement.addEventListener("timeupdate", onTimeUpdate);
+    mediaElement.addEventListener("loadedmetadata", onLoadedMetaData);
+    mediaElement.addEventListener("loadeddata", onLoadedData);
+    mediaElement.addEventListener("play", onPlay);
     mediaElement.addEventListener("playing", onPlaying);
     mediaElement.addEventListener("pause", onPaused);
-    mediaElement.addEventListener("waiting", onBuffering);
-    mediaElement.addEventListener("seeking", onBuffering);
+    mediaElement.addEventListener("waiting", onWaiting);
+    mediaElement.addEventListener("seeking", onSeeking);
     mediaElement.addEventListener("seeked", onSeeked);
     mediaElement.addEventListener("ended", onEnded);
+    mediaElement.addEventListener("ratechange", onRateChange);
     mediaPlayer.on(DashJSEvents.ERROR, onError);
     mediaPlayer.on(DashJSEvents.MANIFEST_LOADED, onManifestLoaded);
     mediaPlayer.on(DashJSEvents.STREAM_INITIALIZED, onStreamInitialised);
@@ -550,6 +645,7 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
     mediaPlayer.on(DashJSEvents.LOG, onDebugLog);
     mediaPlayer.on(DashJSEvents.SERVICE_LOCATION_AVAILABLE, onServiceLocationAvailable);
     mediaPlayer.on(DashJSEvents.URL_RESOLUTION_FAILED, onURLResolutionFailed);
+    mediaPlayer.on(DashJSEvents.QUOTA_EXCEEDED, onQuotaExceeded);
   }
 
   function getSeekableRange() {
@@ -582,13 +678,13 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
 
     mediaPlayer.refreshManifest((manifest) => {
       const mediaPresentationDuration = manifest && manifest.mediaPresentationDuration;
-      if (!isNaN(mediaPresentationDuration)) {
+      if (isNaN(mediaPresentationDuration)) {
+        mediaPlayer.seek(seekToTime);
+      } else {
         DebugToolInstance.info("Stream ended. Clamping seek point to end of stream");
         mediaPlayer.seek(
           getClampedTime(seekToTime, { start: getSeekableRange().start, end: mediaPresentationDuration })
         );
-      } else {
-        mediaPlayer.seek(seekToTime);
       }
     });
   }
@@ -658,12 +754,16 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
       mediaPlayer.reset();
 
       mediaElement.removeEventListener("timeupdate", onTimeUpdate);
+      mediaElement.removeEventListener("loadedmetadata", onLoadedMetaData);
+      mediaElement.removeEventListener("loadeddata", onLoadedData);
+      mediaElement.removeEventListener("play", onPlay);
       mediaElement.removeEventListener("playing", onPlaying);
       mediaElement.removeEventListener("pause", onPaused);
-      mediaElement.removeEventListener("waiting", onBuffering);
-      mediaElement.removeEventListener("seeking", onBuffering);
+      mediaElement.removeEventListener("waiting", onWaiting);
+      mediaElement.removeEventListener("seeking", onSeeking);
       mediaElement.removeEventListener("seeked", onSeeked);
       mediaElement.removeEventListener("ended", onEnded);
+      mediaElement.removeEventListener("ratechange", onRateChange);
       mediaPlayer.off(DashJSEvents.ERROR, onError);
       mediaPlayer.off(DashJSEvents.MANIFEST_LOADED, onManifestLoaded);
       mediaPlayer.off(DashJSEvents.MANIFEST_VALIDITY_CHANGED, onManifestValidityChange);
@@ -674,6 +774,7 @@ function MSEStrategy(mediaSources, windowType, mediaKind, playbackElement, isUHD
       mediaPlayer.off(DashJSEvents.LOG, onDebugLog);
       mediaPlayer.off(DashJSEvents.SERVICE_LOCATION_AVAILABLE, onServiceLocationAvailable);
       mediaPlayer.off(DashJSEvents.URL_RESOLUTION_FAILED, onURLResolutionFailed);
+      mediaPlayer.off(DashJSEvents.QUOTA_EXCEEDED, onQuotaExceeded);
 
       DOMHelpers.safeRemoveElement(mediaElement);
 

package/package.json

@@ -1,57 +1,66 @@
 {
   "name": "bigscreen-player",
-  "version": "7.1.5",
+  "version": "7.2.0",
+  "type": "module",
   "description": "Simplified media playback for bigscreen devices.",
   "main": "dist/esm/main.js",
   "browser": "dist/esm/main.js",
   "module": "dist/esm/main.js",
-  "type": "module",
+  "types": "dist/esm/main.d.ts",
   "files": [
     "dist",
     "CONTRIBUTING.md"
   ],
   "scripts": {
-    "prepare": "[ ! -d dist/ ] && npm run build || exit 0",
-    "postinstall": "[ -d .git/ ] && husky install || exit 0",
+    "prepare": "if [ ! -d dist/ ]; then npm run build; fi",
+    "postinstall": "if [ -d .git/ ]; then husky install; fi",
     "docs": "jsdoc -c jsdoc.conf.json",
-    "build": "npm run build:clean && npm run build:bundle",
-    "build:clean": "rm -rf dist",
-    "build:bundle": "rollup -c rollup.config.js",
-    "watch": "rollup -c rollup.config.js -w",
-    "start": "rollup -c rollup.dev.config.js -w",
+    "build": "npm run build:clean && npm run build:bundle && npm run build:tmp",
+    "build:clean": "rm -rf dist/*",
+    "build:bundle": "rollup --config rollup.config.js",
+    "build:tmp": "rm -r dist/esm/__tmp",
+    "watch": "rollup --watch --config rollup.config.js",
+    "start": "rollup --watch --config rollup.dev.config.js",
     "test": "jest",
     "coverage": "jest --coverage",
     "lint": "eslint ."
   },
   "devDependencies": {
-    "@babel/core": "^7.16.12",
-    "@babel/eslint-parser": "^7.14.7",
-    "@babel/preset-env": "^7.16.11",
-    "@rollup/plugin-alias": "^3.1.4",
-    "@rollup/plugin-babel": "^5.3.0",
-    "@rollup/plugin-commonjs": "^16.0.0",
-    "@rollup/plugin-inject": "^4.0.2",
-    "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^13.0.4",
-    "babel-jest": "^27.0.6",
+    "@babel/core": "^7.23.7",
+    "@babel/plugin-transform-runtime": "^7.23.9",
+    "@babel/preset-env": "^7.23.8",
+    "@babel/preset-typescript": "^7.23.3",
+    "@rollup/plugin-alias": "^5.1.0",
+    "@rollup/plugin-babel": "^6.0.4",
+    "@rollup/plugin-commonjs": "^25.0.7",
+    "@rollup/plugin-inject": "^5.0.5",
+    "@rollup/plugin-json": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-replace": "^5.0.5",
+    "@rollup/plugin-typescript": "^11.1.6",
+    "@types/jest": "^29.5.11",
+    "babel-jest": "^29.7.0",
+    "better-docs": "^2.7.3",
     "clean-jsdoc-theme": "^4.2.7",
-    "eslint": "^8.27.0",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-jest": "^27.1.4",
-    "eslint-plugin-json": "^3.1.0",
-    "eslint-plugin-sonarjs": "^0.16.0",
-    "eslint-plugin-unicorn": "^49.0.0",
+    "eslint": "^8.57.0",
+    "eslint-plugin-jest": "^27.9.0",
+    "eslint-plugin-sonarjs": "^0.23.0",
+    "eslint-plugin-unicorn": "^50.0.1",
     "husky": "^8.0.3",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
     "jsdoc": "^4.0.2",
-    "prettier": "^2.7.1",
-    "rollup": "^2.54.0",
+    "prettier": "^3.1.1",
+    "rollup": "^3.29.4",
+    "rollup-plugin-dts": "^6.1.0",
     "rollup-plugin-livereload": "^2.0.5",
-    "rollup-plugin-polyfill-node": "^0.7.0",
+    "rollup-plugin-polyfill-node": "^0.13.0",
     "rollup-plugin-serve": "^1.1.0",
-    "rollup-plugin-terser": "^7.0.2",
-    "rollup-plugin-visualizer": "^5.5.2"
+    "rollup-plugin-visualizer": "^5.5.2",
+    "ts-jest": "^29.1.1",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.3.3",
+    "typescript-eslint": "^7.2.0"
   },
   "dependencies": {
     "dashjs": "github:bbc/dash.js#smp-v3.2.0-8",