verdnatura-chat/app/views/JitsiMeetView.tsx

155 lines
4.5 KiB
TypeScript
Raw Normal View History

import React from 'react';
import { BackHandler, StyleSheet } from 'react-native';
import JitsiMeet, { JitsiMeetView as RNJitsiMeetView } from 'react-native-jitsi-meet';
import BackgroundTimer from 'react-native-background-timer';
2020-02-18 14:06:14 +00:00
import { connect } from 'react-redux';
2020-02-18 14:06:14 +00:00
import { getUserSelector } from '../selectors/login';
import ActivityIndicator from '../containers/ActivityIndicator';
import { events, logEvent } from '../lib/methods/helpers/log';
import { isAndroid, isIOS } from '../lib/methods/helpers';
import { withTheme } from '../theme';
import { ChatsStackParamList } from '../stacks/types';
import { IApplicationState, IUser, IBaseScreen } from '../definitions';
import { Services } from '../lib/services';
const formatUrl = (url: string, baseUrl: string, uriSize: number, avatarAuthURLFragment: string) =>
`${baseUrl}/avatar/${url}?format=png&width=${uriSize}&height=${uriSize}${avatarAuthURLFragment}`;
interface IJitsiMeetViewState {
userInfo: {
displayName: string;
avatar: string;
};
loading: boolean;
}
interface IJitsiMeetViewProps extends IBaseScreen<ChatsStackParamList, 'JitsiMeetView'> {
baseUrl: string;
user: IUser;
}
class JitsiMeetView extends React.Component<IJitsiMeetViewProps, IJitsiMeetViewState> {
private rid: string;
private url: string;
private videoConf: boolean;
private jitsiTimeout: number | null;
constructor(props: IJitsiMeetViewProps) {
super(props);
[CHORE] Update react-navigation to v5 (#2154) * react-navigation v5 installed * compiling * Outside working * InsideStack compiling * Switch stack * Starting room * RoomView header * SafeAreaView * Slide from right stack animation * stash * Fix params * Create channel * inapp notification * Custom status * Add server working * Refactor appStart * Attachment * in-app notification * AuthLoadingView * Remove compat * Navigation * Outside animations * Fix new server icon * block modal * AttachmentView header * Remove unnecessary code * SelectedUsersView header * StatusView * CreateDiscussionView * RoomInfoView * RoomInfoEditView style * RoomMembersView * RoomsListView header * RoomView header * Share extension * getParam * Focus/blur * Trying to fix inapp * Lint * Simpler app container * Update libs * Revert "Simpler app container" This reverts commit 1e49d80bb49481c34f415831b9da5e9d53e66057. * Load messages faster * Fix safearea on ReactionsModal * Update safe area to v3 * lint * Fix transition * stash - drawer replace working * stash - modal nav * RoomActionsView as tablet modal * RoomStack * Stop showing RoomView header when there's no room * Custom Header and different navigation based on stack * Refactor setHeader * MasterDetailContext * RoomView header * Fix isMasterDetail rule * KeyCommands kind of working * Create channel on tablet * RoomView sCU * Remove withSplit * Settings opening as modal * Settings * StatusView headerLeft * Admin panel * TwoFactor style * DirectoryView * ServerDropdown and SortDropdown animations * ThreadMessagesView * Navigate to empty RoomView on server switch when in master detail * ProfileView header * Fix navigation issues * Nav to any room info on tablet * Room info * Refactoring * Fix rooms search * Roomslist commands * SearchMessagesView close modal * Key commands * Fix undefined subscription * Disallow navigate to focused room * isFocused state on RoomsListView * Blur text inputs when focus is lost * Replace animation * Default nav theme * Refactoring * Always open Attachment with close modal button * ModalContainer backdrop following themes * Screen tracking * Refactor get active route for in-app notification * Only mark room as focused when in master detail layout * Lint * Open modals as fade from bottom on Android * typo * Fixing tests * Fix in-app update * Fixing goRoom issues * Refactor stack names * Fix unreadsCount * Fix stack * Fix header animation * Refactor ShareNavigation * Refactor navigation theme * Make sure title is set * Fix create discussion navigation * Remove unused variable * Create discussions from actions fixed * Layout animation * Screen lock on share extension * Unnecessary change * Admin border * Set header after state callback * Fix key commands on outside stack * Fix back button pressed * Remove layout animations from Android * Tweak animations on Android * Disable swipe gesture to open drawer * Fix current item on RoomsListView * Fix add server * Fix drawer * Fix broadcast * LayoutAnimation instead of Transitions * Fix onboarding back press * Fix assorted tests * Create discussion fix * RoomInfoView header * Drawer active item
2020-06-15 14:00:46 +00:00
this.rid = props.route.params?.rid;
this.url = props.route.params?.url;
this.videoConf = !!props.route.params?.videoConf;
this.jitsiTimeout = null;
const { user, baseUrl } = props;
const { name, id: userId, token, username } = user;
const avatarAuthURLFragment = `&rc_token=${token}&rc_uid=${userId}`;
2020-02-18 14:06:14 +00:00
const avatar = formatUrl(username, baseUrl, 100, avatarAuthURLFragment);
this.state = {
userInfo: {
displayName: name as string,
2020-02-18 14:06:14 +00:00
avatar
},
loading: true
};
}
componentDidMount() {
const { route } = this.props;
const { userInfo } = this.state;
setTimeout(() => {
this.setState({ loading: false });
}, 1000);
if (isIOS) {
setTimeout(() => {
const onlyAudio = route.params?.onlyAudio ?? false;
if (onlyAudio) {
JitsiMeet.audioCall(this.url, userInfo);
} else {
JitsiMeet.call(this.url, userInfo);
}
}, 1000);
}
BackHandler.addEventListener('hardwareBackPress', () => null);
}
componentWillUnmount() {
logEvent(events.JM_CONFERENCE_TERMINATE);
if (this.jitsiTimeout && !this.videoConf) {
BackgroundTimer.clearInterval(this.jitsiTimeout);
this.jitsiTimeout = null;
BackgroundTimer.stopBackgroundTimer();
}
BackHandler.removeEventListener('hardwareBackPress', () => null);
if (isIOS) {
JitsiMeet.endCall();
}
}
endCall = () => {
JitsiMeet.endCall();
return null;
};
onConferenceWillJoin = () => {
this.setState({ loading: false });
};
// Jitsi Update Timeout needs to be called every 10 seconds to make sure
// call is not ended and is available to web users.
onConferenceJoined = () => {
logEvent(this.videoConf ? events.LIVECHAT_VIDEOCONF_JOIN : events.JM_CONFERENCE_JOIN);
this.setState({ loading: false });
if (this.rid && !this.videoConf) {
Services.updateJitsiTimeout(this.rid).catch((e: unknown) => console.log(e));
if (this.jitsiTimeout) {
BackgroundTimer.clearInterval(this.jitsiTimeout);
BackgroundTimer.stopBackgroundTimer();
this.jitsiTimeout = null;
}
this.jitsiTimeout = BackgroundTimer.setInterval(() => {
Services.updateJitsiTimeout(this.rid).catch((e: unknown) => console.log(e));
}, 10000);
}
};
onConferenceTerminated = () => {
logEvent(this.videoConf ? events.LIVECHAT_VIDEOCONF_TERMINATE : events.JM_CONFERENCE_TERMINATE);
const { navigation } = this.props;
// fix to go back when the call ends
setTimeout(() => {
JitsiMeet.endCall();
navigation.pop();
}, 200);
};
render() {
const { userInfo, loading } = this.state;
const { route } = this.props;
const onlyAudio = route.params?.onlyAudio ?? false;
const options = isAndroid ? { url: this.url, userInfo, audioOnly: onlyAudio } : null;
return (
<>
<RNJitsiMeetView
onConferenceWillJoin={this.onConferenceWillJoin}
onConferenceTerminated={this.onConferenceTerminated}
onConferenceJoined={this.onConferenceJoined}
style={StyleSheet.absoluteFill}
options={options}
/>
{loading ? <ActivityIndicator /> : null}
</>
);
}
}
const mapStateToProps = (state: IApplicationState) => ({
2020-02-18 14:06:14 +00:00
user: getUserSelector(state),
baseUrl: state.server.server
});
export default connect(mapStateToProps)(withTheme(JitsiMeetView));