brandly / angular-youtube-embed

:tv: Embed a YouTube player with a simple directive
http://brandly.github.io/angular-youtube-embed/
MIT License
510 stars 147 forks source link

play only one video in the page #138

Closed Mahmoud85 closed 8 years ago

Mahmoud85 commented 8 years ago

Hello guys, Im using ionic and cordova with the youtube api and this great plugin to display multiple videos from a youtube channel using the api search function , my problem is that I need to play only one video, so when I play a video then play another , the first one should pause , any Ideas how to do that ?

brandly commented 8 years ago

hey! it sounds like you could listen for events, like youtube.player.playing, and then pause all other players.

i haven't actually tried to run this code, but it should point you in the right direction:

$scope.players = []

$scope.$on('youtube.player.ready', function ($event, player) {
  // Keep track of a list of players.
  $scope.players.push(player)
})

// When one player begins playing...
$scope.$on('youtube.player.playing', function ($event, primaryPlayer) {
  // pause all the others.
  $scope.players.forEach(function (player) {
    if (player !== primaryPlayer) {
      player.pauseVideo()
    }
  })
})

hope this helps! ⭐️

sischnei commented 8 years ago

I just happend to have the same problem today and found your hint. It wasn't working for me (all other videos went into an unplayable state), but this worked:

var currentPlayer;
$scope.$on('youtube.player.playing', function ($event, player) {
    if (currentPlayer !== undefined) {
        currentPlayer.pauseVideo();
    }
    currentPlayer = player;
});
Mahmoud85 commented 8 years ago

Thank you guys , sischnei's solution worked for me too, thanks alot

brandly commented 8 years ago

thanks for the help @sischnei! glad you got it working @Mahmoud85!

i'll close this issue