var $videos = { 'homepage1' : null, 'homepage2' : null, 'homepage3' : null, 'homepage4' : null };
    
$(document).ready(function(){
  var $slot = $('#gyVideoJSCarousel');
  
  $('.video-wrap', $slot).hide();

  showVid($('#controls a', $slot).first(), false);

  $('#controls a', $slot).click(function() {
    $('#controls a', $slot).removeClass('selected');
    $('.video-wrap', $slot).hide();
    stopAll();
    showVid(this, true);

    return false;
  });
  
});

function showVid(control, play) {
  var $id = $(control).attr('class');
  $(control).addClass('selected');
  $('#' + $id).show();

  //if ($videos[$id] == null) $videos[$id] = VideoJS.setup("video_" + $id); // setup
  
  if ($videos[$id] == null) {  
    new MediaElementPlayer("#video_" + $id, {
        success: function (mediaElement, domObject) {
            $videos[$id] = mediaElement;
            if (play) {
                $videos[$id].play();
                // Safari isn't hiding correctly
                $('.mejs-overlay-play', '#'+$id).css('display', 'none');
            }
        }
    });
  }
  else if (play) {
      $videos[$id].play();
      // Safari isn't hiding correctly
      $('.mejs-overlay-play', '#'+$id).css('display', 'none');
  }
}

function stopAll() {
  for (var $id in $videos) {
    if ($videos[$id] != null) {
        $videos[$id].pause();
    }
  }
}
