mirror of https://github.com/jitsi/jitsi-meet
Bettenbuk Zoltan
6 years ago
committed by
Zoltan Bettenbuk
parent
7e9df74e60
commit
86d0d4fc22
@ -0,0 +1,3 @@ |
||||
// @flow
|
||||
|
||||
export * from './native'; |
||||
@ -0,0 +1,3 @@ |
||||
// @flow
|
||||
|
||||
export * from './web'; |
||||
@ -0,0 +1,156 @@ |
||||
// @flow
|
||||
|
||||
import React, { Component } from 'react'; |
||||
import { Linking, View } from 'react-native'; |
||||
import { WebView } from 'react-native-webview'; |
||||
import { type Dispatch } from 'redux'; |
||||
|
||||
import { openDialog } from '../../../../base/dialog'; |
||||
import { translate } from '../../../../base/i18n'; |
||||
import { |
||||
HeaderWithNavigation, |
||||
LoadingIndicator, |
||||
SlidingView |
||||
} from '../../../../base/react'; |
||||
import { connect } from '../../../../base/redux'; |
||||
|
||||
import { hideDialInSummary } from '../../../actions'; |
||||
import { getDialInfoPageURLForURIString } from '../../../functions'; |
||||
|
||||
import DialInSummaryErrorDialog from './DialInSummaryErrorDialog'; |
||||
import styles, { INDICATOR_COLOR } from './styles'; |
||||
|
||||
type Props = { |
||||
|
||||
/** |
||||
* The URL to display the summary for. |
||||
*/ |
||||
_summaryUrl: ?string, |
||||
|
||||
dispatch: Dispatch<any> |
||||
}; |
||||
|
||||
/** |
||||
* Implements a React native component that displays the dial in info page for a specific room. |
||||
*/ |
||||
class DialInSummary extends Component<Props> { |
||||
|
||||
/** |
||||
* Initializes a new instance. |
||||
* |
||||
* @inheritdoc |
||||
*/ |
||||
constructor(props: Props) { |
||||
super(props); |
||||
|
||||
this._onCloseView = this._onCloseView.bind(this); |
||||
this._onError = this._onError.bind(this); |
||||
this._onNavigate = this._onNavigate.bind(this); |
||||
this._renderLoading = this._renderLoading.bind(this); |
||||
} |
||||
|
||||
/** |
||||
* Implements React's {@link Component#render()}. |
||||
* |
||||
* @inheritdoc |
||||
*/ |
||||
render() { |
||||
const { _summaryUrl } = this.props; |
||||
|
||||
return ( |
||||
<SlidingView |
||||
position = 'bottom' |
||||
show = { Boolean(_summaryUrl) } > |
||||
<View style = { styles.webViewWrapper }> |
||||
<HeaderWithNavigation |
||||
headerLabelKey = 'info.label' |
||||
onPressBack = { this._onCloseView } /> |
||||
<WebView |
||||
onError = { this._onError } |
||||
onShouldStartLoadWithRequest = { this._onNavigate } |
||||
renderLoading = { this._renderLoading } |
||||
source = {{ uri: getDialInfoPageURLForURIString(_summaryUrl) }} |
||||
startInLoadingState = { true } |
||||
style = { styles.webView } /> |
||||
</View> |
||||
</SlidingView> |
||||
); |
||||
} |
||||
|
||||
_onCloseView: () => void; |
||||
|
||||
/** |
||||
* Closes the view. |
||||
* |
||||
* @returns {void} |
||||
*/ |
||||
_onCloseView() { |
||||
this.props.dispatch(hideDialInSummary()); |
||||
} |
||||
|
||||
_onError: () => void; |
||||
|
||||
/** |
||||
* Callback to handle the error if the page fails to load. |
||||
* |
||||
* @returns {void} |
||||
*/ |
||||
_onError() { |
||||
this.props.dispatch(hideDialInSummary()); |
||||
this.props.dispatch(openDialog(DialInSummaryErrorDialog)); |
||||
} |
||||
|
||||
_onNavigate: Object => Boolean; |
||||
|
||||
/** |
||||
* Callback to intercept navigation inside the webview and make the native app handle the dial requests. |
||||
* |
||||
* NOTE: We don't navigate to anywhere else form that view. |
||||
* |
||||
* @param {any} request - The request object. |
||||
* @returns {boolean} |
||||
*/ |
||||
_onNavigate(request) { |
||||
const { url } = request; |
||||
|
||||
if (url.startsWith('tel:')) { |
||||
Linking.openURL(url); |
||||
this.props.dispatch(hideDialInSummary()); |
||||
} |
||||
|
||||
return url === getDialInfoPageURLForURIString(this.props._summaryUrl); |
||||
} |
||||
|
||||
_renderLoading: () => React$Component<any>; |
||||
|
||||
/** |
||||
* Renders the loading indicator. |
||||
* |
||||
* @returns {React$Component<any>} |
||||
*/ |
||||
_renderLoading() { |
||||
return ( |
||||
<View style = { styles.indicatorWrapper }> |
||||
<LoadingIndicator |
||||
color = { INDICATOR_COLOR } |
||||
size = 'large' /> |
||||
</View> |
||||
); |
||||
} |
||||
} |
||||
|
||||
/** |
||||
* Maps part of the Redux state to the props of this component. |
||||
* |
||||
* @param {Object} state - The Redux state. |
||||
* @returns {{ |
||||
* _summaryUrl: ?string |
||||
* }} |
||||
*/ |
||||
function _mapStateToProps(state) { |
||||
return { |
||||
_summaryUrl: state['features/invite'].summaryUrl |
||||
}; |
||||
} |
||||
|
||||
export default translate(connect(_mapStateToProps)(DialInSummary)); |
||||
@ -0,0 +1,29 @@ |
||||
// @flow
|
||||
|
||||
import React, { Component } from 'react'; |
||||
|
||||
import { AlertDialog } from '../../../../base/dialog'; |
||||
import { translate } from '../../../../base/i18n'; |
||||
import { connect } from '../../../../base/redux'; |
||||
|
||||
/** |
||||
* Dialog to inform the user that we could't fetch the dial-in info page. |
||||
*/ |
||||
class DialInSummaryErrorDialog extends Component<{}> { |
||||
/** |
||||
* Implements React's {@link Component#render()}. |
||||
* |
||||
* @inheritdoc |
||||
* @returns {ReactElement} |
||||
*/ |
||||
render() { |
||||
return ( |
||||
<AlertDialog |
||||
contentKey = 'info.dialInSummaryError' /> |
||||
); |
||||
} |
||||
|
||||
_onSubmit: () => boolean; |
||||
} |
||||
|
||||
export default translate(connect()(DialInSummaryErrorDialog)); |
||||
@ -1 +1,3 @@ |
||||
// @flow
|
||||
|
||||
export { default as DialInSummary } from './DialInSummary'; |
||||
@ -0,0 +1,24 @@ |
||||
// @flow
|
||||
|
||||
import { ColorPalette } from '../../../../base/styles'; |
||||
|
||||
export const INDICATOR_COLOR = ColorPalette.lightGrey; |
||||
|
||||
export default { |
||||
|
||||
indicatorWrapper: { |
||||
alignItems: 'center', |
||||
backgroundColor: ColorPalette.white, |
||||
flex: 1, |
||||
justifyContent: 'center' |
||||
}, |
||||
|
||||
webView: { |
||||
flex: 1 |
||||
}, |
||||
|
||||
webViewWrapper: { |
||||
flex: 1, |
||||
flexDirection: 'column' |
||||
} |
||||
}; |
||||
@ -1,8 +1,8 @@ |
||||
/* @flow */ |
||||
// @flow
|
||||
|
||||
import React, { Component } from 'react'; |
||||
|
||||
import { translate } from '../../../base/i18n'; |
||||
import { translate } from '../../../../base/i18n'; |
||||
|
||||
/** |
||||
* The type of the React {@code Component} props of {@link ConferenceID}. |
||||
@ -1,8 +1,8 @@ |
||||
/* @flow */ |
||||
// @flow
|
||||
|
||||
import React, { Component } from 'react'; |
||||
|
||||
import { translate } from '../../../base/i18n'; |
||||
import { translate } from '../../../../base/i18n'; |
||||
|
||||
import ConferenceID from './ConferenceID'; |
||||
import NumbersList from './NumbersList'; |
||||
@ -1,8 +1,8 @@ |
||||
/* @flow */ |
||||
// @flow
|
||||
|
||||
import React, { Component } from 'react'; |
||||
|
||||
import { translate } from '../../../base/i18n'; |
||||
import { translate } from '../../../../base/i18n'; |
||||
|
||||
type Props = { |
||||
|
||||
@ -0,0 +1,3 @@ |
||||
// @flow
|
||||
|
||||
export { default as DialInSummary } from './DialInSummary'; |
||||
@ -1,6 +1,6 @@ |
||||
// @flow
|
||||
|
||||
export * from './add-people-dialog'; |
||||
export { DialInSummary } from './dial-in-summary'; |
||||
export * from './dial-in-summary'; |
||||
export * from './info-dialog'; |
||||
export * from './callee-info'; |
||||
|
||||
Loading…
Reference in new issue