Improved video appearance

This commit is contained in:
Pierre HUBERT 2019-01-25 19:03:00 +01:00
parent 45a4f552e8
commit 154f1b98ef
2 changed files with 22 additions and 6 deletions

View File

@ -7,7 +7,6 @@
.call-window { .call-window {
background-color: white; background-color: white;
width: 300px; width: 300px;
height: 300px;
position: fixed; position: fixed;
top: 100px; top: 100px;
right: 10px; right: 10px;
@ -46,7 +45,7 @@
/** /**
* Loading message * Loading message
*/ */
.loading-message-container { .loading-message-container {
position: absolute; position: absolute;
min-height: 110px; min-height: 110px;
width: 100%; width: 100%;
@ -58,3 +57,17 @@
font-size: 150%; font-size: 150%;
color: white; color: white;
} }
/**
* Stream target
*/
.call-window .streams-target {
display: flex;
flex-wrap: wrap;
flex-direction: row;
}
.call-window .streams-target video {
width: 149px;
}

View File

@ -151,7 +151,7 @@ ComunicWeb.components.calls.callWindow = {
* Create loading message area * Create loading message area
*/ */
call.window.loadingMessageContainer = createElem2({ call.window.loadingMessageContainer = createElem2({
appendTo: call.window.body, insertBefore: call.window.body.firstChild,
type: "div", type: "div",
class: "loading-message-container", class: "loading-message-container",
innerHTML: "<i class='fa fa-clock-o'></i>" innerHTML: "<i class='fa fa-clock-o'></i>"
@ -196,14 +196,17 @@ ComunicWeb.components.calls.callWindow = {
if(!call.open) if(!call.open)
return; return;
//Mark as connecting
call.setLoadingMessage("Connecting...");
call.localStream = stream; call.localStream = stream;
//Initialize signaling server connection //Initialize signaling server connection
ComunicWeb.components.calls.callWindow.initializeConnectionToSignalingServer(call); ComunicWeb.components.calls.callWindow.initializeConnectionToSignalingServer(call);
//Add local stream to the list of visible stream
ComunicWeb.components.calls.callWindow.addVideoStream(call, true, stream);
//Mark as connecting
call.setLoadingMessage("Connecting...");
return true; return true;
}).catch(function(e){ }).catch(function(e){