|
|
@@ -1,277 +1,296 @@
|
|
1
|
|
-import React, {useState} from 'react';
|
|
2
|
|
-import { View, Text, Pressable, StyleSheet} from 'react-native';
|
|
3
|
|
-import DropDownPicker from 'react-native-dropdown-picker';
|
|
4
|
|
-import {styles} from "./styles"
|
|
5
|
|
-
|
|
6
|
|
-const queryBase = "https://api.census.gov/data/2020/acs/acs5/profile?get=group"
|
|
7
|
|
-const queryEnd = "&in=state:72"
|
|
8
|
|
-var table = ""
|
|
9
|
|
-var pueblo = ""
|
|
10
|
|
-
|
|
11
|
|
-//where data will be stored
|
|
12
|
|
-var information = "data goes here"
|
|
13
|
|
-
|
|
14
|
|
-function Picker() {
|
|
15
|
|
-
|
|
16
|
|
- //table to pick from
|
|
17
|
|
-
|
|
18
|
|
-
|
|
19
|
|
- const [openTable, setOpenTable] = useState(false);
|
|
20
|
|
- const [valueTable, setValueTable] = useState(null);
|
|
21
|
|
- const [table, setTable] = useState([
|
|
22
|
|
- {label:'DP02PR', value: 'DP02PR'},
|
|
23
|
|
- {label:'DP03', value: 'DP03'},
|
|
24
|
|
- {label:'DP04', value: 'DP04'},
|
|
25
|
|
- {label:'DP05', value: 'DP05'},
|
|
26
|
|
- ]);
|
|
27
|
|
-
|
|
28
|
|
- //cambiar pueblo
|
|
29
|
|
-
|
|
30
|
|
-
|
|
31
|
|
- //pueblo
|
|
32
|
|
- const [openPueblo, setOpenPueblo] = useState(false);
|
|
33
|
|
- const [valuePueblo, setValuePueblo] = useState(null);
|
|
34
|
|
- const [pueblo, setPueblo] = useState([
|
|
35
|
|
- {label: 'Adjuntas', value: '001'},
|
|
36
|
|
- {label: 'Aguada', value: '003'},
|
|
37
|
|
- {label: 'Aguadillas', value: '005'},
|
|
38
|
|
- {label: 'Aguas Buenas', value: '007'},
|
|
39
|
|
- {label: 'Aibonito', value: '009'},
|
|
40
|
|
- {label: 'Añasco', value: '011'},
|
|
41
|
|
- {label: 'Arecibo', value: '013'},
|
|
42
|
|
- {label: 'Arroyo', value: '015'},
|
|
43
|
|
- {label: 'Barceloneta', value: '017'},
|
|
44
|
|
- {label: 'Barranquitas', value: '019'},
|
|
45
|
|
- {label: 'Bayamón', value: '021'},
|
|
46
|
|
- {label: 'Cabo Rojo', value: '023'},
|
|
47
|
|
- {label: 'Caguas', value: '025'},
|
|
48
|
|
- {label: 'Camuy', value: '027'},
|
|
49
|
|
- {label: 'Canóvanas', value: '029'},
|
|
50
|
|
- {label: 'Carolina', value: '031'},
|
|
51
|
|
- {label: 'Cataño', value: '033'},
|
|
52
|
|
- {label: 'Cayey', value: '035'},
|
|
53
|
|
- {label: 'Ceiba', value: '037'},
|
|
54
|
|
- {label: 'Ciales', value: '039'},
|
|
55
|
|
- {label: 'Cidra', value: '041'},
|
|
56
|
|
- {label: 'Coamo', value: '043'},
|
|
57
|
|
- {label: 'Comerío', value: '045'},
|
|
58
|
|
- {label: 'Corozal', value: '047'},
|
|
59
|
|
- {label: 'Culebra', value: '049'},
|
|
60
|
|
- {label: 'Dorado', value: '051'},
|
|
61
|
|
- {label: 'Fajardo', value: '053'},
|
|
62
|
|
- {label: 'Florida', value: '054'},
|
|
63
|
|
- {label: 'Guánica', value: '055'},
|
|
64
|
|
- {label: 'Guayama', value: '057'},
|
|
65
|
|
- {label: 'Guayanilla', value: '059'},
|
|
66
|
|
- {label: 'Guaynabo', value: '061'},
|
|
67
|
|
- {label: 'Gurabo', value: '063'},
|
|
68
|
|
- {label: 'Hatillo', value: '065'},
|
|
69
|
|
- {label: 'Hormigueros', value: '067'},
|
|
70
|
|
- {label: 'Humacao', value: '069'},
|
|
71
|
|
- {label: 'Isabela', value: '071'},
|
|
72
|
|
- {label: 'Jayuya', value: '073'},
|
|
73
|
|
- {label: 'Juana Díaz', value: '075'},
|
|
74
|
|
- {label: 'Juncos', value: '077'},
|
|
75
|
|
- {label: 'Lajas', value: '079'},
|
|
76
|
|
- {label: 'Lares', value: '081'},
|
|
77
|
|
- {label: 'Las Marías', value: '083'},
|
|
78
|
|
- {label: 'Las Piedras', value: '085'},
|
|
79
|
|
- {label: 'Loíza', value: '087'},
|
|
80
|
|
- {label: 'Luquillo', value: '089'},
|
|
81
|
|
- {label: 'Manatí', value: '091'},
|
|
82
|
|
- {label: 'Maricao', value: '093'},
|
|
83
|
|
- {label: 'Maunabo', value: '095'},
|
|
84
|
|
- {label: 'Mayagüez', value: '097'},
|
|
85
|
|
- {label: 'Moca', value: '099'},
|
|
86
|
|
- {label: 'Morovis', value: '101'},
|
|
87
|
|
- {label: 'Naguabo', value: '103'},
|
|
88
|
|
- {label: 'Naranjito', value: '105'},
|
|
89
|
|
- {label: 'Orocovis', value: '107'},
|
|
90
|
|
- {label: 'Patillas', value: '109'},
|
|
91
|
|
- {label: 'Peñuelas', value: '111'},
|
|
92
|
|
- {label: 'Ponce', value: '113'},
|
|
93
|
|
- {label: 'Quebradillas', value: '115'},
|
|
94
|
|
- {label: 'Rincón', value: '117'},
|
|
95
|
|
- {label: 'Río Grande', value: '119'},
|
|
96
|
|
- {label: 'Sabana Grande', value: '121'},
|
|
97
|
|
- {label: 'Salinas', value: '123'},
|
|
98
|
|
- {label: 'San Germán', value: '125'},
|
|
99
|
|
- {label: 'San Juan', value: '127'},
|
|
100
|
|
- {label: 'San Lorenzo', value: '129'},
|
|
101
|
|
- {label: 'San Sebastián', value: '131'},
|
|
102
|
|
- {label: 'Santa Isabel', value: '133'},
|
|
103
|
|
- {label: 'Toa Alta', value: '135'},
|
|
104
|
|
- {label: 'Toa Baja', value: '137'},
|
|
105
|
|
- {label: 'Trujillo Alto', value: '139'},
|
|
106
|
|
- {label: 'Utuado', value: '141'},
|
|
107
|
|
- {label: 'Vega Alta', value: '143'},
|
|
108
|
|
- {label: 'Vega Baja', value: '145'},
|
|
109
|
|
- {label: 'Vieques', value: '147'},
|
|
110
|
|
- {label: 'Villalba', value: '149'},
|
|
111
|
|
- {label: 'Yabucoa', value: '151'},
|
|
112
|
|
- {label: 'Yauco', value: '153'}
|
|
113
|
|
- ]);
|
|
114
|
|
-
|
|
115
|
|
-
|
|
116
|
|
- return (
|
|
117
|
|
- <View>
|
|
118
|
|
- <DropDownPicker
|
|
119
|
|
- open={openTable}
|
|
120
|
|
- value={valueTable}
|
|
121
|
|
- items={table}
|
|
122
|
|
- setOpen={setOpenTable}
|
|
123
|
|
- setValue={setValueTable}
|
|
124
|
|
- setItems={setTable}
|
|
125
|
|
- onChangeValue = {(valueTable) => {
|
|
126
|
|
- updateTable(valueTable);
|
|
127
|
|
- }}
|
|
128
|
|
- onOpen = {() => {setOpenPueblo(false)}}
|
|
129
|
|
- zIndex={3000}
|
|
130
|
|
- zIndexInverse={1000}
|
|
131
|
|
- placeholder="Tabla de Datos"
|
|
132
|
|
- />
|
|
133
|
|
-
|
|
134
|
|
-
|
|
135
|
|
- <DropDownPicker
|
|
136
|
|
- searchable={true}
|
|
137
|
|
- open={openPueblo}
|
|
138
|
|
- value={valuePueblo}
|
|
139
|
|
- items={pueblo}
|
|
140
|
|
- setOpen={setOpenPueblo}
|
|
141
|
|
- setValue={setValuePueblo}
|
|
142
|
|
- setItems={setPueblo}
|
|
143
|
|
- onChangeValue = {(valuePueblo) => {
|
|
144
|
|
- updatePueblo(valuePueblo);
|
|
145
|
|
- }}
|
|
146
|
|
- onOpen = {() => {setOpenTable(false)}}
|
|
147
|
|
- zIndex={1000}
|
|
148
|
|
- zIndexInverse={3000}
|
|
149
|
|
- placeholder="Pueblo"
|
|
150
|
|
- searchPlaceholder="Busqueda..."
|
|
151
|
|
- />
|
|
152
|
|
-
|
|
153
|
|
- </View>
|
|
154
|
|
-
|
|
155
|
|
- );
|
|
156
|
|
-}
|
|
157
|
|
-
|
|
158
|
|
-
|
|
159
|
|
-
|
|
160
|
|
-function updateTable(value){
|
|
161
|
|
- table = value
|
|
162
|
|
-}
|
|
163
|
|
-
|
|
164
|
|
-function updatePueblo(value){
|
|
165
|
|
- pueblo = value
|
|
166
|
|
-}
|
|
167
|
|
-
|
|
168
|
|
-//calls data query
|
|
169
|
|
-function loadDoc(query) {
|
|
170
|
|
- var xhttp = new XMLHttpRequest();
|
|
171
|
|
- xhttp.onreadystatechange = function() {
|
|
172
|
|
- if (this.readyState == 4 && this.status == 200) {
|
|
173
|
|
- information = this.responseText;
|
|
174
|
|
- organize()
|
|
175
|
|
- }
|
|
176
|
|
- };
|
|
177
|
|
-
|
|
178
|
|
- xhttp.open("GET", query, true);
|
|
179
|
|
- xhttp.send();
|
|
180
|
|
- }
|
|
181
|
|
-
|
|
182
|
|
- function fetchData() {
|
|
183
|
|
-
|
|
184
|
|
- console.log("fetching data")
|
|
185
|
|
- var query = queryBase + "(" + table + ")&for=county:" + pueblo + queryEnd
|
|
186
|
|
-
|
|
187
|
|
- if(pueblo && table)
|
|
188
|
|
- {loadDoc(query)}
|
|
189
|
|
-
|
|
190
|
|
- else
|
|
191
|
|
- {Alert.alert("Please fill every parameter before calling!")}
|
|
192
|
|
-
|
|
193
|
|
- }
|
|
194
|
|
-
|
|
195
|
|
-
|
|
196
|
|
-
|
|
197
|
|
-//organize data make it pretty
|
|
198
|
|
-//add loading thing while this organizes all the data !!!
|
|
199
|
|
-
|
|
200
|
|
-function organize(){
|
|
201
|
|
-
|
|
202
|
|
- var stringDiv = JSON.stringify(information)
|
|
203
|
|
- stringDiv = stringDiv.replace('[[', '');
|
|
204
|
|
- stringDiv = stringDiv.replace(']]', '');
|
|
205
|
|
- stringDiv = stringDiv.split(',')
|
|
206
|
|
- //create smaller array variables
|
|
207
|
|
- let variables = []
|
|
208
|
|
- let value = []
|
|
209
|
|
- let est = []
|
|
210
|
|
-
|
|
211
|
|
-
|
|
212
|
|
- //theres a better way to do this but im not fixing it rn
|
|
213
|
|
- for(let i = 0; i<stringDiv.length; i++){
|
|
214
|
|
-
|
|
215
|
|
- if(i<stringDiv.length/3)
|
|
216
|
|
- {variables.push(stringDiv[i])}
|
|
217
|
|
- else if(i<stringDiv.length/3*2)
|
|
218
|
|
- {value.push(stringDiv[i])}
|
|
219
|
|
- else
|
|
220
|
|
- {est.push(stringDiv[i])}
|
|
221
|
|
- }
|
|
222
|
|
-
|
|
223
|
|
- //anyways this to format it
|
|
224
|
|
-
|
|
225
|
|
- console.log("vars:",variables)
|
|
226
|
|
- console.log("val:",value)
|
|
227
|
|
- console.log("est:",est)
|
|
228
|
|
-
|
|
229
|
|
-
|
|
230
|
|
-}
|
|
231
|
|
-
|
|
232
|
|
-function json_2_csv(information){
|
|
233
|
|
-
|
|
234
|
|
- const csv = parse(obj);
|
|
235
|
|
- console.log(csv);
|
|
236
|
|
-}
|
|
237
|
|
-
|
|
238
|
|
-//fix
|
|
239
|
|
-
|
|
240
|
|
-DropDownPicker.setListMode("SCROLLVIEW")
|
|
241
|
|
-
|
|
242
|
|
-
|
|
243
|
|
-//data parsing goes here
|
|
244
|
|
-function getInfo(){
|
|
245
|
|
- if(!information)
|
|
246
|
|
- {Alert.alert("Please try again later! Error retriving data")}
|
|
247
|
|
- else
|
|
248
|
|
- {return information}
|
|
249
|
|
-}
|
|
250
|
|
-
|
|
251
|
|
-//data display
|
|
252
|
|
-
|
|
253
|
|
-class DataButton extends React.Component{
|
|
254
|
|
-
|
|
255
|
|
- state = {
|
|
256
|
|
- click: false
|
|
257
|
|
- }
|
|
258
|
|
-
|
|
259
|
|
- pullData = () => {fetchData(); this.setState({click: true})}
|
|
260
|
|
-
|
|
261
|
|
-
|
|
262
|
|
- render() {
|
|
263
|
|
- return(
|
|
264
|
|
- <View style = {styles.container}>
|
|
265
|
|
-
|
|
266
|
|
- <Pressable style={styles.buttons} onPress = {this.pullData}>
|
|
267
|
|
- <Text style={styles.text}> Fetch Data</Text>
|
|
268
|
|
- </Pressable>
|
|
269
|
|
-
|
|
270
|
|
- <Text style={styles.sub}>{getInfo()}</Text>
|
|
271
|
|
-
|
|
272
|
|
- </View>
|
|
273
|
|
- );
|
|
274
|
|
- }
|
|
275
|
|
-}
|
|
276
|
|
-
|
|
|
1
|
+import React, {useState} from 'react';
|
|
|
2
|
+import { View, Text, Pressable, StyleSheet, Alert} from 'react-native';
|
|
|
3
|
+import DropDownPicker from 'react-native-dropdown-picker';
|
|
|
4
|
+import {styles} from "./styles"
|
|
|
5
|
+
|
|
|
6
|
+
|
|
|
7
|
+var table = ""
|
|
|
8
|
+var pueblo = ""
|
|
|
9
|
+
|
|
|
10
|
+//where data will be stored
|
|
|
11
|
+var information
|
|
|
12
|
+
|
|
|
13
|
+function Picker() {
|
|
|
14
|
+
|
|
|
15
|
+ //table to pick from
|
|
|
16
|
+
|
|
|
17
|
+
|
|
|
18
|
+ const [openTable, setOpenTable] = useState(false);
|
|
|
19
|
+ const [valueTable, setValueTable] = useState(null);
|
|
|
20
|
+ const [table, setTable] = useState([
|
|
|
21
|
+ {label:'DP02PR', value: 'DP02PR'},
|
|
|
22
|
+ {label:'DP03', value: 'DP03'},
|
|
|
23
|
+ {label:'DP04', value: 'DP04'},
|
|
|
24
|
+ {label:'DP05', value: 'DP05'},
|
|
|
25
|
+ ]);
|
|
|
26
|
+
|
|
|
27
|
+ //cambiar pueblo
|
|
|
28
|
+
|
|
|
29
|
+
|
|
|
30
|
+ //pueblo
|
|
|
31
|
+ const [openPueblo, setOpenPueblo] = useState(false);
|
|
|
32
|
+ const [valuePueblo, setValuePueblo] = useState(null);
|
|
|
33
|
+ const [pueblo, setPueblo] = useState([
|
|
|
34
|
+ {label: 'Adjuntas', value: '001'},
|
|
|
35
|
+ {label: 'Aguada', value: '003'},
|
|
|
36
|
+ {label: 'Aguadillas', value: '005'},
|
|
|
37
|
+ {label: 'Aguas Buenas', value: '007'},
|
|
|
38
|
+ {label: 'Aibonito', value: '009'},
|
|
|
39
|
+ {label: 'Añasco', value: '011'},
|
|
|
40
|
+ {label: 'Arecibo', value: '013'},
|
|
|
41
|
+ {label: 'Arroyo', value: '015'},
|
|
|
42
|
+ {label: 'Barceloneta', value: '017'},
|
|
|
43
|
+ {label: 'Barranquitas', value: '019'},
|
|
|
44
|
+ {label: 'Bayamón', value: '021'},
|
|
|
45
|
+ {label: 'Cabo Rojo', value: '023'},
|
|
|
46
|
+ {label: 'Caguas', value: '025'},
|
|
|
47
|
+ {label: 'Camuy', value: '027'},
|
|
|
48
|
+ {label: 'Canóvanas', value: '029'},
|
|
|
49
|
+ {label: 'Carolina', value: '031'},
|
|
|
50
|
+ {label: 'Cataño', value: '033'},
|
|
|
51
|
+ {label: 'Cayey', value: '035'},
|
|
|
52
|
+ {label: 'Ceiba', value: '037'},
|
|
|
53
|
+ {label: 'Ciales', value: '039'},
|
|
|
54
|
+ {label: 'Cidra', value: '041'},
|
|
|
55
|
+ {label: 'Coamo', value: '043'},
|
|
|
56
|
+ {label: 'Comerío', value: '045'},
|
|
|
57
|
+ {label: 'Corozal', value: '047'},
|
|
|
58
|
+ {label: 'Culebra', value: '049'},
|
|
|
59
|
+ {label: 'Dorado', value: '051'},
|
|
|
60
|
+ {label: 'Fajardo', value: '053'},
|
|
|
61
|
+ {label: 'Florida', value: '054'},
|
|
|
62
|
+ {label: 'Guánica', value: '055'},
|
|
|
63
|
+ {label: 'Guayama', value: '057'},
|
|
|
64
|
+ {label: 'Guayanilla', value: '059'},
|
|
|
65
|
+ {label: 'Guaynabo', value: '061'},
|
|
|
66
|
+ {label: 'Gurabo', value: '063'},
|
|
|
67
|
+ {label: 'Hatillo', value: '065'},
|
|
|
68
|
+ {label: 'Hormigueros', value: '067'},
|
|
|
69
|
+ {label: 'Humacao', value: '069'},
|
|
|
70
|
+ {label: 'Isabela', value: '071'},
|
|
|
71
|
+ {label: 'Jayuya', value: '073'},
|
|
|
72
|
+ {label: 'Juana Díaz', value: '075'},
|
|
|
73
|
+ {label: 'Juncos', value: '077'},
|
|
|
74
|
+ {label: 'Lajas', value: '079'},
|
|
|
75
|
+ {label: 'Lares', value: '081'},
|
|
|
76
|
+ {label: 'Las Marías', value: '083'},
|
|
|
77
|
+ {label: 'Las Piedras', value: '085'},
|
|
|
78
|
+ {label: 'Loíza', value: '087'},
|
|
|
79
|
+ {label: 'Luquillo', value: '089'},
|
|
|
80
|
+ {label: 'Manatí', value: '091'},
|
|
|
81
|
+ {label: 'Maricao', value: '093'},
|
|
|
82
|
+ {label: 'Maunabo', value: '095'},
|
|
|
83
|
+ {label: 'Mayagüez', value: '097'},
|
|
|
84
|
+ {label: 'Moca', value: '099'},
|
|
|
85
|
+ {label: 'Morovis', value: '101'},
|
|
|
86
|
+ {label: 'Naguabo', value: '103'},
|
|
|
87
|
+ {label: 'Naranjito', value: '105'},
|
|
|
88
|
+ {label: 'Orocovis', value: '107'},
|
|
|
89
|
+ {label: 'Patillas', value: '109'},
|
|
|
90
|
+ {label: 'Peñuelas', value: '111'},
|
|
|
91
|
+ {label: 'Ponce', value: '113'},
|
|
|
92
|
+ {label: 'Quebradillas', value: '115'},
|
|
|
93
|
+ {label: 'Rincón', value: '117'},
|
|
|
94
|
+ {label: 'Río Grande', value: '119'},
|
|
|
95
|
+ {label: 'Sabana Grande', value: '121'},
|
|
|
96
|
+ {label: 'Salinas', value: '123'},
|
|
|
97
|
+ {label: 'San Germán', value: '125'},
|
|
|
98
|
+ {label: 'San Juan', value: '127'},
|
|
|
99
|
+ {label: 'San Lorenzo', value: '129'},
|
|
|
100
|
+ {label: 'San Sebastián', value: '131'},
|
|
|
101
|
+ {label: 'Santa Isabel', value: '133'},
|
|
|
102
|
+ {label: 'Toa Alta', value: '135'},
|
|
|
103
|
+ {label: 'Toa Baja', value: '137'},
|
|
|
104
|
+ {label: 'Trujillo Alto', value: '139'},
|
|
|
105
|
+ {label: 'Utuado', value: '141'},
|
|
|
106
|
+ {label: 'Vega Alta', value: '143'},
|
|
|
107
|
+ {label: 'Vega Baja', value: '145'},
|
|
|
108
|
+ {label: 'Vieques', value: '147'},
|
|
|
109
|
+ {label: 'Villalba', value: '149'},
|
|
|
110
|
+ {label: 'Yabucoa', value: '151'},
|
|
|
111
|
+ {label: 'Yauco', value: '153'}
|
|
|
112
|
+ ]);
|
|
|
113
|
+
|
|
|
114
|
+
|
|
|
115
|
+ return (
|
|
|
116
|
+ <View>
|
|
|
117
|
+ <DropDownPicker
|
|
|
118
|
+ open={openTable}
|
|
|
119
|
+ value={valueTable}
|
|
|
120
|
+ items={table}
|
|
|
121
|
+ setOpen={setOpenTable}
|
|
|
122
|
+ setValue={setValueTable}
|
|
|
123
|
+ setItems={setTable}
|
|
|
124
|
+ onChangeValue = {(valueTable) => {
|
|
|
125
|
+ updateTable(valueTable);
|
|
|
126
|
+ }}
|
|
|
127
|
+ onOpen = {() => {setOpenPueblo(false)}}
|
|
|
128
|
+ zIndex={3000}
|
|
|
129
|
+ zIndexInverse={1000}
|
|
|
130
|
+ placeholder="Tabla de Datos"
|
|
|
131
|
+ />
|
|
|
132
|
+
|
|
|
133
|
+
|
|
|
134
|
+ <DropDownPicker
|
|
|
135
|
+ searchable={true}
|
|
|
136
|
+ open={openPueblo}
|
|
|
137
|
+ value={valuePueblo}
|
|
|
138
|
+ items={pueblo}
|
|
|
139
|
+ setOpen={setOpenPueblo}
|
|
|
140
|
+ setValue={setValuePueblo}
|
|
|
141
|
+ setItems={setPueblo}
|
|
|
142
|
+ onChangeValue = {(valuePueblo) => {
|
|
|
143
|
+ updatePueblo(valuePueblo);
|
|
|
144
|
+ }}
|
|
|
145
|
+ onOpen = {() => {setOpenTable(false)}}
|
|
|
146
|
+ zIndex={1000}
|
|
|
147
|
+ zIndexInverse={3000}
|
|
|
148
|
+ placeholder="Pueblo"
|
|
|
149
|
+ searchPlaceholder="Busqueda..."
|
|
|
150
|
+ />
|
|
|
151
|
+
|
|
|
152
|
+ </View>
|
|
|
153
|
+
|
|
|
154
|
+ );
|
|
|
155
|
+}
|
|
|
156
|
+
|
|
|
157
|
+
|
|
|
158
|
+
|
|
|
159
|
+function updateTable(value){
|
|
|
160
|
+ table = value
|
|
|
161
|
+}
|
|
|
162
|
+
|
|
|
163
|
+function updatePueblo(value){
|
|
|
164
|
+ pueblo = value
|
|
|
165
|
+}
|
|
|
166
|
+
|
|
|
167
|
+//calls data query
|
|
|
168
|
+function loadDoc(query) {
|
|
|
169
|
+ console.log("load")
|
|
|
170
|
+ var xhttp = new XMLHttpRequest();
|
|
|
171
|
+ xhttp.onreadystatechange = function() {
|
|
|
172
|
+ if (this.readyState == 4) {
|
|
|
173
|
+ information = this.responseText;
|
|
|
174
|
+
|
|
|
175
|
+ if(this.status == 200){console.log("received response");organize()}
|
|
|
176
|
+ }
|
|
|
177
|
+ }
|
|
|
178
|
+ xhttp.open("GET", query, true);
|
|
|
179
|
+ xhttp.send(null);
|
|
|
180
|
+ }
|
|
|
181
|
+
|
|
|
182
|
+
|
|
|
183
|
+function fetchData() {
|
|
|
184
|
+
|
|
|
185
|
+ var query = "http://127.0.0.1:5378/table?table=" + table + "&municipality=" + pueblo
|
|
|
186
|
+ if(pueblo && table)
|
|
|
187
|
+ {loadDoc(query)}
|
|
|
188
|
+
|
|
|
189
|
+ else
|
|
|
190
|
+ {Alert.alert("Please fill every parameter before calling!")}
|
|
|
191
|
+
|
|
|
192
|
+ }
|
|
|
193
|
+
|
|
|
194
|
+
|
|
|
195
|
+
|
|
|
196
|
+//organize data make it pretty
|
|
|
197
|
+//add loading thing while this organizes all the data !!!
|
|
|
198
|
+
|
|
|
199
|
+function organize(){
|
|
|
200
|
+
|
|
|
201
|
+ console.log(information)
|
|
|
202
|
+
|
|
|
203
|
+ let bigData = JSON.parse(information)
|
|
|
204
|
+
|
|
|
205
|
+ /*
|
|
|
206
|
+ var stringDiv = JSON.stringify(information)
|
|
|
207
|
+ stringDiv = stringDiv.replace('[[', '');
|
|
|
208
|
+ stringDiv = stringDiv.replace(']]', '');
|
|
|
209
|
+ stringDiv = stringDiv.split(',')
|
|
|
210
|
+ //create smaller array variables
|
|
|
211
|
+ let variables = []
|
|
|
212
|
+ let value = []
|
|
|
213
|
+ let est = []
|
|
|
214
|
+
|
|
|
215
|
+
|
|
|
216
|
+ //theres a better way to do this but im not fixing it rn
|
|
|
217
|
+ for(let i = 0; i<stringDiv.length; i++){
|
|
|
218
|
+
|
|
|
219
|
+ if(i<stringDiv.length/3)
|
|
|
220
|
+ {variables.push(stringDiv[i])}
|
|
|
221
|
+ else if(i<stringDiv.length/3*2)
|
|
|
222
|
+ {value.push(stringDiv[i])}
|
|
|
223
|
+ else
|
|
|
224
|
+ {est.push(stringDiv[i])}
|
|
|
225
|
+ }
|
|
|
226
|
+
|
|
|
227
|
+ //anyways this to format it
|
|
|
228
|
+
|
|
|
229
|
+ console.log("vars:",variables)
|
|
|
230
|
+ console.log("val:",value)
|
|
|
231
|
+ console.log("est:",est)
|
|
|
232
|
+ */
|
|
|
233
|
+
|
|
|
234
|
+
|
|
|
235
|
+}
|
|
|
236
|
+
|
|
|
237
|
+function json_2_csv(information){
|
|
|
238
|
+
|
|
|
239
|
+ const csv = parse(obj);
|
|
|
240
|
+ console.log(csv);
|
|
|
241
|
+}
|
|
|
242
|
+
|
|
|
243
|
+//fix
|
|
|
244
|
+
|
|
|
245
|
+DropDownPicker.setListMode("SCROLLVIEW")
|
|
|
246
|
+
|
|
|
247
|
+
|
|
|
248
|
+//data parsing goes here
|
|
|
249
|
+function getInfo(){
|
|
|
250
|
+ if(!information)
|
|
|
251
|
+ {Alert.alert("Please try again later! Error retriving data")}
|
|
|
252
|
+ else
|
|
|
253
|
+ {return information}
|
|
|
254
|
+}
|
|
|
255
|
+
|
|
|
256
|
+//data display
|
|
|
257
|
+
|
|
|
258
|
+class DataButton extends React.Component{
|
|
|
259
|
+
|
|
|
260
|
+
|
|
|
261
|
+ state = {
|
|
|
262
|
+ updated: 1,
|
|
|
263
|
+ notUpdated: 0
|
|
|
264
|
+ }
|
|
|
265
|
+
|
|
|
266
|
+ pullData = () => {fetchData(); this.setState({current: 1})}
|
|
|
267
|
+
|
|
|
268
|
+
|
|
|
269
|
+ //the reason you need to press the button twice is bc the http request doesnt finish in time
|
|
|
270
|
+ //for information to be updated before its rerendered
|
|
|
271
|
+ componentDidUpdate(){
|
|
|
272
|
+ console.log(this.state)
|
|
|
273
|
+ if(this.state.current == 1){
|
|
|
274
|
+ console.log("updating")
|
|
|
275
|
+ this.setState({current: 0})
|
|
|
276
|
+ }
|
|
|
277
|
+ }
|
|
|
278
|
+
|
|
|
279
|
+ state = {current: 0}
|
|
|
280
|
+
|
|
|
281
|
+ render() {
|
|
|
282
|
+ return(
|
|
|
283
|
+ <View style = {styles.container}>
|
|
|
284
|
+
|
|
|
285
|
+ <Pressable style={styles.buttons} onPress = {this.pullData}>
|
|
|
286
|
+ <Text style={styles.text}> Fetch Data</Text>
|
|
|
287
|
+ </Pressable>
|
|
|
288
|
+
|
|
|
289
|
+ <Text style={styles.sub}>{information}</Text>
|
|
|
290
|
+
|
|
|
291
|
+ </View>
|
|
|
292
|
+ );
|
|
|
293
|
+ }
|
|
|
294
|
+}
|
|
|
295
|
+
|
|
277
|
296
|
export { Picker, updateTable, updatePueblo,loadDoc,fetchData,DataButton};
|
