You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
79 lines
1.8 KiB
79 lines
1.8 KiB
import React, {Component} from 'react';
|
|
import {
|
|
Modal,
|
|
Text,
|
|
TouchableHighlight,
|
|
View,
|
|
Alert,
|
|
StyleSheet,
|
|
TextInput
|
|
} from 'react-native';
|
|
|
|
export default class RoomInput extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.join = this.props.join;;
|
|
|
|
}
|
|
state = {
|
|
modalVisible: false,
|
|
gameText: "",
|
|
userText: ""
|
|
};
|
|
|
|
setModalVisible(visible) {
|
|
this.setState({modalVisible: visible});
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<View>
|
|
<Modal
|
|
visible={this.state.modalVisible}
|
|
onRequestClose={() => {
|
|
Alert.alert('Modal has been closed.');
|
|
}}
|
|
style={styles.modal}>
|
|
<View>
|
|
<Text>Enter Game ID:</Text>
|
|
<TextInput
|
|
style={styles.textInput}
|
|
placeholder="Username"
|
|
onChangeText={(text) => this.setState({userText: text})}
|
|
/>
|
|
<TextInput
|
|
style={styles.textInput}
|
|
placeholder="Game No."
|
|
onChangeText={(texta) => this.setState({gameText: texta})}
|
|
/>
|
|
|
|
|
|
<TouchableHighlight
|
|
onPress={() => {
|
|
this.join(this.state.userText, this.state.gameText);
|
|
this.setModalVisible(!this.state.modalVisible)
|
|
}}>
|
|
<Text>Join</Text>
|
|
</TouchableHighlight>
|
|
|
|
<TouchableHighlight
|
|
onPress={() => {
|
|
this.setModalVisible(!this.state.modalVisible);
|
|
}}>
|
|
<Text>Cancel</Text>
|
|
</TouchableHighlight>
|
|
|
|
</View>
|
|
</Modal>
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
const styles = StyleSheet.create({
|
|
modal: {
|
|
backgroundColor: 'white',
|
|
margin: 15,
|
|
alignItems: undefined,
|
|
justifyContent: undefined,
|
|
}
|
|
}) |