Javascript HTML5 player - Добавить остановку

0

В какой-то момент я построил плеер HTML5/jQuery, и, вернувшись к нему, у меня возник вопрос о том, что делать, когда источник звука больше не существует или песня закончена.

Итак, при использовании локального mp3 файла, например: "song.mp3", когда это заканчивается, есть ли способ сделать сам плеер сброшен и восстановить кнопку воспроизведения? Как и сейчас, игрок будет просто следовать инструкциям javascript и, насколько мне известно, потребует двух щелчков, чтобы снова запустить его, потому что это логично.

Или, если вы используете удаленный источник, такой как поток SHOUTcast (http://somedomain.com:8000/;stream.nsv), если или когда этот источник падает (из-за проблемы с потоковой передачей или из-за того, что источник фактически отключен (например, в трансляции SHOUTcast)), есть ли способ попытаться снова подключиться, и если он не через 5 или 10 секунд, скажем, мы могли бы сбросить плеер?

Это чисто любопытство - я еще ничего не попробовал. Но, если это может быть сделано, то это будет для человека, который помогает мне, потому что это может быть здорово, если это произойдет.

Живой просмотр рабочего игрока здесь: http://www.dominicharrison.co.uk/projects/audio-player/original

Обратите внимание, что звук воспроизводится при загрузке!

Код JS:

/* Coded and designed by D Harrison */
$(document).ready(function(){

    var audioPlayer = document.getElementById("audio-player");
    //var audioSrc =  'http://habbcrazy.net:8000/;stream.nsv';
    var audioSrc =  'song.mp3';
    var prevValue = '0';

    audioPlayer.src = audioSrc;
    audioPlayer.play();


$("#play").click(function(){

        if (audioPlayer.paused) {
               audioPlayer.src = audioSrc;
               $("#slider").slider('value', $("#slider").slider('value') + prevValue);
               audioPlayer.play();
               prevValue = '0';
            }   
            else {
               audioPlayer.pause();
               audioPlayer.src ='';
               prevValue = $("#slider").slider('value');
               $("#slider").slider('value', $("#slider").slider('value') - 100);
            }

            $(this).toggleClass('inactive'); 
            return false;
        })

        $("#slider").slider(
        {   value: 75,
            step: 0.1,
            range: 'min',
            min: 0,
            max: 100,
            slide: function(){
                var value = $("#slider").slider('value');
                audioPlayer.volume = (value / 100);
                $( "#amount" ).text($( "#slider" ).slider( "value") + '%');
            },
            change: function(){
                var value = $("#slider").slider('value');
                audioPlayer.volume = (value / 100);
                $( "#amount" ).text($( "#slider" ).slider( "value") + '%');
            },
            animate: true
})
})
Теги:
audio

1 ответ

0

Итак, при использовании локального mp3 файла, например: "song.mp3", когда это заканчивается, есть ли способ сделать сам плеер сброшен и восстановить кнопку воспроизведения? Как и сейчас, игрок будет просто следовать инструкциям javascript и, насколько мне известно, потребует двух щелчков, чтобы снова запустить его, потому что это логично.

Вы можете поместить обработчик в "завершенное" событие. В jQuery это будет:

$(audio).on("ended",function(){
  //reset audio track and play button here
}

Или, если вы используете удаленный источник, такой как поток SHOUTcast (http://somedomain.com:8000/;stream.nsv), если или когда этот источник падает (из-за проблемы с потоковой передачей или из-за того, что источник фактически отключен (например, в трансляции SHOUTcast)), есть ли способ попытаться снова подключиться, и если он не через 5 или 10 секунд, скажем, мы могли бы сбросить плеер?

Там есть другие звуковые события. Я не использовал их всех, но тестировал "ожидание" или "прогресс" или что-то в этом роде. Аудио-видео-события HTML

  • 0
    Ах, гениально. Спасибо! Осмотрит и доложит!
  • 0
    @futureslay ты решил это?

Ещё вопросы

Сообщество Overcoder
Наверх
Меню