Commit ea8edabe authored by Amy Stamile's avatar Amy Stamile
Browse files

Pagination and limit now updates on apply. Other clean up changes.

parent fb4f58bb

app/src/assets/img/cartocosmos-logo.svg

deleted100644 → 0
+0 −27
Original line number Diff line number Diff line 
<?xml version="1.0" encoding="utf-8"?>

<!-- Generator: Adobe Illustrator 24.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"

	 viewBox="0 0 1000 1000" style="enable-background:new 0 0 1000 1000;" xml:space="preserve">

<path d="M987.2,484.61l-59.95-11.1c-6.47-105.81-51.74-204.92-127.71-279.34C725.73,121.86,629.17,79.04,526.49,72.75l-11.1-59.95

	C514.02,5.38,507.55,0,500,0s-14.02,5.38-15.39,12.8l-11.09,59.93C367.39,79.22,268,124.78,193.55,201.1

	c-71.92,73.73-114.53,170.06-120.8,272.41l-59.95,11.1C5.38,485.98,0,492.45,0,500c0,7.55,5.38,14.02,12.8,15.39l59.93,11.09

	c6.48,106.13,52.04,205.52,128.37,279.98c73.73,71.92,170.05,114.52,272.4,120.79l11.1,59.95c1.37,7.42,7.85,12.8,15.39,12.8

	s14.02-5.38,15.39-12.8l11.1-59.95c105.74-6.46,204.76-51.65,279.17-127.54c72.41-73.84,115.3-170.45,121.59-273.22l59.95-11.1

	c7.42-1.37,12.8-7.85,12.8-15.39C1000,492.45,994.62,485.98,987.2,484.61z M775.86,218.36c67.94,66.55,109.22,154.54,117.01,248.79

	l-36.11-6.68c-9.02-82.15-46.47-159.08-105.86-217.14c-57.41-56.13-132-91.34-211.36-100.08l-6.68-36.11

	C624.25,114.7,709.9,153.75,775.86,218.36z M542.52,159.36c72.84,9.05,141.22,41.45,194.6,92.45L579.74,360.45L542.52,159.36z

	 M711.46,288.54L589.09,410.91l-6.22-33.6L711.46,288.54z M748.2,262.89c50.92,53.31,83.41,121.67,92.45,194.6l-200.58-37.13

	L748.2,262.89z M217.78,224.74c66.59-68.26,154.83-109.81,249.37-117.61l-6.69,36.13c-82.28,9.04-159.33,46.6-217.41,106.14

	c-55.97,57.37-91.08,131.86-99.81,211.08l-36.11,6.68C114.68,376.05,153.53,290.6,217.78,224.74z M377.32,417.13l-88.76-128.58

	l0.02,0.01l122.34,122.34L377.32,417.13z M159.36,457.48c9.05-72.83,41.45-141.23,92.45-194.6l108.64,157.37L159.36,457.48z

	 M420.25,360.49L262.88,251.81c53.3-50.91,121.67-83.42,194.6-92.46L420.25,360.49z M15.65,500L15.65,500 M224.75,782.23

	c-68.27-66.59-109.82-154.84-117.62-249.38l36.13,6.69c9.03,82.26,46.57,159.28,106.08,217.36c57.38,56,131.89,91.13,211.13,99.86

	l6.68,36.11C376.05,885.32,290.61,846.48,224.75,782.23z M457.48,840.64c-72.83-9.05-141.23-41.45-194.6-92.45l157.37-108.64

	L457.48,840.64z M288.55,711.45l122.37-122.37l6.22,33.6L288.55,711.45z M251.81,737.12c-50.92-53.3-83.42-121.67-92.45-194.6

	l201.04,37.21L251.81,737.12z M424.35,424.35L500,15.65v0V500l75.65-75.65 M575.65,424.35L984.35,500l0,0L500,500l75.65,75.65

	L500,984.35v0V500l-75.65,75.65L15.65,500L500,500l-75.65-75.65 M589.09,589.09L589.09,589.09l33.6-6.22l88.77,128.59L589.09,589.09

	z M579.65,640.07l157.47,108.13c-53.32,50.93-121.67,83.41-194.59,92.45L579.65,640.07z M748.19,737.12L639.55,579.74l201.09-37.22

	C831.59,615.36,799.2,683.74,748.19,737.12z M781.49,776.01c-66.55,67.86-154.46,109.07-248.64,116.85l6.68-36.1

	c82.1-9.02,158.96-46.41,217.01-105.73c56.21-57.44,91.46-132.07,100.21-211.49l36.11-6.68

	C885.3,624.32,846.19,710.03,781.49,776.01z"/>

