|
|
@ -12,7 +12,6 @@ import { |
|
|
|
BlueCard, |
|
|
|
BlueNavigationStyle, |
|
|
|
BlueText, |
|
|
|
BlueButtonLink, |
|
|
|
} from '../../BlueComponents'; |
|
|
|
import { Badge } from 'react-native-elements'; |
|
|
|
import PropTypes from 'prop-types'; |
|
|
@ -86,111 +85,113 @@ export default class ElectrumSettings extends Component { |
|
|
|
render() { |
|
|
|
return ( |
|
|
|
<SafeBlueArea forceInset={{ horizontal: 'always' }} style={{ flex: 1 }}> |
|
|
|
<ScrollView> |
|
|
|
<BlueCard> |
|
|
|
<BlueText style={{ textAlign: "center", color: "#9AA0AA", marginBottom: 4, }}>Status</BlueText> |
|
|
|
<View style={{ width: 'auto', height: 34, flexWrap: 'wrap', justifyContent: 'center', flexDirection: 'row', }}> |
|
|
|
<Badge containerStyle={{ |
|
|
|
backgroundColor: this.state.config.status === 1 ? '#D2F8D6' : '#F8D2D2', |
|
|
|
paddingTop: 6, |
|
|
|
paddingBottom: 6, |
|
|
|
paddingLeft: 16, |
|
|
|
paddingRight: 16, |
|
|
|
borderRadius: 20, |
|
|
|
|
|
|
|
}} |
|
|
|
> |
|
|
|
<BlueText style={{ fontWeight: "600", color: this.state.config.status === 1 ? '#37C0A1' : '#D0021B', }}> |
|
|
|
{(this.state.config.status === 1 && 'Connected') || 'Not Connected'} |
|
|
|
</BlueText> |
|
|
|
</Badge> |
|
|
|
<ScrollView> |
|
|
|
<BlueCard> |
|
|
|
<BlueText style={{ textAlign: 'center', color: '#9AA0AA', marginBottom: 4 }}>Status</BlueText> |
|
|
|
<View style={{ width: 'auto', height: 34, flexWrap: 'wrap', justifyContent: 'center', flexDirection: 'row' }}> |
|
|
|
<Badge |
|
|
|
containerStyle={{ |
|
|
|
backgroundColor: this.state.config.status === 1 ? '#D2F8D6' : '#F8D2D2', |
|
|
|
paddingTop: 6, |
|
|
|
paddingBottom: 6, |
|
|
|
paddingLeft: 16, |
|
|
|
paddingRight: 16, |
|
|
|
borderRadius: 20, |
|
|
|
}} |
|
|
|
> |
|
|
|
<BlueText style={{ fontWeight: '600', color: this.state.config.status === 1 ? '#37C0A1' : '#D0021B' }}> |
|
|
|
{(this.state.config.status === 1 && 'Connected') || 'Not Connected'} |
|
|
|
</BlueText> |
|
|
|
</Badge> |
|
|
|
</View> |
|
|
|
<BlueSpacing20 /> |
|
|
|
<BlueText style={{ textAlign: 'center', color: '#0C2550' }} onPress={this.checkServer}> |
|
|
|
{this.state.config.host}:{this.state.config.port} |
|
|
|
</BlueText> |
|
|
|
<BlueSpacing20 /> |
|
|
|
</BlueCard> |
|
|
|
<BlueCard> |
|
|
|
<BlueText style={{ color: '#9AA0AA', marginBottom: -24 }}>{loc.settings.electrum_settings_explain}</BlueText> |
|
|
|
</BlueCard> |
|
|
|
<BlueCard> |
|
|
|
<View |
|
|
|
style={{ |
|
|
|
flexDirection: 'row', |
|
|
|
borderColor: '#d2d2d2', |
|
|
|
borderBottomColor: '#d2d2d2', |
|
|
|
borderWidth: 1.0, |
|
|
|
borderBottomWidth: 0.5, |
|
|
|
backgroundColor: '#f5f5f5', |
|
|
|
minHeight: 44, |
|
|
|
height: 44, |
|
|
|
alignItems: 'center', |
|
|
|
borderRadius: 4, |
|
|
|
}} |
|
|
|
> |
|
|
|
<TextInput |
|
|
|
placeholder={'host, for example 111.222.333.444'} |
|
|
|
value={this.state.host} |
|
|
|
onChangeText={text => this.setState({ host: text })} |
|
|
|
numberOfLines={1} |
|
|
|
style={{ flex: 1, marginHorizontal: 8, minHeight: 36, height: 36 }} |
|
|
|
editable={!this.state.isLoading} |
|
|
|
underlineColorAndroid="transparent" |
|
|
|
/> |
|
|
|
</View> |
|
|
|
<BlueSpacing20 /> |
|
|
|
<View |
|
|
|
style={{ |
|
|
|
flexDirection: 'row', |
|
|
|
borderColor: '#d2d2d2', |
|
|
|
borderBottomColor: '#d2d2d2', |
|
|
|
borderWidth: 1.0, |
|
|
|
borderBottomWidth: 0.5, |
|
|
|
backgroundColor: '#f5f5f5', |
|
|
|
minHeight: 44, |
|
|
|
height: 44, |
|
|
|
alignItems: 'center', |
|
|
|
borderRadius: 4, |
|
|
|
}} |
|
|
|
> |
|
|
|
<TextInput |
|
|
|
placeholder={'TCP port, usually 50001'} |
|
|
|
value={this.state.port} |
|
|
|
onChangeText={text => this.setState({ port: text })} |
|
|
|
numberOfLines={1} |
|
|
|
style={{ flex: 1, marginHorizontal: 8, minHeight: 36, height: 36 }} |
|
|
|
editable={!this.state.isLoading} |
|
|
|
underlineColorAndroid="transparent" |
|
|
|
/> |
|
|
|
</View> |
|
|
|
<BlueSpacing20 /> |
|
|
|
<View |
|
|
|
style={{ |
|
|
|
flexDirection: 'row', |
|
|
|
borderColor: '#d2d2d2', |
|
|
|
borderBottomColor: '#d2d2d2', |
|
|
|
borderWidth: 1.0, |
|
|
|
borderBottomWidth: 0.5, |
|
|
|
backgroundColor: '#f5f5f5', |
|
|
|
minHeight: 44, |
|
|
|
height: 44, |
|
|
|
alignItems: 'center', |
|
|
|
borderRadius: 4, |
|
|
|
}} |
|
|
|
> |
|
|
|
<TextInput |
|
|
|
placeholder={'SSL port, usually 50002'} |
|
|
|
value={this.state.sslPort} |
|
|
|
onChangeText={text => this.setState({ sslPort: text })} |
|
|
|
numberOfLines={1} |
|
|
|
style={{ flex: 1, marginHorizontal: 8, minHeight: 36, height: 36 }} |
|
|
|
editable={!this.state.isLoading} |
|
|
|
underlineColorAndroid="transparent" |
|
|
|
/> |
|
|
|
</View> |
|
|
|
<BlueSpacing20 /> |
|
|
|
<BlueText style={{ textAlign: "center", color: "#0C2550" }} onPress={this.checkServer}>{this.state.config.host}:{this.state.config.port}</BlueText> |
|
|
|
<BlueSpacing20 /> |
|
|
|
</BlueCard> |
|
|
|
<BlueCard> |
|
|
|
<BlueText style={{ color: "#9AA0AA", marginBottom: -24 }}>{loc.settings.electrum_settings_explain}</BlueText> |
|
|
|
</BlueCard> |
|
|
|
<BlueCard> |
|
|
|
<View |
|
|
|
style={{ |
|
|
|
flexDirection: 'row', |
|
|
|
borderColor: '#d2d2d2', |
|
|
|
borderBottomColor: '#d2d2d2', |
|
|
|
borderWidth: 1.0, |
|
|
|
borderBottomWidth: 0.5, |
|
|
|
backgroundColor: '#f5f5f5', |
|
|
|
minHeight: 44, |
|
|
|
height: 44, |
|
|
|
alignItems: 'center', |
|
|
|
borderRadius: 4, |
|
|
|
}} |
|
|
|
> |
|
|
|
<TextInput |
|
|
|
placeholder={'host, for example 111.222.333.444'} |
|
|
|
value={this.state.host} |
|
|
|
onChangeText={text => this.setState({ host: text })} |
|
|
|
numberOfLines={1} |
|
|
|
style={{ flex: 1, marginHorizontal: 8, minHeight: 36, height: 36 }} |
|
|
|
editable={!this.state.isLoading} |
|
|
|
underlineColorAndroid="transparent" |
|
|
|
/> |
|
|
|
</View> |
|
|
|
<BlueSpacing20 /> |
|
|
|
<View |
|
|
|
style={{ |
|
|
|
flexDirection: 'row', |
|
|
|
borderColor: '#d2d2d2', |
|
|
|
borderBottomColor: '#d2d2d2', |
|
|
|
borderWidth: 1.0, |
|
|
|
borderBottomWidth: 0.5, |
|
|
|
backgroundColor: '#f5f5f5', |
|
|
|
minHeight: 44, |
|
|
|
height: 44, |
|
|
|
alignItems: 'center', |
|
|
|
borderRadius: 4, |
|
|
|
}} |
|
|
|
> |
|
|
|
<TextInput |
|
|
|
placeholder={'TCP port, usually 50001'} |
|
|
|
value={this.state.port} |
|
|
|
onChangeText={text => this.setState({ port: text })} |
|
|
|
numberOfLines={1} |
|
|
|
style={{ flex: 1, marginHorizontal: 8, minHeight: 36, height: 36 }} |
|
|
|
editable={!this.state.isLoading} |
|
|
|
underlineColorAndroid="transparent" |
|
|
|
/> |
|
|
|
</View> |
|
|
|
<BlueSpacing20 /> |
|
|
|
<View |
|
|
|
style={{ |
|
|
|
flexDirection: 'row', |
|
|
|
borderColor: '#d2d2d2', |
|
|
|
borderBottomColor: '#d2d2d2', |
|
|
|
borderWidth: 1.0, |
|
|
|
borderBottomWidth: 0.5, |
|
|
|
backgroundColor: '#f5f5f5', |
|
|
|
minHeight: 44, |
|
|
|
height: 44, |
|
|
|
alignItems: 'center', |
|
|
|
borderRadius: 4, |
|
|
|
}} |
|
|
|
> |
|
|
|
<TextInput |
|
|
|
placeholder={'SSL port, usually 50002'} |
|
|
|
value={this.state.sslPort} |
|
|
|
onChangeText={text => this.setState({ sslPort: text })} |
|
|
|
numberOfLines={1} |
|
|
|
style={{ flex: 1, marginHorizontal: 8, minHeight: 36, height: 36 }} |
|
|
|
editable={!this.state.isLoading} |
|
|
|
underlineColorAndroid="transparent" |
|
|
|
/> |
|
|
|
</View> |
|
|
|
|
|
|
|
<BlueSpacing20 /> |
|
|
|
{this.state.isLoading ? <BlueLoading /> : <BlueButton onPress={this.save} title={loc.settings.save} />} |
|
|
|
</BlueCard> |
|
|
|
<BlueSpacing20 /> |
|
|
|
{this.state.isLoading ? <BlueLoading /> : <BlueButton onPress={this.save} title={loc.settings.save} />} |
|
|
|
</BlueCard> |
|
|
|
</ScrollView> |
|
|
|
</SafeBlueArea> |
|
|
|
); |
|
|
|