diff --git a/assets/css/components/calls/callWindow.css b/assets/css/components/calls/callWindow.css index f9415f84..ee080dbb 100644 --- a/assets/css/components/calls/callWindow.css +++ b/assets/css/components/calls/callWindow.css @@ -7,7 +7,6 @@ .call-window { background-color: white; width: 300px; - height: 300px; position: fixed; top: 100px; right: 10px; @@ -46,7 +45,7 @@ /** * Loading message */ - .loading-message-container { +.loading-message-container { position: absolute; min-height: 110px; width: 100%; @@ -57,4 +56,18 @@ text-align: center; font-size: 150%; color: white; +} + + +/** + * Stream target + */ +.call-window .streams-target { + display: flex; + flex-wrap: wrap; + flex-direction: row; +} + +.call-window .streams-target video { + width: 149px; } \ No newline at end of file diff --git a/assets/js/components/calls/callWindow.js b/assets/js/components/calls/callWindow.js index ac88c5c9..1d51a375 100644 --- a/assets/js/components/calls/callWindow.js +++ b/assets/js/components/calls/callWindow.js @@ -151,7 +151,7 @@ ComunicWeb.components.calls.callWindow = { * Create loading message area */ call.window.loadingMessageContainer = createElem2({ - appendTo: call.window.body, + insertBefore: call.window.body.firstChild, type: "div", class: "loading-message-container", innerHTML: "" @@ -196,14 +196,17 @@ ComunicWeb.components.calls.callWindow = { if(!call.open) return; - //Mark as connecting - call.setLoadingMessage("Connecting..."); - call.localStream = stream; //Initialize signaling server connection 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; }).catch(function(e){