</svg>

app/src/assets/img/geostaclogo.svg

0 → 100644
+1 −0

File added.

Preview size limit exceeded, changes collapsed.

app/src/components/presentational/CreditsDisplay.jsx

+8 −22
Original line number Diff line number Diff line
@@ -4,7 +4,7 @@ import Link from "@mui/material/Link"; 
import Divider from "@mui/material/Divider";

import GitHubIcon from "@mui/icons-material/GitHub";

import SvgIcon from "@mui/material/SvgIcon";

import CartoCosmosIcon from "../../assets/img/cartocosmos-logo.svg";

import GeoSTACIcon from "../../assets/img/geostaclogo.svg";





export default function CreditsDisplay() {
@@ -31,7 +31,7 @@ export default function CreditsDisplay() { 
          color="inherit"

          style={{ fontWeight: 600 }}

          variant="caption"

          href="https://docs.google.com/document/d/1Wy5rwjEU7qACsI3jc-JdGEjh8jkq_v5DyQelfNOkjO4/edit?usp=sharing"

          href=""

        >

          User Manual

        </Link>
@@ -39,28 +39,27 @@ export default function CreditsDisplay() { 
      <Divider orientation="vertical" />

      <div className="credit-item">

        <Typography style={{ fontSize: 12 }} variant="caption">

          Made by{" "}

          <Link

            target="_blank"

            rel="noopener"

            variant="caption"

            color="inherit"

            style={{ fontWeight: 600 }}

            href="https://cefns.nau.edu/capstone/projects/CS/2020/CartoCosmos-S20/"

            href="https://www.ceias.nau.edu/capstone/projects/CS/2022/GeoSTAC/"

          >

            CartoCosmos{" "}

            GeoSTAC Project Website

          </Link>

        </Typography>

        <SvgIcon

          viewBox="0 0 1000 1000"

          viewBox="0 0 375 375"

          style={{

            color: "#343a40",

            top: 3,

            width: 13,

            width: 20,

            height: 13,

            position: "relative"

          }}

          component={CartoCosmosIcon}

          component={GeoSTACIcon}

        />

      </div>

      <Divider orientation="vertical" />
@@ -68,20 +67,7 @@ export default function CreditsDisplay() { 
        <Link

          target="_blank"

          rel="noopener"

          color="inherit"

          variant="caption"

          style={{ fontWeight: 600 }}

          href="https://cartocosmos-test.readthedocs.io/en/latest/"

        >

          Jupyter Notebooks

        </Link>

      </div>

      <Divider orientation="vertical" />

      <div className="credit-item">

        <Link

          target="_blank"

          rel="noopener"

          href="https://github.com/CartoCosmos/CartoCosmos/"

          href="https://github.com/GeoSTAC/CartoCosmos-with-STAC"

        >

          <GitHubIcon

            style={{

app/src/components/presentational/SearchAndFilterInput.jsx

+11 −6
Original line number Diff line number Diff line
@@ -24,7 +24,7 @@ import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'; 
import Slider from '@mui/material/Slider';

import Pagination from '@mui/material/Pagination';



import { getMaxNumberPages, setCurrentPage, getCurrentPage, getNumberMatched } from "../../js/ApiJsonCollection";

import { getMaxNumberPages, setCurrentPage, getCurrentPage, getNumberMatched, setLimit } from "../../js/ApiJsonCollection";





/**
@@ -104,6 +104,12 @@ export default function SearchAndFilterInput(props) { 
  const [maxNumberFootprints, setMaxNumberFootprints] = React.useState(0);

  const [limitVal, setLimitVal] = React.useState(0);



  const handleApply = (event) => {

    setTimeout(() => {

      setMaxPages(getMaxNumberPages);

    }, 1000);

  }



  // Clear all values

  const handleClear = (event) => {

    setSortVal('');
@@ -166,9 +172,7 @@ export default function SearchAndFilterInput(props) { 
  // limit

  const handleLimitChange = (event, value) => {

    setLimitVal(value);

    setTimeout(() => {

      setMaxPages(getMaxNumberPages);

    }, 1000);

    setLimit(value);

  }



  // resets pagination and limit when switching targets
@@ -176,10 +180,12 @@ export default function SearchAndFilterInput(props) { 
    setTimeout(() => {

      setMaxNumberFootprints(getNumberMatched);

      setLimitVal(10);

      setLimit(10);

      setMaxPages(getMaxNumberPages);

    }, 1000);

  }, [props.target]);





  // Pagination

  const handlePageChange = (event, value) => {

    setCurrentPage(value);
@@ -208,7 +214,7 @@ export default function SearchAndFilterInput(props) { 
          </div>

          <div className="panelSection">

            <ButtonGroup>

              <Button id="applyButton" variant="contained" startIcon={<FilterAltIcon />} sx={css.button}>

              <Button id="applyButton" variant="contained" startIcon={<FilterAltIcon />} onClick={handleApply} sx={css.button}>

                Apply

              </Button>

              <Button id="clearButton" variant="contained" endIcon={<DeleteForeverIcon />} onClick={handleClear} sx={css.buttonRemove}>
@@ -339,7 +345,6 @@ export default function SearchAndFilterInput(props) { 
            </div>

            <div className="panelSectionHeader">

              <div className="panelItem">

                <div className="panelSectionTitle">Showing {limitVal} of {maxNumberFootprints} Footprints</div>

                  <Pagination

                    id="pagination"

                    count={maxPages}

app/src/js/ApiJsonCollection.js

+29 −15
Original line number Diff line number Diff line 
var _maxNumberPages = 0;

var _currentPage = 1;

var _numberMatched = 0;

var _limitVal = 10;



function callAPI() {

  return fetch(
@@ -8,7 +9,7 @@ function callAPI() { 
  ).then(response => response.json());

}



function getItemCollection(name, queryString) {

export function getItemCollection(name, queryString) {

  var urlArray = [];

  return callAPI().then(result => {

    for (let i = 0; i < result.collections.length; i++) {
@@ -32,6 +33,11 @@ function getItemCollection(name, queryString) { 
    let promiseArray = [];

    for (let i = 0; i < urlArray.length; i++) {

      promiseArray.push(fetch(urlArray[i]));

      let urlResults = "";

      for(let i = 0; i < urlArray.length; i++){

        urlResults += urlArray[i] + " ";

      }

      document.getElementById("query-textarea").innerText = urlResults;

    }

    return Promise.all(promiseArray).then(function(responses) {

      return Promise.all(
@@ -47,12 +53,14 @@ function getItemCollection(name, queryString) { 
 * @function setNumberMatched

 * @description Sets the value of the return number of footprints

 */

function setNumberMatched(matched) {

export function setNumberMatched(matched) {

  _numberMatched = matched;

  let sliderElement = document.getElementById('valueSlider');

  let limitVal = sliderElement.lastChild.firstChild.value;

    if (limitVal != 0 && matched != 0){

      setMaxNumberPages(Math.floor(matched/limitVal));



  if (_limitVal != 0 && matched != 0){

    setMaxNumberPages(Math.floor(matched/_limitVal));

  }

  if (matched == 0){

    setMaxNumberPages(0);

  }

}
@@ -60,7 +68,7 @@ function setNumberMatched(matched) { 
 * @function getNumberMatched

 * @description Gets the value of the return number of footprints

 */

function getNumberMatched() {

export function getNumberMatched() {

  return _numberMatched

}
@@ -68,7 +76,7 @@ function getNumberMatched() { 
 * @function setMaxNumberPages

 * @description Sets the value of the max number of pages possible

 */

function setMaxNumberPages(pages) {

export function setMaxNumberPages(pages) {

  _maxNumberPages = pages;

}
@@ -76,7 +84,7 @@ function setMaxNumberPages(pages) { 
 * @function getMaxNumberPages

 * @description Gets the value of the max number of pages possible

 */

function getMaxNumberPages() {

export function getMaxNumberPages() {

  return _maxNumberPages;

}
@@ -84,17 +92,23 @@ function getMaxNumberPages() { 
 * @function setCurrentPage

 * @description Sets the value of the current page

 */

function setCurrentPage(page) {

export function setCurrentPage(page) {

  _currentPage = page;

}



/**

 * @function getMaxNumberPages

 * @description Gets the value of the max number of pages possible

 * @function getCurrentPage

 * @description Gets the value of the current page

 */

function getCurrentPage() {

export function getCurrentPage() {

  return _currentPage;

}





export { getItemCollection, getMaxNumberPages, setCurrentPage, getCurrentPage, setNumberMatched, getNumberMatched, setMaxNumberPages };
 
/**

 * @function setLimit

 * @description Sets the value of the limit

 */

export function setLimit(val) {

  _limitVal = val;

}