Update empty content message when the room state changes

The empty content message shown when waiting for others to join the call
depends on the state of the room. Thus, now the message is updated if
there are changes in that state, like the participants or the type of
the room.

The updates need to be disabled when WebRTC is not supported and when
waiting for the media permissions to prevent those messages from being
overriden; the updates are enabled again once the media permissions were
granted, or if they were rejected but it is possible to join the call
nevertheless (that is, if WebRTC is supported).

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>

js/views/emptycontentview.js

@@ -62,14 +62,31 @@
 
 			this.listenTo(roomsChannel, 'leaveCurrentRoom', this.setEmptyContentMessageWhenConversationEnded);
 
-			this.listenTo(localMediaChannel, 'webRtcNotSupported', this.setEmptyContentMessageWhenWebRtcIsNotSupported);
+			this.listenTo(localMediaChannel, 'webRtcNotSupported', function() {
-			this.listenTo(localMediaChannel, 'waitingForPermissions', this.setEmptyContentMessageWhenWaitingForMediaPermissions);
+				this._disableUpdatesOnActiveRoomChanges();
-			this.listenTo(localMediaChannel, 'startLocalMedia', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
+
-			this.listenTo(localMediaChannel, 'startWithoutLocalMedia', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
+				this.setEmptyContentMessageWhenWebRtcIsNotSupported();
+			});
+			this.listenTo(localMediaChannel, 'waitingForPermissions', function() {
+				this._disableUpdatesOnActiveRoomChanges();
+
+				this.setEmptyContentMessageWhenWaitingForMediaPermissions();
+			});
+			this.listenTo(localMediaChannel, 'startLocalMedia', function() {
+				this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall();
+
+				this._enableUpdatesOnActiveRoomChanges();
+			});
+			this.listenTo(localMediaChannel, 'startWithoutLocalMedia', function() {
+				this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall();
+
+				this._enableUpdatesOnActiveRoomChanges();
+			});
 		},
 
 		setActiveRoom: function(activeRoom) {
 			this.stopListening(this._activeRoom, 'destroy', this.setInitialEmptyContentMessage);
+			this._disableUpdatesOnActiveRoomChanges();
 
 			this._activeRoom = activeRoom;
 
@@ -79,6 +96,21 @@
 			// so when the room is destroyed the initial message overwrites the
 			// conversation ended message.
 			this.listenTo(this._activeRoom, 'destroy', this.setInitialEmptyContentMessage);
+			this._enableUpdatesOnActiveRoomChanges();
+		},
+
+		_disableUpdatesOnActiveRoomChanges: function() {
+			this.stopListening(this._activeRoom, 'change:participants', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
+			this.stopListening(this._activeRoom, 'change:numGuests', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
+			this.stopListening(this._activeRoom, 'change:participantType', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
+			this.stopListening(this._activeRoom, 'change:type', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
+		},
+
+		_enableUpdatesOnActiveRoomChanges: function() {
+			this.listenTo(this._activeRoom, 'change:participants', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
+			this.listenTo(this._activeRoom, 'change:numGuests', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
+			this.listenTo(this._activeRoom, 'change:participantType', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
+			this.listenTo(this._activeRoom, 'change:type', this.setEmptyContentMessageWhenWaitingForOthersToJoinTheCall);
 		},
 
 		/**