feat: Added mute video moderation feature (#1496)

* Added video mute participant

* Trigger mute event

* Optimized mute type checks

* Fixed event name

* Fixed some linter issues

* Fixed more linter issues

* And even more linter issues fixed

* And more linter fixes

* Added media type to analytics event

JitsiConference.js

@@ -151,6 +151,11 @@ export default function JitsiConference(options) {
     // when muted by focus we receive the jid of the initiator of the mute
     this.mutedByFocusActor = null;
 
+    this.isVideoMutedByFocus = false;
+
+    // when video muted by focus we receive the jid of the initiator of the mute
+    this.mutedVideoByFocusActor = null;
+
     // Flag indicates if the 'onCallEnded' method was ever called on this
     // instance. Used to log extra analytics event for debugging purpose.
     // We need to know if the potential issue happened before or after
@@ -1019,14 +1024,23 @@ JitsiConference.prototype._fireMuteChangeEvent = function(track) {
         this.isMutedByFocus = false;
 
         // unmute local user on server
-        this.room.muteParticipant(this.room.myroomjid, false);
+        this.room.muteParticipant(this.room.myroomjid, false, MediaType.AUDIO);
+    } else if (this.isVideoMutedByFocus && track.isVideoTrack() && !track.isMuted()) {
+        this.isVideoMutedByFocus = false;
+
+        // unmute local user on server
+        this.room.muteParticipant(this.room.myroomjid, false, MediaType.VIDEO);
     }
 
     let actorParticipant;
 
-    if (this.mutedByFocusActor) {
+    if (this.mutedByFocusActor && track.isAudioTrack()) {
         const actorId = Strophe.getResourceFromJid(this.mutedByFocusActor);
 
+        actorParticipant = this.participants[actorId];
+    } else if (this.mutedVideoByFocusActor && track.isVideoTrack()) {
+        const actorId = Strophe.getResourceFromJid(this.mutedVideoByFocusActor);
+
         actorParticipant = this.participants[actorId];
     }
 
@@ -1497,13 +1511,21 @@ JitsiConference.prototype._maybeSetSITimeout = function() {
  * Mutes a participant.
  * @param {string} id The id of the participant to mute.
  */
-JitsiConference.prototype.muteParticipant = function(id) {
+JitsiConference.prototype.muteParticipant = function(id, mediaType) {
+    const muteMediaType = mediaType ? mediaType : MediaType.AUDIO;
+
+    if (muteMediaType !== MediaType.AUDIO && muteMediaType !== MediaType.VIDEO) {
+        logger.error(`Unsupported media type: ${muteMediaType}`);
+
+        return;
+    }
+
     const participant = this.getParticipantById(id);
 
     if (!participant) {
         return;
     }
-    this.room.muteParticipant(participant.getJid(), true);
+    this.room.muteParticipant(participant.getJid(), true, muteMediaType);
 };
 
 /* eslint-disable max-params */

JitsiConferenceEventManager.js

@@ -92,7 +92,7 @@ JitsiConferenceEventManager.prototype.setupChatRoomListeners = function() {
             // TODO: Add a way to differentiate between commands which caused
             // us to mute and those that did not change our state (i.e. we were
             // already muted).
-            Statistics.sendAnalytics(createRemotelyMutedEvent());
+            Statistics.sendAnalytics(createRemotelyMutedEvent(MediaType.AUDIO));
 
             conference.mutedByFocusActor = actor;
 
@@ -111,6 +111,30 @@ JitsiConferenceEventManager.prototype.setupChatRoomListeners = function() {
         }
     );
 
+    chatRoom.addListener(XMPPEvents.VIDEO_MUTED_BY_FOCUS,
+        actor => {
+            // TODO: Add a way to differentiate between commands which caused
+            // us to mute and those that did not change our state (i.e. we were
+            // already muted).
+            Statistics.sendAnalytics(createRemotelyMutedEvent(MediaType.VIDEO));
+
+            conference.mutedVideoByFocusActor = actor;
+
+            // set isVideoMutedByFocus when setVideoMute Promise ends
+            conference.rtc.setVideoMute(true).then(
+                () => {
+                    conference.isVideoMutedByFocus = true;
+                    conference.mutedVideoByFocusActor = null;
+                })
+                .catch(
+                    error => {
+                        conference.mutedVideoByFocusActor = null;
+                        logger.warn(
+                            'Error while video muting due to focus request', error);
+                    });
+        }
+    );
+
     this.chatRoomForwarder.forward(XMPPEvents.SUBJECT_CHANGED,
         JitsiConferenceEvents.SUBJECT_CHANGED);
 

modules/RTC/RTC.js

@@ -624,6 +624,25 @@ export default class RTC extends Listenable {
         return Promise.all(mutePromises);
     }
 
+    /**
+    * Set mute for all local video streams attached to the conference.
+    * @param value The mute value.
+    * @returns {Promise}
+    */
+    setVideoMute(value) {
+        const mutePromises = [];
+
+        this.getLocalTracks(MediaType.VIDEO).concat(this.getLocalTracks(MediaType.PRESENTER))
+            .forEach(videoTrack => {
+                // this is a Promise
+                mutePromises.push(value ? videoTrack.mute() : videoTrack.unmute());
+            });
+
+        // We return a Promise from all Promises so we can wait for their
+        // execution.
+        return Promise.all(mutePromises);
+    }
+
     /**
      *
      * @param track

modules/xmpp/ChatRoom.js

@@ -1672,14 +1672,15 @@ export default class ChatRoom extends Listenable {
      * Mutes remote participant.
      * @param jid of the participant
      * @param mute
+     * @param mediaType
      */
-    muteParticipant(jid, mute) {
+    muteParticipant(jid, mute, mediaType) {
         logger.info('set mute', mute);
         const iqToFocus = $iq(
             { to: this.focusMucJid,
                 type: 'set' })
             .c('mute', {
-                xmlns: 'http://jitsi.org/jitmeet/audio',
+                xmlns: `http://jitsi.org/jitmeet/${mediaType}`,
                 jid
             })
             .t(mute.toString())
@@ -1716,6 +1717,31 @@ export default class ChatRoom extends Listenable {
         }
     }
 
+    /**
+     * TODO: Document
+     * @param iq
+     */
+    onMuteVideo(iq) {
+        const from = iq.getAttribute('from');
+
+        if (from !== this.focusMucJid) {
+            logger.warn('Ignored mute from non focus peer');
+
+            return;
+        }
+        const mute = $(iq).find('mute');
+
+        if (mute.length && mute.text() === 'true') {
+            this.eventEmitter.emit(XMPPEvents.VIDEO_MUTED_BY_FOCUS, mute.attr('actor'));
+        } else {
+            // XXX Why do we support anything but muting? Why do we encode the
+            // value in the text of the element? Why do we use a separate XML
+            // namespace?
+            logger.warn('Ignoring a mute request which does not explicitly '
+                + 'specify a positive mute command.');
+        }
+    }
+
     /**
      * Clean any listeners or resources, executed on leaving.
      */

modules/xmpp/strophe.emuc.js

@@ -42,6 +42,8 @@ export default class MucConnectionPlugin extends ConnectionPluginListenable {
             'message', null, null);
         this.connection.addHandler(this.onMute.bind(this),
             'http://jitsi.org/jitmeet/audio', 'iq', 'set', null, null);
+        this.connection.addHandler(this.onMuteVideo.bind(this),
+            'http://jitsi.org/jitmeet/video', 'iq', 'set', null, null);
     }
 
     /**
@@ -175,4 +177,22 @@ export default class MucConnectionPlugin extends ConnectionPluginListenable {
 
         return true;
     }
+
+    /**
+     * TODO: Document
+     * @param iq
+     */
+    onMuteVideo(iq) {
+        const from = iq.getAttribute('from');
+        const room = this.rooms[Strophe.getBareJidFromJid(from)];
+
+        // Returning false would result in the listener being deregistered by Strophe
+        if (!room) {
+            return true;
+        }
+
+        room.onMuteVideo(iq);
+
+        return true;
+    }
 }

service/statistics/AnalyticsEvents.js

@@ -420,10 +420,11 @@ export const createP2PEvent = function(action, attributes = {}) {
 /**
  * Indicates that we received a remote command to mute.
  */
-export const createRemotelyMutedEvent = function() {
+export const createRemotelyMutedEvent = function(mediaType) {
     return {
         type: TYPE_OPERATIONAL,
-        action: 'remotely.muted'
+        action: 'remotely.muted',
+        mediaType
     };
 };
 

service/xmpp/XMPPEvents.js

@@ -7,6 +7,10 @@ const XMPPEvents = {
     // Designates an event indicating that the focus has asked us to mute our
     // audio.
     AUDIO_MUTED_BY_FOCUS: 'xmpp.audio_muted_by_focus',
+
+    // Designates an event indicating that the focus has asked us to disable our
+    // camera.
+    VIDEO_MUTED_BY_FOCUS: 'xmpp.video_muted_by_focus',
     AUTHENTICATION_REQUIRED: 'xmpp.authentication_required',
     BRIDGE_DOWN: 'xmpp.bridge_down',