Improve videos appearance

This commit is contained in:
Pierre HUBERT 2020-04-13 09:26:15 +02:00
parent 14c85b194e
commit a4d7eb9903
2 changed files with 31 additions and 8 deletions

View File

@ -69,11 +69,18 @@
justify-content: center;
}
.call-window .videos-area video {
.call-window .videos-area .video {
flex-shrink: 1;
flex: 1;
max-height: 100%;
max-width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.call-window .videos-area .video video {
max-width: 100%;
}
.call-window .window-bottom {

View File

@ -365,6 +365,20 @@ class CallWindow extends CustomEvents {
return this.membersArea.querySelector("[data-call-member-name-id=\""+userID+"\"]");
}
/**
* Remove the video element of a specific user
*
* @param {number} peerID Target peer ID
*/
removeVideoElement(peerID) {
const el = this.videoEls.get(peerID);
this.videoEls.delete(peerID)
el.pause()
el.parentNode.remove()
}
/**
* Remove a member connection
*
@ -378,11 +392,7 @@ class CallWindow extends CustomEvents {
// Remove video (if any)
if(this.videoEls.has(userID)) {
const el = this.videoEls.get(userID);
this.videoEls.delete(userID)
el.pause()
el.remove()
this.removeVideoElement(userID)
}
// Remove peer connection (if any)
@ -471,11 +481,17 @@ class CallWindow extends CustomEvents {
// Remove any previous video stream
if(this.videoEls.has(peerID)) {
this.videoEls.get(peerID).remove()
this.removeVideoElement(peerID)
}
const videoContainer = createElem2({
appendTo: this.videosArea,
type: "div",
class: "video"
})
const videoEl = document.createElement(stream.getVideoTracks().length > 0 ? "video" : "audio");
this.videosArea.appendChild(videoEl)
videoContainer.appendChild(videoEl)
videoEl.muted = muted;