a_adli/colouring-montreal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

smarter enabling/disabling map buttons

Browse Source
This commit is contained in:
Mateusz Konieczny 2022-12-22 16:32:16 +01:00
parent 86d437a609
commit 80714255b1
1 changed files with 23 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
app/src/frontend/building/data-containers/planning.tsx
View File

@ -57,6 +57,10 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
e.preventDefault(); e.preventDefault();
props.onMapColourScale('planning_combined') props.onMapColourScale('planning_combined')
} }
const switchToEmptyMapStyle = (e) => {
e.preventDefault();
props.onMapColourScale('empty_map')
}
const { flood, floodSwitchOnClick, housing, housingSwitchOnClick, creative, creativeSwitchOnClick, vista, vistaSwitchOnClick, parcel, parcelSwitchOnClick, conservation, conservationSwitchOnClick } = useDisplayPreferences(); const { flood, floodSwitchOnClick, housing, housingSwitchOnClick, creative, creativeSwitchOnClick, vista, vistaSwitchOnClick, parcel, parcelSwitchOnClick, conservation, conservationSwitchOnClick } = useDisplayPreferences();
const communityLinkUrl = `/${props.mode}/${Category.Community}/${props.building.building_id}`; const communityLinkUrl = `/${props.mode}/${Category.Community}/${props.building.building_id}`;
return ( return (
@ -100,9 +104,16 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
</DataEntryGroup> </DataEntryGroup>
<DataEntryGroup name="Possible future applications (crowdsourced data)" collapsed={true} > <DataEntryGroup name="Possible future applications (crowdsourced data)" collapsed={true} >
<InfoBox type='info'>Click and colour buildings here if you think they may be subject to a future planning application involving demolition. To add your opinion on how well this building works, please also visit the <Link to={communityLinkUrl}>Community</Link> section.</InfoBox> <InfoBox type='info'>Click and colour buildings here if you think they may be subject to a future planning application involving demolition. To add your opinion on how well this building works, please also visit the <Link to={communityLinkUrl}>Community</Link> section.</InfoBox>
{
props.mapColourScale != "community_expected_planning_application_total" ?
<button className="map-switcher-inline btn btn-outline btn-outline-dark" onClick={switchToExpectedApplicationMapStyle}> <button className="map-switcher-inline btn btn-outline btn-outline-dark" onClick={switchToExpectedApplicationMapStyle}>
{'Click here to view possible locations of future applications'} {'Click here to view possible locations of future applications'}
</button> </button>
:
<button className="map-switcher-inline btn btn-outline btn-outline-dark" onClick={switchToEmptyMapStyle}>
{'Click here to hide possible locations of future applications'}
</button>
}
<UserOpinionEntry <UserOpinionEntry
slug='community_expected_planning_application' slug='community_expected_planning_application'
title={buildingUserFields.community_expected_planning_application.title} title={buildingUserFields.community_expected_planning_application.title}
@ -189,9 +200,16 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
<InfoBox> <InfoBox>
Help us produce the most accurate map possible for London's designated/protected buildings. Please add data if missing or click "Verify" where entries are correct. Help us produce the most accurate map possible for London's designated/protected buildings. Please add data if missing or click "Verify" where entries are correct.
</InfoBox> </InfoBox>
{
props.mapColourScale != "planning_combined" ?
<button className="map-switcher-inline btn btn-outline btn-outline-dark" onClick={switchToBuildingProtectionMapStyle}> <button className="map-switcher-inline btn btn-outline btn-outline-dark" onClick={switchToBuildingProtectionMapStyle}>
{'Click to see individual protected buildings mapped'} {'Click to see individual protected buildings mapped'}
</button> </button>
:
<button className="map-switcher-inline btn btn-outline btn-outline-dark" onClick={switchToEmptyMapStyle}>
{'Click to hide individual protected buildings on map'}
</button>
}
<button className="map-switcher-inline btn btn-outline btn-outline-dark" onClick={conservationSwitchOnClick}> <button className="map-switcher-inline btn btn-outline btn-outline-dark" onClick={conservationSwitchOnClick}>
{(conservation === 'enabled')? 'Click to hide Convervation Areas' : 'Click to see Convervation Areas'} {(conservation === 'enabled')? 'Click to hide Convervation Areas' : 'Click to see Convervation Areas'}
</button> </button>