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

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