Merge pull request #7691 from diegobenetti/issue7671-take-ownership-button

Implements tooltip and label to the button to take over the captions

bigbluebutton-html5/imports/ui/components/button/component.jsx

@@ -84,6 +84,7 @@ const defaultProps = {
   block: false,
   iconRight: false,
   hideLabel: false,
+  tooltipLabel: '',
 };
 
 export default class Button extends BaseButton {
@@ -116,17 +117,17 @@ export default class Button extends BaseButton {
       'aria-label': ariaLabel,
       'aria-expanded': ariaExpanded,
       tooltipDistance,
+      tooltipLabel,
     } = this.props;
 
     const renderFuncName = circle ? 'renderCircle' : 'renderDefault';
 
-    if (hideLabel && !ariaExpanded) {
-      const tooltipLabel = label || ariaLabel;
-
+    if ((hideLabel && !ariaExpanded) || tooltipLabel) {
+      const buttonLabel = label || ariaLabel;
       return (
         <Tooltip
           tooltipDistance={tooltipDistance}
-          title={tooltipLabel}
+          title={tooltipLabel || buttonLabel}
         >
           {this[renderFuncName]()}
         </Tooltip>
@@ -153,6 +154,7 @@ export default class Button extends BaseButton {
     delete remainingProps.block;
     delete remainingProps.hideLabel;
     delete remainingProps.tooltipDistance;
+    delete remainingProps.tooltipLabel;
 
     /* TODO: We can change this and make the button with flexbox to avoid html
       changes */
@@ -186,6 +188,7 @@ export default class Button extends BaseButton {
     delete remainingProps.block;
     delete remainingProps.hideLabel;
     delete remainingProps.tooltipDistance;
+    delete remainingProps.tooltipLabel;
 
     return (
       <BaseButton

bigbluebutton-html5/imports/ui/components/captions/pad/component.jsx

@@ -22,6 +22,10 @@ const intlMessages = defineMessages({
     id: 'app.captions.pad.ownership',
     description: 'Label for taking ownership of closed captions pad',
   },
+  takeOwnershipTooltip: {
+    id: 'app.captions.pad.ownershipTooltip',
+    description: 'Text for button for taking ownership of closed captions pad',
+  },
   interimResult: {
     id: 'app.captions.pad.interimResult',
     description: 'Title for speech recognition interim results',
@@ -221,11 +225,8 @@ class Pad extends PureComponent {
           {CaptionsService.canIOwnThisPad(ownerId)
             ? (
               <Button
-                icon="pen_tool"
-                size="sm"
-                ghost
-                color="dark"
-                hideLabel
+                color="primary"
+                tooltipLabel={intl.formatMessage(intlMessages.takeOwnershipTooltip, { 0: name })}
                 onClick={() => { CaptionsService.takeOwnership(locale); }}
                 aria-label={intl.formatMessage(intlMessages.takeOwnership)}
                 label={intl.formatMessage(intlMessages.takeOwnership)}

bigbluebutton-html5/imports/ui/components/tooltip/component.jsx

@@ -31,20 +31,6 @@ class Tooltip extends Component {
     const expandedEl = tooltipTarget.parentElement.querySelector('[aria-expanded="true"]');
     const isTarget = expandedEl === tooltipTarget;
     if (expandedEl && !isTarget) return;
-
-    const findLabel = (node) => {
-      let rtn;
-      if (node) {
-        const { nodeName, lastChild, parentElement } = node;
-        if (nodeName.toLowerCase() === 'button') rtn = lastChild.innerText;
-        else rtn = findLabel(parentElement);
-      }
-      return rtn;
-    };
-    const label = findLabel(tooltipTarget);
-    if (label) tip.set({ content: label });
-    // if we are not able to get the text, the default content is used
-
     tip.show();
   }
 

bigbluebutton-html5/private/locales/en.json

@@ -37,10 +37,11 @@
     "app.captions.menu.cancelLabel": "Cancel",
     "app.captions.pad.hide": "Hide closed captions",
     "app.captions.pad.tip": "Press Esc to focus editor toolbar",
-    "app.captions.pad.ownership": "Take ownership",
+    "app.captions.pad.ownership": "Take over",
+    "app.captions.pad.ownershipTooltip": "You will be assigned as the owner of {0} captions",
     "app.captions.pad.interimResult": "Interim results",
-    "app.captions.pad.dictationStart": "Start Dictation",
-    "app.captions.pad.dictationStop": "Stop Dictation",
+    "app.captions.pad.dictationStart": "Start dictation",
+    "app.captions.pad.dictationStop": "Stop dictation",
     "app.captions.pad.dictationOnDesc": "Turns speech recognition on",
     "app.captions.pad.dictationOffDesc": "Turns speech recognition off",
     "app.note.title": "Shared Notes",