You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

AbstractClosedCaptionButton.js 2.3KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. // @flow
  2. import { createToolbarEvent, sendAnalytics } from '../../analytics';
  3. import { isLocalParticipantModerator } from '../../base/participants';
  4. import { AbstractButton, type AbstractButtonProps } from '../../base/toolbox/components';
  5. import { toggleRequestingSubtitles } from '../actions';
  6. export type AbstractProps = AbstractButtonProps & {
  7. /**
  8. * Invoked to obtain translated strings.
  9. */
  10. t: Function,
  11. /**
  12. * Invoked to Dispatch an Action to the redux store.
  13. */
  14. dispatch: Function,
  15. /**
  16. * Whether the local participant is currently requesting subtitles.
  17. */
  18. _requestingSubtitles: Boolean
  19. };
  20. /**
  21. * The button component which starts/stops the transcription.
  22. */
  23. export class AbstractClosedCaptionButton
  24. extends AbstractButton<AbstractProps, *> {
  25. /**
  26. * Handles clicking / pressing the button.
  27. *
  28. * @override
  29. * @protected
  30. * @returns {void}
  31. */
  32. _handleClick() {
  33. const { _requestingSubtitles, dispatch } = this.props;
  34. sendAnalytics(createToolbarEvent('transcribing.ccButton',
  35. {
  36. 'requesting_subtitles': Boolean(_requestingSubtitles)
  37. }));
  38. dispatch(toggleRequestingSubtitles());
  39. }
  40. /**
  41. * Indicates whether this button is disabled or not.
  42. *
  43. * @override
  44. * @protected
  45. * @returns {boolean}
  46. */
  47. _isDisabled() {
  48. return false;
  49. }
  50. /**
  51. * Indicates whether this button is in toggled state or not.
  52. *
  53. * @override
  54. * @protected
  55. * @returns {boolean}
  56. */
  57. _isToggled() {
  58. return this.props._requestingSubtitles;
  59. }
  60. }
  61. /**
  62. * Maps (parts of) the redux state to the associated props for the
  63. * {@code AbstractClosedCaptionButton} component.
  64. *
  65. * @param {Object} state - The redux state.
  66. * @param {Object} ownProps - The properties explicitly passed to the component
  67. * instance.
  68. * @private
  69. * @returns {{
  70. * _requestingSubtitles: boolean,
  71. * visible: boolean
  72. * }}
  73. */
  74. export function _abstractMapStateToProps(state: Object, ownProps: Object) {
  75. const { _requestingSubtitles } = state['features/subtitles'];
  76. const { transcribingEnabled } = state['features/base/config'];
  77. const { visible = Boolean(transcribingEnabled && isLocalParticipantModerator(state)) } = ownProps;
  78. return {
  79. _requestingSubtitles,
  80. visible
  81. };
  82. }