fix(FEC-8588): large play button displayed for a sec before the next …

…item is playing (#168) use `autoplay` config for the second entry and onwards
kaltura · Nov 11, 2018 · 46a4c40 · 46a4c40
1 parent 6f020dc
commit 46a4c40
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 18 deletions.
diff --git a/samples/ovp/playlist-by-entry-list.html b/samples/ovp/playlist-by-entry-list.html
@@ -25,7 +25,7 @@
 
   try {
     var kalturaPlayer = KalturaPlayer.setup(config);
-    kalturaPlayer.loadPlaylistByEntryList({entries: ['0_nwkp7jtx', '0_wifqaipd', '0_nwkp7jtx'], options: {}});
+    kalturaPlayer.loadPlaylistByEntryList({entries: ['0_nwkp7jtx', '0_wifqaipd', '0_nwkp7jtx']});
   } catch (e) {
     console.error(e.message)
   }

diff --git a/src/common/playlist/playlist-manager.js b/src/common/playlist/playlist-manager.js
@@ -1,6 +1,6 @@
 // @flow
 import {KalturaPlayer} from '../../kaltura-player';
-import {FakeEvent, Utils} from '@playkit-js/playkit-js';
+import {FakeEvent, Utils, EventManager} from '@playkit-js/playkit-js';
 import {PlaylistEventType} from './playlist-event-type';
 import getLogger from '../utils/logger';
 import {Playlist} from './playlist';
@@ -10,13 +10,15 @@ class PlaylistManager {
   static _logger: any = getLogger('PlaylistManager');
 
   _player: KalturaPlayer;
+  _eventManager: EventManager;
   _playlist: Playlist;
   _playerOptions: KPOptionsObject;
   _options: KPPlaylistOptions;
   _countdown: KPPlaylistCountdownOptions;
 
   constructor(player: KalturaPlayer, options: KPOptionsObject) {
     this._player = player;
+    this._eventManager = new EventManager();
     this._playlist = new Playlist();
     this._options = {autoContinue: true};
     this._countdown = {duration: 10, showing: true};
@@ -30,18 +32,22 @@ class PlaylistManager {
       this._playlist.configure(config);
       Utils.Object.mergeDeep(this._options, config.options);
       Utils.Object.mergeDeep(this._countdown, config.countdown);
-      if (this._playlist.items.find(item => !!item.sources)) {
+      if (config.items && config.items.find(item => !!item.sources)) {
         this._player.dispatchEvent(new FakeEvent(PlaylistEventType.PLAYLIST_LOADED, {playlist: this._playlist}));
         const next = this._playlist.next;
         if (next.item) {
-          this._setItem(next.item, next.index);
+          this._setItem(next.item, next.index).then(() => {
+            this._eventManager.listenOnce(this._player, PlaylistEventType.PLAYLIST_ITEM_CHANGED, () => {
+              this._player.configure({playback: {autoplay: this._options.autoContinue}});
+            });
+          });
         }
       }
     }
   }
 
   addBindings() {
-    this._player.addEventListener(this._player.Event.Core.PLAYBACK_ENDED, () => this._onPlaybackEnded());
+    this._eventManager.listen(this._player, this._player.Event.Core.PLAYBACK_ENDED, () => this._onPlaybackEnded());
   }
 
   _onPlaybackEnded(): void {
@@ -73,29 +79,23 @@ class PlaylistManager {
     PlaylistManager._logger.debug('playNext');
     const next = this._playlist.next;
     if (next.item) {
-      this._setItem(next.item, next.index).then(() => {
-        this._player.play();
-      });
+      this._setItem(next.item, next.index);
     }
   }
 
   playPrev(): void {
     PlaylistManager._logger.debug('playPrev');
     const prev = this._playlist.prev;
     if (prev.item) {
-      this._setItem(prev.item, prev.index).then(() => {
-        this._player.play();
-      });
+      this._setItem(prev.item, prev.index);
     }
   }
 
   playItem(index: number): void {
     PlaylistManager._logger.debug(`playItem(${index})`);
     const item = this._playlist.items[index];
     if (item) {
-      this._setItem(item, index).then(() => {
-        this._player.play();
-      });
+      this._setItem(item, index);
     }
   }
 

diff --git a/src/kaltura-player.js b/src/kaltura-player.js
@@ -81,27 +81,27 @@ class KalturaPlayer extends FakeEventTarget {
     this.configure(playerConfig);
   }
 
-  loadPlaylist(playlistInfo: ProviderPlaylistInfoObject, playlistOptions: KPPlaylistConfigObject): Promise<*> {
+  loadPlaylist(playlistInfo: ProviderPlaylistInfoObject, playlistCustomConfig: KPPlaylistConfigObject): Promise<*> {
     this._logger.debug('loadPlaylist', playlistInfo);
     this._uiWrapper.setLoadingSpinnerState(true);
     this._playlistManager.reset();
     return this._provider
       .getPlaylistConfig(playlistInfo)
-      .then(playlistConfig => this._mergePlaylistConfigAndSet(playlistConfig, playlistOptions))
+      .then(playlistConfig => this._mergePlaylistConfigAndSet(playlistConfig, playlistCustomConfig))
       .catch(e =>
         this._localPlayer.dispatchEvent(
           new FakeEvent(CoreEventType.ERROR, new Error(Error.Severity.CRITICAL, Error.Category.PLAYER, Error.Code.LOAD_FAILED, e))
         )
       );
   }
 
-  loadPlaylistByEntryList(entryList: ProviderEntryListObject, playlistOptions: KPPlaylistConfigObject): Promise<*> {
+  loadPlaylistByEntryList(entryList: ProviderEntryListObject, playlistCustomConfig: KPPlaylistConfigObject): Promise<*> {
     this._logger.debug('loadPlaylistByEntryList', entryList);
     this._uiWrapper.setLoadingSpinnerState(true);
     this._playlistManager.reset();
     return this._provider
       .getEntryListConfig(entryList)
-      .then(playlistConfig => this._mergePlaylistConfigAndSet(playlistConfig, playlistOptions))
+      .then(playlistConfig => this._mergePlaylistConfigAndSet(playlistConfig, playlistCustomConfig))
       .catch(e =>
         this._localPlayer.dispatchEvent(
           new FakeEvent(CoreEventType.ERROR, new Error(Error.Severity.CRITICAL, Error.Category.PLAYER, Error.Code.LOAD_FAILED, e))