Commit 5f3e956d authored by Oleksii Savran's avatar Oleksii Savran
Browse files

All maps with same config

parent d2b2db85
......@@ -16,6 +16,7 @@ import { ROLE_USER } from 'constants/userRoles';
import AccessionDetails from 'model/accession/AccessionDetails';
import RepositoryFile from 'model/repository/RepositoryFile';
import AccessionAuditLog from 'model/accession/AccessionAuditLog';
import MapLayer from 'model/genesys/MapTileLayer';
// UI
import PrettyDate from 'ui/common/time/PrettyDate';
......@@ -71,6 +72,7 @@ interface IBrowsePageProps {
removeAccessionFromMyList: any;
applyFilters: any;
navigateTo: (location: string) => void;
mapLayers: MapLayer[];
}
class BrowsePage extends React.Component<IBrowsePageProps, any> {
......@@ -135,7 +137,7 @@ class BrowsePage extends React.Component<IBrowsePageProps, any> {
}
public render() {
const { t, error, uuid, doi, accessions, auditLog, classes } = this.props;
const { t, error, uuid, doi, accessions, auditLog, classes, mapLayers } = this.props;
const { auditAccession, auditAccessionId, auditAccessionCollect, auditAccessionGeo } = auditLog || { auditAccession: {}, auditAccessionId: {}, auditAccessionCollect: {}, auditAccessionGeo: {} };
......@@ -375,7 +377,10 @@ class BrowsePage extends React.Component<IBrowsePageProps, any> {
</Properties>
{ hasLatLon &&
<LocationMap locations={ [{ id: accession.geo.id, lat: accession.geo.latitude, lng: accession.geo.longitude }] } />
<LocationMap
locations={ [{ id: accession.geo.id, lat: accession.geo.latitude, lng: accession.geo.longitude }] }
mapLayers={ mapLayers }
/>
}
</PageSection>
}
......@@ -458,6 +463,7 @@ const mapStateToProps = (state, ownProps) => ({
uuid: ownProps.match.params.uuid,
doi: ownProps.match.params.doi,
accessions: state.list.public.myList.accessions,
mapLayers: state.accessions.public.mapLayers,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
......
......@@ -9,6 +9,7 @@ import {loadMoreAccessions, loadDataset} from 'datasets/actions/public';
import Dataset from 'model/catalog/Dataset';
import { AccessionRef } from 'model/accession/AccessionRef';
import Page from 'model/Page';
import MapLayer from 'model/genesys/MapTileLayer';
import PageLayout from 'ui/layout/PageLayout';
import BackButton from 'ui/common/buttons/BackButton';
......@@ -31,6 +32,7 @@ interface IDatasetDetailProps extends React.ClassAttributes<any> {
approveDataset: (dataset: Dataset) => void;
rejectDataset: (dataset: Dataset, needToRedirect?: boolean) => void;
loadMoreAccessions: (uuid: string, page?: Page<AccessionRef>) => any;
mapLayers: MapLayer[];
}
const styles = (theme) => ({
......@@ -62,7 +64,7 @@ class DatasetDetail extends React.Component<IDatasetDetailProps, any> {
}
public render() {
const { t, classes, uuid, dataset, publishDataset, rejectDataset, approveDataset, deleteDataset } = this.props;
const { t, classes, uuid, dataset, publishDataset, rejectDataset, approveDataset, deleteDataset, mapLayers } = this.props;
const stillLoading: boolean = (!dataset || (uuid && dataset && dataset.uuid !== uuid));
......@@ -85,6 +87,7 @@ class DatasetDetail extends React.Component<IDatasetDetailProps, any> {
deleteDataset={ deleteDataset }
loadAccessions={ this.loadMoreAccessions }
accessionRefs={ this.props.accessionRefs }
mapLayers={ mapLayers }
/>
</Grid>
}
......@@ -104,6 +107,7 @@ const mapStateToProps = (state, ownProps) => ({
dataset: state.datasets.public.dataset,
accessionRefs: state.datasets.public.accessionRefs,
uuid: ownProps.match.params.uuid,
mapLayers: state.accessions.public.mapLayers,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
......
......@@ -13,6 +13,7 @@ import { AVAILABLE_LICENSES } from 'model/License';
import { PublishState } from 'model/common.model';
import Page from 'model/Page';
import { AccessionRef } from 'model/accession/AccessionRef';
import MapLayer from 'model/genesys/MapTileLayer';
import confirm from 'utilities/confirmAlert';
import Authorize from 'ui/common/authorized/Authorize';
......@@ -140,6 +141,7 @@ interface IDetailInfoProps extends React.ClassAttributes<any> {
deleteDataset?: (dataset: Dataset) => any;
loadAccessions: (page: Page<AccessionRef>) => any;
accessionRefs: Page<AccessionRef>;
mapLayers: MapLayer[];
}
class DetailInfo extends React.Component<IDetailInfoProps, any> {
......@@ -230,7 +232,7 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
}
public render() {
const { classes, dataset, publishDataset, deleteDataset, t, accessionRefs } = this.props;
const { classes, dataset, publishDataset, deleteDataset, t, accessionRefs, mapLayers } = this.props;
if (!dataset) {
log('Waiting for dataset.');
......@@ -461,7 +463,7 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
<Grid item xs={ 12 } md={ 12 } lg={ 12 } className="p-10" id="dataset-locations">
<Section title={ t('datasets.public.c.datasetDisplay.locations') }>
<div className="p-20">
<LocationMap locations={ dataset.locations } classes={ {} }/>
<LocationMap locations={ dataset.locations } mapLayers={ mapLayers } classes={ {} } />
</div>
</Section>
</Grid>
......
......@@ -6,6 +6,7 @@ import { translate } from 'react-i18next';
import { isNumeric } from 'utilities';
import { IGeoPoint } from 'model/common.model';
import DatasetLocation from 'model/catalog/DatasetLocation';
import MapLayer from 'model/genesys/MapTileLayer';
import { Properties, PropertiesItem } from 'ui/common/Properties';
import McpdDate from 'ui/common/time/McpdDate';
import Markdown from 'ui/common/markdown';
......@@ -18,6 +19,7 @@ interface ILocationMapProps {
classes?: any;
t?: any;
locations: DatasetLocation[];
mapLayers: MapLayer[];
}
const styles = (theme) => ({
......@@ -56,7 +58,7 @@ class LocationMap extends React.Component<ILocationMapProps, any> {
}
public render() {
const { classes, locations, t } = this.props;
const { classes, locations, mapLayers, t } = this.props;
if (!(locations && locations.length)) {
return null;
......@@ -107,6 +109,13 @@ class LocationMap extends React.Component<ILocationMapProps, any> {
attribution={ `&copy; ${ t('datasets.public.c.locationMap.link', { aOpen: '<a href="http://www.openstreetmap.org/copyright">', aClose: '</a>' }) }` }
url={ 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png' }
/>
{ mapLayers &&
mapLayers
.filter((layer) => layer.enabled)
.map((layer, index) => {
return <TileLayer zIndex={ index + 1 } key={ layer.name } { ...layer }/>;
})
}
{ positions && positions.map((position, i) => (
<Marker key={ i } position={ position }/>
),
......
......@@ -4,6 +4,7 @@ import { translate } from 'react-i18next';
import { error } from 'utilities/debug';
import { isNumeric } from 'utilities';
import MapLayer from 'model/genesys/MapTileLayer';
let Map;
let Marker;
......@@ -22,6 +23,7 @@ interface IFormMapProps extends React.ClassAttributes<any> {
countryCode: any,
}];
onMouseOut: () => any;
mapLayers: MapLayer[];
checkGeonames: (lat, lng) => Promise<{ countryCode: string, userCountry: string, stateProvince: string, verbatimLocality?: string }>;
}
......@@ -98,7 +100,7 @@ class FormMap extends React.Component<IFormMapProps, any> {
return null;
}
const { classes, t } = this.props;
const { classes, mapLayers, t } = this.props;
const { decimalLatitude, decimalLongitude } = this.getCurrentLocation();
......@@ -122,6 +124,13 @@ class FormMap extends React.Component<IFormMapProps, any> {
attribution={ `&copy; ${ t('datasets.dashboard.p.stepper.location.copyright', { openingTag: '<a href="http://www.openstreetmap.org/copyright">', closingTag: '</a>' }) }` }
url={ 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png' }
/>
{ mapLayers &&
mapLayers
.filter((layer) => layer.enabled)
.map((layer, index) => {
return <TileLayer zIndex={ index + 1 } key={ layer.name } { ...layer }/>;
})
}
{ position && <Marker onContextmenu={ this.onMarkerRightClick } position={ position }/> }
</Map>
</div>
......
......@@ -11,6 +11,7 @@ import MarkdownField from 'ui/common/markdown/MarkdownField';
import countries from 'data/countries';
import FormMap from './FormMap';
import Dataset from 'model/catalog/Dataset';
import MapLayer from 'model/genesys/MapTileLayer';
import DatasetLocation from 'model/catalog/DatasetLocation';
import { error, log } from 'utilities/debug';
import { isNumeric } from 'utilities';
......@@ -31,6 +32,7 @@ interface ILocationFormProps extends React.ClassAttributes<any> {
createLocation: () => Promise<DatasetLocation>;
deleteLocation: (location: Location) => Promise<DatasetLocation>;
changeFieldValue: (field: string, value: any) => void;
mapLayers: MapLayer[];
t: any;
}
......@@ -98,8 +100,7 @@ class LocationForm extends React.Component<ILocationFormProps, any> {
}
protected renderLocations = ({ fields, meta: { touched, error, submitFailed } }) => {
const { t } = this.props;
const { t, mapLayers } = this.props;
return (
<div>
{ fields.map((location, index) => (
......@@ -125,6 +126,7 @@ class LocationForm extends React.Component<ILocationFormProps, any> {
] }
checkGeonames={ this.checkGeonames }
component={ FormMap }
mapLayers={ mapLayers }
/>
<Field
name={ `${location}.countryCode` }
......
......@@ -13,6 +13,7 @@ import { getFormValues, change } from 'redux-form';
import { LOCATION_FORM } from 'datasets/constants';
import * as _ from 'lodash';
import StepperTemplate from 'ui/common/stepper/StepperTemplate';
import MapLayer from 'model/genesys/MapTileLayer';
interface ILocationStepProps extends React.ClassAttributes<any> {
createLocationRequest: () => Promise<DatasetLocation>;
......@@ -20,6 +21,7 @@ interface ILocationStepProps extends React.ClassAttributes<any> {
deleteLocationRequest: (location: Location) => Promise<DatasetLocation>;
formValues: any;
change: any;
mapLayers: MapLayer[];
}
class LocationStep extends StepperTemplate<ILocationStepProps> {
......@@ -45,6 +47,7 @@ class LocationStep extends StepperTemplate<ILocationStepProps> {
createLocation={ this.createLocation }
deleteLocation={ this.props.deleteLocationRequest }
changeFieldValue={ this.changeFieldValue }
mapLayers={ this.props.mapLayers }
/>
)
......@@ -63,6 +66,7 @@ class LocationStep extends StepperTemplate<ILocationStepProps> {
const mapStateToProps = (state, ownProps) => ({
formValues: getFormValues(LOCATION_FORM)(state),
mapLayers: state.accessions.public.mapLayers,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
......
......@@ -10,6 +10,7 @@ import { applyFilters } from 'accessions/actions/public';
// Model
import CountryDetails from 'model/geo/CountryDetails';
import FaoInstitute from 'model/genesys/FaoInstitute';
import MapLayer from 'model/genesys/MapTileLayer';
// UI
import PageLayout, { MainSection, PageContents, PageSection } from 'ui/layout/PageLayout';
......@@ -28,6 +29,7 @@ interface ICountryDisplayPageProps extends React.ClassAttributes<any> {
t: any;
loadCountryDetails: (isoCode: string) => void;
applyFilters: any;
mapLayers: MapLayer[];
}
class CountryDisplayPage extends React.Component<ICountryDisplayPageProps> {
......@@ -74,7 +76,7 @@ class CountryDisplayPage extends React.Component<ICountryDisplayPageProps> {
}
public render() {
const {details, isoCode, t} = this.props;
const {details, isoCode, mapLayers, t} = this.props;
const stillLoading: boolean = (! details || details.code3 !== isoCode);
return (
......@@ -100,7 +102,10 @@ class CountryDisplayPage extends React.Component<ICountryDisplayPageProps> {
{ details.genesysInstitutes && details.genesysInstitutes.length > 0 &&
<PageSection title={ t('geo.public.p.countryList.instituteLocations') }>
<LocationMap locations={ this.getLocations(details.genesysInstitutes) } />
<LocationMap
locations={ this.getLocations(details.genesysInstitutes) }
mapLayers={ mapLayers }
/>
</PageSection>
}
......@@ -151,6 +156,7 @@ class CountryDisplayPage extends React.Component<ICountryDisplayPageProps> {
const mapStateToProps = (state, ownProps) => ({
details: state.geo.public.countryDetails || undefined,
isoCode: ownProps.match.params.isoCode,
mapLayers: state.accessions.public.mapLayers,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
......
......@@ -10,6 +10,7 @@ import { applyFilters, applyOverviewFilters } from 'accessions/actions/public';
// Models
import FaoInstituteDetails from 'model/genesys/InstituteDetails';
import MapLayer from 'model/genesys/MapTileLayer';
// UI
import PageLayout, { MainSection, PageContents, PageSection } from 'ui/layout/PageLayout';
......@@ -46,6 +47,7 @@ interface IDisplayPageProps extends React.ClassAttributes<any> {
applyFilters: any;
applyOverviewFilters: any;
userRoles: string[];
mapLayers: MapLayer[];
}
const mobile = ['sm', 'xs'] as Breakpoint[];
......@@ -105,7 +107,7 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
}
public render() {
const { error, institute, code, width, t } = this.props;
const { error, institute, code, width, mapLayers, t } = this.props;
const slug: string = this.state.authenticated ? 'download-authenticated' : 'download-anonymous';
const stillLoading: boolean = ! error && (! institute || (code && institute && institute.details.code !== code));
const isMobile = mobile.indexOf(width) !== -1;
......@@ -190,6 +192,7 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
<PageSection title={ t('geo.common.location') }>
<LocationMap
locations={ [{ id: institute.details.id, lat: institute.details.latitude, lng: institute.details.longitude }] }
mapLayers={ mapLayers }
/>
<Properties>
<PropertiesItem title={ t('geo.common.latitude') }>{ institute.details.latitude }</PropertiesItem>
......@@ -300,6 +303,7 @@ const mapStateToProps = (state, ownProps) => ({
error: state.institutes.public.instituteError,
code: ownProps.match.params.wiewsCode,
userRoles: state.login.authorities,
mapLayers: state.accessions.public.mapLayers,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
......
......@@ -2,6 +2,7 @@ import * as React from 'react';
import {withStyles} from '@material-ui/core/styles';
import Grid from '@material-ui/core/Grid';
import { IGeoPoint } from 'model/common.model';
import MapLayer from 'model/genesys/MapTileLayer';
let Map;
let Marker;
......@@ -10,6 +11,7 @@ let TileLayer;
interface ILocationMapProps extends React.ClassAttributes<any> {
classes?: any;
locations: IGeoPoint[];
mapLayers: MapLayer[];
}
const styles = (theme) => ({
......@@ -47,7 +49,7 @@ class LocationMap extends React.Component<ILocationMapProps, any> {
}
public render() {
const {classes, locations } = this.props;
const { classes, locations, mapLayers } = this.props;
if (!locations) {
return null;
......@@ -69,6 +71,13 @@ class LocationMap extends React.Component<ILocationMapProps, any> {
attribution={ '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' }
url={ 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png' }
/>
{ mapLayers &&
mapLayers
.filter((layer) => layer.enabled)
.map((layer, index) => {
return <TileLayer zIndex={ index + 1 } key={ layer.name } { ...layer }/>;
})
}
{ locations.map((location) => <Marker key={ location.id } position={ location } />) }
</Map>
</div>
......
Markdown is supported
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