feat(FEC-11761): expose stream timed metadata - phase 2 (#512)

use `TimedMetadata` from core Change cuePointManager API's to use `TimedMetadata` instead of `VttCue` Solves FEC-11761 Depends on kaltura/playkit-js#623 Breaking Change for - kaltura/playkit-js-dual-screen#52 kaltura/playkit-js-kaltura-cuepoints#15
kaltura · Jan 12, 2022 · dea6cbb · dea6cbb
1 parent af593a8
commit dea6cbb
Show file tree

Hide file tree

Showing 7 changed files with 43 additions and 55 deletions.
diff --git a/flow-typed/interfaces/cue-point.js b/flow-typed/interfaces/cue-point.js
@@ -0,0 +1,6 @@
+declare interface CuePoint {
+  id: string;
+  startTime: number;
+  endTime: number;
+  metadata: any;
+}
diff --git a/src/common/cuepoint/cuepoint-manager.js b/src/common/cuepoint/cuepoint-manager.js
@@ -1,12 +1,6 @@
 //@flow
-import {FakeEvent, TextTrack, EventType, createTextTrackCue} from '@playkit-js/playkit-js';
-import {CUE_POINTS_TEXT_TRACK, CUE_POINT_KEY} from './cuepoint-type';
-
-interface CuePoint {
-  id: string;
-  startTime: number;
-  endTime: number;
-}
+import {FakeEvent, TextTrack, EventType, TimedMetadata, createTextTrackCue, createTimedMetadata} from '@playkit-js/playkit-js';
+const CUE_POINTS_TEXT_TRACK = 'CuePoints';
 
 export class CuePointManager {
   _player: KalturaPlayer;
@@ -25,40 +19,44 @@ export class CuePointManager {
   }
 
   _createTextTrackCue(data: CuePoint): TextTrackCue {
-    const {startTime, endTime, id} = data;
-    return createTextTrackCue({startTime, endTime, id, type: CUE_POINT_KEY, metadata: data});
+    const {startTime, endTime, id, metadata} = data;
+    return createTextTrackCue({startTime, endTime, id, type: TimedMetadata.TYPE.CUE_POINT, metadata});
   }
 
-  _cuesSorter(a: TextTrackCue, b: TextTrackCue): number {
+  _cuesSorter(a: CuePoint, b: CuePoint): number {
     return a.startTime - b.startTime;
   }
 
-  getAllCuePoints(): Array<TextTrackCue> {
+  getAllCuePoints(): Array<TimedMetadata> {
     const metadataTracks = this._getMetadataTracks();
-    return metadataTracks.reduce((cues, track) => cues.concat(...track.cues), []).sort(this._cuesSorter);
+    return metadataTracks
+      .reduce((cues, track) => cues.concat(Array.from(track.cues).map(cue => createTimedMetadata(cue))), [])
+      .sort(this._cuesSorter);
   }
 
-  getActiveCuePoints(): Array<TextTrackCue> {
+  getActiveCuePoints(): Array<TimedMetadata> {
     const metadataTracks = this._getMetadataTracks();
-    return metadataTracks.reduce((cues, track) => cues.concat(...track.activeCues), []).sort(this._cuesSorter);
+    return metadataTracks
+      .reduce((cues, track) => cues.concat(Array.from(track.activeCues).map(cue => createTimedMetadata(cue))), [])
+      .sort(this._cuesSorter);
   }
 
-  getCuePointById(id: string): ?TextTrackCue {
-    let cuePoint = null;
+  _getTextTrackCueById(id: string): ?TextTrackCue {
+    let cue = null;
     const metadataTracks = this._getMetadataTracks();
     metadataTracks.some(track => {
-      cuePoint = track.cues.getCueById(id);
-      return cuePoint;
+      cue = track.cues.getCueById(id);
+      return cue;
     });
-    return cuePoint;
+    return cue;
   }
 
-  removeCuePoint(cuePoint: TextTrackCue) {
+  _removeTextTrackCue(cue: TextTrackCue) {
     const metadataTracks = this._getMetadataTracks();
     metadataTracks.forEach(track => {
       try {
-        track.removeCue(cuePoint);
-      } catch (e) {
+        track.removeCue(cue);
+      } catch {
         // do nothing
       }
     });
@@ -69,31 +67,31 @@ export class CuePointManager {
       if (!this._textTrack) {
         this._addTextTrack();
       }
-      const newCuePoints: Array<TextTrackCue> = [];
+      const timedMetadataArr: Array<TimedMetadata> = [];
       data.forEach((cuePoint: CuePoint) => {
         const textTrackCue = this._createTextTrackCue(cuePoint);
-        const exisedCue = this.getCuePointById(textTrackCue.id);
+        const exisedCue = this._getTextTrackCueById(cuePoint.id);
         if (exisedCue) {
-          this.removeCuePoint(exisedCue);
+          this._removeTextTrackCue(exisedCue);
         }
         this._textTrack?.addCue(textTrackCue);
-        newCuePoints.push(textTrackCue);
+        timedMetadataArr.push(createTimedMetadata(textTrackCue));
       });
-      this._player.dispatchEvent(new FakeEvent(EventType.TIMED_METADATA_ADDED, {cues: newCuePoints}));
+      this._player.dispatchEvent(new FakeEvent(EventType.TIMED_METADATA_ADDED, {cues: timedMetadataArr}));
     });
   }
 
-  clearAllCuePoints() {
+  _clearAllTextTrackCues() {
     const metadataTracks = this._getMetadataTracks();
     metadataTracks.forEach(track => {
       while (track.cues.length) {
-        this.removeCuePoint(track.cues[0]);
+        this._removeTextTrackCue(track.cues[0]);
       }
     });
   }
 
   reset() {
-    this.clearAllCuePoints();
+    this._clearAllTextTrackCues();
   }
 
   destroy() {

diff --git a/src/common/cuepoint/cuepoint-type.js b/src/common/cuepoint/cuepoint-type.js
diff --git a/src/common/cuepoint/index.js b/src/common/cuepoint/index.js
diff --git a/src/index.js b/src/index.js
@@ -17,8 +17,6 @@ import {getPlayers, getPlayer} from './proxy';
 import {cast} from './common/cast';
 // Import playlist
 import {playlist} from './common/playlist';
-// Import cue-points
-import {cuepoint} from './common/cuepoint';
 
 // Import plugin framework
 import {Ad, AdBreak} from './common/ads';
@@ -50,7 +48,6 @@ export {
   setup,
   cast,
   playlist,
-  cuepoint,
   Ad,
   AdBreak,
   BasePlugin,

diff --git a/test/src/common/cuepoints/cuepoint-manager.spec.js b/test/src/common/cuepoints/cuepoint-manager.spec.js
@@ -57,11 +57,11 @@ describe('CuePointManager', () => {
       expect(player.cuePointManager.getAllCuePoints().length).eql(0);
       player.cuePointManager.addCuePoints(cuePoints);
       expect(player.cuePointManager.getAllCuePoints().length).eql(3);
-      const cuePoint = player.cuePointManager.getCuePointById('test-id-1');
+      const cuePoint = player.cuePointManager._getTextTrackCueById('test-id-1');
       expect(cuePoint.id).to.eql('test-id-1');
-      player.cuePointManager.removeCuePoint(cuePoint);
+      player.cuePointManager._removeTextTrackCue(cuePoint);
       expect(player.cuePointManager.getAllCuePoints().length).eql(2);
-      player.cuePointManager.clearAllCuePoints();
+      player.cuePointManager._clearAllTextTrackCues();
       expect(player.cuePointManager.getAllCuePoints().length).eql(0);
     });
   });

diff --git a/ts-typed/cue-point-manager.d.ts b/ts-typed/cue-point-manager.d.ts
@@ -1,16 +1,15 @@
+import {TimedMetadata} from '@playkit-js/playkit-js';
 declare namespace KalturaPlayerTypes {
   export interface CuePoint {
     id: string;
     startTime: number;
     endTime: number;
+    metadata: any;
   }
   export interface CuePointManager {
-    getAllCuePoints(): Array<VTTCue>;
-    getActiveCuePoints(): Array<VTTCue>;
-    getCuePointById(id: string): VTTCue;
-    removeCuePoint(cuePoint: VTTCue): void;
-    addCuePoints(cuePointData: Array<CuePoint & any>): void;
-    clearAllCuePoints(): void;
+    getAllCuePoints(): Array<TimedMetadata>;
+    getActiveCuePoints(): Array<TimedMetadata>;
+    addCuePoints(cuePointData: Array<CuePoint>): void;
     reset(): void;
     destroy(): void;
   }