mirror of
https://github.com/pierre42100/ComunicWeb
synced 2024-11-22 20:19:21 +00:00
Improve videos appearance
This commit is contained in:
parent
14c85b194e
commit
a4d7eb9903
@ -69,11 +69,18 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.call-window .videos-area video {
|
.call-window .videos-area .video {
|
||||||
flex-shrink: 1;
|
flex-shrink: 1;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
max-height: 100%;
|
max-height: 100%;
|
||||||
max-width: 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 {
|
.call-window .window-bottom {
|
||||||
|
@ -365,6 +365,20 @@ class CallWindow extends CustomEvents {
|
|||||||
return this.membersArea.querySelector("[data-call-member-name-id=\""+userID+"\"]");
|
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
|
* Remove a member connection
|
||||||
*
|
*
|
||||||
@ -378,11 +392,7 @@ class CallWindow extends CustomEvents {
|
|||||||
|
|
||||||
// Remove video (if any)
|
// Remove video (if any)
|
||||||
if(this.videoEls.has(userID)) {
|
if(this.videoEls.has(userID)) {
|
||||||
const el = this.videoEls.get(userID);
|
this.removeVideoElement(userID)
|
||||||
this.videoEls.delete(userID)
|
|
||||||
|
|
||||||
el.pause()
|
|
||||||
el.remove()
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Remove peer connection (if any)
|
// Remove peer connection (if any)
|
||||||
@ -471,11 +481,17 @@ class CallWindow extends CustomEvents {
|
|||||||
|
|
||||||
// Remove any previous video stream
|
// Remove any previous video stream
|
||||||
if(this.videoEls.has(peerID)) {
|
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");
|
const videoEl = document.createElement(stream.getVideoTracks().length > 0 ? "video" : "audio");
|
||||||
this.videosArea.appendChild(videoEl)
|
videoContainer.appendChild(videoEl)
|
||||||
|
|
||||||
videoEl.muted = muted;
|
videoEl.muted = muted;
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user