Adds event handling for kick user

Conflicts:
	bigbluebutton-html5/app/client/react/components/UserList/UserItem.jsx

bigbluebutton-html5/app/client/react/components/UserList/README.md

@@ -1,7 +1,9 @@
 # TODO
 
- [] Migrate kick functionality
  [] Migrate user lock status, currently is just a dummy boolean.
+ [] Migrate set presenter functionality to a service
+ [] Migrate kick user functionality to a service
+ [] Migrate open private chat to a service
 
 # Know Issues
 

bigbluebutton-html5/app/client/react/components/UserList/UserItem.jsx

@@ -1,4 +1,17 @@
 UserItem = React.createClass({
+
+  handleKick(user) {
+    kickUser(BBB.getMeetingId(), user.id, getInSession("userId"), getInSession("authToken"));
+  },
+
+  handleMute(user) {
+    alert('Should mute user ' + user.name);
+  },
+
+  handleUnmute(user) {
+    alert('Should unmute user ' + user.name);
+  },
+
   handleOpenPrivateChat(user) {
     let userIdSelected = user.id;
 
@@ -19,7 +32,6 @@ UserItem = React.createClass({
   },
 
   handleSetPresenter(user){
-    /*this is a global function and should be looked at to be changed to a better solution*/
     setUserPresenter(BBB.getMeetingId(), user.id, getInSession('userId'), user.name, getInSession('authToken'));
   },
 
@@ -30,6 +42,7 @@ UserItem = React.createClass({
         {this.renderStatusIcons(user)}
         {this.renderUserName(user)}
         {this.renderUnreadBadge(user.unreadMessagesCount)}
+        {this.renderSharingStatus(user)}
       </div>
     );
   },
@@ -89,5 +102,68 @@ UserItem = React.createClass({
         {(unreadMessagesCount > 9) ? '9+' : unreadMessagesCount}
       </div>
     );
+  },
+
+  renderSharingStatus(user) {
+    const { sharingStatus, name: userName } = user;
+
+    const currentUser = this.props.currentUser;
+
+    let icons = [];
+
+    if(sharingStatus.isListenOnly) {
+      icons.push(<Icon iconName="fi-volume-none"
+      title={`${userName} is only listening`} className="icon usericon"/>);
+    } else {
+      if(sharingStatus.isMuted) {
+        icons.push(
+          <Button className="muteIcon"
+            onClick={() => this.handleMute(user)} componentClass="span">
+            <Icon prependIconName="ion-" iconName="ios-mic-off"
+              title={`${userName} is muted`} className="icon usericon"/>
+          </Button>
+        );
+      } else {
+        let talkingStatusIcon = <Icon prependIconName="ion-"
+          iconName="ios-mic-outline" title={`${userName} is not talking`}
+          className="icon usericon"/>;
+
+        if(sharingStatus.isTalking) {
+          talkingStatusIcon = <Icon prependIconName="ion-" iconName="ios-mic"
+          title={`${userName} is talking`}
+          className="icon usericon"/>;
+        }
+
+        icons.push(
+          <Button className="muteIcon"
+            onClick={() => this.handleUnmute(user)}
+            componentClass="span">
+            {talkingStatusIcon}
+          </Button>
+        );
+      }
+    }
+
+    if (!user.isCurrent && currentUser.isModerator) {
+      icons.push(
+        <Button className="kickUser" onClick={() => this.handleKick(user)} componentClass="span">
+          <Icon iconName="x-circle" title={`Kick ${userName}`} className="icon usericon"/>
+        </Button>
+      );
+    }
+
+    if (sharingStatus.isWebcamOpen) {
+      icons.push(<Icon iconName="video" title={`${userName} is sharing their webcam`} className="icon usericon"/>);
+    }
+
+    if (sharingStatus.isLocked) {
+      icons.push(<Icon iconName="lock" title={`${userName} is locked`} className="icon usericon"/>);
+    }
+
+    return (
+      <div id="usericons">
+        {icons.map(i => i)}
+      </div>
+    );
   }
 })