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.

AudioOnlyButton.js 1.7KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. // @flow
  2. import { connect } from 'react-redux';
  3. import { toggleAudioOnly } from '../../../base/conference';
  4. import { translate } from '../../../base/i18n';
  5. import { AbstractButton } from '../../../base/toolbox';
  6. import type { AbstractButtonProps } from '../../../base/toolbox';
  7. /**
  8. * The type of the React {@code Component} props of {@link AudioOnlyButton}.
  9. */
  10. type Props = AbstractButtonProps & {
  11. /**
  12. * Whether the current conference is in audio only mode or not.
  13. */
  14. _audioOnly: boolean,
  15. /**
  16. * The redux {@code dispatch} function.
  17. */
  18. dispatch: Function
  19. };
  20. /**
  21. * An implementation of a button for toggling the audio-only mode.
  22. */
  23. class AudioOnlyButton extends AbstractButton<Props, *> {
  24. accessibilityLabel = 'Audio only mode';
  25. iconName = 'visibility';
  26. label = 'toolbar.audioonly';
  27. toggledIconName = 'visibility-off';
  28. /**
  29. * Handles clicking / pressing the button.
  30. *
  31. * @override
  32. * @protected
  33. * @returns {void}
  34. */
  35. _handleClick() {
  36. this.props.dispatch(toggleAudioOnly());
  37. }
  38. /**
  39. * Indicates whether this button is in toggled state or not.
  40. *
  41. * @override
  42. * @protected
  43. * @returns {boolean}
  44. */
  45. _isToggled() {
  46. return this.props._audioOnly;
  47. }
  48. }
  49. /**
  50. * Maps (parts of) the redux state to the associated props for the
  51. * {@code AudioOnlyButton} component.
  52. *
  53. * @param {Object} state - The Redux state.
  54. * @private
  55. * @returns {{
  56. * _audioOnly: boolean
  57. * }}
  58. */
  59. function _mapStateToProps(state): Object {
  60. const { audioOnly } = state['features/base/conference'];
  61. return {
  62. _audioOnly: Boolean(audioOnly)
  63. };
  64. }
  65. export default translate(connect(_mapStateToProps)(AudioOnlyButton));