diff --git a/app/map_styles/polygon.xml b/app/map_styles/polygon.xml
index 963aa1f9..7f54c7d8 100644
--- a/app/map_styles/polygon.xml
+++ b/app/map_styles/polygon.xml
@@ -1145,7 +1145,7 @@
- [typology_style_period] = "1945-1979 (Post war)"
+ [typology_style_period] = "1946-1979 (Post war)"
diff --git a/app/src/frontend/building/data-containers/age-history.tsx b/app/src/frontend/building/data-containers/age-history.tsx
index 3ee13b94..8100cbd2 100644
--- a/app/src/frontend/building/data-containers/age-history.tsx
+++ b/app/src/frontend/building/data-containers/age-history.tsx
@@ -40,11 +40,26 @@ const AgeView: React.FunctionComponent = (props) => {
const ageLinkUrl = `/${props.mode}/${Category.Age}/${props.building.building_id}`;
const { historicData, historicDataSwitchOnClick, darkLightTheme } = useDisplayPreferences();
+ const { historicMap, historicMapSwitchOnClick } = useDisplayPreferences();
const switchToSurvivalMapStyle = (e) => {
+ e.preventDefault();
+ props.onMapColourScale('survival_status');
+ historicMapSwitchOnClick(e);
+
+ if (historicData === 'enabled') {
+ historicDataSwitchOnClick(e);
+ }
+ }
+
+ const switchToSurvivalDataStyle = (e) => {
e.preventDefault();
props.onMapColourScale('survival_status');
historicDataSwitchOnClick(e);
+
+ if (historicMap === 'enabled') {
+ historicMapSwitchOnClick(e);
+ }
}
const switchToAgeMapStyle = (e) => {
@@ -208,9 +223,6 @@ const AgeView: React.FunctionComponent = (props) => {
user_verified_as={props.user_verified.typology_style_period}
verified_count={props.building.verified.typology_style_period}
/>
-
= (props) => {
}
- {(props.mapColourScale == "survival_status") ?
-
- :
-
- }
@@ -495,13 +498,22 @@ const AgeView: React.FunctionComponent = (props) => {
Choose a colour to indicate whether the building has survived.
- {(props.mapColourScale == "survival_status") ?
+ {(historicMap == "enabled") ?
:
+ }
+ {(historicData == "enabled") ?
+
+ :
+
}
= (props) => {
}
- {(props.mapColourScale == "typology_style_period") ?
+ {/*(props.mapColourScale == "typology_style_period") ?
@@ -109,8 +109,8 @@ const TypeView: React.FunctionComponent = (props) => {
- }
- {/* = (props) => {
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
+ disabled={true}
/>
+ {/*
= (props) => {
verified_count={props.building.verified.typology_style_period}
/> */}
-
For building age/architectural style data, see Age & History.
+
To edit the architectural style box, and to see the data mapped, please go to Age & History.
{/* ) => void;
historicDataSwitchOnClick: React.MouseEventHandler;
+ historicMap: LayerEnablementState;
+ historicMapSwitch: (e: React.FormEvent) => void;
+ historicMapSwitchOnClick: React.MouseEventHandler;
+
darkLightTheme: MapTheme;
darkLightThemeSwitch: (e: React.FormEvent) => void;
darkLightThemeSwitchOnClick: React.MouseEventHandler;
@@ -87,6 +91,10 @@ export const DisplayPreferencesContext = createContext = ({children}) => {
const defaultParcel = 'disabled'
const defaultConservation = 'disabled'
const defaultHistoricData = 'disabled'
+ const defaultHistoricMap = 'disabled'
const defaultShowLayerSelection = 'disabled'
const [vista, setVista] = useState(defaultVista);
const [flood, setFlood] = useState(defaultFlood);
@@ -116,6 +125,7 @@ export const DisplayPreferencesProvider: React.FC<{}> = ({children}) => {
const [parcel, setParcel] = useState(defaultParcel);
const [conservation, setConservation] = useState(defaultConservation);
const [historicData, setHistoricData] = useState(defaultHistoricData);
+ const [historicMap, setHistoricMap] = useState(defaultHistoricMap);
const [darkLightTheme, setDarkLightTheme] = useState('night');
const [showLayerSelection, setShowLayerSelection] = useState(defaultShowLayerSelection);
@@ -136,6 +146,7 @@ export const DisplayPreferencesProvider: React.FC<{}> = ({children}) => {
setParcel(defaultParcel);
setConservation(defaultConservation);
setHistoricData(defaultHistoricData);
+ setHistoricMap(defaultHistoricMap);
setShowLayerSelection(defaultShowLayerSelection); // reset layers + hiding this panel is integrated into one action
//setDarkLightTheme('night'); // reset only layers
},
@@ -167,6 +178,9 @@ export const DisplayPreferencesProvider: React.FC<{}> = ({children}) => {
if(historicData != defaultHistoricData) {
return true;
}
+ if(historicMap != defaultHistoricMap) {
+ return true;
+ }
//darkLightTheme not handled here
return false;
}
@@ -278,7 +292,10 @@ export const DisplayPreferencesProvider: React.FC<{}> = ({children}) => {
const historicDataSwitch = useCallback(
(e) => {
- flipHistoricData(e)
+ if (historicMap === 'enabled') {
+ fliphistoricMap(e);
+ }
+ flipHistoricData(e);
},
[historicData],
)
@@ -291,6 +308,24 @@ export const DisplayPreferencesProvider: React.FC<{}> = ({children}) => {
setHistoricData(newHistoric);
}
+ const historicMapSwitch = useCallback(
+ (e) => {
+ if (historicData === 'enabled') {
+ flipHistoricData(e);
+ }
+ fliphistoricMap(e);
+ },
+ [historicMap],
+ )
+ const historicMapSwitchOnClick = (e) => {
+ fliphistoricMap(e)
+ }
+ function fliphistoricMap(e) {
+ e.preventDefault();
+ const newHistoric = (historicMap === 'enabled')? 'disabled' : 'enabled';
+ setHistoricMap(newHistoric);
+ }
+
const darkLightThemeSwitch = useCallback(
(e) => {
flipDarkLightTheme(e)
@@ -354,6 +389,10 @@ export const DisplayPreferencesProvider: React.FC<{}> = ({children}) => {
historicDataSwitch,
historicDataSwitchOnClick,
+ historicMap,
+ historicMapSwitch,
+ historicMapSwitchOnClick,
+
darkLightTheme,
darkLightThemeSwitch,
darkLightThemeSwitchOnClick,
diff --git a/app/src/frontend/map/historic-data-switcher.tsx b/app/src/frontend/map/historic-data-switcher.tsx
index c1eadb58..db64c17e 100644
--- a/app/src/frontend/map/historic-data-switcher.tsx
+++ b/app/src/frontend/map/historic-data-switcher.tsx
@@ -5,11 +5,12 @@ import { useDisplayPreferences } from '../displayPreferences-context';
export const HistoricDataSwitcher: React.FC<{}> = (props) => {
const { historicData, historicDataSwitch, darkLightTheme } = useDisplayPreferences();
+
return (
);
diff --git a/app/src/frontend/map/historic-map-switcher.tsx b/app/src/frontend/map/historic-map-switcher.tsx
new file mode 100644
index 00000000..6e6be073
--- /dev/null
+++ b/app/src/frontend/map/historic-map-switcher.tsx
@@ -0,0 +1,17 @@
+import React from 'react';
+
+import './map-button.css';
+import { useDisplayPreferences } from '../displayPreferences-context';
+
+export const HistoricMapSwitcher: React.FC<{}> = (props) => {
+ const { historicMap, historicMapSwitch, darkLightTheme } = useDisplayPreferences();
+
+ return (
+
+ );
+}
\ No newline at end of file
diff --git a/app/src/frontend/map/layers/historic-map-layer.tsx b/app/src/frontend/map/layers/historic-map-layer.tsx
new file mode 100644
index 00000000..405fc5dc
--- /dev/null
+++ b/app/src/frontend/map/layers/historic-map-layer.tsx
@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { TileLayer } from 'react-leaflet';
+import { LayerEnablementState } from '../../config/map-config';
+import { BuildingBaseLayerAllZoom } from './building-base-layer-all-zoom';
+import { useDisplayPreferences } from '../../displayPreferences-context';
+import { BuildingDataLayer } from './building-data-layer';
+
+export function HistoricMapLayer({revisionId}: {revisionId: string}) {
+ const { historicMap } = useDisplayPreferences();
+ if(historicMap == "enabled") {
+ return <>
+
+ >
+ } else {
+ return null;
+ }
+}
+
diff --git a/app/src/frontend/map/map-button.css b/app/src/frontend/map/map-button.css
index b77c57d8..277c49a7 100644
--- a/app/src/frontend/map/map-button.css
+++ b/app/src/frontend/map/map-button.css
@@ -111,11 +111,15 @@
}
.historic-data-switcher {
+ top: 437px;
+}
+
+.historic-map-switcher {
top: 397px;
}
.parcel-switcher {
- top: 437px;
+ top: 477px;
}
.map-switcher-inline {
diff --git a/app/src/frontend/map/map.tsx b/app/src/frontend/map/map.tsx
index a1cb637a..1a1e9286 100644
--- a/app/src/frontend/map/map.tsx
+++ b/app/src/frontend/map/map.tsx
@@ -15,6 +15,7 @@ import { BoroughBoundaryLayer } from './layers/borough-boundary-layer';
import { BoroughLabelLayer } from './layers/borough-label-layer';
import { ParcelBoundaryLayer } from './layers/parcel-boundary-layer';
import { HistoricDataLayer } from './layers/historic-data-layer';
+import { HistoricMapLayer } from './layers/historic-map-layer';
import { FloodBoundaryLayer } from './layers/flood-boundary-layer';
import { ConservationAreaBoundaryLayer } from './layers/conservation-boundary-layer';
import { VistaBoundaryLayer } from './layers/vista-boundary-layer';
@@ -34,6 +35,7 @@ import { ParcelSwitcher } from './parcel-switcher';
import { FloodSwitcher } from './flood-switcher';
import { ConservationAreaSwitcher } from './conservation-switcher';
import { HistoricDataSwitcher } from './historic-data-switcher';
+import { HistoricMapSwitcher } from './historic-map-switcher';
import { VistaSwitcher } from './vista-switcher';
import { CreativeSwitcher } from './creative-switcher';
import { HousingSwitcher } from './housing-switcher';
@@ -129,6 +131,7 @@ export const ColouringMap : FC = ({
>
+
@@ -167,10 +170,12 @@ export const ColouringMap : FC = ({
+
+
>
: <>>
}