0

I have a YouTube player that sits in a slide of a Bootstrap carousel that sits in a template (the below doesn't include the html for the carousel):

<script type="text/html> <div class="video-container" id="introVideoTmpl">
 <iframe width="640" height="480" src="//www.youtube.com/embed/Kn-7OlEVdNM?rel=0&enablejsapi=1" id="videoOne" frameborder="0" allowfullscreen></iframe>
</script>

I render this by making a JavaScript call:

renderPageOne = function(){
var introVideoTmpl= $("#introVideoTmpl").html();
$("#container").empty();
$("#container").append(_.template(introVideoTmpl, ""));
getPlayerOne();

getPlayerOne() generates an instance of the player:

function getPlayerOne() {
    playerOne = new YT.Player('videoOne', {});
}

This playerOne has a pauseVideo() method which I call when needed.

It works fine most of the times but sometimes, with low bandwith the API seems not to load properly and the pauseVideo() does not work.

How can I check that the API is loaded properly so that the video can be paused when necessary?

d4nyll
  • 11,811
  • 6
  • 54
  • 68
Arianule
  • 8,811
  • 45
  • 116
  • 174

1 Answers1

0

Manage to solve the problem.

Problem I think was that the youtube api didn't load properly on low bandwith so avoided it all together and used the function callPlayer instead.

YouTube iframe API: how do I control a iframe player that's already in the HTML?

Community
  • 1
  • 1
Arianule
  • 8,811
  • 45
  • 116
  • 174