Initial data in FootprintResults (no updating) (a189cc43) · Commits · aflab / astrogeology / Asc Geostac

src/components/container/App.jsx

+2 −2

Original line number	Diff line number	Diff line
		@@ -35,10 +35,10 @@ export default function App() {
		let jsonPromise = {};

		// Fetched Maps
		var mapsJson = {};
		let mapsJson = {};

		// Combined Data
		var aggregateMapList = {};
		let aggregateMapList = {};

		// Init
		fetchStatus[astroWebMaps] = "Not Started";

src/components/container/GeoStacApp.jsx

+2 −2

Original line number	Diff line number	Diff line
		@@ -29,7 +29,7 @@ let css = {
		* @component
		*/
		export default function GeoStacApp(props) {
		const [targetPlanet, setTargetPlanet] = React.useState("Mars");
		const [targetPlanet, setTargetPlanet] = React.useState(props.mapList.systems[4].bodies[0]);

		const [footprintData, setFootprintData] = React.useState([]);

		@@ -68,7 +68,7 @@ export default function GeoStacApp(props) {
		bodyChange={handleTargetBodyChange}
		/>
		<div id="map-area">
		<MapContainer target={targetPlanet} />
		<MapContainer target={targetPlanet.name} />
		</div>
		<QueryConsole />
		</div>

src/components/presentational/ConsoleTargetInfo.jsx

+4 −6

Original line number	Diff line number	Diff line
		@@ -120,8 +120,6 @@ function PlanetDialog(props) {
		onClose(value);
		};

		console.log(props.mapList)

		return (
		<Dialog PaperProps={{sx: {overflowY: "scroll"}}} onClose={handleClose} open={open}>
		<DialogTitle sx={{ minWidth: 225 }}>Select Target Body</DialogTitle>
		@@ -146,7 +144,7 @@ function PlanetDialog(props) {
		{props.mapList.systems[sysIndex].bodies.map((body, bodIndex) => (
		<ListItemButton
		sx={{ pl: 4 }}
		onClick={() => handleListItemClick(body.name)}
		onClick={() => handleListItemClick(body)}
		key={body.name}
		>
		<ListItemAvatar>
		@@ -170,7 +168,7 @@ function PlanetDialog(props) {
		PlanetDialog.propTypes = {
		onClose: PropTypes.func.isRequired,
		open: PropTypes.bool.isRequired,
		selectedValue: PropTypes.string.isRequired,
		selectedValue: PropTypes.object.isRequired,
		};

		/**
		@@ -186,7 +184,7 @@ PlanetDialog.propTypes = {
		*/
		export default function ConsoleTargetInfo(props) {
		const [open, setOpen] = React.useState(false);
		const [selectedValue, setSelectedValue] = React.useState(planets[3][0]);
		const [selectedValue, setSelectedValue] = React.useState(props.mapList.systems[4].bodies[0]);

		const handleClickOpen = () => {
		setOpen(true);
		@@ -214,7 +212,7 @@ export default function ConsoleTargetInfo(props) {
		variant="h4"
		onClick={handleClickOpen}
		>
		{props.target.toUpperCase()} <ArrowDropDownIcon fontSize="large" />
		{props.target.name.toUpperCase()} <ArrowDropDownIcon fontSize="large" />
		</Typography>
		</Grid>
		<PlanetDialog

src/components/presentational/FootprintResults.jsx

+106 −4

Original line number	Diff line number	Diff line
		@@ -42,8 +42,15 @@ let css = {
		*
		*/
		export default function FootprintResults(props) {

		const [features, setFeatures] = React.useState([]);

		const [footprintListComponent, setFootprintListComponent] = React.useState(() => {
		return(
		<div>Loading...</div>
		);
		})

		const geoTiffViewer = new GeoTiffViewer("GeoTiffAsset");

		const showMetadata = (value) => () => {
		@@ -58,10 +65,104 @@ export default function FootprintResults(props) {
		};

		useEffect(() => {
		setTimeout(() => {
		setFeatures(getFeatures);
		}, 1000);

		// If target has collections (of footprints)
		if (props.target.collections.length > 0) {

		let fetchPromise = {};
		let jsonPromise = {};
		let jsonRes = {};

		let itemCollectionUrls = [];
		for(const collection of props.target.collections) {
		// Get "items" link for each collection
		let newItemCollectionUrl = collection.links.find(obj => obj.rel === "items").href
		itemCollectionUrls.push(newItemCollectionUrl);
		}

		for(const itemCollectionUrl of itemCollectionUrls) {
		fetchPromise[itemCollectionUrl] = "Not Started";
		jsonPromise[itemCollectionUrl] = "Not Started";
		jsonRes[itemCollectionUrl] = [];
		}

		// Fetch JSON and read into object
		async function startFetch(targetUrl) {
		fetchPromise[targetUrl] = fetch(
		targetUrl
		).then((res)=>{
		jsonPromise[targetUrl] = res.json().then((jsonData)=>{
		jsonRes[targetUrl] = jsonData;
		}).catch((err)=>{
		console.log(err);
		});
		}).catch((err) => {
		console.log(err);
		});
		}

		async function awaitFetch(targetUrl) {
		await fetchPromise[targetUrl];
		await jsonPromise[targetUrl];
		}

		function extractFootprints(resultsArr) {
		for(const result in resultsArr){

		}
		}

		async function fetchAndWait() {
		// Start fetching
		for(const itemCollectionUrl of itemCollectionUrls) {
		startFetch(itemCollectionUrl);
		}

		// Wait for completion
		for(const itemCollectionUrl of itemCollectionUrls) {
		await awaitFetch(itemCollectionUrl);
		}

		let resultsArr = [];
		let myFeatures = [];

		for(const itemCollectionUrl of itemCollectionUrls) {
		myFeatures.push(jsonRes[itemCollectionUrl]);
		}

		for(const featCollection of myFeatures) {
		resultsArr.push(...featCollection.features)
		}

		return resultsArr;
		}



		(async () => {
		// Wait
		let myFeatures = await fetchAndWait()
		setFeatures(myFeatures);
		setFootprintListComponent(
		<>
		<div>Footprints!</div>
		</>
		);
		})();





		} else {
		setFootprintListComponent(<div>No footprints for this Target.</div>)
		}

		// setTimeout(() => {
		// setFeatures(getFeatures);
		// }, 1000);

		}, []);

		return (
		<div style={css.root} className="scroll-parent">
		@@ -81,6 +182,7 @@ export default function FootprintResults(props) {
		/>
		</span>
		</div>
		{footprintListComponent}
		<div className="resultsList">
		{features.map((feature) => (
		<div className="resultContainer" key={feature.id}>

src/components/presentational/SearchAndFilterInput.jsx

+1 −1

Original line number	Diff line number	Diff line
		@@ -221,7 +221,7 @@ export default function SearchAndFilterInput(props) {
		setMaxPages(getMaxNumberPages);
		props.footprintNavClick();
		}, 2000);
		}, [props.target]);
		}, [props.target.name]);

		// Pagination
		const handlePageChange = (event, value) => {