|
|
@@ -1,387 +1,7 @@
|
|
1
|
|
-import { StatusBar } from 'expo-status-bar';
|
|
2
|
1
|
import React, {useState, useEffect} from 'react';
|
|
3
|
|
-import { View, Image, StyleSheet, Text, Button, ScrollView, Pressable} from 'react-native';
|
|
4
|
|
-import DropDownPicker from 'react-native-dropdown-picker';
|
|
5
|
|
-
|
|
6
|
|
-
|
|
7
|
|
-//import JSON;
|
|
8
|
|
-//import { Dataframe, readJSON } from "danfojs";
|
|
9
|
|
-
|
|
10
|
|
-//where data will be put
|
|
11
|
|
-var organizedData
|
|
12
|
|
-
|
|
13
|
|
-//where data will be stored
|
|
14
|
|
-var information = "data goes here"
|
|
15
|
|
-
|
|
16
|
|
-//organize data make it pretty
|
|
17
|
|
-
|
|
18
|
|
-//add loading thing while this organizes all the data !!!
|
|
19
|
|
-
|
|
20
|
|
-function organize(){
|
|
21
|
|
-
|
|
22
|
|
- var stringDiv = JSON.stringify(information)
|
|
23
|
|
- stringDiv = stringDiv.replace('[[', '');
|
|
24
|
|
- stringDiv = stringDiv.replace(']]', '');
|
|
25
|
|
- stringDiv = stringDiv.split(',')
|
|
26
|
|
- //create smaller array variables
|
|
27
|
|
- let variables = []
|
|
28
|
|
- let value = []
|
|
29
|
|
- let est = []
|
|
30
|
|
-
|
|
31
|
|
-
|
|
32
|
|
- //theres a better way to do this but im not fixing it rn
|
|
33
|
|
- for(let i = 0; i<stringDiv.length; i++){
|
|
34
|
|
- if(i<stringDiv.length/3)
|
|
35
|
|
- {variables.push(stringDiv[i])}
|
|
36
|
|
- else if(i<stringDiv.length/3*2)
|
|
37
|
|
- {value.push(stringDiv[i])}
|
|
38
|
|
- else{est.push(stringDiv[i])}
|
|
39
|
|
- }
|
|
40
|
|
-
|
|
41
|
|
- //anyways this to format it
|
|
42
|
|
-
|
|
43
|
|
- console.log("vars:",variables)
|
|
44
|
|
- console.log("val:",value)
|
|
45
|
|
- console.log("est:",est)
|
|
46
|
|
- //organizedData = JSON.parse(information)
|
|
47
|
|
- //console.log(stringDiv)
|
|
48
|
|
-
|
|
49
|
|
-}
|
|
50
|
|
-
|
|
51
|
|
-function json_2_csv(information){
|
|
52
|
|
- const csv = parse(obj);
|
|
53
|
|
-
|
|
54
|
|
- console.log(csv);
|
|
55
|
|
-}
|
|
56
|
|
-
|
|
57
|
|
-//fix
|
|
58
|
|
-
|
|
59
|
|
-DropDownPicker.setListMode("SCROLLVIEW")
|
|
60
|
|
-
|
|
61
|
|
-//data query variables (global)
|
|
62
|
|
-
|
|
63
|
|
-const queryBase = "http://127.0.0.1:5378/table?table=DP03&municipality=Ceiba"
|
|
64
|
|
-const queryEnd = "&in=state:72"
|
|
65
|
|
-var table = ""
|
|
66
|
|
-var pueblo = ""
|
|
67
|
|
-
|
|
68
|
|
-
|
|
69
|
|
-function updateTable(value){
|
|
70
|
|
- table = value
|
|
71
|
|
-}
|
|
72
|
|
-
|
|
73
|
|
-function updatePueblo(value){
|
|
74
|
|
- pueblo = value
|
|
75
|
|
-}
|
|
76
|
|
-
|
|
77
|
|
-//calls data query
|
|
78
|
|
-function loadDoc(query) {
|
|
79
|
|
- var xhttp = new XMLHttpRequest();
|
|
80
|
|
- xhttp.onreadystatechange = function() {
|
|
81
|
|
- if (this.readyState == 4 && this.status == 200) {
|
|
82
|
|
- information = this.responseText;
|
|
83
|
|
- organize()
|
|
84
|
|
- }
|
|
85
|
|
- };
|
|
86
|
|
- xhttp.open("GET", query, true);
|
|
87
|
|
- xhttp.send();
|
|
88
|
|
-
|
|
89
|
|
-}
|
|
90
|
|
-
|
|
91
|
|
-
|
|
92
|
|
-//"https://api.census.gov/data/2020/acs/acs5/profile?get=group(DP02PR)&for=county:127&in=state:72"
|
|
93
|
|
-
|
|
94
|
|
-
|
|
95
|
|
-
|
|
96
|
|
-function fetchData() {
|
|
97
|
|
-
|
|
98
|
|
- console.log("fetching data")
|
|
99
|
|
-
|
|
100
|
|
- var query = queryBase + "(" + table + ")&for=county:" + pueblo + queryEnd
|
|
101
|
|
-
|
|
102
|
|
- if(pueblo && table)
|
|
103
|
|
- {loadDoc(query)}
|
|
104
|
|
- else
|
|
105
|
|
- {Alert.alert("Please fill every parameter before calling!")}
|
|
106
|
|
-
|
|
107
|
|
-}
|
|
108
|
|
-
|
|
109
|
|
-//change this to an external css file later
|
|
110
|
|
-const styles = StyleSheet.create({
|
|
111
|
|
-
|
|
112
|
|
- buttons: {
|
|
113
|
|
- flexDirection: 'row',
|
|
114
|
|
- justifyContent: 'center',
|
|
115
|
|
- marginTop: 40,
|
|
116
|
|
- marginBottom: 30,
|
|
117
|
|
- margin: 30,
|
|
118
|
|
- borderColor: "grey",
|
|
119
|
|
- borderRadius: 8,
|
|
120
|
|
- padding: (30, 16),
|
|
121
|
|
- backgroundColor: "black",
|
|
122
|
|
- marginTop: 0
|
|
123
|
|
- },
|
|
124
|
|
- buttonContainer: {
|
|
125
|
|
- flexDirection: 'column',
|
|
126
|
|
- backgroundColor: '#f0f8ff',
|
|
127
|
|
- // alignItems: 'center',
|
|
128
|
|
- // justifyContent: 'center',
|
|
129
|
|
- paddingTop:40,
|
|
130
|
|
- marginTop: 15,
|
|
131
|
|
- },
|
|
132
|
|
- bottom: {
|
|
133
|
|
- flex: 0.3,
|
|
134
|
|
- backgroundColor: "gray",
|
|
135
|
|
- borderWidth: 5,
|
|
136
|
|
- borderBottomLeftRadius: 20,
|
|
137
|
|
- borderBottomRightRadius: 20,
|
|
138
|
|
- alignItems:'center',
|
|
139
|
|
-
|
|
140
|
|
- },
|
|
141
|
|
- container: {
|
|
142
|
|
- flexDirection: 'column',
|
|
143
|
|
- justifyContent: 'center',
|
|
144
|
|
- backgroundColor: '#f0f8ff',
|
|
145
|
|
- alignItems: 'center',
|
|
146
|
|
- justifyContent: 'center',
|
|
147
|
|
- paddingTop:20,
|
|
148
|
|
- marginTop: 15,
|
|
149
|
|
- },
|
|
150
|
|
-
|
|
151
|
|
-
|
|
152
|
|
- containerbackground:{
|
|
153
|
|
-
|
|
154
|
|
- backgroundColor: '#f0f8ff'
|
|
155
|
|
- },
|
|
156
|
|
- intro: {
|
|
157
|
|
- fontWeight: "bold",
|
|
158
|
|
- color:"#black",
|
|
159
|
|
- fontSize: 30,
|
|
160
|
|
- },
|
|
161
|
|
-
|
|
162
|
|
- sub: {
|
|
163
|
|
- color:"#black",
|
|
164
|
|
- fontWeight: "bold",
|
|
165
|
|
- fontSize: 15,
|
|
166
|
|
- paddingBottom:10,
|
|
167
|
|
-},
|
|
168
|
|
-
|
|
169
|
|
- Navsub: {
|
|
170
|
|
- color:"#black",
|
|
171
|
|
- fontWeight: "bold",
|
|
172
|
|
- fontSize: 30,
|
|
173
|
|
- paddingBottom:10,
|
|
174
|
|
- },
|
|
175
|
|
- scrollView:{
|
|
176
|
|
- marginHorizontal: 20
|
|
177
|
|
- },
|
|
178
|
|
- listItem:{
|
|
179
|
|
- fontSize: 30,
|
|
180
|
|
- color: "white",
|
|
181
|
|
- textDecorationLines: "underline"
|
|
182
|
|
- },
|
|
183
|
|
- listButtons:{
|
|
184
|
|
- fontSize: 15,
|
|
185
|
|
- color: "white",
|
|
186
|
|
- textDecorationLines: "underline"
|
|
187
|
|
- },
|
|
188
|
|
- buttonsVer: {
|
|
189
|
|
- flexDirection: 'column',
|
|
190
|
|
- justifyContent: 'center',
|
|
191
|
|
- marginTop: 40,
|
|
192
|
|
- marginBottom: 30,
|
|
193
|
|
- margin: 30,
|
|
194
|
|
- borderColor: "grey",
|
|
195
|
|
- }
|
|
196
|
|
-});
|
|
197
|
|
-
|
|
198
|
|
-
|
|
199
|
|
-
|
|
200
|
|
-//default button press
|
|
201
|
|
-
|
|
202
|
|
-const handlePress = () => false
|
|
203
|
|
-
|
|
204
|
|
-
|
|
205
|
|
-//data parsing goes here
|
|
206
|
|
-function getInfo(){
|
|
207
|
|
- //console.log(information[6])
|
|
208
|
|
- if(!information)
|
|
209
|
|
- {Alert.alert("Please try again later! Error retriving data")}
|
|
210
|
|
- else
|
|
211
|
|
- {return information}
|
|
212
|
|
-
|
|
213
|
|
-
|
|
214
|
|
-}
|
|
215
|
|
-
|
|
216
|
|
-//data display
|
|
217
|
|
-
|
|
218
|
|
-class DataButton extends React.Component{
|
|
219
|
|
-
|
|
220
|
|
- state = {
|
|
221
|
|
- click: false
|
|
222
|
|
- }
|
|
223
|
|
-
|
|
224
|
|
- pullData = () => {fetchData(); this.setState({click: true})}
|
|
225
|
|
-
|
|
226
|
|
-
|
|
227
|
|
- render() {
|
|
228
|
|
- return(
|
|
229
|
|
- <View>
|
|
230
|
|
- <Button
|
|
231
|
|
- onPress = {this.pullData}
|
|
232
|
|
- title = "Fetch Data"
|
|
233
|
|
- color = "black"
|
|
234
|
|
- />
|
|
235
|
|
- <Text style={styles.sub}>{getInfo()}</Text>
|
|
236
|
|
- </View>
|
|
237
|
|
- );}
|
|
238
|
|
-}
|
|
239
|
|
-
|
|
240
|
|
-
|
|
241
|
|
-//picker test
|
|
242
|
|
-
|
|
243
|
|
-function Picker() {
|
|
244
|
|
-
|
|
245
|
|
- //table to pick from
|
|
246
|
|
-
|
|
247
|
|
-
|
|
248
|
|
- const [openTable, setOpenTable] = useState(false);
|
|
249
|
|
- const [valueTable, setValueTable] = useState(null);
|
|
250
|
|
- const [table, setTable] = useState([
|
|
251
|
|
- {label:'DP02PR', value: 'DP02PR'},
|
|
252
|
|
- {label:'DP03', value: 'DP03'},
|
|
253
|
|
- {label:'DP04', value: 'DP04'},
|
|
254
|
|
- {label:'DP05', value: 'DP05'},
|
|
255
|
|
- ]);
|
|
256
|
|
-
|
|
257
|
|
- //cambiar pueblo
|
|
258
|
|
-
|
|
259
|
|
-
|
|
260
|
|
- //pueblo
|
|
261
|
|
- const [openPueblo, setOpenPueblo] = useState(false);
|
|
262
|
|
- const [valuePueblo, setValuePueblo] = useState(null);
|
|
263
|
|
- const [pueblo, setPueblo] = useState([
|
|
264
|
|
- {label: 'Adjuntas', value: '001'},
|
|
265
|
|
- {label: 'Aguada', value: '003'},
|
|
266
|
|
- {label: 'Aguadillas', value: '005'},
|
|
267
|
|
- {label: 'Aguas Buenas', value: '007'},
|
|
268
|
|
- {label: 'Aibonito', value: '009'},
|
|
269
|
|
- {label: 'Añasco', value: '011'},
|
|
270
|
|
- {label: 'Arecibo', value: '013'},
|
|
271
|
|
- {label: 'Arroyo', value: '015'},
|
|
272
|
|
- {label: 'Barceloneta', value: '017'},
|
|
273
|
|
- {label: 'Barranquitas', value: '019'},
|
|
274
|
|
- {label: 'Bayamón', value: '021'},
|
|
275
|
|
- {label: 'Cabo Rojo', value: '023'},
|
|
276
|
|
- {label: 'Caguas', value: '025'},
|
|
277
|
|
- {label: 'Camuy', value: '027'},
|
|
278
|
|
- {label: 'Canóvanas', value: '029'},
|
|
279
|
|
- {label: 'Carolina', value: '031'},
|
|
280
|
|
- {label: 'Cataño', value: '033'},
|
|
281
|
|
- {label: 'Cayey', value: '035'},
|
|
282
|
|
- {label: 'Ceiba', value: '037'},
|
|
283
|
|
- {label: 'Ciales', value: '039'},
|
|
284
|
|
- {label: 'Cidra', value: '041'},
|
|
285
|
|
- {label: 'Coamo', value: '043'},
|
|
286
|
|
- {label: 'Comerío', value: '045'},
|
|
287
|
|
- {label: 'Corozal', value: '047'},
|
|
288
|
|
- {label: 'Culebra', value: '049'},
|
|
289
|
|
- {label: 'Dorado', value: '051'},
|
|
290
|
|
- {label: 'Fajardo', value: '053'},
|
|
291
|
|
- {label: 'Florida', value: '054'},
|
|
292
|
|
- {label: 'Guánica', value: '055'},
|
|
293
|
|
- {label: 'Guayama', value: '057'},
|
|
294
|
|
- {label: 'Guayanilla', value: '059'},
|
|
295
|
|
- {label: 'Guaynabo', value: '061'},
|
|
296
|
|
- {label: 'Gurabo', value: '063'},
|
|
297
|
|
- {label: 'Hatillo', value: '065'},
|
|
298
|
|
- {label: 'Hormigueros', value: '067'},
|
|
299
|
|
- {label: 'Humacao', value: '069'},
|
|
300
|
|
- {label: 'Isabela', value: '071'},
|
|
301
|
|
- {label: 'Jayuya', value: '073'},
|
|
302
|
|
- {label: 'Juana Díaz', value: '075'},
|
|
303
|
|
- {label: 'Juncos', value: '077'},
|
|
304
|
|
- {label: 'Lajas', value: '079'},
|
|
305
|
|
- {label: 'Lares', value: '081'},
|
|
306
|
|
- {label: 'Las Marías', value: '083'},
|
|
307
|
|
- {label: 'Las Piedras', value: '085'},
|
|
308
|
|
- {label: 'Loíza', value: '087'},
|
|
309
|
|
- {label: 'Luquillo', value: '089'},
|
|
310
|
|
- {label: 'Manatí', value: '091'},
|
|
311
|
|
- {label: 'Maricao', value: '093'},
|
|
312
|
|
- {label: 'Maunabo', value: '095'},
|
|
313
|
|
- {label: 'Mayagüez', value: '097'},
|
|
314
|
|
- {label: 'Moca', value: '099'},
|
|
315
|
|
- {label: 'Morovis', value: '101'},
|
|
316
|
|
- {label: 'Naguabo', value: '103'},
|
|
317
|
|
- {label: 'Naranjito', value: '105'},
|
|
318
|
|
- {label: 'Orocovis', value: '107'},
|
|
319
|
|
- {label: 'Patillas', value: '109'},
|
|
320
|
|
- {label: 'Peñuelas', value: '111'},
|
|
321
|
|
- {label: 'Ponce', value: '113'},
|
|
322
|
|
- {label: 'Quebradillas', value: '115'},
|
|
323
|
|
- {label: 'Rincón', value: '117'},
|
|
324
|
|
- {label: 'Río Grande', value: '119'},
|
|
325
|
|
- {label: 'Sabana Grande', value: '121'},
|
|
326
|
|
- {label: 'Salinas', value: '123'},
|
|
327
|
|
- {label: 'San Germán', value: '125'},
|
|
328
|
|
- {label: 'San Juan', value: '127'},
|
|
329
|
|
- {label: 'San Lorenzo', value: '129'},
|
|
330
|
|
- {label: 'San Sebastián', value: '131'},
|
|
331
|
|
- {label: 'Santa Isabel', value: '133'},
|
|
332
|
|
- {label: 'Toa Alta', value: '135'},
|
|
333
|
|
- {label: 'Toa Baja', value: '137'},
|
|
334
|
|
- {label: 'Trujillo Alto', value: '139'},
|
|
335
|
|
- {label: 'Utuado', value: '141'},
|
|
336
|
|
- {label: 'Vega Alta', value: '143'},
|
|
337
|
|
- {label: 'Vega Baja', value: '145'},
|
|
338
|
|
- {label: 'Vieques', value: '147'},
|
|
339
|
|
- {label: 'Villalba', value: '149'},
|
|
340
|
|
- {label: 'Yabucoa', value: '151'},
|
|
341
|
|
- {label: 'Yauco', value: '153'}
|
|
342
|
|
- ]);
|
|
343
|
|
-
|
|
344
|
|
-
|
|
345
|
|
-
|
|
346
|
|
- return (
|
|
347
|
|
- <View>
|
|
348
|
|
- <DropDownPicker
|
|
349
|
|
- open={openTable}
|
|
350
|
|
- value={valueTable}
|
|
351
|
|
- items={table}
|
|
352
|
|
- setOpen={setOpenTable}
|
|
353
|
|
- setValue={setValueTable}
|
|
354
|
|
- setItems={setTable}
|
|
355
|
|
- onChangeValue = {(valueTable) => {
|
|
356
|
|
- updateTable(valueTable);
|
|
357
|
|
- }}
|
|
358
|
|
- onOpen = {() => {setOpenPueblo(false)}}
|
|
359
|
|
- zIndex={3000}
|
|
360
|
|
- zIndexInverse={1000}
|
|
361
|
|
- placeholder="Tabla de Datos"
|
|
362
|
|
- />
|
|
363
|
|
-
|
|
364
|
|
- <DropDownPicker
|
|
365
|
|
- searchable={true}
|
|
366
|
|
- open={openPueblo}
|
|
367
|
|
- value={valuePueblo}
|
|
368
|
|
- items={pueblo}
|
|
369
|
|
- setOpen={setOpenPueblo}
|
|
370
|
|
- setValue={setValuePueblo}
|
|
371
|
|
- setItems={setPueblo}
|
|
372
|
|
- onChangeValue = {(valuePueblo) => {
|
|
373
|
|
- updatePueblo(valuePueblo);
|
|
374
|
|
- }}
|
|
375
|
|
- onOpen = {() => {setOpenTable(false)}}
|
|
376
|
|
- zIndex={1000}
|
|
377
|
|
- zIndexInverse={3000}
|
|
378
|
|
- placeholder="Pueblo"
|
|
379
|
|
- searchPlaceholder="Busqueda..."
|
|
380
|
|
- />
|
|
381
|
|
-
|
|
382
|
|
- </View>
|
|
383
|
|
- );
|
|
384
|
|
-}
|
|
|
2
|
+import { View, Image, Text, Button, ScrollView, Pressable, Linking,StyleSheet} from 'react-native';
|
|
|
3
|
+import {Picker, DataButton} from "./Datos"
|
|
|
4
|
+import { styles } from './styles';
|
|
385
|
5
|
|
|
386
|
6
|
|
|
387
|
7
|
|
|
|
@@ -391,122 +11,120 @@ class App extends React.Component {
|
|
391
|
11
|
|
|
392
|
12
|
//the text at the end of a page gets cut off if anyone knows how to fix that?
|
|
393
|
13
|
vars = {
|
|
394
|
|
- welcome:
|
|
395
|
|
-<ScrollView style={styles.scrollView}>
|
|
396
|
|
- <View style = {styles.containerbackground}>
|
|
397
|
|
-
|
|
398
|
|
- <View style = {styles.container}>
|
|
|
14
|
+ welcome:
|
|
|
15
|
+
|
|
|
16
|
+ <View style = {styles.containerbackground}>
|
|
|
17
|
+ <ScrollView style={styles.scrollView}>
|
|
|
18
|
+ <View style = {styles.container}>
|
|
399
|
19
|
<Text style={styles.intro}>Bienvenido!</Text>
|
|
400
|
|
- <Image source={require('./smallLogo.jpeg')} />
|
|
401
|
20
|
</View>
|
|
|
21
|
+
|
|
402
|
22
|
<View style = {styles.container}>
|
|
|
23
|
+
|
|
403
|
24
|
<Text style={styles.sub}>Aquí podra mantenerse al tanto con las
|
|
404
|
25
|
últimas noticias relacionadas al Censo y tener acceso a los
|
|
405
|
26
|
los Demographic Data Profiles de cada municipio de
|
|
406
|
|
- Puerto Rico.</Text>
|
|
407
|
|
- </View>
|
|
|
27
|
+ Puerto Rico.
|
|
|
28
|
+ </Text>
|
|
|
29
|
+ </View>
|
|
408
|
30
|
|
|
409
|
|
- <View style = {styles.bottom}>
|
|
|
31
|
+ <View style = {styles.bottom}>
|
|
410
|
32
|
<Text style={styles.intro2}>Contactenos:</Text>
|
|
411
|
33
|
<Text style={styles.sub}>Prof: Hernando Mattei Torres
|
|
412
|
34
|
<Button onPress={() => Linking.openURL('mailto:hernando.mattei@upr.edu') }
|
|
413
|
|
- title="e-mail" /></Text>
|
|
|
35
|
+ title="e-mail" /></Text>
|
|
414
|
36
|
<Text style={styles.sub}>Angelica Rosario Santos
|
|
415
|
37
|
<Button onPress={() => Linking.openURL('mailto:angelica.rosario2@upr.edu') }
|
|
416
|
|
- title="e-mail" /></Text>
|
|
|
38
|
+ title="e-mail" /></Text>
|
|
417
|
39
|
<Text style={styles.sub}>Data from:</Text>
|
|
418
|
40
|
<Image source={require('./census-logos.png')} />
|
|
419
|
41
|
<Button onPress={() => Linking.openURL('https://data.census.gov/profile?q=United+States&g=0100000US') }
|
|
420
|
|
- title="United States Census page" />
|
|
421
|
|
- </View>
|
|
422
|
|
-
|
|
423
|
|
- </View>
|
|
424
|
|
- </ScrollView>,
|
|
425
|
|
-
|
|
426
|
|
- newsView:
|
|
|
42
|
+ title="United States Census page" />
|
|
|
43
|
+ </View>
|
|
|
44
|
+ </ScrollView>
|
|
|
45
|
+ </View>,
|
|
|
46
|
+
|
|
|
47
|
+
|
|
|
48
|
+ newsView:
|
|
427
|
49
|
<View style = {styles.containerbackground}>
|
|
428
|
|
- <ScrollView style={styles.scrollView}>
|
|
429
|
|
- <View style = {styles.container}>
|
|
430
|
|
-
|
|
431
|
|
- <Text style={styles.intro}>Noticias</Text>
|
|
432
|
|
-
|
|
433
|
|
- <Image source={require('./Logo.jpeg')} />
|
|
434
|
|
-
|
|
435
|
|
- </View>
|
|
436
|
|
- </ScrollView></View>,
|
|
|
50
|
+ <ScrollView style={styles.scrollView}>
|
|
|
51
|
+ <View style = {styles.container}>
|
|
|
52
|
+
|
|
|
53
|
+ <Text style={styles.intro}>Noticias</Text>
|
|
|
54
|
+
|
|
|
55
|
+ <Image source={require('./Logo.jpeg')} />
|
|
|
56
|
+
|
|
|
57
|
+ </View>
|
|
|
58
|
+ </ScrollView>
|
|
|
59
|
+ </View>,
|
|
437
|
60
|
|
|
438
|
|
- dataOp:
|
|
|
61
|
+ dataOp:
|
|
439
|
62
|
<View style = {styles.containerbackground}>
|
|
440
|
|
- <ScrollView nestedScrollEnabled = {true} style={styles.scrollView}>
|
|
441
|
|
- <View style = {styles.container}>
|
|
442
|
|
-
|
|
443
|
|
- <Text style={styles.intro}>DATA VIEWING PROJECT</Text>
|
|
444
|
|
-
|
|
445
|
|
- <Picker />
|
|
|
63
|
+ <ScrollView nestedScrollEnabled = {true} style={styles.scrollView}>
|
|
|
64
|
+ <View style = {styles.container}>
|
|
|
65
|
+ <Text style={styles.intro}>DATA VIEWING PROJECT</Text>
|
|
|
66
|
+ </View>
|
|
446
|
67
|
|
|
|
68
|
+
|
|
|
69
|
+ <Picker />
|
|
447
|
70
|
|
|
448
|
|
- <DataButton />
|
|
449
|
|
-
|
|
450
|
|
- <Text style={styles.sub}>blehhhhhh bleh bleh bleh bleh bleh blehhhhhhhhhhhhhhhhh </Text>
|
|
|
71
|
+ <DataButton />
|
|
|
72
|
+
|
|
|
73
|
+
|
|
|
74
|
+ </ScrollView>
|
|
451
|
75
|
|
|
452
|
|
- </View>
|
|
453
|
|
- </ScrollView></View>
|
|
454
|
|
-
|
|
455
|
|
-
|
|
|
76
|
+ </View>
|
|
456
|
77
|
|
|
457
|
78
|
|
|
458
|
|
- }
|
|
459
|
|
-//current state
|
|
460
|
|
-state = {current: this.vars.welcome}
|
|
|
79
|
+}
|
|
|
80
|
+
|
|
461
|
81
|
|
|
462
|
|
-//state changing functions
|
|
463
|
|
-setHome = () => this.setState({ current: this.vars.welcome })
|
|
|
82
|
+ //current state
|
|
|
83
|
+ state = {current: this.vars.welcome}
|
|
464
|
84
|
|
|
|
85
|
+ //state changing functions
|
|
|
86
|
+ setHome = () => this.setState({ current: this.vars.welcome })
|
|
465
|
87
|
|
|
466
|
|
-setData = () => this.setState({current: this.vars.dataOp})
|
|
467
|
88
|
|
|
|
89
|
+ setData = () => this.setState({current: this.vars.dataOp})
|
|
468
|
90
|
|
|
469
|
|
-setNews = () => this.setState({ current: this.vars.newsView })
|
|
|
91
|
+
|
|
|
92
|
+ setNews = () => this.setState({ current: this.vars.newsView })
|
|
470
|
93
|
|
|
471
|
94
|
|
|
472
|
95
|
|
|
473
|
96
|
//render app
|
|
474
|
97
|
render() {
|
|
475
|
|
- return (
|
|
476
|
|
- <View>
|
|
477
|
|
-
|
|
478
|
|
- <View style = {styles.containerbackground}>
|
|
479
|
|
- <ScrollView style={styles.scrollView}>
|
|
480
|
|
- <View style = {styles.buttonContainer}>
|
|
481
|
|
- <Text style={styles.Navsub}> Demographic Data Viewer</Text>
|
|
482
|
|
- <Text style={styles.sub}> Navegador</Text>
|
|
483
|
|
- <Pressable style = {styles.buttons} onPress={this.setNews}>
|
|
|
98
|
+ return (
|
|
|
99
|
+ <View>
|
|
|
100
|
+ <View style = {styles.containerbackground}>
|
|
|
101
|
+ <View style = {styles.buttonContainer}>
|
|
|
102
|
+
|
|
|
103
|
+ <Text style={styles.Navsub}> Demographic Data Viewer</Text>
|
|
484
|
104
|
|
|
485
|
|
- <Button
|
|
486
|
|
- title = "Noticias"
|
|
487
|
|
- color = "white"
|
|
488
|
|
- />
|
|
489
|
|
-
|
|
490
|
|
-
|
|
|
105
|
+ <View style = {styles.navContainer}>
|
|
|
106
|
+ <Pressable style={styles.buttons} onPress = {this.setNews}>
|
|
|
107
|
+ <Text style={styles.text}> Noticias</Text>
|
|
491
|
108
|
</Pressable>
|
|
492
|
|
-
|
|
493
|
|
- <Pressable style = {styles.buttons} onPress={this.setData}>
|
|
494
|
|
-
|
|
495
|
|
- <Button
|
|
496
|
|
- title = "Datos"
|
|
497
|
|
- color = "white"
|
|
498
|
|
- />
|
|
499
|
|
-
|
|
500
|
|
-
|
|
|
109
|
+
|
|
|
110
|
+ <Pressable style={styles.buttons} onPress = {this.setHome}>
|
|
|
111
|
+ <Text style={styles.text}> Hogar</Text>
|
|
501
|
112
|
</Pressable>
|
|
502
|
|
-
|
|
503
|
|
-
|
|
504
|
|
- {this.state.current}
|
|
|
113
|
+
|
|
|
114
|
+ <Pressable style={styles.buttons} onPress = {this.setData}>
|
|
|
115
|
+ <Text style={styles.text}> Datos</Text>
|
|
|
116
|
+ </Pressable>
|
|
|
117
|
+
|
|
|
118
|
+ </View>
|
|
|
119
|
+
|
|
|
120
|
+ {this.state.current}
|
|
|
121
|
+
|
|
505
|
122
|
</View>
|
|
506
|
|
- </ScrollView>
|
|
|
123
|
+
|
|
|
124
|
+ </View>
|
|
|
125
|
+
|
|
507
|
126
|
</View>
|
|
508
|
|
- </View>
|
|
509
|
|
- );
|
|
|
127
|
+ );
|
|
510
|
128
|
}
|
|
511
|
129
|
}
|
|
512
|
130
|
|
