Merge pull request #6161 from BobakOftadeh/user-manage-b

User manage button clear status, mute meeting implementation

bigbluebutton-html5/imports/api/voice-users/server/eventHandlers.js

@@ -6,10 +6,12 @@ import handleTalkingVoiceUser from './handlers/talkingVoiceUser';
 import handleMutedVoiceUser from './handlers/mutedVoiceUser';
 import handleGetVoiceUsers from './handlers/getVoiceUsers';
 import handleVoiceUsers from './handlers/voiceUsers';
+import handleMeetingMuted from './handlers/meetingMuted';
 
 RedisPubSub.on('UserLeftVoiceConfToClientEvtMsg', handleLeftVoiceUser);
 RedisPubSub.on('UserJoinedVoiceConfToClientEvtMsg', handleJoinVoiceUser);
 RedisPubSub.on('UserTalkingVoiceEvtMsg', handleTalkingVoiceUser);
 RedisPubSub.on('UserMutedVoiceEvtMsg', handleMutedVoiceUser);
 RedisPubSub.on('GetVoiceUsersMeetingRespMsg', processForHTML5ServerOnly(handleGetVoiceUsers));
 RedisPubSub.on('SyncGetVoiceUsersRespMsg', handleVoiceUsers);
+RedisPubSub.on('MeetingMutedEvtMsg', handleMeetingMuted);

bigbluebutton-html5/imports/api/voice-users/server/handlers/meetingMuted.js

@@ -0,0 +1,5 @@
+import changeMuteMeeting from '../modifiers/changeMuteMeeting';
+
+export default function handleMeetingMuted({ body }, meetingId) {
+  return changeMuteMeeting(meetingId, body);
+}

bigbluebutton-html5/imports/api/voice-users/server/methods.js

@@ -1,11 +1,15 @@
 import { Meteor } from 'meteor/meteor';
 import listenOnlyToggle from './methods/listenOnlyToggle';
 import muteToggle from './methods/muteToggle';
+import muteAllToggle from './methods/muteAllToggle';
+import muteAllExceptPresenterToggle from './methods/muteAllExceptPresenterToggle';
 import ejectUserFromVoice from './methods/ejectUserFromVoice';
 
 Meteor.methods({
   listenOnlyToggle,
   toggleSelfVoice: (credentials) => { muteToggle(credentials, credentials.requesterUserId); },
   toggleVoice: muteToggle,
+  muteAllUsers: muteAllToggle,
+  muteAllExceptPresenter: muteAllExceptPresenterToggle,
   ejectUserFromVoice,
 });

bigbluebutton-html5/imports/api/voice-users/server/methods/muteAllExceptPresenterToggle.js

@@ -0,0 +1,24 @@
+import { Meteor } from 'meteor/meteor';
+import { check } from 'meteor/check';
+import RedisPubSub from '/imports/startup/server/redis';
+import Meetings from '/imports/api/meetings';
+
+export default function muteAllExceptPresenterToggle(credentials) {
+  const REDIS_CONFIG = Meteor.settings.private.redis;
+  const CHANNEL = REDIS_CONFIG.channels.toAkkaApps;
+  const EVENT_NAME = 'MuteAllExceptPresentersCmdMsg';
+
+  const { meetingId, requesterUserId } = credentials;
+
+  check(meetingId, String);
+  check(requesterUserId, String);
+  const meeting = Meetings.findOne({ meetingId });
+  const toggleMeetingMuted = !meeting.voiceProp.muteOnStart;
+
+  const payload = {
+    mutedBy: requesterUserId,
+    mute: toggleMeetingMuted,
+  };
+
+  RedisPubSub.publishUserMessage(CHANNEL, EVENT_NAME, meetingId, requesterUserId, payload);
+}

bigbluebutton-html5/imports/api/voice-users/server/methods/muteAllToggle.js

