diff --git a/assets/css/components/calls/window.css b/assets/css/components/calls/window.css
index cdf35ed6..164477b4 100644
--- a/assets/css/components/calls/window.css
+++ b/assets/css/components/calls/window.css
@@ -98,6 +98,12 @@
color: rgb(1, 218, 1);
}
+.call-window .messages-area {
+ color: white;
+ margin: 1px 10px;
+ text-align: center;
+}
+
.call-window .videos-area {
display: flex;
flex-direction: row;
diff --git a/assets/js/components/calls/window.js b/assets/js/components/calls/window.js
index 56d9b7bb..7a70f1e9 100644
--- a/assets/js/components/calls/window.js
+++ b/assets/js/components/calls/window.js
@@ -106,6 +106,13 @@ class CallWindow extends CustomEvents {
class: "members-area"
})
+ // Add message area
+ this.messageArea = createElem2({
+ appendTo: this.rootEl,
+ type: "div",
+ class: "messages-area"
+ })
+
// Create videos area
this.videosArea = createElem2({
@@ -373,6 +380,9 @@ class CallWindow extends CustomEvents {
if(user.userID != userID() && user.ready)
await this.PeerReady(user.userID)
+ // Show appropriate message
+ this.setMessage("Click on to start to share audio"+
+ (this.allowVideo ? " or on to start sharing your camera" : "") + ".");
} catch(e) {
console.error(e)
@@ -505,6 +515,21 @@ class CallWindow extends CustomEvents {
this.emitEvent("close");
}
+ /**
+ * Display a new message for the window
+ *
+ * @param {String} msg New message / null to remove
+ */
+ setMessage(msg) {
+ if(msg == null) {
+ this.messageArea.style.display = "none"
+ }
+ else {
+ this.messageArea.style.display = "block";
+ this.messageArea.innerHTML = msg;
+ }
+ }
+
/**
* Add a member to this call
*
@@ -608,6 +633,7 @@ class CallWindow extends CustomEvents {
*/
async toggleStream(isVideo) {
+
if(isVideo && !this.conv.can_have_video_call) {
notify("Video calls can not be done on this conversations!", "danger")
return;
@@ -766,6 +792,8 @@ class CallWindow extends CustomEvents {
*/
async startStreaming(includeVideo, shareScreen = false) {
+ this.setMessage(null)
+
// Close any previous connection
this.closeMainPeer();
this.refreshButtonsState()