# Player API Методы: [events](#events) | [calls](#calls) ## events *События плеера* Boomstream Player генерирует события, которые вы можете перехватывать на странице с помощью JavaScript. Плеер генерирует следующие события: * **loaded** — iframe плеера загружен и готов к получению действий. * **play** — когда плеер начинает воспроизведение видео. * **pause** — когда пользователь ставит видео на паузу. * **stop** — когда плеер заканчивает воспроизведение видео. * **time** — периодическое событие, отправляющее текущую позицию видео. * **event** — JavaScript-событие. * **progress** — когда пользователь или плеер изменяет точку на шкале прогресса. * **fullScreen** — когда изменяется полноэкранный режим. > **Примечание:** Вы можете передать параметр `use_fullscreen_mode=0`, чтобы отключить вход в полноэкранный режим (работают только события и переключение кнопки). Пример: `https://play.boomstream.com/VCcNtuiw?use_fullscreen_mode=0` ### Интеграция Добавьте следующий JavaScript-код на страницу, где находится Boomstream Player: ```javascript window.addEventListener('message', receiveMessage, false); function receiveMessage(event) { if (event.origin !== "https://play.boomstream.com") { return; } // Ваш код здесь } ``` Данные события будут находиться в объекте `event` в поле `data`. **Возможные свойства поля:** * **method** — имя события (loaded, play, pause, stop, time, event, fullScreen, progress). * **code** — код видео. * **time** — текущая позиция видео. Доступно для событий: loaded, play, pause, stop, time. * **duration** — длительность видео. Доступно для событий: loaded, play, pause, stop, time. * **event** — тип JavaScript-события из iframe (работает, когда method равно 'event' или 'fullScreen'). * Если method равно 'event', может быть: `window.onfocus`, `window.onblur` * Если method равно 'fullScreen', может быть: `requestFullscreen`, `exitFullscreen` * Если method равно 'progress', может быть: `change` ## calls *Вызовы действий* Существует система обмена сообщениями JavaScript API (postMessage) для управления плеером Boomstream вне iframe (для использования внешних кнопок на сайте). Действия, которые можно передать в плеер: * **play** — начать воспроизведение. * **pause** — поставить на паузу. * **seek** — перейти к указанному моменту времени (время указывается в процентах %). * **mute** — отключить звук. * **unmute** — включить звук. * **volume** — установить громкость (громкость указывается в процентах). * **useLastTime** — начать воспроизведение с последнего времени. * **previous** — переключиться на предыдущее видео в плейлисте. * **next** — переключиться на следующее видео в плейлисте. * **fullScreen** — переключить полноэкранный режим. * **toggleFullScreenButtonState** — переключить состояние кнопки полноэкранного режима без самого действия (варианты значения: 'requestFullscreen', 'exitFullscreen'). ### Интеграция Используйте этот HTML-код для отправки действий в плеер: ```html Пример плеера во фрейме
``` Вы можете попробовать демо по ссылке: `https://play.boomstream.com/test/frame.html` > **Важно:** Код iframe должен содержать параметр: `allow="autoplay; fullscreen"` Для отправки действий в плеер вы можете использовать JavaScript API (postMessage). Примеры: ```javascript let frame = document.querySelector("iframe"); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'play', data: ''}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'pause', data: ''}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'seek', data: '10'}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'mute', data: ''}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'unmute', data: ''}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'volume', data: '50'}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'useLastTime', data: ''}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'previous', data: ''}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'next', data: ''}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'fullScreen', data: ''}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'toggleFullScreenButtonState', data: ''}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'toggleFullScreenButtonState', data: 'exitFullscreen'}, '*'); frame.contentWindow.postMessage({code: 'MEDIA_CODE', method: 'action', action: 'toggleFullScreenButtonState', data: 'requestFullscreen'}, '*'); ```