Управління youtube плеєром через javascript

ініціалізація плеєра

Для початку нам потрібно створити блок замість якого буде довантажувати плеєр, а так само необхідно розмістити підключення YouTube API.

Після того як API буде повністю завантажено відбудеться виклик методу onYouTubeIframeAPIReady (). який повинен бути нами визначено. Всередині ми повинні створити об'єкт YouTube плеєра. Перший аргумент: ідентифікатор HTML елемента, де буде розміщуватися плеєр (в нашому випадку video-placeholder). Другий: об'єкт з наступними полями:

Повний код буде виглядати так:

Після того як плеєр буде повністю завантажений відбудеться виклик методу initialize (). Він запускає функціонал, який буде відпрацьовувати кожну секунду.

Зазначений нами функціонал буде здійснюватися в методі updateTimerDisplay (). яка буде викликатися кожну секунду. Далі ми звертаємося до методів API для отримання потрібної інформації.

Блок прогресу програвання

Тут нічого надприродного. Клепаємо дві кнопки, і відстежуємо кліки по ним.

управління звуком

Для включення / відключення звуку можемо створити спеціальну кнопку.

Якщо ми хочемо задати гучність у відсотках, то можемо взяти відповідне значення з поля і передати в метод setVolume (). Дане значення буде автоматично приведено в потрібний для методу тип, так що вам більше нема про що турбуватися.

Інші настройки плеєра

швидкість відтворення

У player.setPlaybackRate () можна передати одне з наступних значень:

створюємо елемент