#jquery #jquery-plugins #youtube-api
#jquery #jquery-плагины #youtube-api
Вопрос:
После того, как мое видео на YouTube закончится, я бы хотел вернуть видео в исходное состояние. Мне не нравится черный экран со ссылками в конце, и я бы также предпочел скрыть панель управления, которая, хотя и установлена на автоматическое скрытие, не скрывается при остановке видео. Возможно ли это с помощью
onPlayerEnded: function(){}, // when the player returns a state of ended
и
onStop: function(){}, // after the player is stopped
?
Имейте в виду, что это относится к объектной версии, а не к iframe. Tumblr (обычно) встраивает YouTube как flash, а не iframe.
Вы можете увидеть и пример здесь: http://syndex.me , который, кстати, уже успешно справляется с множеством задач, связанных с ограничением возможностей Tumblr для видео, с помощью чертовски приятного плагина tubeplayer. Теперь, если бы я только мог приукрасить / минимизировать конец видео! Большое спасибо.
Ответ №1:
Вы можете добиться этого с помощью JSAPI YouTube. Вместо того, чтобы ждать завершения работы проигрывателя, у меня был бы таймер, чтобы проверить, когда время воспроизведения проигрывателя достигло заданной продолжительности, таким образом, видео завершено, но это до того, как проигрыватель начнет выключаться. Затем вы просто возвращаетесь к 0 и делаете паузу, вот так:
var i = setInterval( checkPlayer, 100 );
function checkPlayer()
{
if ( player.getCurrentTime() >= player.getDuration() )
{
clearInterval( i );
player.seekTo( 0 );
player.pause();
}
}
И вот несколько рабочих кодов:
<div id="player"></div>
<script src="http://www.youtube.com/player_api"></script>
<script>
<!--
var player;
var int;
function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: 'u1zgFlCw8Aw',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
}
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING) {
int = setInterval(handleInterval, 100);
}
}
function handleInterval() {
if (player.getCurrentTime() >= player.getDuration()) {
player.pauseVideo();
player.seekTo(0);
}
}
-->
</script>
Комментарии:
1. Привет, Ахмед, я проверю это, когда вернусь к этой части сборки сайта и дам вам знать. Спасибо за ваше терпение.
Ответ №2:
Быстрым и грязным подходом было бы установить таймер интервала, который на 5 секунд длиннее, чем видео, а затем запустить onPlayerEnded по завершении интервала. Инициируйте интервал с помощью размытия или фокусировки, в основном какого-либо события мыши, которое люди, вероятно, будут делать.
$(".video").blur(function() {
$("#something").delay(30500).queue(function() {
// do something..
Если вы хотите получить полный контроль, вы можете использовать Javascript API YouTube с обратными вызовами и событиями.
http://code.google.com/apis/youtube/js_api_reference.html#SubscribingEvents
Комментарии:
1. Проблема с этим подходом заключается в том, что вам нужно полагаться на тайм-аут, а не смотреть, что делает видео. Например, это не удастся, если пользователь поставит видео на паузу.
Ответ №3:
У Ахмеда была правильная идея. Вы можете повторить это в плагине tubeplayer, используя метод onPlayerEnded, выполнив следующие действия:
onPlayerEnded: function(){
jQuery("#your-tubeplayer")
.tubeplayer("seek", 0)
.tubeplayer("pause");
}
Стоит отметить, что метод onStop является перехватчиком "триггера". Методы onPlayer [X] фактически вызываются проигрывателем, тогда как другие события onX используются для перехватов при вызове tubeplayer для выполнения желаемой операции.
W.r.t. скрытие панели управления: используете ли вы showControls: false? Насколько я могу судить, вы можете только установить, хотите ли вы показывать элементы управления во время создания экземпляра самого проигрывателя YouTube (и не можете изменить его на лету после этого).
Я протестировал вышеупомянутое исправление, и панель управления остается скрытой при использовании showControls: false.
Комментарии:
1. кроме того, теперь я замечаю, что параметр автоматического скрытия реализован не полностью. извините за это. я исправлю это, как только смогу