Airplay с пользовательскими элементами управления html5

кто-нибудь знает, есть ли способ заставить Airplay работать на видео html5, которое использует пользовательские элементы управления? Это важная часть, я понимаю, что вы можете просто добавить атрибут x-webkit-airplay="allow" к элементу, если вы используете встроенные элементы управления html5. Но мой видеоплеер использует настраиваемые элементы управления.

похоже, что Safari поместит кнопку Airplay на встроенные элементы управления html5, но есть ли способ сделать это, если я не использую встроенный контроль? Вот ссылка на html5-плеер, который я написал. Обратите внимание, что элементы управления внизу-мои собственные:

http://pluralsight.com/training/Player?author=keith-brown&name=aspdotnet-security&mode=live&clip=0&course=aspdotnet-security

спасибо!

6
airplay html5 html5-video safari

3 ответов

хорошие новости здесь! Эта функция была реализована в Safari 9.

Safari 9.0 позволяет создавать пользовательские элементы управления для носителей HTML5 с поддержкой JavaScript AirPlay. Используйте Safari WebKitPlaybackTargetAvailabilityEvent чтобы определить доступность Airplay, а затем добавить свои собственные элементы управления для потоковой передачи аудио и видео на устройства AirPlay.

Via. Что нового в Safari 9

вот пример HTML5 Видео и кнопка для Видеоповтор AirPlay

// Detect if AirPlay is available
// Mac OS Safari 9+ only
if (window.WebKitPlaybackTargetAvailabilityEvent) {
    video.addEventListener('webkitplaybacktargetavailabilitychanged', function(event) {
        switch (event.availability) {
            case "available":
                AirPlayButton.show();
                break;
            default:
                AirPlayButton.hide();
        }
        AirPlayButton.on('click', function() {
            video.webkitShowPlaybackTargetPicker();
        });
    });
}
9

к сожалению, Apple не реализовала вызовы событий JavaScript Airplay, это в основном потому, что при использовании AirPlay в вашем родном quicktime управления AirPlay запрашивает пользователя с рядом устройств AirPlay. В настоящее время нет конкретной реализации JS Safari для извлечения этих данных в вашем контенте и создания кнопок на основе того, что доступно.

по состоянию на февраль 2013 года, единственное, что вы можете указать для AirPlay в HTML5, это если вы хотите показать или не показать AirPlay контроли.

https://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/AirPlayGuide/OptingInorOutofAirPlay/OptingInorOutofAirPlay.html

вы можете подать ошибку с Apple, если это функция, которую вы хотели бы в будущих версиях: https://bugreport.apple.com/

надеюсь, что это помогает.

1

мы можем проверить webkitcurrentplaybacktargetiswirelesschanged событие, чтобы поймать выключить устройство airplay:

      this.on(videoEl, 'webkitcurrentplaybacktargetiswirelesschanged', this.checkWireles);
0