-
Notifications
You must be signed in to change notification settings - Fork 51
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
* feat(FEV-1016): add cue-point manager * feat(FEV-1016): getAllCuePoints returns array * feat(FEV-1003): cover cue-point manager by unit tests * feat(FEV-1016): address PR comments * feat(FEV-1016): add context for constants * fix(FEC-11540): add reset and destroy methods to cue-point manager * fix(FEC-11540): add new types * fix(FEC-11540): address PR comments * fix(FEC-11540): address PR comments * fix(FEC-11540): define KalturaPlayer types as a global module * fix(FEC-11540): fix unit tests * fix(FEC-11540): use canary playkit-js Co-authored-by: Roy Bregman <48884909+RoyBregman@users.noreply.github.com>
- Loading branch information
1 parent
d68e890
commit 025059a
Showing
11 changed files
with
916 additions
and
701 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,82 @@ | ||
| //@flow | ||
| import {Cue, FakeEvent, TextTrack, EventType} from '@playkit-js/playkit-js'; | ||
| import {CUE_POINTS_TEXT_TRACK, CUE_POINT_KEY} from './cuepoint-type'; | ||
|
|
||
| interface CuePoint { | ||
| id: string; | ||
| startTime: number; | ||
| endTime: number; | ||
| } | ||
|
|
||
| export class CuePointManager { | ||
| _player: KalturaPlayer; | ||
| _textTrack: TextTrack | null = null; | ||
|
|
||
| constructor(player: KalturaPlayer) { | ||
| this._player = player; | ||
| } | ||
|
|
||
| _addTextTrack() { | ||
| this._textTrack = this._player.addTextTrack(TextTrack.KIND.METADATA, CUE_POINTS_TEXT_TRACK); | ||
| } | ||
|
|
||
| _createTextTrackCue(data: CuePoint): window.VTTCue | typeof Cue { | ||
| let cue = {}; | ||
| if (window.VTTCue) { | ||
| cue = new window.VTTCue(data.startTime, data.endTime, ''); | ||
| } else if (window.TextTrackCue) { | ||
| // IE11 support | ||
| cue = new Cue(data.startTime, data.endTime, ''); | ||
| } | ||
| const cueValue = {key: CUE_POINT_KEY, data}; | ||
| cue.id = data.id; | ||
| cue.value = cueValue; | ||
| return cue; | ||
| } | ||
|
|
||
| getAllCuePoints() { | ||
| return this._textTrack?.cues || []; | ||
| } | ||
|
|
||
| getCuePointById(id: string) { | ||
| return this._textTrack?.cues?.getCueById(id); | ||
| } | ||
|
|
||
| removeCuePoint(cuePoint: window.VTTCue | typeof Cue) { | ||
| this._textTrack?.removeCue(cuePoint); | ||
| } | ||
|
|
||
| addCuePoints(data: CuePoint[]) { | ||
| if (!this._textTrack) { | ||
| this._addTextTrack(); | ||
| } | ||
| const newCuePoints: window.VTTCue | typeof Cue = []; | ||
|
|
||
| data.forEach((cuePoint: CuePoint) => { | ||
| const textTrackCue = this._createTextTrackCue(cuePoint); | ||
| const exisedCue = this.getCuePointById(textTrackCue.id); | ||
| if (exisedCue) { | ||
| this.removeCuePoint(exisedCue); | ||
| } | ||
| this._textTrack?.addCue(textTrackCue); | ||
| newCuePoints.push(textTrackCue); | ||
| }); | ||
| this._player.dispatchEvent(new FakeEvent(EventType.TIMED_METADATA_ADDED, {cues: newCuePoints})); | ||
| } | ||
|
|
||
| clearAllCuePoints() { | ||
| if (this._textTrack && this._textTrack.cues.length) { | ||
| while (this._textTrack.cues.length) { | ||
| this.removeCuePoint(this._textTrack.cues[0]); | ||
| } | ||
| } | ||
| } | ||
|
|
||
| reset() { | ||
| this.clearAllCuePoints(); | ||
| } | ||
|
|
||
| destroy() { | ||
| this.reset(); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| // @flow | ||
| export const CUE_POINTS_TEXT_TRACK = 'CuePoints'; | ||
| export const CUE_POINT_KEY = 'CuePoint'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| // @flow | ||
| import {CUE_POINTS_TEXT_TRACK, CUE_POINT_KEY} from './cuepoint-type'; | ||
|
|
||
| const cuepoint = { | ||
| CUE_POINTS_TEXT_TRACK, | ||
| CUE_POINT_KEY | ||
| }; | ||
|
|
||
| export {cuepoint}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| import {expect} from 'chai'; | ||
| import SourcesConfig from '../../configs/sources'; | ||
| import {getConfigStructure} from '../../utils/test-utils'; | ||
| import {KalturaPlayer as Player} from '../../../../src/kaltura-player'; | ||
| import {CuePointManager} from '../../../../src/common/cuepoint/cuepoint-manager'; | ||
|
|
||
| describe('CuePointManager', () => { | ||
| let config, player, sandbox; | ||
|
|
||
| before(() => { | ||
| config = getConfigStructure(); | ||
| }); | ||
|
|
||
| beforeEach(() => { | ||
| player = new Player(config); | ||
| sandbox = sinon.createSandbox(); | ||
| }); | ||
|
|
||
| afterEach(() => { | ||
| player.destroy(); | ||
| sandbox.restore(); | ||
| }); | ||
|
|
||
| it('should get cue-point manager', function () { | ||
| expect(player.cuePointManager).instanceOf(CuePointManager); | ||
| }); | ||
|
|
||
| it('should create and add text-track', function () { | ||
| player.setMedia({sources: SourcesConfig.Mp4}); | ||
| expect(player.cuePointManager._textTrack).to.eql(null); | ||
| player.cuePointManager.addCuePoints([]); | ||
| expect(player.cuePointManager._textTrack).instanceOf(TextTrack); | ||
| }); | ||
|
|
||
| it('should add/get/remove/clear-all cue points', function () { | ||
| const cuePoints = [ | ||
| { | ||
| id: 'test-id-1', | ||
| startTime: 1, | ||
| endTime: 6 | ||
| }, | ||
| { | ||
| id: 'test-id-2', | ||
| startTime: 6, | ||
| endTime: 10 | ||
| }, | ||
| { | ||
| id: 'test-id-3', | ||
| startTime: 10, | ||
| endTime: 15 | ||
| } | ||
| ]; | ||
| player.setMedia({sources: SourcesConfig.Mp4}); | ||
| 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'); | ||
| expect(cuePoint.id).to.eql('test-id-1'); | ||
| player.cuePointManager.removeCuePoint(cuePoint); | ||
| expect(player.cuePointManager.getAllCuePoints().length).eql(2); | ||
| player.cuePointManager.clearAllCuePoints(); | ||
| expect(player.cuePointManager.getAllCuePoints().length).eql(0); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,56 +1,55 @@ | ||
| declare global { | ||
| const KalturaPlayer: { | ||
| providers:{ | ||
| RequestBuilder: any | ||
| ResponseTypes: any | ||
| }; | ||
| ui: { | ||
| EventType: Record<string, string>; | ||
| redux: { | ||
| connect: (...args: any) => any; | ||
| }; | ||
| reducers: Record<string, {actions: Record<string, unknown>[]}>; | ||
| createPortal: (children: any, domElement: HTMLElement) => void; | ||
| utils: { | ||
| getLogger: (name: string) => KalturaPlayerTypes.Logger; | ||
| bindActions(actions: Record<string, unknown>[]): (...args: any) => void; | ||
| }; | ||
| components: { | ||
| withPlayer: any; | ||
| Tooltip: any; | ||
| Icon: any; | ||
| IconType: any; | ||
| PLAYER_SIZE: Record<string, string>; | ||
| Remove: string, | ||
| Settings: { | ||
| displayName: string | ||
| } | ||
| }; | ||
| preactHooks: any; | ||
| preacti18n: any; | ||
| }; | ||
| core: { | ||
| EventType: Record<string, string>; | ||
| FakeEvent: any; | ||
| Error: any; | ||
| StateType: Record<string, string>; | ||
| registerPlugin(name: string, component: any): void; | ||
| BasePlugin: { | ||
| new (...args: any[]): KalturaPlayerTypes.BasePlugin; | ||
| declare module 'global' { | ||
| declare global { | ||
| const KalturaPlayer: { | ||
| providers: { | ||
| RequestBuilder: any; | ||
| ResponseTypes: any; | ||
| }; | ||
| BaseMiddleware: { | ||
| new (): KalturaPlayerTypes.BaseMiddleware; | ||
| ui: { | ||
| EventType: Record<string, string>; | ||
| redux: { | ||
| connect: (...args: any) => any; | ||
| }; | ||
| reducers: Record<string, {actions: Record<string, unknown>[]}>; | ||
| createPortal: (children: any, domElement: HTMLElement) => void; | ||
| utils: { | ||
| getLogger: (name: string) => KalturaPlayerTypes.Logger; | ||
| bindActions(actions: Record<string, unknown>[]): (...args: any) => void; | ||
| }; | ||
| components: { | ||
| withPlayer: any; | ||
| Tooltip: any; | ||
| Icon: any; | ||
| IconType: any; | ||
| PLAYER_SIZE: Record<string, string>; | ||
| Remove: string; | ||
| Settings: { | ||
| displayName: string; | ||
| }; | ||
| }; | ||
| preactHooks: any; | ||
| preacti18n: any; | ||
| }; | ||
| utils: { | ||
| Object: { | ||
| mergeDeep( | ||
| target: Record<string, any>, | ||
| ...sources: Record<string, any>[] | ||
| ); | ||
| core: { | ||
| EventType: Record<string, string>; | ||
| FakeEvent: any; | ||
| Error: any; | ||
| StateType: Record<string, string>; | ||
| registerPlugin(name: string, component: any): void; | ||
| BasePlugin: { | ||
| new (...args: any[]): KalturaPlayerTypes.BasePlugin; | ||
| }; | ||
| BaseMiddleware: { | ||
| new (): KalturaPlayerTypes.BaseMiddleware; | ||
| }; | ||
| utils: { | ||
| Object: { | ||
| mergeDeep(target: Record<string, any>, ...sources: Record<string, any>[]); | ||
| }; | ||
| }; | ||
| }; | ||
| getPlayer(targetId?: string): any; | ||
| setup(options: any): KalturaPlayer; | ||
| }; | ||
| getPlayer(targetId?: string): any; | ||
| setup(options: any): KalturaPlayer; | ||
| }; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters