I hope someone can help with this. I am getting the following error Uncaught TypeError: YT.Player is not a constructor when I am on one tab of about 5 on my page. I click on a button on the page, and it brings up a modal window from which I make a selection and upon the closing of the modal window in the console that error is shown.
What is frustrating is that using the same data with the same compile arguments as production, I cannot get this error to replicate itself in our Dev or Staging environments. The one difference is that our production servers sit behind a NetScaler. Could the NetScaler be the issue?
Below is my Video code.
<div class="videocontainer">
@if (!string.IsNullOrEmpty(video.VideoURL))
{
<script type="text/javascript">
var _gVideoTracked = false;
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
events: { 'onStateChange': onPlayerStateChange }
});
}
function onPlayerStateChange(event) {
switch (event.data) {
case 0:
break;
case 1:
if (!_gVideoTracked) {
BaGaTrack('Video Played', 'Played')
}
_gVideoTracked = true;
break;
case 2:
}
}
$(document).ready(function () {
$.getScript("https://www.youtube.com/iframe_api", function () {
player = new YT.Player('player', {
events: { 'onStateChange': onPlayerStateChange }
});
});
});
</script>
<iframe id="player" src="@video.VideoURL/?enablejsapi=1" allowfullscreen class="video"></iframe>
}
</div>