import * from styles;
import DropDownPicker from 'react-native-dropdown-picker';
import React, {useState, useEffect} from 'react';


//ALL REQUIRED TO GET DATA

DropDownPicker.setListMode("SCROLLVIEW")

//data parsing goes here
function getInfo(information){
	//console.log(information[6])
	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 = () => {createQuery(pueblo, table); information = loadDoc(query); this.setState({click: true})}
	
	
	render() {
		return(
		<View>
			<Button
			onPress = {this.pullData}
			title = "Fetch Data"
			color = "black"
			/>
			<Text style={styles.sub}>{getInfo()}</Text> 
		</View>
	);}	
}


function createQuery(pueblo, table) {
	
	const queryBase = "https://api.census.gov/data/2020/acs/acs5/profile?get=group"
	const queryEnd = "&in=state:72"
	console.log("fetching data")
	
	var query = queryBase + "(" + table + ")&for=county:" + pueblo + queryEnd 
	
	if(pueblo && table)
	{return query}
	else
	{Alert.alert("Please fill every parameter before calling!")}
	
}

function loadDoc(query) {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
         var information = this.responseText;
		 return information
  }
  };
  xhttp.open("GET", query, true);
  xhttp.send();
  
}