1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
import * as React from 'react';
import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
import * as SecureStore from 'expo-secure-store';
import Dialog from "react-native-dialog";
import * as WebBrowser from 'expo-web-browser';
// import * as ImageManipulator from "expo-image-manipulator";
export default class Settings extends React.Component {
constructor(props) {
super(props)
this.state = { ip: ":", dialogVisible: false }
this.toggleDialog = this.toggleDialog.bind(this)
}
async componentDidMount() {
this.setState({ ip: await getIp(true) })
}
toggleDialog() {
this.setState({ dialogVisible: !this.state.dialogVisible })
}
render() {
const [ip, port] = this.state.ip.split(":");
let [cip, cpo] = [ip, port]
const saveIP = async () => {
const ip = cip + ":" + cpo
await setIp(ip)
this.setState({ ip })
this.toggleDialog()
}
return (
<View style={styles.cont}>
<View><Text style={styles.h1}>Current IP: {ip}{"\n"}Current port: {port}</Text></View>
<TouchableOpacity onPress={this.toggleDialog}><Text style={styles.h1b}>New IP & PORT</Text></TouchableOpacity>
<TouchableOpacity onPress={() => WebBrowser.openBrowserAsync("http://" + this.state.ip)}><Text style={styles.h1b}>Open web app</Text></TouchableOpacity>
<Dialog.Container visible={this.state.dialogVisible}>
<Dialog.Title>New IP & PORT</Dialog.Title>
<Dialog.Input onChangeText={c => cip = c} label="IP" defaultValue={ip} />
<Dialog.Input onChangeText={c => cpo = c} label="PORT" defaultValue={port} />
<Dialog.Button label="Cancel" onPress={this.toggleDialog} />
<Dialog.Button label="Save" onPress={saveIP} />
</Dialog.Container>
</View >
)
}
}
export async function getIp(skipProtocol = false) {
return (skipProtocol ? "" : "http://") + (await SecureStore.getItemAsync("ip") ?? "192.168.0.118:8000")
}
export async function setIp(ip) {
await SecureStore.setItemAsync("ip", ip)
}
const styles = StyleSheet.create({
cont: {
flexDirection: "column",
backgroundColor: "black",
justifyContent: "space-evenly",
alignItems: "center",
height: "100%",
},
h1: {
color: "white",
fontSize: 23,
// height: 60,
},
h1b: {
color: "white",
fontSize: 25,
fontWeight: "bold",
// height: 32,
},
span: {
color: "white",
fontSize: 22,
},
})
|
