From 29b5499b85a1913b2b8f6b01865237e2a40045a7 Mon Sep 17 00:00:00 2001 From: Pierre HUBERT Date: Fri, 25 Jan 2019 15:34:40 +0100 Subject: [PATCH] Created call window body --- assets/css/components/calls/callWindow.css | 36 +++++---- assets/js/components/calls/callWindow.js | 85 +++++++++++++--------- 2 files changed, 71 insertions(+), 50 deletions(-) diff --git a/assets/css/components/calls/callWindow.css b/assets/css/components/calls/callWindow.css index 013edba7..f9415f84 100644 --- a/assets/css/components/calls/callWindow.css +++ b/assets/css/components/calls/callWindow.css @@ -13,23 +13,12 @@ right: 10px; z-index: 100; border: 1px black solid; + display: flex; + flex-direction: column; } - -/** - * Loading message - */ -.loading-message-container { - position: absolute; - height: inherit; - width: inherit; - display: flex; - background: 1px #0009; - flex-direction: column; - justify-content: space-around; - text-align: center; - font-size: 150%; - color: white; +.call.window.body { + flex: 1; } @@ -51,4 +40,21 @@ .call-title { flex: 1; +} + + +/** + * Loading message + */ + .loading-message-container { + position: absolute; + min-height: 110px; + width: 100%; + display: flex; + background: 1px #0009; + flex-direction: column; + justify-content: space-around; + text-align: center; + font-size: 150%; + color: white; } \ No newline at end of file diff --git a/assets/js/components/calls/callWindow.js b/assets/js/components/calls/callWindow.js index 7db7b2c3..98013e0b 100644 --- a/assets/js/components/calls/callWindow.js +++ b/assets/js/components/calls/callWindow.js @@ -47,41 +47,6 @@ ComunicWeb.components.calls.callWindow = { call.window.container = callContainer; - //Create loading message area - call.window.loadingMessageContainer = createElem2({ - appendTo: callContainer, - type: "div", - class: "loading-message-container", - innerHTML: "" - }); - - call.window.loadingMessageContent = createElem2({ - appendTo: call.window.loadingMessageContainer, - type: "div", - class: "message", - innerHTML: "Loading..." - }); - - /** - * Set loading message visiblity - * - * @param {Boolean} visible TRUE to make it visible / FALSE else - */ - call.setLoadingMessageVisibility = function(visible){ - call.window.loadingMessageContainer.style.display = visible ? "flex" : "none"; - } - - /** - * Update call loading message - * - * @param {String} message The new message to show to the - * users - */ - call.setLoadingMessage = function(message){ - call.window.loadingMessageContent.innerHTML = message; - } - - //Add toolbar call.window.toolbar = createElem2({ appendTo: callContainer, @@ -137,6 +102,56 @@ ComunicWeb.components.calls.callWindow = { }); + + //Call box body + call.window.body = createElem2({ + appendTo: callContainer, + type: "div", + class: "call-window-body" + }); + + + + + /** + * Create loading message area + */ + call.window.loadingMessageContainer = createElem2({ + appendTo: call.window.body, + type: "div", + class: "loading-message-container", + innerHTML: "" + }); + + call.window.loadingMessageContent = createElem2({ + appendTo: call.window.loadingMessageContainer, + type: "div", + class: "message", + innerHTML: "Loading..." + }); + + /** + * Set loading message visiblity + * + * @param {Boolean} visible TRUE to make it visible / FALSE else + */ + call.setLoadingMessageVisibility = function(visible){ + call.window.loadingMessageContainer.style.display = visible ? "flex" : "none"; + } + + /** + * Update call loading message + * + * @param {String} message The new message to show to the + * users + */ + call.setLoadingMessage = function(message){ + call.window.loadingMessageContent.innerHTML = message; + } + + + + //Load user media call.setLoadingMessage("Waiting for your microphone and camera...");