Upload files to ''

String version + some test

App.js

@@ -22,7 +22,7 @@ vars = {
 			<View style = {styles.container}>
 				
 				<Text style={styles.sub}>Aquí podra mantenerse al tanto con las 
-					últimas noticias relacionadas al Censo y tener acceso a los  
+					últimas noticias relacionadas al Censo y tener acceso a   
 					los Demographic Data Profiles de cada municipio de
 					Puerto Rico.
 				</Text>
@@ -129,4 +129,4 @@ vars = {
 }
 
 
-export default App
+export default App

Datos.js

@@ -1,375 +1,277 @@
-import React, {useState} from 'react';
-import { View, Text, Pressable, StyleSheet} from 'react-native';
-import DropDownPicker from 'react-native-dropdown-picker';
-//import {styles} from "./styles"
-  
-const styles = StyleSheet.create({
-	
-	buttons: {
-		flexDirection: 'row',
-		justifyContent: 'center',
-		marginTop: 40,
-		marginBottom: 30,
-		margin: 30,
-		borderColor: "grey",
-		borderRadius: 8,
-		padding: (30, 16),
-		backgroundColor: "black",
-		marginTop: 0,
-	}, 
-	navContainer: {
-	  flexDirection: 'row',
-	  justifyContent: "space-evenly",
-	  borderColor: "black",
-	  borderWidth: 5,
-	  borderRadius: 8,
-	  paddingTop: 20,
-	  backgroundColor: "gray",
-	  marginTop: 5,
-  }, 
-	buttonContainer: {
-	  flexDirection: 'column',
-	  backgroundColor: '#f0f8ff',
-	  alignItems: 'center',
-	  justifyContent: 'center',
-	  paddingTop:100,
-	  marginTop: 40,
-	},
-	container: {
-	  flexDirection: 'column',
-	  justifyContent: 'center',
-	  backgroundColor: '#f0f8ff',
-	  alignItems: 'center',
-	  justifyContent: 'center',
-	  paddingTop:20,
-	  marginTop: 20,
-	},
-	containerbackground:{
-	  
-	  backgroundColor: '#f0f8ff'
-	},
-	intro: {
-		fontWeight: "bold",
-		color:"#black",
-		fontSize: 30,
-	},
-  
-	sub: {
-	  color:"#black",  
-	  fontWeight: "bold",
-	  fontSize: 15,
-	  paddingBottom:10,
-  },
-  
-	Navsub: {
-		color:"#black",  
-		fontWeight: "bold",
-		fontSize: 30,
-		paddingBottom:10,
-	},
-	scrollView:{
-		marginHorizontal: 20
-	},
-	listItem:{
-		fontSize: 30,
-		color: "white",
-		textDecorationLines: "underline"
-	},
-	listButtons:{
-		fontSize: 15,
-		color: "white",
-		textDecorationLines: "underline"  
-	},
-	buttonsVer: {
-		flexDirection: 'column',
-		justifyContent: 'center',
-		marginTop: 40,
-		marginBottom: 30,
-		margin: 30,
-		borderColor: "grey",
-	},
-	bottom: {
-	  flex: 0.3,
-	  backgroundColor: "gray",
-	  borderWidth: 5,
-	  alignItems: 'center',
-	  borderBottomLeftRadius: 20,
-	  borderBottomRightRadius: 20,
-	
-  },text: {
-	  fontSize: 16,
-	  lineHeight: 21,
-	  fontWeight: 'bold',
-	  letterSpacing: 0.25,
-	  color: 'white',
-	},
-  });  
-const queryBase = "https://api.census.gov/data/2020/acs/acs5/profile?get=group"
-const queryEnd = "&in=state:72"
-var table = ""
-var pueblo = ""
-
-//where data will be stored
-var information = "data goes here"
-
-function Picker() {    
-
-    //table to pick from
-  
-  
-  const [openTable, setOpenTable] = useState(false);
-  const [valueTable, setValueTable] = useState(null);
-  const [table, setTable] = useState([
-    {label:'DP02PR', value: 'DP02PR'},
-    {label:'DP03', value: 'DP03'},
-	{label:'DP04', value: 'DP04'},
-    {label:'DP05', value: 'DP05'},
-  ]);
-    
-  //cambiar pueblo
-  
-  
-  //pueblo
-  const [openPueblo, setOpenPueblo] = useState(false);
-  const [valuePueblo, setValuePueblo] = useState(null);
-  const [pueblo, setPueblo] = useState([
-    {label: 'Adjuntas', value: '001'},
-    {label: 'Aguada', value: '003'},
-	{label: 'Aguadillas', value: '005'},
-    {label: 'Aguas Buenas', value: '007'},
-	{label: 'Aibonito', value: '009'},
-    {label: 'Añasco', value: '011'},
-	{label: 'Arecibo', value: '013'},
-    {label: 'Arroyo', value: '015'},
-	{label: 'Barceloneta', value: '017'},
-    {label: 'Barranquitas', value: '019'},
-	{label: 'Bayamón', value: '021'},
-    {label: 'Cabo Rojo', value: '023'},
-	{label: 'Caguas', value: '025'},
-    {label: 'Camuy', value: '027'},
-	{label: 'Canóvanas', value: '029'},
-	{label: 'Carolina', value: '031'},
-	{label: 'Cataño', value: '033'},
-	{label: 'Cayey', value: '035'},
-	{label: 'Ceiba', value: '037'},
-	{label: 'Ciales', value: '039'},
-	{label: 'Cidra', value: '041'},
-	{label: 'Coamo', value: '043'},
-	{label: 'Comerío', value: '045'},
-	{label: 'Corozal', value: '047'},
-	{label: 'Culebra', value: '049'},
-	{label: 'Dorado', value: '051'},
-	{label: 'Fajardo', value: '053'},
-	{label: 'Florida', value: '054'},
-	{label: 'Guánica', value: '055'},
-	{label: 'Guayama', value: '057'},
-	{label: 'Guayanilla', value: '059'},
-	{label: 'Guaynabo', value: '061'},	
-	{label: 'Gurabo', value: '063'},
-	{label: 'Hatillo', value: '065'},
-	{label: 'Hormigueros', value: '067'},
-	{label: 'Humacao', value: '069'},
-	{label: 'Isabela', value: '071'},
-	{label: 'Jayuya', value: '073'},
-	{label: 'Juana Díaz', value: '075'},
-	{label: 'Juncos', value: '077'},
-	{label: 'Lajas', value: '079'},
-	{label: 'Lares', value: '081'},
-	{label: 'Las Marías', value: '083'},
-	{label: 'Las Piedras', value: '085'},
-	{label: 'Loíza', value: '087'},
-	{label: 'Luquillo', value: '089'},
-	{label: 'Manatí', value: '091'},
-	{label: 'Maricao', value: '093'},
-	{label: 'Maunabo', value: '095'},
-	{label: 'Mayagüez', value: '097'},
-	{label: 'Moca', value: '099'},
-	{label: 'Morovis', value: '101'},
-	{label: 'Naguabo', value: '103'},
-	{label: 'Naranjito', value: '105'},
-	{label: 'Orocovis', value: '107'},
-	{label: 'Patillas', value: '109'},
-	{label: 'Peñuelas', value: '111'},
-	{label: 'Ponce', value: '113'},
-	{label: 'Quebradillas', value: '115'},
-	{label: 'Rincón', value: '117'},
-	{label: 'Río Grande', value: '119'},
-	{label: 'Sabana Grande', value: '121'},
-	{label: 'Salinas', value: '123'},
-	{label: 'San Germán', value: '125'},
-	{label: 'San Juan', value: '127'},
-	{label: 'San Lorenzo', value: '129'},
-	{label: 'San Sebastián', value: '131'},
-	{label: 'Santa Isabel', value: '133'},
-	{label: 'Toa Alta', value: '135'},
-	{label: 'Toa Baja', value: '137'},
-	{label: 'Trujillo Alto', value: '139'},
-	{label: 'Utuado', value: '141'},
-	{label: 'Vega Alta', value: '143'},
-	{label: 'Vega Baja', value: '145'},
-	{label: 'Vieques', value: '147'},
-	{label: 'Villalba', value: '149'},
-	{label: 'Yabucoa', value: '151'},
-	{label: 'Yauco', value: '153'}
-  ]);
-  
-
-    return (
-        <View>
-            <DropDownPicker
-                open={openTable}
-                value={valueTable}
-                items={table}
-                setOpen={setOpenTable}
-                setValue={setValueTable}
-                setItems={setTable}
-                onChangeValue = {(valueTable) => {
-                    updateTable(valueTable);
-                }}
-                onOpen = {() => {setOpenPueblo(false)}}
-                zIndex={3000}
-                zIndexInverse={1000}
-                placeholder="Tabla de Datos"
-            />
-
-                
-            <DropDownPicker
-                searchable={true}
-                open={openPueblo}
-                value={valuePueblo}
-                items={pueblo}
-                setOpen={setOpenPueblo}
-                setValue={setValuePueblo}
-                setItems={setPueblo}
-                onChangeValue = {(valuePueblo) => {
-                    updatePueblo(valuePueblo);
-                }}
-                onOpen = {() => {setOpenTable(false)}}
-                zIndex={1000}
-                zIndexInverse={3000}
-                placeholder="Pueblo"
-                searchPlaceholder="Busqueda..."
-            />
-                
-        </View>
-
-    );
-}
-
-
-        
-function updateTable(value){
-    table = value
-}
-        
-function updatePueblo(value){
-    pueblo = value
-}
-        
-//calls data query
-function loadDoc(query) {
-    var xhttp = new XMLHttpRequest();
-    xhttp.onreadystatechange = function() {
-        if (this.readyState == 4 && this.status == 200) {
-            information = this.responseText;
-            organize()
-            }
-        };
-        
-        xhttp.open("GET", query, true);
-        xhttp.send();  
-        }
-        
-    function fetchData() {
-            
-        console.log("fetching data")
-        var query = queryBase + "(" + table + ")&for=county:" + pueblo + queryEnd 
-        
-        if(pueblo && table)
-        {loadDoc(query)}
-
-        else
-            {Alert.alert("Please fill every parameter before calling!")}
-            
-    }
-
-
-
-//organize data make it pretty
-//add loading thing while this organizes all the data !!!
-
-function organize(){
-	
-	var stringDiv = JSON.stringify(information)
-	stringDiv = stringDiv.replace('[[', '');
-	stringDiv = stringDiv.replace(']]', '');
-	stringDiv = stringDiv.split(',')
-	//create smaller array variables
-	let variables = []
-	let value = []
-	let est = []
-	
-	
-	//theres a better way to do this but im not fixing it rn
-	for(let i = 0; i<stringDiv.length; i++){
-
-		if(i<stringDiv.length/3)
-		    {variables.push(stringDiv[i])}
-		else if(i<stringDiv.length/3*2)
-		    {value.push(stringDiv[i])}
-		else
-            {est.push(stringDiv[i])}
-	}
-	
-	//anyways this to format it
-	
-	console.log("vars:",variables)
-	console.log("val:",value)
-	console.log("est:",est)
-
-	
-}
-
-function json_2_csv(information){
-
-	const csv = parse(obj);
-	console.log(csv);
-}
-
-//fix
-
-DropDownPicker.setListMode("SCROLLVIEW")
-
-
-//data parsing goes here
-function getInfo(){
-	return information
-}
-
-//data display
-
-class DataButton extends React.Component{
-	
-	state = {
-		click: false
-	}
-	
-	pullData = () => {fetchData(); this.setState({click: true})}
-	
-	
-	render() {
-		return(
-            <View style = {styles.container}>
-                    
-                    <Pressable style={styles.buttons} onPress = {this.pullData}>
-                        <Text style={styles.text}> Fetch Data</Text>
-                    </Pressable>
-                   
-                        <Text style={styles.sub}>{getInfo()}</Text> 
-                    
-            </View>
-	    );
-    }	
-}
-
+import React, {useState} from 'react';
+import { View, Text, Pressable, StyleSheet} from 'react-native';
+import DropDownPicker from 'react-native-dropdown-picker';
+import {styles} from "./styles"
+  
+const queryBase = "https://api.census.gov/data/2020/acs/acs5/profile?get=group"
+const queryEnd = "&in=state:72"
+var table = ""
+var pueblo = ""
+
+//where data will be stored
+var information = "data goes here"
+
+function Picker() {    
+
+    //table to pick from
+  
+  
+  const [openTable, setOpenTable] = useState(false);
+  const [valueTable, setValueTable] = useState(null);
+  const [table, setTable] = useState([
+    {label:'DP02PR', value: 'DP02PR'},
+    {label:'DP03', value: 'DP03'},
+	{label:'DP04', value: 'DP04'},
+    {label:'DP05', value: 'DP05'},
+  ]);
+    
+  //cambiar pueblo
+  
+  
+  //pueblo
+  const [openPueblo, setOpenPueblo] = useState(false);
+  const [valuePueblo, setValuePueblo] = useState(null);
+  const [pueblo, setPueblo] = useState([
+    {label: 'Adjuntas', value: '001'},
+    {label: 'Aguada', value: '003'},
+	{label: 'Aguadillas', value: '005'},
+    {label: 'Aguas Buenas', value: '007'},
+	{label: 'Aibonito', value: '009'},
+    {label: 'Añasco', value: '011'},
+	{label: 'Arecibo', value: '013'},
+    {label: 'Arroyo', value: '015'},
+	{label: 'Barceloneta', value: '017'},
+    {label: 'Barranquitas', value: '019'},
+	{label: 'Bayamón', value: '021'},
+    {label: 'Cabo Rojo', value: '023'},
+	{label: 'Caguas', value: '025'},
+    {label: 'Camuy', value: '027'},
+	{label: 'Canóvanas', value: '029'},
+	{label: 'Carolina', value: '031'},
+	{label: 'Cataño', value: '033'},
+	{label: 'Cayey', value: '035'},
+	{label: 'Ceiba', value: '037'},
+	{label: 'Ciales', value: '039'},
+	{label: 'Cidra', value: '041'},
+	{label: 'Coamo', value: '043'},
+	{label: 'Comerío', value: '045'},
+	{label: 'Corozal', value: '047'},
+	{label: 'Culebra', value: '049'},
+	{label: 'Dorado', value: '051'},
+	{label: 'Fajardo', value: '053'},
+	{label: 'Florida', value: '054'},
+	{label: 'Guánica', value: '055'},
+	{label: 'Guayama', value: '057'},
+	{label: 'Guayanilla', value: '059'},
+	{label: 'Guaynabo', value: '061'},	
+	{label: 'Gurabo', value: '063'},
+	{label: 'Hatillo', value: '065'},
+	{label: 'Hormigueros', value: '067'},
+	{label: 'Humacao', value: '069'},
+	{label: 'Isabela', value: '071'},
+	{label: 'Jayuya', value: '073'},
+	{label: 'Juana Díaz', value: '075'},
+	{label: 'Juncos', value: '077'},
+	{label: 'Lajas', value: '079'},
+	{label: 'Lares', value: '081'},
+	{label: 'Las Marías', value: '083'},
+	{label: 'Las Piedras', value: '085'},
+	{label: 'Loíza', value: '087'},
+	{label: 'Luquillo', value: '089'},
+	{label: 'Manatí', value: '091'},
+	{label: 'Maricao', value: '093'},
+	{label: 'Maunabo', value: '095'},
+	{label: 'Mayagüez', value: '097'},
+	{label: 'Moca', value: '099'},
+	{label: 'Morovis', value: '101'},
+	{label: 'Naguabo', value: '103'},
+	{label: 'Naranjito', value: '105'},
+	{label: 'Orocovis', value: '107'},
+	{label: 'Patillas', value: '109'},
+	{label: 'Peñuelas', value: '111'},
+	{label: 'Ponce', value: '113'},
+	{label: 'Quebradillas', value: '115'},
+	{label: 'Rincón', value: '117'},
+	{label: 'Río Grande', value: '119'},
+	{label: 'Sabana Grande', value: '121'},
+	{label: 'Salinas', value: '123'},
+	{label: 'San Germán', value: '125'},
+	{label: 'San Juan', value: '127'},
+	{label: 'San Lorenzo', value: '129'},
+	{label: 'San Sebastián', value: '131'},
+	{label: 'Santa Isabel', value: '133'},
+	{label: 'Toa Alta', value: '135'},
+	{label: 'Toa Baja', value: '137'},
+	{label: 'Trujillo Alto', value: '139'},
+	{label: 'Utuado', value: '141'},
+	{label: 'Vega Alta', value: '143'},
+	{label: 'Vega Baja', value: '145'},
+	{label: 'Vieques', value: '147'},
+	{label: 'Villalba', value: '149'},
+	{label: 'Yabucoa', value: '151'},
+	{label: 'Yauco', value: '153'}
+  ]);
+  
+
+    return (
+        <View>
+            <DropDownPicker
+                open={openTable}
+                value={valueTable}
+                items={table}
+                setOpen={setOpenTable}
+                setValue={setValueTable}
+                setItems={setTable}
+                onChangeValue = {(valueTable) => {
+                    updateTable(valueTable);
+                }}
+                onOpen = {() => {setOpenPueblo(false)}}
+                zIndex={3000}
+                zIndexInverse={1000}
+                placeholder="Tabla de Datos"
+            />
+
+                
+            <DropDownPicker
+                searchable={true}
+                open={openPueblo}
+                value={valuePueblo}
+                items={pueblo}
+                setOpen={setOpenPueblo}
+                setValue={setValuePueblo}
+                setItems={setPueblo}
+                onChangeValue = {(valuePueblo) => {
+                    updatePueblo(valuePueblo);
+                }}
+                onOpen = {() => {setOpenTable(false)}}
+                zIndex={1000}
+                zIndexInverse={3000}
+                placeholder="Pueblo"
+                searchPlaceholder="Busqueda..."
+            />
+                
+        </View>
+
+    );
+}
+
+
+        
+function updateTable(value){
+    table = value
+}
+        
+function updatePueblo(value){
+    pueblo = value
+}
+        
+//calls data query
+function loadDoc(query) {
+    var xhttp = new XMLHttpRequest();
+    xhttp.onreadystatechange = function() {
+        if (this.readyState == 4 && this.status == 200) {
+            information = this.responseText;
+            organize()
+            }
+        };
+        
+        xhttp.open("GET", query, true);
+        xhttp.send();  
+        }
+        
+    function fetchData() {
+            
+        console.log("fetching data")
+        var query = queryBase + "(" + table + ")&for=county:" + pueblo + queryEnd 
+        
+        if(pueblo && table)
+        {loadDoc(query)}
+
+        else
+            {Alert.alert("Please fill every parameter before calling!")}
+            
+    }
+
+
+
+//organize data make it pretty
+//add loading thing while this organizes all the data !!!
+
+function organize(){
+	
+	var stringDiv = JSON.stringify(information)
+	stringDiv = stringDiv.replace('[[', '');
+	stringDiv = stringDiv.replace(']]', '');
+	stringDiv = stringDiv.split(',')
+	//create smaller array variables
+	let variables = []
+	let value = []
+	let est = []
+	
+	
+	//theres a better way to do this but im not fixing it rn
+	for(let i = 0; i<stringDiv.length; i++){
+
+		if(i<stringDiv.length/3)
+		    {variables.push(stringDiv[i])}
+		else if(i<stringDiv.length/3*2)
+		    {value.push(stringDiv[i])}
+		else
+            {est.push(stringDiv[i])}
+	}
+	
+	//anyways this to format it
+	
+	console.log("vars:",variables)
+	console.log("val:",value)
+	console.log("est:",est)
+
+	
+}
+
+function json_2_csv(information){
+
+	const csv = parse(obj);
+	console.log(csv);
+}
+
+//fix
+
+DropDownPicker.setListMode("SCROLLVIEW")
+
+
+//data parsing goes here
+function getInfo(){
+	if(!information)
+	{Alert.alert("Please try again later! Error retriving data")}
+	else
+	{return information}
+}
+
+//data display
+
+class DataButton extends React.Component{
+	
+	state = {
+		click: false
+	}
+	
+	pullData = () => {fetchData(); this.setState({click: true})}
+	
+	
+	render() {
+		return(
+            <View style = {styles.container}>
+                    
+                    <Pressable style={styles.buttons} onPress = {this.pullData}>
+                        <Text style={styles.text}> Fetch Data</Text>
+                    </Pressable>
+                   
+                        <Text style={styles.sub}>{getInfo()}</Text> 
+                    
+            </View>
+	    );
+    }	
+}
+
 export { Picker, updateTable, updatePueblo,loadDoc,fetchData,DataButton};