fix(share-video) fix backwards compatibility issue

This commit is contained in:
Tudor-Ovidiu Avram 2021-06-11 11:40:23 +03:00 committed by Дамян Минков
parent 51a996d0e0
commit b2985934f7
6 changed files with 24 additions and 33 deletions

View File

@ -224,7 +224,7 @@ class ParticipantView extends Component<Props> {
onPress = { renderYoutubeLargeVideo ? undefined : onPress } onPress = { renderYoutubeLargeVideo ? undefined : onPress }
value = '' /> value = '' />
{ renderYoutubeLargeVideo && <YoutubeLargeVideo youtubeUrl = { this.props.participantId } /> } { renderYoutubeLargeVideo && <YoutubeLargeVideo youtubeId = { this.props.participantId } /> }
{ !_isFakeParticipant && renderVideo { !_isFakeParticipant && renderVideo
&& <VideoTrack && <VideoTrack

View File

@ -49,7 +49,7 @@ class SharedVideoDialog extends AbstractSharedVideoDialog<*> {
if (videoId) { if (videoId) {
const { onPostSubmit } = this.props; const { onPostSubmit } = this.props;
onPostSubmit && onPostSubmit(link); onPostSubmit && onPostSubmit(videoId);
return true; return true;
} }

View File

@ -9,7 +9,6 @@ import { connect } from '../../../base/redux';
import { ASPECT_RATIO_WIDE } from '../../../base/responsive-ui'; import { ASPECT_RATIO_WIDE } from '../../../base/responsive-ui';
import { setToolboxVisible } from '../../../toolbox/actions'; import { setToolboxVisible } from '../../../toolbox/actions';
import { setSharedVideoStatus } from '../../actions.native'; import { setSharedVideoStatus } from '../../actions.native';
import { getYoutubeId } from '../../functions';
import styles from './styles'; import styles from './styles';
@ -101,11 +100,11 @@ type Props = {
dispatch: Function, dispatch: Function,
/** /**
* Youtube url of the video to be played. * Youtube id of the video to be played.
* *
* @private * @private
*/ */
youtubeUrl: string youtubeId: string
}; };
/** /**
@ -200,7 +199,7 @@ class YoutubeLargeVideo extends Component<Props, *> {
_isPlaying, _isPlaying,
_playerHeight, _playerHeight,
_playerWidth, _playerWidth,
youtubeUrl youtubeId
} = this.props; } = this.props;
return ( return (
@ -221,7 +220,7 @@ class YoutubeLargeVideo extends Component<Props, *> {
play = { _isPlaying } play = { _isPlaying }
playbackRate = { 1 } playbackRate = { 1 }
ref = { this.playerRef } ref = { this.playerRef }
videoId = { getYoutubeId(youtubeUrl) } videoId = { youtubeId }
volume = { 50 } volume = { 50 }
webViewProps = {{ webViewProps = {{
bounces: false, bounces: false,
@ -244,7 +243,7 @@ class YoutubeLargeVideo extends Component<Props, *> {
_onReady() { _onReady() {
if (this.props?._isOwner) { if (this.props?._isOwner) {
this.onVideoReady( this.onVideoReady(
this.props.youtubeUrl, this.props.youtubeId,
this.playerRef.current && this.playerRef.current.getCurrentTime(), this.playerRef.current && this.playerRef.current.getCurrentTime(),
this.props._ownerId); this.props._ownerId);
} }
@ -267,11 +266,11 @@ class YoutubeLargeVideo extends Component<Props, *> {
_isStopped, _isStopped,
_ownerId, _ownerId,
_seek, _seek,
youtubeUrl youtubeId
} = this.props; } = this.props;
if (shouldSetNewStatus(_isStopped, _isOwner, status, _isPlaying, time, _seek)) { if (shouldSetNewStatus(_isStopped, _isOwner, status, _isPlaying, time, _seek)) {
this.onVideoChangeEvent(youtubeUrl, status, time, _ownerId); this.onVideoChangeEvent(youtubeId, status, time, _ownerId);
} }
}); });
} }
@ -283,10 +282,10 @@ class YoutubeLargeVideo extends Component<Props, *> {
* @returns {void} * @returns {void}
*/ */
saveRefTime() { saveRefTime() {
const { youtubeUrl, _status, _ownerId } = this.props; const { youtubeId, _status, _ownerId } = this.props;
this.playerRef.current && this.playerRef.current.getCurrentTime().then(time => { this.playerRef.current && this.playerRef.current.getCurrentTime().then(time => {
this.onVideoChangeEvent(youtubeUrl, _status, time, _ownerId); this.onVideoChangeEvent(youtubeId, _status, time, _ownerId);
}); });
} }

View File

@ -6,7 +6,6 @@ import Filmstrip from '../../../../../modules/UI/videolayout/Filmstrip';
import { getLocalParticipant } from '../../../base/participants'; import { getLocalParticipant } from '../../../base/participants';
import { connect } from '../../../base/redux'; import { connect } from '../../../base/redux';
import { getToolboxHeight } from '../../../toolbox/functions.web'; import { getToolboxHeight } from '../../../toolbox/functions.web';
import { getYoutubeId } from '../../functions';
import VideoManager from './VideoManager'; import VideoManager from './VideoManager';
import YoutubeVideoManager from './YoutubeVideoManager'; import YoutubeVideoManager from './YoutubeVideoManager';
@ -38,14 +37,9 @@ type Props = {
isOwner: boolean, isOwner: boolean,
/** /**
* The shared video id * The shared video url
*/ */
sharedVideoId: string, videoUrl: string,
/**
* The shared youtube video id
*/
sharedYoutubeVideoId: string,
} }
/** /**
@ -97,20 +91,17 @@ class SharedVideo extends Component<Props> {
* @returns {Component} * @returns {Component}
*/ */
getManager() { getManager() {
const { const { videoUrl } = this.props;
sharedVideoId,
sharedYoutubeVideoId
} = this.props;
if (!sharedVideoId) { if (!videoUrl) {
return null; return null;
} }
if (sharedYoutubeVideoId) { if (videoUrl.match(/http/)) {
return <YoutubeVideoManager videoId = { sharedYoutubeVideoId } />; return <VideoManager videoId = { videoUrl } />;
} }
return <VideoManager videoId = { sharedVideoId } />; return <YoutubeVideoManager videoId = { videoUrl } />;
} }
/** /**
@ -154,8 +145,7 @@ function _mapStateToProps(state) {
clientWidth, clientWidth,
filmstripVisible: visible, filmstripVisible: visible,
isOwner: ownerId === localParticipant.id, isOwner: ownerId === localParticipant.id,
sharedVideoId: videoUrl, videoUrl
sharedYoutubeVideoId: getYoutubeId(videoUrl)
}; };
} }

View File

@ -8,6 +8,7 @@ import { translate } from '../../../base/i18n';
import { getFieldValue } from '../../../base/react'; import { getFieldValue } from '../../../base/react';
import { connect } from '../../../base/redux'; import { connect } from '../../../base/redux';
import { defaultSharedVideoLink } from '../../constants'; import { defaultSharedVideoLink } from '../../constants';
import { getYoutubeId } from '../../functions';
import AbstractSharedVideoDialog from '../AbstractSharedVideoDialog'; import AbstractSharedVideoDialog from '../AbstractSharedVideoDialog';
/** /**
@ -108,9 +109,10 @@ class SharedVideoDialog extends AbstractSharedVideoDialog<*> {
return false; return false;
} }
const youtubeId = getYoutubeId(link);
const { onPostSubmit } = this.props; const { onPostSubmit } = this.props;
onPostSubmit(link); onPostSubmit(youtubeId || link);
return true; return true;
} }

View File

@ -18,7 +18,7 @@ import {
setSharedVideoStatus setSharedVideoStatus
} from './actions.any'; } from './actions.any';
import { SHARED_VIDEO, VIDEO_PLAYER_PARTICIPANT_NAME } from './constants'; import { SHARED_VIDEO, VIDEO_PLAYER_PARTICIPANT_NAME } from './constants';
import { getYoutubeId, isSharingStatus } from './functions'; import { isSharingStatus } from './functions';
/** /**
* Middleware that captures actions related to video sharing and updates * Middleware that captures actions related to video sharing and updates
@ -126,7 +126,7 @@ function handleSharingVideoStatus(store, videoUrl, { state, time, from, muted },
const oldStatus = getState()['features/shared-video']?.status; const oldStatus = getState()['features/shared-video']?.status;
if (state === 'start' || ![ 'playing', 'pause', 'start' ].includes(oldStatus)) { if (state === 'start' || ![ 'playing', 'pause', 'start' ].includes(oldStatus)) {
const youtubeId = getYoutubeId(videoUrl); const youtubeId = videoUrl.match(/http/) ? false : videoUrl;
const avatarURL = youtubeId ? `https://img.youtube.com/vi/${youtubeId}/0.jpg` : ''; const avatarURL = youtubeId ? `https://img.youtube.com/vi/${youtubeId}/0.jpg` : '';
dispatch(participantJoined({ dispatch(participantJoined({