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.

VideoTrack.js 2.0KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. /* @flow */
  2. import React from 'react';
  3. import { connect } from '../../../redux';
  4. import AbstractVideoTrack from '../AbstractVideoTrack';
  5. import type { Props as AbstractVideoTrackProps } from '../AbstractVideoTrack';
  6. import Video from './Video';
  7. /**
  8. * The type of the React {@code Component} props of {@link VideoTrack}.
  9. */
  10. type Props = AbstractVideoTrackProps & {
  11. /**
  12. * CSS classes to add to the video element.
  13. */
  14. className: string,
  15. /**
  16. * The value of the id attribute of the video. Used by the torture tests
  17. * to locate video elements.
  18. */
  19. id: string,
  20. /**
  21. *
  22. * Used to determine the value of the autoplay attribute of the underlying
  23. * video element.
  24. */
  25. _noAutoPlayVideo: boolean
  26. };
  27. /**
  28. * Component that renders a video element for a passed in video track and
  29. * notifies the store when the video has started playing.
  30. *
  31. * @extends AbstractVideoTrack
  32. */
  33. class VideoTrack extends AbstractVideoTrack<Props> {
  34. /**
  35. * Default values for {@code VideoTrack} component's properties.
  36. *
  37. * @static
  38. */
  39. static defaultProps = {
  40. className: '',
  41. id: ''
  42. };
  43. /**
  44. * Renders the video element.
  45. *
  46. * @override
  47. * @returns {ReactElement}
  48. */
  49. render() {
  50. return (
  51. <Video
  52. autoPlay = { !this.props._noAutoPlayVideo }
  53. className = { this.props.className }
  54. id = { this.props.id }
  55. onVideoPlaying = { this._onVideoPlaying }
  56. videoTrack = { this.props.videoTrack } />
  57. );
  58. }
  59. _onVideoPlaying: () => void;
  60. }
  61. /**
  62. * Maps (parts of) the Redux state to the associated VideoTracks props.
  63. *
  64. * @param {Object} state - The Redux state.
  65. * @private
  66. * @returns {{
  67. * _noAutoPlayVideo: boolean
  68. * }}
  69. */
  70. function _mapStateToProps(state) {
  71. const testingConfig = state['features/base/config'].testing;
  72. return {
  73. _noAutoPlayVideo: testingConfig?.noAutoPlayVideo
  74. };
  75. }
  76. export default connect(_mapStateToProps)(VideoTrack);