138 lines
4.3 KiB
JavaScript
138 lines
4.3 KiB
JavaScript
import React from 'react';
|
|
import { TextInput, TouchableHighlight, View } from 'react-native';
|
|
import { connect } from 'react-redux';
|
|
|
|
import { translate } from '../../base/i18n';
|
|
import { Link, Text } from '../../base/react';
|
|
import { ColorPalette } from '../../base/styles';
|
|
|
|
import { AbstractWelcomePage, _mapStateToProps } from './AbstractWelcomePage';
|
|
import styles from './styles';
|
|
|
|
/**
|
|
* The URL at which the privacy policy is available to the user.
|
|
*/
|
|
const PRIVACY_URL = 'https://jitsi.org/meet/privacy';
|
|
|
|
/**
|
|
* The URL at which the user may send feedback.
|
|
*/
|
|
const SEND_FEEDBACK_URL = 'mailto:support@jitsi.org';
|
|
|
|
/**
|
|
* The URL at which the terms (of service/use) are available to the user.
|
|
*/
|
|
const TERMS_URL = 'https://jitsi.org/meet/terms';
|
|
|
|
/**
|
|
* The native container rendering the welcome page.
|
|
*
|
|
* @extends AbstractWelcomePage
|
|
*/
|
|
class WelcomePage extends AbstractWelcomePage {
|
|
/**
|
|
* WelcomePage component's property types.
|
|
*
|
|
* @static
|
|
*/
|
|
static propTypes = AbstractWelcomePage.propTypes
|
|
|
|
/**
|
|
* Renders a prompt for entering a room name.
|
|
*
|
|
* @returns {ReactElement}
|
|
*/
|
|
render() {
|
|
return (
|
|
<View style = { styles.container }>
|
|
{
|
|
this._renderLocalVideo()
|
|
}
|
|
{
|
|
this._renderLocalVideoOverlay()
|
|
}
|
|
</View>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Renders legal-related content such as Terms of service/use, Privacy
|
|
* policy, etc.
|
|
*
|
|
* @private
|
|
* @returns {ReactElement}
|
|
*/
|
|
_renderLegalese() {
|
|
const { t } = this.props;
|
|
|
|
return (
|
|
<View style = { styles.legaleseContainer }>
|
|
<Link
|
|
style = { styles.legaleseItem }
|
|
url = { TERMS_URL }>
|
|
{ t('welcomepage.terms') }
|
|
</Link>
|
|
<Link
|
|
style = { styles.legaleseItem }
|
|
url = { PRIVACY_URL }>
|
|
{ t('welcomepage.privacy') }
|
|
</Link>
|
|
<Link
|
|
style = { styles.legaleseItem }
|
|
url = { SEND_FEEDBACK_URL }>
|
|
{ t('welcomepage.sendFeedback') }
|
|
</Link>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Renders a View over the local video. The latter is thought of as the
|
|
* background (content) of this WelcomePage. The former is thought of as the
|
|
* foreground (content) of this WelcomePage such as the room name input, the
|
|
* button to initiate joining the specified room, etc.
|
|
*
|
|
* @private
|
|
* @returns {ReactElement}
|
|
*/
|
|
_renderLocalVideoOverlay() {
|
|
const { t } = this.props;
|
|
|
|
return (
|
|
<View style = { styles.localVideoOverlay }>
|
|
<View style = { styles.roomContainer }>
|
|
<Text style = { styles.title }>
|
|
{ t('welcomepage.roomname') }
|
|
</Text>
|
|
<TextInput
|
|
accessibilityLabel = { 'Input room name.' }
|
|
autoCapitalize = 'none'
|
|
autoComplete = { false }
|
|
autoCorrect = { false }
|
|
autoFocus = { false }
|
|
onChangeText = { this._onRoomChange }
|
|
placeholder = { t('welcomepage.roomnamePlaceHolder') }
|
|
style = { styles.textInput }
|
|
underlineColorAndroid = 'transparent'
|
|
value = { this.state.room } />
|
|
<TouchableHighlight
|
|
accessibilityLabel = { 'Tap to Join.' }
|
|
disabled = { this._isJoinDisabled() }
|
|
onPress = { this._onJoin }
|
|
style = { styles.button }
|
|
underlayColor = { ColorPalette.white }>
|
|
<Text style = { styles.buttonText }>
|
|
{ t('welcomepage.join') }
|
|
</Text>
|
|
</TouchableHighlight>
|
|
</View>
|
|
{
|
|
this._renderLegalese()
|
|
}
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default translate(connect(_mapStateToProps)(WelcomePage));
|