...
1. Обертка для кода
createControls() code
Функция-обертка для вызова из основной логики, ограничивает область видимости
...
2. Создание объекта controls
Создание объекта controls, содержащего все HTML элементы для настройки. Здесь же инициализируются таблицы для настройки публикации дорожек.
...
3. Заполнение полей модального окна входа
Заполнение полей модального окна входа в соответствии с текущей конфигурацией
...
4. Добавление новых аудио дорожек в объект controls
addAudioTrackRow() code
Добавление новых аудиодорожек и оповещение основного модуля
...
Запрос локального медиа через WebRTC API
Code Block | ||||
---|---|---|---|---|
| ||||
getMedia([track]).then(function(stream){ |
Добавление аудио дорожки в таблицу дорожек
Code Block | ||||
---|---|---|---|---|
| ||||
let button = '<button id="' + stream.id + '-button" class="btn btn-primary">Delete</button>'; const row = controls.tables.audio.row.add({ source: track.source, channels: track.channels, action: button, stream: stream }).node(); controls.tables.audio.draw(); |
Подписка на событие "click". По нажатию кнопки "Delete" дорожка останавливается, генерируется событие "ended"
Code Block | ||||
---|---|---|---|---|
| ||||
$('#' + stream.id + "-button").on('click', function(){ //terminate stream console.log("terminate stream " + stream.id); let track = stream.getAudioTracks()[0]; track.stop(); track.dispatchEvent(new Event("ended")); }); |
Подписка на событие "ended" и очистка таблицы при получении данного события
Code Block | ||||
---|---|---|---|---|
| ||||
stream.getTracks()[0].onended = function() { controls.tables.audio.row(row).remove().draw(); } |
Оповещение основного модуля о том, что добавлена новая дорожка
Code Block | ||||
---|---|---|---|---|
| ||||
trackCallback({ stream: stream, encodings: track.encodings }); |
5. Добавление новых видео дорожек
addVideoTrackRow() code
Добавление новых видео дорожек и оповещение основного модуля, аналогично функции addAudioTrackRow.
...
6. Форматирование настроек кодирования видео
format() code
Вспомогательная функция форматирует настройки кодирования видео для их отображения в таблице
...
7. Добавление обработчика для отображения/скрытия данных дорожки
Добавление обработчика для тогтого, чтобы показать или спрятать данные видео дорожки
...
8. Добавление аудио дорожек в таблицу
Добавление всех настроенных аудио дорожек в таблицу
...
9. Добавление видео дорожек в таблицу
Добавление всех настроенных видео дорожек в таблицу
...
10. Отключение элементов формы
muteForm() code
Вспомогательная функция, отключающая все элементы указанной формы
...
11. Включение элементов формы
unmuteForm() code
Вспомогательная функция, включающая все элементы указанной формы
...
12. Отключение полей ввода модального окна входа
muteInput() code
Вспомогательная функция, отключающая поля ввода в модальном окне
...
13. Создание объекта конфигурации комнаты
roomConfig() code
Функция собирает объект конфигурации комнаты
...
14. Получение локальных видео дорожек
getVideoStreams() code
Функция возвращает все локальные видео дорожки
...
15. Получение локальных аудио дорожек
getAudioStreams() code
Функция возвращает все локальные аудио дорожки
...
16. Обработчик для добавления видео дорожки в таблицу
Подписка на событие "click" кнопки добавления дорожки. Функция добавляет новую дорожку в таблицу
...
17. Обработчик для удаления параметров кодирования видео из таблицы
Удаление параметров кодирования видео из таблицы
...
18. Обработчик для добавления параметров кодирования видео в таблицу
Добавление параметров кодирования видео в таблицу
Code Block | ||||
---|---|---|---|---|
| ||||
document.getElementById("addVideoTrackEncoding").addEventListener("click", function(){ let button = '<button class="btn btn-primary remove">Delete</button>'; controls.tables.encodings.row.add({ rid: controls.addVideoEncoding.rid.value, active: controls.addVideoEncoding.active.value, maxBitrate: controls.addVideoEncoding.maxBitrate.value, resolutionScale: controls.addVideoEncoding.resolutionScale.value, action: button }).draw(); }); |
19.
...
Обработчик для добавления
...
аудио дорожки в таблицу
Подписка на событие "click" кнопки добавления дорожки. Функция добавляет новую дорожку в таблицу
...
20. Передача callback функции новым дорожкам
Функция передает указанную callback функцию новым дорожкам
Code Block | ||||
---|---|---|---|---|
| ||||
const onTrack = function(callback) { trackCallback = callback; } |
21. Экпорт функций
Экспорт функций для использования в основном модуле
...
22. Получение медиа потоков из WebRTC API
getMedia() code
Запрос списка локальных медиа потоков от WebRTC API
...