@@ -0,0 +1,24 @@
+import { Meteor } from 'meteor/meteor';
+import { check } from 'meteor/check';
+import RedisPubSub from '/imports/startup/server/redis';
+import Meetings from '/imports/api/meetings';
+
+export default function muteAllToggle(credentials) {
+  const REDIS_CONFIG = Meteor.settings.private.redis;
+  const CHANNEL = REDIS_CONFIG.channels.toAkkaApps;
+  const EVENT_NAME = 'MuteMeetingCmdMsg';
+
+  const { meetingId, requesterUserId } = credentials;
+
+  check(meetingId, String);
+  check(requesterUserId, String);
+  const meeting = Meetings.findOne({ meetingId });
+  const toggleMeetingMuted = !meeting.voiceProp.muteOnStart;
+
+  const payload = {
+    mutedBy: requesterUserId,
+    mute: toggleMeetingMuted,
+  };
+
+  RedisPubSub.publishUserMessage(CHANNEL, EVENT_NAME, meetingId, requesterUserId, payload);
+}

bigbluebutton-html5/imports/api/voice-users/server/modifiers/changeMuteMeeting.js

@@ -0,0 +1,35 @@
+import Meetings from '/imports/api/meetings';
+import { check } from 'meteor/check';
+import Logger from '/imports/startup/server/logger';
+
+export default function changeMuteMeeting(meetingId, payload) {
+  check(meetingId, String);
+  check(payload, {
+    muted: Boolean,
+    mutedBy: String,
+  });
+
+  const selector = {
+    meetingId,
+  };
+
+  const modifier = {
+    $set: {
+      'voiceProp.muteOnStart': payload.muted,
+    },
+  };
+
+  const cb = (err, numChanged) => {
+    if (err) {
+      Logger.error(`Changing meeting mute status meeting={${meetingId}} ${err}`);
+      return;
+    }
+
+    if (numChanged) {
+      Logger.info(`Changed meeting mute status meeting=${meetingId}`);
+    }
+  };
+
+
+  return Meetings.upsert(selector, modifier, cb);
+}

bigbluebutton-html5/imports/ui/components/user-list/component.jsx

