[Glitch] Fix expanded video player issues
Port c955f98d36 to glitch-soc
Signed-off-by: Thibaut Girka <thib@sitedethib.com>
			
			
This commit is contained in:
		| @@ -372,8 +372,8 @@ class Status extends ImmutablePureComponent { | ||||
|     } | ||||
|   }; | ||||
|  | ||||
|   handleOpenVideo = (media, startTime) => { | ||||
|     this.props.onOpenVideo(media, startTime); | ||||
|   handleOpenVideo = (media, options) => { | ||||
|     this.props.onOpenVideo(media, options); | ||||
|   } | ||||
|  | ||||
|   handleHotkeyOpenMedia = e => { | ||||
| @@ -385,7 +385,7 @@ class Status extends ImmutablePureComponent { | ||||
|       if (status.getIn(['media_attachments', 0, 'type']) === 'audio') { | ||||
|         // TODO: toggle play/paused? | ||||
|       } else if (status.getIn(['media_attachments', 0, 'type']) === 'video') { | ||||
|         onOpenVideo(status.getIn(['media_attachments', 0]), 0); | ||||
|         onOpenVideo(status.getIn(['media_attachments', 0]), { startTime: 0 }); | ||||
|       } else { | ||||
|         onOpenMedia(status.get('media_attachments'), 0); | ||||
|       } | ||||
|   | ||||
| @@ -178,8 +178,8 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({ | ||||
|     dispatch(openModal('MEDIA', { media, index })); | ||||
|   }, | ||||
|  | ||||
|   onOpenVideo (media, time) { | ||||
|     dispatch(openModal('VIDEO', { media, time })); | ||||
|   onOpenVideo (media, options) { | ||||
|     dispatch(openModal('VIDEO', { media, options })); | ||||
|   }, | ||||
|  | ||||
|   onBlock (status) { | ||||
|   | ||||
| @@ -66,8 +66,8 @@ export default class DetailedStatus extends ImmutablePureComponent { | ||||
|     e.stopPropagation(); | ||||
|   } | ||||
|  | ||||
|   handleOpenVideo = (media, startTime) => { | ||||
|     this.props.onOpenVideo(media, startTime); | ||||
|   handleOpenVideo = (media, options) => { | ||||
|     this.props.onOpenVideo(media, options); | ||||
|   } | ||||
|  | ||||
|   _measureHeight (heightJustChanged) { | ||||
|   | ||||
| @@ -130,8 +130,8 @@ const mapDispatchToProps = (dispatch, { intl }) => ({ | ||||
|     dispatch(openModal('MEDIA', { media, index })); | ||||
|   }, | ||||
|  | ||||
|   onOpenVideo (media, time) { | ||||
|     dispatch(openModal('VIDEO', { media, time })); | ||||
|   onOpenVideo (media, options) { | ||||
|     dispatch(openModal('VIDEO', { media, options })); | ||||
|   }, | ||||
|  | ||||
|   onBlock (status) { | ||||
|   | ||||
| @@ -316,8 +316,8 @@ class Status extends ImmutablePureComponent { | ||||
|     this.props.dispatch(openModal('MEDIA', { media, index })); | ||||
|   } | ||||
|  | ||||
|   handleOpenVideo = (media, time) => { | ||||
|     this.props.dispatch(openModal('VIDEO', { media, time })); | ||||
|   handleOpenVideo = (media, options) => { | ||||
|     this.props.dispatch(openModal('VIDEO', { media, options })); | ||||
|   } | ||||
|  | ||||
|   handleHotkeyOpenMedia = e => { | ||||
| @@ -329,7 +329,7 @@ class Status extends ImmutablePureComponent { | ||||
|       if (status.getIn(['media_attachments', 0, 'type']) === 'audio') { | ||||
|         // TODO: toggle play/paused? | ||||
|       } else if (status.getIn(['media_attachments', 0, 'type']) === 'video') { | ||||
|         this.handleOpenVideo(status.getIn(['media_attachments', 0]), 0); | ||||
|         this.handleOpenVideo(status.getIn(['media_attachments', 0]), { startTime: 0 }); | ||||
|       } else { | ||||
|         this.handleOpenMedia(status.get('media_attachments'), 0); | ||||
|       } | ||||
|   | ||||
| @@ -16,7 +16,11 @@ export default class VideoModal extends ImmutablePureComponent { | ||||
|   static propTypes = { | ||||
|     media: ImmutablePropTypes.map.isRequired, | ||||
|     status: ImmutablePropTypes.map, | ||||
|     time: PropTypes.number, | ||||
|     options: PropTypes.shape({ | ||||
|       startTime: PropTypes.number, | ||||
|       autoPlay: PropTypes.bool, | ||||
|       defaultVolume: PropTypes.number, | ||||
|     }), | ||||
|     onClose: PropTypes.func.isRequired, | ||||
|   }; | ||||
|  | ||||
| @@ -28,7 +32,8 @@ export default class VideoModal extends ImmutablePureComponent { | ||||
|   } | ||||
|  | ||||
|   render () { | ||||
|     const { media, status, time, onClose } = this.props; | ||||
|     const { media, status, onClose } = this.props; | ||||
|     const options = this.props.options || {}; | ||||
|  | ||||
|     return ( | ||||
|       <div className='modal-root__modal video-modal'> | ||||
| @@ -37,7 +42,9 @@ export default class VideoModal extends ImmutablePureComponent { | ||||
|             preview={media.get('preview_url')} | ||||
|             blurhash={media.get('blurhash')} | ||||
|             src={media.get('url')} | ||||
|             startTime={time} | ||||
|             startTime={options.startTime} | ||||
|             autoPlay={options.autoPlay} | ||||
|             defaultVolume={options.defaultVolume} | ||||
|             onCloseVideo={onClose} | ||||
|             detailed | ||||
|             alt={media.get('description')} | ||||
|   | ||||
| @@ -111,6 +111,8 @@ class Video extends React.PureComponent { | ||||
|     preventPlayback: PropTypes.bool, | ||||
|     blurhash: PropTypes.string, | ||||
|     link: PropTypes.node, | ||||
|     autoPlay: PropTypes.bool, | ||||
|     defaultVolume: PropTypes.number, | ||||
|   }; | ||||
|  | ||||
|   state = { | ||||
| @@ -360,6 +362,13 @@ class Video extends React.PureComponent { | ||||
|   handleLoadedData = () => { | ||||
|     if (this.props.startTime) { | ||||
|       this.video.currentTime = this.props.startTime; | ||||
|     } | ||||
|  | ||||
|     if (this.props.defaultVolume !== undefined) { | ||||
|       this.video.volume = this.props.defaultVolume; | ||||
|     } | ||||
|  | ||||
|     if (this.props.autoPlay) { | ||||
|       this.video.play(); | ||||
|     } | ||||
|   } | ||||
| @@ -386,8 +395,14 @@ class Video extends React.PureComponent { | ||||
|       height, | ||||
|     }); | ||||
|  | ||||
|     const options = { | ||||
|       startTime: this.video.currentTime, | ||||
|       autoPlay: !this.state.paused, | ||||
|       defaultVolume: this.state.volume, | ||||
|     }; | ||||
|  | ||||
|     this.video.pause(); | ||||
|     this.props.onOpenVideo(media, this.video.currentTime); | ||||
|     this.props.onOpenVideo(media, options); | ||||
|   } | ||||
|  | ||||
|   handleCloseVideo = () => { | ||||
|   | ||||
		Reference in New Issue
	
	Block a user