Commit 6b4b85d5 authored by Elisabeth Reuhl's avatar Elisabeth Reuhl
Browse files

Merge branch 'master' into api-changes-workaround

parents 6d7b81b4 066e0e66
...@@ -23,6 +23,8 @@ ...@@ -23,6 +23,8 @@
"Period_other": "Perioden", "Period_other": "Perioden",
"Region": "Region", "Region": "Region",
"Coordinate bounding box": "Bounding Box", "Coordinate bounding box": "Bounding Box",
"North, East decimal degrees": "Nord, Ost Dezimalgrade",
"South, West decimal degrees": "Süd, West Dezimalgrade",
"Catalog": "Katalog", "Catalog": "Katalog",
"Catalog_other": "Kataloge", "Catalog_other": "Kataloge",
"iDAI.gazetteer provenance": "iDAI.gazetteer-Provenienz", "iDAI.gazetteer provenance": "iDAI.gazetteer-Provenienz",
......
...@@ -23,6 +23,8 @@ ...@@ -23,6 +23,8 @@
"Period_other": "Periods", "Period_other": "Periods",
"Region": "Region", "Region": "Region",
"Coordinate bounding box": "Bounding box", "Coordinate bounding box": "Bounding box",
"North, East decimal degrees": "North, East decimal degrees",
"South, West decimal degrees": "South, West decimal degrees",
"Catalog": "Catalog", "Catalog": "Catalog",
"Catalog_other": "Catalogs", "Catalog_other": "Catalogs",
"iDAI.gazetteer provenance": "iDAI.gazetteer provenance tag", "iDAI.gazetteer provenance": "iDAI.gazetteer provenance tag",
......
...@@ -337,7 +337,7 @@ export const Filters = (props) => { ...@@ -337,7 +337,7 @@ export const Filters = (props) => {
name="boundingBoxCorner1" name="boundingBoxCorner1"
value={input.boundingBoxCorner1} value={input.boundingBoxCorner1}
placeholder={t("select using toggle below")} placeholder={t("select using toggle below")}
label="North, East decimal degrees" label={t("North, East decimal degrees")}
InputLabelProps={{ InputLabelProps={{
shrink: true, shrink: true,
}} }}
...@@ -364,7 +364,7 @@ export const Filters = (props) => { ...@@ -364,7 +364,7 @@ export const Filters = (props) => {
name="boundingBoxCorner2" name="boundingBoxCorner2"
value={input.boundingBoxCorner2} value={input.boundingBoxCorner2}
placeholder={t("select using toggle below")} placeholder={t("select using toggle below")}
label="South, West decimal degrees" label={t("South, West decimal degrees")}
InputLabelProps={{ InputLabelProps={{
shrink: true, shrink: true,
}} }}
......
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { import {
AppBar, Button, ClickAwayListener, Drawer, Grid, Grow, Link, MenuItem, MenuList, Paper, Popper, Slide, Toolbar, AppBar, Button, ClickAwayListener, Drawer, Grid, Grow, Hidden, Link, MenuItem, MenuList, Paper, Popper, Slide,
Tooltip, Typography, useScrollTrigger Toolbar, Tooltip, Typography, useScrollTrigger
} from '@material-ui/core'; } from '@material-ui/core';
import { useStyles } from '../../styles'; import { useStyles } from '../../styles';
import { CollapsedFilters, Filters } from ".."; import { CollapsedFilters, Filters } from "..";
...@@ -181,8 +181,74 @@ export const PageHeader = (props) => { ...@@ -181,8 +181,74 @@ export const PageHeader = (props) => {
</Toolbar> </Toolbar>
</AppBar> </AppBar>
{/* white header containing filters which is shown on page load, it will disappear when scrolling down and reappear when scrolling up */} {/* show different headers depending on screen size breakpoints using Hidden */}
<HideOnScroll {...props}> {/* for breakpoints md and up (i.e., hide for sm down), occupy more space with headers */}
<Hidden smDown>
{/* white header containing filters which is shown on page load, it will disappear when scrolling down and reappear when scrolling up */}
<HideOnScroll {...props}>
<AppBar
className={classes.whiteHeader}
position="relative"
>
<Toolbar>
<Filters
reducer={[input, dispatch]}
viewResultsButton={
<Tooltip title={t("View results")} arrow placement="right">
<Button
size="large"
onClick={scrollDashboardIntoView}
>
<ArrowDownwardIcon fontSize="large" />
</Button>
</Tooltip>
}
loadingInfo={loadingInfo}
/>
</Toolbar>
</AppBar>
</HideOnScroll>
{/* overlay header containing CollapsedFilters and a button with which to open a Filters drawer, only visible once user has scrolled down a bit */}
<ElevationScroll {...props}>
<AppBar
className={classes.smallHeader}
color="primary"
>
<Toolbar>
<Grid container direction="row" spacing={2}>
{/* the overview of the current filter values */}
<CollapsedFilters
input={input}
toggleDrawer={toggleDrawer()}
/>
<Button
variant="contained"
color="primary"
disableElevation
onClick={toggleDrawer()}
className={classes.changeFiltersButton}
>
<SearchIcon/> <Typography variant="button">{t("Change filters")}</Typography> <ExpandMoreIcon/>
</Button>
<Grid item xs={12} container spacing={1} className={classes.loadingInfo}>
<Grid item>
<Typography variant="h6" component="h3" color="textPrimary">{t("Status")}:</Typography>
</Grid>
<Grid item className={classes.loadingInfoContent}>
{loadingInfo}
</Grid>
</Grid>
</Grid>
</Toolbar>
</AppBar>
</ElevationScroll>
</Hidden>
{/* for breakpoints from md up (i.e. hide for sm down), user has to scroll back up to see header to save space */}
<Hidden mdUp>
<AppBar <AppBar
className={classes.whiteHeader} className={classes.whiteHeader}
position="relative" position="relative"
...@@ -204,44 +270,7 @@ export const PageHeader = (props) => { ...@@ -204,44 +270,7 @@ export const PageHeader = (props) => {
/> />
</Toolbar> </Toolbar>
</AppBar> </AppBar>
</HideOnScroll> </Hidden>
{/* overlay header containing CollapsedFilters and a button with which to open a Filters drawer, only visible once user has scrolled down a bit */}
<ElevationScroll {...props}>
<AppBar
className={classes.smallHeader}
color="primary"
>
<Toolbar>
<Grid container direction="row" spacing={2}>
{/* the overview of the current filter values */}
<CollapsedFilters
input={input}
toggleDrawer={toggleDrawer()}
/>
<Button
variant="contained"
color="primary"
disableElevation
onClick={toggleDrawer()}
className={classes.changeFiltersButton}
>
<SearchIcon/> <Typography variant="button">{t("Change filters")}</Typography> <ExpandMoreIcon/>
</Button>
<Grid item xs={12} container spacing={1} className={classes.loadingInfo}>
<Grid item>
<Typography variant="h6" component="h3" color="textPrimary">{t("Status")}:</Typography>
</Grid>
<Grid item className={classes.loadingInfoContent}>
{loadingInfo}
</Grid>
</Grid>
</Grid>
</Toolbar>
</AppBar>
</ElevationScroll>
{/* the filters inside a drawer */} {/* the filters inside a drawer */}
<Drawer <Drawer
......
...@@ -117,11 +117,10 @@ const useStyles = makeStyles(theme => ({ ...@@ -117,11 +117,10 @@ const useStyles = makeStyles(theme => ({
marginBottom: "4px", marginBottom: "4px",
minHeight: "49vh", minHeight: "49vh",
}, },
"&& .MuiInputLabel-shrink": {
color: neutralColor.darker
},
minHeight: "49vh", minHeight: "49vh",
/*[theme.breakpoints.down("sm")]: {
height: 0,
visibility: "hidden",
}*/
}, },
smallHeader: { smallHeader: {
"&& .MuiToolbar-root": { "&& .MuiToolbar-root": {
...@@ -129,6 +128,9 @@ const useStyles = makeStyles(theme => ({ ...@@ -129,6 +128,9 @@ const useStyles = makeStyles(theme => ({
marginTop: "4px", marginTop: "4px",
padding: "20px" padding: "20px"
}, },
"&& .MuiInputLabel-shrink": {
color: neutralColor.darker
}
}, },
changeLanguageButton: { changeLanguageButton: {
...@@ -261,7 +263,7 @@ const useStyles = makeStyles(theme => ({ ...@@ -261,7 +263,7 @@ const useStyles = makeStyles(theme => ({
marginRight: "0.5% !important", marginRight: "0.5% !important",
marginTop: "5px !important", marginTop: "5px !important",
backgroundColor: theme.palette.secondary.main, backgroundColor: theme.palette.secondary.main,
color: theme.palette.secondary.contrastText color: `${theme.palette.secondary.contrastText} !important`
}, },
tabSelected: { tabSelected: {
height: "35px !important", height: "35px !important",
...@@ -299,7 +301,10 @@ const useStyles = makeStyles(theme => ({ ...@@ -299,7 +301,10 @@ const useStyles = makeStyles(theme => ({
// //
leafletContainer: { leafletContainer: {
height: "100%" height: "100%",
"&& .leaflet-control-attribution": {
background: "rgba(255, 255, 255, 0.95)"
}
}, },
//this is necessary to make MUI create the classes at all, but the actual styles stem from the "&& $polygon" etc. selector below //this is necessary to make MUI create the classes at all, but the actual styles stem from the "&& $polygon" etc. selector below
...@@ -500,7 +505,7 @@ const useStyles = makeStyles(theme => ({ ...@@ -500,7 +505,7 @@ const useStyles = makeStyles(theme => ({
}, },
marginBottom1: { marginBottom1: {
marginBottom: theme.spacing(1) marginBottom: `${theme.spacing(1)}px !important`
}, },
introductionHeading: { introductionHeading: {
......
...@@ -366,21 +366,16 @@ const getNodesAndLinks = (data) => { ...@@ -366,21 +366,16 @@ const getNodesAndLinks = (data) => {
const getCatalogNodesAndLinks = ({catalogPaths, sourceId}) => { const getCatalogNodesAndLinks = ({catalogPaths, sourceId}) => {
catalogPaths && catalogPaths &&
catalogPaths.map(catalogPath => { catalogPaths.map(catalogPath => {
//console.log("catalogPath", catalogPath);
const catalogId = catalogPath.split("/")[0]; const catalogId = catalogPath.split("/")[0];
//console.log("catalogId", catalogId);
const identifier = `Catalog ${catalogId}`; const identifier = `Catalog ${catalogId}`;
// if the catalog is part of the ones defined in the config file (catalogs to be used for filtering in Filters),
// then get the label for this catalog and add it to the node // TODO: to get labels for catalogs, the Hub should be extended to query iDAI.objects catalogs for their title etc.
// NOTE: to get labels for all catalogs, the Hub has to be extended to query iDAI.objects catalogs for their title etc. // If the catalog is part of the ones defined in the config file (catalogs to be used for filtering in Filters),
const catalogLabel = catalogs.find(catalog => catalog.id === parseInt(catalogId))?.label || null; // then the label for this catalog could be taken from there.
//console.log("catalogLabel", catalogLabel);
nodes.push({ nodes.push({
id: identifier, id: identifier,
name: catalogLabel || identifier, // use identifier as fallback name if a catalog is not defined in config file name: identifier,
type: "arachne", type: "arachne",
subtype: "arachne_catalogs" subtype: "arachne_catalogs"
}) })
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment