andrea.nieves7 1 year ago
parent
commit
56ef9c7345
4 changed files with 2505 additions and 103 deletions
  1. 70
    88
      App.js
  2. 1754
    2
      package-lock.json
  3. 1
    0
      package.json
  4. 680
    13
      yarn.lock

+ 70
- 88
App.js View File

@@ -1,8 +1,9 @@
1 1
 import { StatusBar } from 'expo-status-bar';
2 2
 import React, {useState, useEffect} from 'react';
3 3
 import { View, Image, StyleSheet, Text, Button, ScrollView, Pressable} from 'react-native';
4
-import data from './transfer.json' 
5 4
 import DropDownPicker from 'react-native-dropdown-picker';
5
+//import JSON;
6
+//import { Dataframe, readJSON } from "danfojs";
6 7
 
7 8
 //where data will be put
8 9
 var organizedData
@@ -11,10 +12,37 @@ var organizedData
11 12
 var information = "data goes here"
12 13
 
13 14
 //organize data make it pretty
15
+
16
+//add loading thing while this organizes all the data !!!
17
+
14 18
 function organize(){
15 19
 	
20
+	var stringDiv = JSON.stringify(information)
21
+	stringDiv = stringDiv.replace('[[', '');
22
+	stringDiv = stringDiv.replace(']]', '');
23
+	stringDiv = stringDiv.split(',')
24
+	//create smaller array variables
25
+	let variables = []
26
+	let value = []
27
+	let est = []
28
+	
29
+	
30
+	//theres a better way to do this but im not fixing it rn
31
+	for(let i = 0; i<stringDiv.length; i++){
32
+		if(i<stringDiv.length/3)
33
+		{variables.push(stringDiv[i])}
34
+		else if(i<stringDiv.length/3*2)
35
+		{value.push(stringDiv[i])}
36
+		else{est.push(stringDiv[i])}
37
+	}
16 38
 	
39
+	//anyways this to format it
17 40
 	
41
+	console.log("vars:",variables)
42
+	console.log("val:",value)
43
+	console.log("est:",est)
44
+	//organizedData = JSON.parse(information)
45
+	//console.log(stringDiv)
18 46
 	
19 47
 }
20 48
 