@@ -24,6 +24,8 @@ const propTypes = {
   assignPresenter: PropTypes.func.isRequired,
   removeUser: PropTypes.func.isRequired,
   toggleVoice: PropTypes.func.isRequired,
+  muteAllUsers: PropTypes.func.isRequired,
+  muteAllExceptPresenter: PropTypes.func.isRequired,
   changeRole: PropTypes.func.isRequired,
   roving: PropTypes.func.isRequired,
   getGroupChatPrivate: PropTypes.func.isRequired,
@@ -51,6 +53,8 @@ class UserList extends Component {
       assignPresenter,
       removeUser,
       toggleVoice,
+      muteAllUsers,
+      muteAllExceptPresenter,
       changeRole,
       meeting,
       getAvailableActions,
@@ -87,6 +91,8 @@ class UserList extends Component {
           assignPresenter,
           removeUser,
           toggleVoice,
+          muteAllUsers,
+          muteAllExceptPresenter,
           changeRole,
           meeting,
           getAvailableActions,

bigbluebutton-html5/imports/ui/components/user-list/container.jsx

@@ -21,6 +21,8 @@ const propTypes = {
   assignPresenter: PropTypes.func.isRequired,
   removeUser: PropTypes.func.isRequired,
   toggleVoice: PropTypes.func.isRequired,
+  muteAllUsers: PropTypes.func.isRequired,
+  muteAllExceptPresenter: PropTypes.func.isRequired,
   changeRole: PropTypes.func.isRequired,
   roving: PropTypes.func.isRequired,
   getGroupChatPrivate: PropTypes.func.isRequired,
@@ -45,6 +47,8 @@ export default withTracker(({ chatID, compact }) => ({
   assignPresenter: Service.assignPresenter,
   removeUser: Service.removeUser,
   toggleVoice: Service.toggleVoice,
+  muteAllUsers: Service.muteAllUsers,
+  muteAllExceptPresenter: Service.muteAllExceptPresenter,
   changeRole: Service.changeRole,
   roving: Service.roving,
   CustomLogoUrl: Service.getCustomLogoUrl(),

bigbluebutton-html5/imports/ui/components/user-list/service.js

@@ -364,6 +364,10 @@ const removeUser = (userId) => {
 
 const toggleVoice = (userId) => { userId === Auth.userID ? makeCall('toggleSelfVoice') : makeCall('toggleVoice', userId); };
 
+const muteAllUsers = (userId) => { makeCall('muteAllUsers', userId); };
+
+const muteAllExceptPresenter = (userId) => { makeCall('muteAllExceptPresenter', userId); };
+
 const changeRole = (userId, role) => { makeCall('changeRole', userId, role); };
 
 const roving = (event, itemCount, changeState) => {
@@ -438,6 +442,8 @@ export default {
   assignPresenter,
   removeUser,
   toggleVoice,
+  muteAllUsers,
+  muteAllExceptPresenter,
   changeRole,
   getUsers,
   getOpenChats,

bigbluebutton-html5/imports/ui/components/user-list/user-list-content/component.jsx

@@ -24,6 +24,8 @@ const propTypes = {
   assignPresenter: PropTypes.func.isRequired,
   removeUser: PropTypes.func.isRequired,
   toggleVoice: PropTypes.func.isRequired,
+  muteAllUsers: PropTypes.func.isRequired,
+  muteAllExceptPresenter: PropTypes.func.isRequired,
   changeRole: PropTypes.func.isRequired,
   roving: PropTypes.func.isRequired,
   getGroupChatPrivate: PropTypes.func.isRequired,
@@ -50,6 +52,8 @@ class UserContent extends React.Component {
       assignPresenter,
       removeUser,
       toggleVoice,
+      muteAllUsers,
+      muteAllExceptPresenter,
       changeRole,
       getAvailableActions,
       normalizeEmojiName,
@@ -101,6 +105,8 @@ class UserContent extends React.Component {
             assignPresenter,
             removeUser,
             toggleVoice,
+            muteAllUsers,
+            muteAllExceptPresenter,
             changeRole,
             getAvailableActions,
             normalizeEmojiName,

bigbluebutton-html5/imports/ui/components/user-list/user-list-content/user-participants/component.jsx

@@ -20,6 +20,8 @@ const propTypes = {
   assignPresenter: PropTypes.func.isRequired,
   removeUser: PropTypes.func.isRequired,
   toggleVoice: PropTypes.func.isRequired,
+  muteAllUsers: PropTypes.func.isRequired,
+  muteAllExceptPresenter: PropTypes.func.isRequired,
   changeRole: PropTypes.func.isRequired,
   getAvailableActions: PropTypes.func.isRequired,
   normalizeEmojiName: PropTypes.func.isRequired,
@@ -168,7 +170,9 @@ class UserParticipants extends Component {
   }
 
   render() {
-    const { intl, users, compact } = this.props;
+    const {
+      intl, users, compact, setEmojiStatus, muteAllUsers, meeting, muteAllExceptPresenter,
+    } = this.props;
 
     return (
       <div>
@@ -180,7 +184,14 @@ class UserParticipants extends Component {
                 &nbsp;({users.length})
 
               </h2>
-              <UserOptionsContainer />
+              <UserOptionsContainer {...{
+                users,
+                muteAllUsers,
+                muteAllExceptPresenter,
+                setEmojiStatus,
+                meeting,
+              }}
+              />
             </div>
             : <hr className={styles.separator} />
         }

bigbluebutton-html5/imports/ui/components/user-list/user-list-content/user-participants/user-options/component.jsx

@@ -1,4 +1,5 @@
 import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { defineMessages, injectIntl } from 'react-intl';
 import _ from 'lodash';
 import { withModalMounter } from '/imports/ui/components/modal/service';
@@ -10,6 +11,17 @@ import DropdownList from '/imports/ui/components/dropdown/list/component';
 import DropdownListItem from '/imports/ui/components/dropdown/list/item/component';
 import { styles } from './styles';
 
+const propTypes = {
+  intl: PropTypes.shape({
+    formatMessage: PropTypes.func.isRequired,
+  }).isRequired,
+  isMeetingMuted: PropTypes.bool.isRequired,
+  toggleMuteAllUsers: PropTypes.func.isRequired,
+  toggleMuteAllUsersExceptPresenter: PropTypes.func.isRequired,
+  toggleStatus: PropTypes.func.isRequired,
+  toggleLockView: PropTypes.func.isRequired,
+};
+
 const intlMessages = defineMessages({
   optionsLabel: {
     id: 'app.userList.userOptions.manageUsersLabel',
@@ -31,6 +43,14 @@ const intlMessages = defineMessages({
     id: 'app.userList.userOptions.muteAllDesc',
     description: 'Mute all description',
   },
+  unmuteAllLabel: {
+    id: 'app.userList.userOptions.unmuteAllLabel',
+    description: 'Unmute all label',
+  },
+  unmuteAllDesc: {
+    id: 'app.userList.userOptions.unmuteAllDesc',
+    description: 'Unmute all desc',
+  },
   lockViewersLabel: {
     id: 'app.userList.userOptions.lockViewersLabel',
     description: 'Lock viewers label',
@@ -59,11 +79,11 @@ class UserOptions extends Component {
 
     this.onActionsShow = this.onActionsShow.bind(this);
     this.onActionsHide = this.onActionsHide.bind(this);
+    this.alterMenu = this.alterMenu.bind(this);
   }
 
   componentWillMount() {
-    const { intl } = this.props;
-
+    const { intl, isMeetingMuted } = this.props;
     this.menuItems = _.compact([
       (<DropdownListItem
         key={_.uniqueId('list-item-')}
@@ -94,6 +114,16 @@ class UserOptions extends Component {
         onClick={this.props.toggleLockView}
       />),
     ]);
+
+    if (isMeetingMuted) {
+      this.alterMenu();
+    }
+  }
+
+  componentDidUpdate(prevProps) {
+    if (prevProps.isMeetingMuted !== this.props.isMeetingMuted) {
+      this.alterMenu();
+    }
   }
 
   onActionsShow() {
@@ -108,6 +138,37 @@ class UserOptions extends Component {
     });
   }
 
+  alterMenu() {
+    const { intl, isMeetingMuted } = this.props;
+
+    if (isMeetingMuted) {
+      const menuButton = (<DropdownListItem
+        key={_.uniqueId('list-item-')}
+        icon="unmute"
+        label={intl.formatMessage(intlMessages.unmuteAllLabel)}
+        description={intl.formatMessage(intlMessages.unmuteAllDesc)}
+        onClick={this.props.toggleMuteAllUsers}
+      />);
+      this.menuItems.splice(1, 2, menuButton);
+    } else {
+      const muteMeetingButtons = [(<DropdownListItem
+        key={_.uniqueId('list-item-')}
+        icon="mute"
+        label={intl.formatMessage(intlMessages.muteAllLabel)}
+        description={intl.formatMessage(intlMessages.muteAllDesc)}
+        onClick={this.props.toggleMuteAllUsers}
+      />), (<DropdownListItem
+        key={_.uniqueId('list-item-')}
+        icon="mute"
+        label={intl.formatMessage(intlMessages.muteAllExceptPresenterLabel)}
+        description={intl.formatMessage(intlMessages.muteAllExceptPresenterDesc)}
+        onClick={this.props.toggleMuteAllUsersExceptPresenter}
+      />)];
+
+      this.menuItems.splice(1, 1, muteMeetingButtons[0], muteMeetingButtons[1]);
+    }
+  }
+
   render() {
     const { intl } = this.props;
 
@@ -147,4 +208,5 @@ class UserOptions extends Component {
   }
 }
 
+UserOptions.propTypes = propTypes;
 export default withModalMounter(injectIntl(UserOptions));