Skip to content

Commit

Permalink
RedirectView fix; SidebarBlock update; Map update
Browse files Browse the repository at this point in the history
  • Loading branch information
@razvanMiu
razvanMiu committed Sep 1, 2020
1 parent 2dec996 commit b7aff61
Show file tree
Hide file tree
Showing 7 changed files with 189 additions and 120 deletions.
40 changes: 25 additions & 15 deletions src/components/manage/Blocks/DetailedLink/View.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import React from 'react';
import { injectIntl } from 'react-intl';
import { Link } from 'react-router-dom';
import { settings } from '~/config';
import cx from 'classnames';
import './style.css';

const getPath = (url) => {
Expand All @@ -27,36 +28,45 @@ const View = (props) => {
} = props.data;
return (
<div
className={`detailed-link-container text-align-${textAlign || 'left'}`}
className={cx(
'detailed-link-container display-flex flex-column',
`text-align-${textAlign || 'left'}`,
)}
>
{(detailedLink && (
<div>
<>
{!hideTitle ? (
<div className={`detailed-link-title ${titleClassname || ''}`}>
<div className={cx('detailed-link-title', titleClassname || '')}>
{title || detailedLink.title || ''}
</div>
) : (
''
)}
{!hideDescription ? (
{!hideDescription && (description || detailedLink.description) ? (
<p
className={`detailed-link-description ${
descriptionClassname || ''
}`}
className={cx(
'detailed-link-description',
descriptionClassname || '',
)}
>
{description || detailedLink.description || ''}
</p>
) : (
''
)}
<Link
className={`detailed-link-button ${buttonClassname || ''}`}
onClick={(e) => e.preventDefault}
to={getPath(detailedLink.path)}
>
{buttonTitle || detailedLink.title || 'Go'}
</Link>
</div>
<div>
<Link
className={cx(
'detailed-link-button display-inline-block',
buttonClassname || '',
)}
onClick={(e) => e.preventDefault}
to={getPath(detailedLink.path)}
>
{buttonTitle || detailedLink.title || 'Go'}
</Link>
</div>
</>
)) || (
<p className="detailed-link-placeholder">Select a page from sidebar</p>
)}
Expand Down
41 changes: 41 additions & 0 deletions src/components/manage/Blocks/DiscodataOpenlayersMapBlock/Edit.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,47 @@ const getSchema = (props) => {
title: 'Has sidebar',
defaultValue: false,
},
filterSource: {
type: 'array',
title: 'Filter source',
choices: [
['eprtr_filters', 'EPRTR filters'],
['query_params', 'Query params'],
],
},
query: {
title: 'Query parameters',
type: 'schema',
fieldSetTitle: 'Query metadata',
fieldSetId: 'query-metadata',
fieldSetSchema: {
fieldsets: [
{
id: 'default',
title: 'title',
fields: ['title', 'id', 'param'],
},
],
properties: {
title: {
type: 'string',
title: 'Query title',
},
id: {
type: 'string',
title: 'Query id',
description: 'This will be used as query parameter key',
},
param: {
type: 'string',
title: 'Query to use',
},
},
required: ['id', 'title', 'param'],
},
editFieldset: false,
deleteFieldset: false,
},
};
};

Expand Down
179 changes: 92 additions & 87 deletions src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,20 +17,10 @@ import { setQueryParam } from 'volto-datablocks/actions';
import { Grid, Header, Loader, Dimmer } from 'semantic-ui-react';
// SVGs
import clearSVG from '@plone/volto/icons/clear.svg';
// import pinSVG from '~/icons/pin.svg';
// import bluePinSVG from '~/icons/blue_pin.svg';
// STYLES
import 'ol/ol.css';
import './style.css';

const getHtmlAttributes = (obj) => {
return Object.entries(obj)
.map(([key, value]) => {
return `${key}="${value}"`;
})
.join(' ');
};

const splitBy = (arr, delimiter) => {
if (Array.isArray(arr)) {
return (
Expand All @@ -43,16 +33,6 @@ const splitBy = (arr, delimiter) => {
return '';
};

// const encodedPinSVG = encodeURIComponent(
// `<svg ${getHtmlAttributes(pinSVG.attributes)}>${pinSVG.content}</svg>`,
// );

// const encodedBluePinSVG = encodeURIComponent(
// `<svg ${getHtmlAttributes(bluePinSVG.attributes)}>${
// bluePinSVG.content
// }</svg>`,
// );

let Map,
View,
Overlay,
Expand Down Expand Up @@ -82,6 +62,7 @@ const initialExtent = [
6199975.99999531,
10421410.9999871,
];
let renderExtent = [];
const OpenlayersMapView = (props) => {
const stateRef = useRef({
map: {
Expand Down Expand Up @@ -115,10 +96,23 @@ const OpenlayersMapView = (props) => {
const draggable = !!props.data?.draggable?.value;
const hasPopups = !!props.data?.hasPopups?.value;
const hasSidebar = !!props.data?.hasSidebar?.value;
const filterSource = props.data?.filterSource?.value || 'query_params';
const zoomSwitch = 6;
const currentMapZoom = state.map?.element
? state.map.element.getView().getZoom()
: null;
let queryParams;
if (filterSource === 'query_params') {
try {
queryParams = JSON.parse(props.data?.query?.value)?.properties;
Object.entries(queryParams).forEach(([key, value]) => {
queryParams[key].sql = `(${value.param} = ':options')`;
queryParams[key].type = 'string';
});
} catch {
queryParams = {};
}
}

if (mapRendered && !firstFilteringUpdate) {
updateFilters();
Expand Down Expand Up @@ -220,7 +214,6 @@ const OpenlayersMapView = (props) => {
updateMapPosition: null,
});
} else {
console.log('UPDATE FILTERS', state.map.sitesSourceQuery);
state.map.sitesSourceLayer &&
state.map.sitesSourceLayer.getSource().refresh();
}
Expand All @@ -231,11 +224,11 @@ const OpenlayersMapView = (props) => {
function updateFilters() {
const sitesSourceQuery = { ...state.map.sitesSourceQuery };
const locationTerm = props.discodata_query.search.locationTerm || null;
if (hasSidebar) {
if (hasSidebar && filterSource === 'eprtr_filters') {
sitesSourceQuery.whereStatements = {
...sitesSourceQuery.whereStatements,
siteTerm: {
sql: `(sitename LIKE ':options%')`,
sql: `(siteName LIKE ':options%')`,
type: 'string',
},
//? Industries
Expand Down Expand Up @@ -279,19 +272,10 @@ const OpenlayersMapView = (props) => {
//! Permit type
//! Permit year
};
} else {
} else if (filterSource === 'query_params') {
sitesSourceQuery.whereStatements = {
...sitesSourceQuery.whereStatements,
// Country
siteCountry: {
sql: `(country = ':options')`,
type: 'string',
},
// Site inspire id
siteId: {
sql: `(id = ':options')`,
type: 'string',
},
...queryParams,
};
}

Expand Down Expand Up @@ -319,7 +303,7 @@ const OpenlayersMapView = (props) => {
let updateMapPosition = null;
if (
sitesSourceQuery.whereStatements.siteTerm?.sql ||
sitesSourceQuery.whereStatements.siteId?.sql
sitesSourceQuery.whereStatements.siteName?.sql
) {
updateMapPosition = 'bySiteTerm';
} else if (locationTerm?.text) {
Expand Down Expand Up @@ -850,7 +834,7 @@ const OpenlayersMapView = (props) => {
<>
<div className="popover-header">
{currentMapZoom && currentMapZoom > zoomSwitch ? (
<Header as="h3">{state.popup.properties.sitename}</Header>
<Header as="h3">{state.popup.properties.siteName}</Header>
) : (
<Header as="h3">{`${state.popup.properties.NUTS_NAME}, ${state.popup.properties.CNTR_CODE}, ${state.popup.properties.COUNTRY}`}</Header>
)}
Expand Down Expand Up @@ -888,8 +872,8 @@ const OpenlayersMapView = (props) => {
<>
<div className="popover-header">
<Header as="h2">
{state.popupDetails.properties.sitename
? state.popupDetails.properties.sitename
{state.popupDetails.properties.siteName
? state.popupDetails.properties.siteName
: ''}
</Header>
<VoltoIcon
Expand All @@ -901,58 +885,79 @@ const OpenlayersMapView = (props) => {
/>
</div>
<div className="popover-body">
<Grid.Column stretched>
<div className="grid-layout">
{/* SITE CONTENTS */}
<Grid.Row>
<Header as="h3">Site contents</Header>
<p>
<Link
onClick={setSiteQueryParams}
to={'/industrial-sites/introduction'}
>
{state.popupDetails.properties.n_fac || 0} Facilities
</Link>
</p>
<p>
<Link
onClick={setSiteQueryParams}
to={'/industrial-sites/introduction'}
>
{state.popupDetails.properties.n_lcp || 0} Large comustion
plants
</Link>
</p>
<p>
<Link
onClick={setSiteQueryParams}
to={'/industrial-sites/introduction'}
>
{state.popupDetails.properties.n_inst || 0} Installations
</Link>
</p>
</Grid.Row>
{/* SITE POLLUTANT EMISSIONS */}
<Grid.Row>
<Header as="h3">Pollutant emissions</Header>
{state.popupDetails.properties.pollutants ? (
<p>{state.popupDetails.properties.pollutants}</p>
) : (
<p>There are no data regarding the pollutants</p>
)}
</Grid.Row>
{/* REGULATORY INFORMATION */}
<Grid.Row>
<Header as="h3">Regulatory information</Header>
{state.popupDetails.properties.rep_yr ? (
<div className="row mb-1-super mt-0-super">
<div className="column column-12">
<Header Header as="h3">
Site contents
</Header>
</div>
<div className="column column-12">
<p>
Inspections in {state.popupDetails.properties.rep_yr}:{' '}
{state.popupDetails.properties.n_inspect || 0}
<Link
onClick={setSiteQueryParams}
to={'/industrial-sites/introduction'}
>
{state.popupDetails.properties.nFacilities || 0}{' '}
Facilities
</Link>
</p>
) : (
''
)}
</Grid.Row>
</Grid.Column>
</div>
<div className="column column-12">
<p>
<Link
onClick={setSiteQueryParams}
to={'/industrial-sites/introduction'}
>
{state.popupDetails.properties.nLCP || 0} Large
comustion plants
</Link>
</p>
</div>
<div className="column column-12">
<p>
<Link
onClick={setSiteQueryParams}
to={'/industrial-sites/introduction'}
>
{state.popupDetails.properties.nInstallations || 0}{' '}
Installations
</Link>
</p>
</div>
</div>
{/* SITE POLLUTANT EMISSIONS */}
<div className="row mb-1-super mt-0-super">
<div className="column column-12">
<Header as="h3">Pollutant emissions</Header>
</div>
<div className="column column-12">
{state.popupDetails.properties.pollutants ? (
<p>{state.popupDetails.properties.pollutants}</p>
) : (
<p>There are no data regarding the pollutants</p>
)}
</div>
</div>
{/* REGULATORY INFORMATION */}
<div className="row mb-1-super mt-0-super">
<div className="column column-12">
<Header as="h3">Regulatory information</Header>
</div>
<div className="column column-12">
{state.popupDetails.properties.Site_reporting_year ? (
<p>
Inspections in{' '}
{state.popupDetails.properties.Site_reporting_year}:{' '}
{state.popupDetails.properties.numInspections || 0}
</p>
) : (
''
)}
</div>
</div>
</div>
</div>
<div className="popover-actions">
<button
Expand Down
Loading

0 comments on commit b7aff61

Please sign in to comment.