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.

ToggleCameraButton.js 2.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. // @flow
  2. import { translate } from '../../../base/i18n';
  3. import { IconSwitchCamera } from '../../../base/icons';
  4. import { MEDIA_TYPE, toggleCameraFacingMode } from '../../../base/media';
  5. import { connect } from '../../../base/redux';
  6. import { AbstractButton } from '../../../base/toolbox';
  7. import type { AbstractButtonProps } from '../../../base/toolbox';
  8. import { isLocalTrackMuted } from '../../../base/tracks';
  9. /**
  10. * The type of the React {@code Component} props of {@link ToggleCameraButton}.
  11. */
  12. type Props = AbstractButtonProps & {
  13. /**
  14. * Whether the current conference is in audio only mode or not.
  15. */
  16. _audioOnly: boolean,
  17. /**
  18. * Whether video is currently muted or not.
  19. */
  20. _videoMuted: boolean,
  21. /**
  22. * The redux {@code dispatch} function.
  23. */
  24. dispatch: Function
  25. };
  26. /**
  27. * An implementation of a button for toggling the camera facing mode.
  28. */
  29. class ToggleCameraButton extends AbstractButton<Props, *> {
  30. accessibilityLabel = 'toolbar.accessibilityLabel.toggleCamera';
  31. icon = IconSwitchCamera;
  32. label = 'toolbar.toggleCamera';
  33. /**
  34. * Handles clicking / pressing the button.
  35. *
  36. * @override
  37. * @protected
  38. * @returns {void}
  39. */
  40. _handleClick() {
  41. this.props.dispatch(toggleCameraFacingMode());
  42. }
  43. /**
  44. * Indicates whether this button is disabled or not.
  45. *
  46. * @override
  47. * @protected
  48. * @returns {boolean}
  49. */
  50. _isDisabled() {
  51. return this.props._audioOnly || this.props._videoMuted;
  52. }
  53. }
  54. /**
  55. * Maps (parts of) the redux state to the associated props for the
  56. * {@code ToggleCameraButton} component.
  57. *
  58. * @param {Object} state - The Redux state.
  59. * @private
  60. * @returns {{
  61. * _audioOnly: boolean,
  62. * _videoMuted: boolean
  63. * }}
  64. */
  65. function _mapStateToProps(state): Object {
  66. const { enabled: audioOnly } = state['features/base/audio-only'];
  67. const tracks = state['features/base/tracks'];
  68. return {
  69. _audioOnly: Boolean(audioOnly),
  70. _videoMuted: isLocalTrackMuted(tracks, MEDIA_TYPE.VIDEO)
  71. };
  72. }
  73. export default translate(connect(_mapStateToProps)(ToggleCameraButton));