Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Code Block
languagejs
themeRDark
const createOneToOneParticipantView = function () {

    const participantDiv = createContainer(null);

    const audioDisplay = createContainer(participantDiv);

    const participantNicknameDisplay = createInfoDisplay(participantDiv, "Name: ")

    const videoPlayers = new Map();
    const audioElements = new Map();

    return {
        rootDiv: participantDiv,
        dispose: function () {
            for (const player of videoPlayers.values()) {
...
        },
        addVideoTrack: function    player.dispose(track); {
            }...
            videoPlayers.clear();},
        removeVideoTrack: function (track) {
 for (const element of audioElements.values()) {
      ...
        },
  element.remove();
      addVideoSource: function (remoteVideoTrack, track, onResize, muteHandler) }{
            audioElements.clear();...
        },
        addVideoTrackremoveVideoSource: function (track) {
            const player = createVideoPlayer(participantDiv);...
        },
        showVideoTrack: function (track) {
            videoPlayers..set(track.mid, player);
        },
        removeVideoTrackaddAudioTrack: function (track, audioTrack, show) {
            ...
  const player = videoPlayers.get(track.mid);
   },
        removeAudioTrack: iffunction (playertrack) {
            ...
     player.dispose();   },
        setNickname: function (userId, nickname) {
            }...
        },
        addVideoSourceupdateQuality: function (remoteVideoTrack, track, onResizequalityName, muteHandleravailable) {
            const player = videoPlayers.get(track.mid);...
            if (player) {},
        addQuality: function       player.setVideoSource(remoteVideoTrack, onResize, muteHandler);(track, qualityName, available, onQualityPick) {
            }...
        },
        removeVideoSourcepickQuality: function (track, qualityName) {
            const player = videoPlayers.get(track.mid);...
        }
    if (player) {
                player.removeVideoSource();}
}

10.1. Добавление видео дорожки

addVideoTrack() code

Code Block
languagejs
themeRDark
const createOneToOneParticipantView = function () {
    ...
            }return {
        },...
        showVideoTrackaddVideoTrack: function (track) {
            const player = videoPlayers.get(track.mid)createVideoPlayer(participantDiv);
            if (videoPlayers.set(track.mid, player) {;
        },
        ...
   player.showVideoTrack(track);
    }
}

10.2. Удаление видео дорожки

removeVideoTrack() code

Code Block
languagejs
themeRDark
const createOneToOneParticipantView = function () {
    ...
    return }{
        },...
        addAudioTrackremoveVideoTrack: function (track, audioTrack, show) {
            const streamplayer = new MediaStream(videoPlayers.get(track.mid);
            if stream.addTrack(audioTrackplayer); {
             const audioElement = documentplayer.createElementdispose("audio");
            if (!show) {
}
        },
        ...
     hideItem(audioElement);}
}

10.3. Добавление источника к видео элементу

addVideoSource() code

Code Block
languagejs
themeRDark
const createOneToOneParticipantView = function () {
    ...
    return {
   }
     ...
       audioElement.controls = "controls" addVideoSource: function (remoteVideoTrack, track, onResize, muteHandler) {
            const player = videoPlayers.get(track.mid);
            audioElement.muted = true;
if (player) {
             audioElement.autoplay = true;   player.setVideoSource(remoteVideoTrack, onResize, muteHandler);
            }
        },
        ...
    audioElement.onloadedmetadata}
}

10.4. Удаление источника из видео элемента

removeVideoSource() code

Code Block
languagejs
themeRDark
const createOneToOneParticipantView = function (e) {
    ...
    return {
        audioElement..play().then(.
        removeVideoSource: function (track) {
            const player = videoPlayers.get(track.mid);
            if (Browser().isSafariWebRTC() && Browser().isiOS())player) {
                player.removeVideoSource();
            }
        },
        ...
    }
}

10.5. Показать видео дорожку

showVideoTrack() code

Code Block
languagejs
themeRDark
const createOneToOneParticipantView = function () {
    ...
    return {
        ...
        showVideoTrack: function (track) {
            const player = videoPlayers.get(track.mid);
           console.warn("Audio track should be manually unmuted in iOS Safari");
 if (player) {
                player.showVideoTrack(track);
            }
 else {
      },
        ...
    }
}

10.6. Добавление аудио дорожки

addAudioTrack() code

Code Block
languagejs
themeRDark
const createOneToOneParticipantView = function () {
    audioElement.muted = false;...
    return {
        ...
        addAudioTrack: function (track, audioTrack, show) }{
            const stream = new }MediaStream();
            }stream.addTrack(audioTrack);
            const audioElement = audioElementsdocument.set(track.mid, audioElementcreateElement("audio");
            if audioDisplay.appendChild(audioElement!show); {
             audioElement.srcObject  = streamhideItem(audioElement);
            },
          removeAudioTrack: function (track) {
   audioElement.controls = "controls";
           const audioElement.muted = audioElements.get(track.mid)true;
            if (audioElement) {audioElement.autoplay = true;
            audioElement.onloadedmetadata = function  audioElement.remove(e); {
                audioElementsaudioElement.deleteplay(track.mid);).then(function () {
            }
        },
    if (Browser().isSafariWebRTC() && Browser().isiOS()) {
    setNickname: function (userId, nickname) {
            const additionalUserId = userId ? "#" + getShortUserId(userId) : "";
     console.warn("Audio track should be manually unmuted in iOS Safari");
        participantNicknameDisplay.innerText = "Name: " + nickname + additionalUserId;
     } else {
 },
        updateQuality: function (track, qualityName, available) {
          audioElement.muted = constfalse;
 player = videoPlayers.get(track.mid);
                if (player) {}
                player.updateQuality(qualityName, available});
            };
        },
        addQuality: function audioElements.set(track.mid, qualityName, available, onQualityPick) {audioElement);
            const player = videoPlayers.get(track.midaudioDisplay.appendChild(audioElement);
            if (player) {
audioElement.srcObject = stream;
        },
        ...
    player.addQuality(qualityName, available, onQualityPick);
   }
}

10.7. Удаление аудио дорожки

removeAudioTrack() code

Code Block
languagejs
themeRDark
const createOneToOneParticipantView = function () {
    ...
    return }{
        },...
        pickQualityremoveAudioTrack: function (track, qualityName) {
            const playeraudioElement = videoPlayersaudioElements.get(track.mid);
            if (playeraudioElement) {
                audioElement.remove();
                playeraudioElements.pickQualitydelete(qualityNametrack.mid);
            }
        },
        ...
    }
}