@@ -44,7 +72,7 @@ function loadDoc(query) {
44 72
   xhttp.onreadystatechange = function() {
45 73
     if (this.readyState == 4 && this.status == 200) {
46 74
          information = this.responseText;
47
-		 //organize()
75
+		 organize()
48 76
   }
49 77
   };
50 78
   xhttp.open("GET", query, true);
@@ -63,9 +91,10 @@ function fetchData() {
63 91
 	
64 92
 	var query = queryBase + "(" + table + ")&for=county:" + pueblo + queryEnd 
65 93
 	
66
-	console.log(query)
67
-	
68
-	loadDoc(query)
94
+	if(pueblo && table)
95
+	{loadDoc(query)}
96
+	else
97
+	{Alert.alert("Please fill every parameter before calling!")}
69 98
 	
70 99
 }
71 100
 
@@ -154,78 +183,34 @@ const handlePress = () => false
154 183
 
155 184
 
156 185
 //data parsing goes here
157
-
158
-function importJSON() {
159
-	var stuff = JSON.stringify(data)
160
-	return stuff
186
+function getInfo(){
187
+	//console.log(information[6])
188
+	return information
161 189
 }
162 190
 
163
-
164 191
 //data display
165 192
 
166
-function DataDisplay({valueTable, valuePueblo}) {
167
-  const [tableValue, setTableValue] = useState(null);
168
-  const [puebloValue, setPuebloValue] = useState(null);
169
-  
170
-  console.log("tableOption:",valueTable)
171
-  console.log("puebloOption:",valuePueblo)
193
+class DataButton extends React.Component{
172 194
 	
173
-//theres something wrong with this, its applying the previous value of valueTable and valuePueblo instead of the actual value
174
-
175
-  useEffect(() => {
176
-    setTableValue(valueTable);
177
-	console.log("tableValue:",tableValue)
178
-	//if not undefined
179
-	if(tableValue){updateTable(tableValue);}   
180
-  }, [valueTable]); // add props as dependencies
181
-  
182
-  useEffect(() => {
183
-    setPuebloValue(valuePueblo);
184
-	console.log("puebloValue:",puebloValue)
185
-    if(puebloValue){updatePueblo(puebloValue)};
186
-  }, [valuePueblo]); // add props as dependencies
195
+	state = {
196
+		click: false
197
+	}
187 198
 	
188
-
189
-  return (
190
-  <View>
191
-    <Text style={styles.sub}>{information}</Text>
192
-	<Button
193
-		onPress = {fetchData()}
194
-		title = "Fetch Data"
195
-		color = "black"
196
-		/>
197
-   </View>	  
198
-  );
199
-}
200
-
201
-//data pick
202
-/*
203
-function Parent() {
204
-  const [parentOption, setParentOption] = useState(0);
205
-
206
-  return (
207
-    <View>
208
-		<Pressable onPress = {() => setParentOption(current => 1)}>
209
-			<Text style = {styles.listItem}> DP02PR </Text>
210
-		</Pressable>
211
-			
212
-		<Pressable onPress = {() => setParentOption(current => 2)}>
213
-			<Text style = {styles.listItem}> DP03PR </Text>
214
-		</Pressable>
215
-			
216
-		<Pressable onPress = {() => setParentOption(current => 3)}>
217
-			<Text style = {styles.listItem}> DP04PR </Text>
218
-		</Pressable>
219
-			
220
-		<Pressable onPress = {() => setParentOption(current => 4)}>
221
-			<Text style = {styles.listItem}> DP05PR </Text>
222
-		</Pressable>
223
-
224
-		<DataDisplay parentOption={parentOption} />
225
-    </View>
226
-  );
199
+	pullData = () => {fetchData(); this.setState({click: true})}
200
+	
201
+	
202
+	render() {
203
+		return(
204
+		<View>
205
+			<Button
206
+			onPress = {this.pullData}
207
+			title = "Fetch Data"
208
+			color = "black"
209
+			/>
210
+			<Text style={styles.sub}>{getInfo()}</Text> 
211
+		</View>
212
+	);}	
227 213
 }
228
-*/
229 214
 
230 215
 
231 216
 //picker test
@@ -236,7 +221,6 @@ function Picker() {
236 221
   
237 222
   
238 223
   const [openTable, setOpenTable] = useState(false);
239
-  //const [tableOption, setTableOption] = useState(0);
240 224
   const [valueTable, setValueTable] = useState(null);
241 225
   const [table, setTable] = useState([
242 226
     {label:'DP02PR', value: 'DP02PR'},
@@ -250,7 +234,6 @@ function Picker() {
250 234
   
251 235
   //pueblo
252 236
   const [openPueblo, setOpenPueblo] = useState(false);
253
-  //const [puebloOption, setPuebloOption] = useState(0);
254 237
   const [valuePueblo, setValuePueblo] = useState(null);
255 238
   const [pueblo, setPueblo] = useState([
256 239
     {label: 'Adjuntas', value: '001'},
@@ -333,9 +316,6 @@ function Picker() {
333 316
 	{label: 'Yauco', value: '153'}
334 317
   ]);
335 318
   
336
-  
337
-  //make sure pickers are closed when another opens
338
-  
339 319
 
340 320
   return (
341 321
   <View>
@@ -346,9 +326,9 @@ function Picker() {
346 326
       setOpen={setOpenTable}
347 327
       setValue={setValueTable}
348 328
       setItems={setTable}
349
-	  //onChangeValue={(valueTable) => {
350
-	//	setTableOption(current => valueTable);
351
-	//	}}
329
+	  onChangeValue = {(valueTable) => {
330
+		updateTable(valueTable);
331
+		}}
352 332
 	  onOpen = {() => {setOpenPueblo(false)}}
353 333
 	  zIndex={3000}
354 334
 	  zIndexInverse={1000}
@@ -363,9 +343,9 @@ function Picker() {
363 343
       setOpen={setOpenPueblo}
364 344
       setValue={setValuePueblo}
365 345
       setItems={setPueblo}
366
-	  //onChangeValue={(valuePueblo) => {
367
-	//	setPuebloOption(current => valuePueblo);
368
-	//	}}
346
+	  onChangeValue = {(valuePueblo) => {
347
+		updatePueblo(valuePueblo);
348
+		}}
369 349
 	  onOpen = {() => {setOpenTable(false)}}
370 350
 	  zIndex={1000}
371 351
       zIndexInverse={3000}
@@ -373,8 +353,6 @@ function Picker() {
373 353
 	  searchPlaceholder="Busqueda..."
374 354
     />
375 355
 	
376
-	<DataDisplay valueTable={valueTable} valuePueblo={valuePueblo} />
377
-	
378 356
 	</View>
379 357
   );
380 358
 }
@@ -385,7 +363,7 @@ function Picker() {
385 363
 
386 364
 class App extends React.Component {
387 365
 
388
-
366
+//the text at the end of a page gets cut off if anyone knows how to fix that?
389 367
 vars = {
390 368
 		welcome:
391 369
 		  
@@ -428,11 +406,15 @@ vars = {
428 406
 		 <View style = {styles.container}>
429 407
 			
430 408
 		  
431
-			<Text style={styles.intro}>DATA VIEWING</Text>		
432
-			
409
+			<Text style={styles.intro}>DATA VIEWING PROJECT</Text>		
410
+				
433 411
 			<Picker />
434 412
 			
435 413
 			<Image source={require('./testimg.gif')} />
414
+				
415
+			<DataButton />
416
+			
417
+			<Text style={styles.sub}>blehhhhhh bleh bleh bleh bleh bleh blehhhhhhhhhhhhhhhhh </Text>
436 418
 			
437 419
 		 </View>
438 420
 		</ScrollView></View>
@@ -469,13 +451,13 @@ setNews = () => this.setState({ current: this.vars.newsView })
469 451
 			 		 			<Button
470 452
 								onPress = {this.setNews}
471 453
 				 				title = "Noticias"
472
-				 				color = "white"
454
+				 				color = "rgba(255, 0, 0, 0)"
473 455
 			  					/>
474 456
 			  
475 457
 			  					<Button
476 458
 								 onPress = {this.setData}
477 459
 								 title = "Datos"
478
-								 color = "white"
460
+								 color = "rgba(255, 0, 0, 0)"
479 461
 			  					/>
480 462
 							</View>
481 463
 						

+ 1754
- 2
package-lock.json
File diff suppressed because it is too large
View File


+ 1
- 0
package.json View File

@@ -11,6 +11,7 @@
11 11
   "dependencies": {
12 12
     "@expo/webpack-config": "^0.17.2",
13 13
     "@react-native-picker/picker": "^2.4.8",
14
+    "danfojs": "^1.1.2",
14 15
     "expo": "^47.0.6",
15 16
     "expo-font": "~11.0.1",
16 17
     "expo-splash-screen": "~0.17.5",

+ 680
- 13
yarn.lock
File diff suppressed because it is too large
View File