feat(captions): talking users' floor

Associate the floor status with the talking users to improve feedback
on automated closed captions.

bigbluebutton-html5/imports/ui/components/nav-bar/talking-indicator/component.jsx

@@ -53,6 +53,7 @@ class TalkingIndicator extends PureComponent {
         talking,
         color,
         transcribing,
+        floor,
         muted,
         callerName,
       } = talkers[`${id}`];
@@ -70,6 +71,7 @@ class TalkingIndicator extends PureComponent {
           key={_.uniqueId(`${callerName}-`)}
           muted={muted}
           talking={talking}
+          floor={floor}
         >
           {transcribing && (
             <Styled.CCIcon

bigbluebutton-html5/imports/ui/components/nav-bar/talking-indicator/container.jsx

@@ -42,6 +42,7 @@ export default withTracker(() => {
     fields: {
       callerName: 1,
       talking: 1,
+      floor: 1,
       color: 1,
       startTime: 1,
       muted: 1,
@@ -60,12 +61,13 @@ export default withTracker(() => {
 
     for (let i = 0; i < maxNumberVoiceUsersNotification; i += 1) {
       const {
-        callerName, talking, color, muted, intId,
+        callerName, talking, floor, color, muted, intId,
       } = usersTalking[i];
 
       talkers[`${intId}`] = {
         color,
         transcribing: SpeechService.hasSpeechLocale(intId),
+        floor,
         talking,
         muted,
         callerName,

bigbluebutton-html5/imports/ui/components/nav-bar/talking-indicator/styles.js

@@ -14,7 +14,7 @@ import {
   colorWhite,
   colorSuccess,
   colorDanger,
-  btnMutedColor,
+  colorBackground,
 } from '/imports/ui/stylesheets/styled-components/palette';
 import {
   fontSizeBase,
@@ -129,7 +129,7 @@ const TalkingIndicatorWrapper = styled.div`
   margin: 0 ${borderRadius};
   opacity: ${({ muted, talking }) => ((muted || !talking) && `${spokeOpacity};`)
     || '1;'};
-  background: ${({ muted, talking }) => ((muted || !talking) && `${btnMutedColor};`)
+  background: ${({ muted, talking, floor }) => ((muted || !talking || !floor) && `${colorBackground};`)
     || `${colorSuccess}`}
 `;