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

Tweaks (see #1186)

Browse Source
This commit is contained in:
Mike Simpson 2023-06-23 22:25:35 +01:00
parent 8b8c92afc3
commit b5103327c5
10 changed files with 585 additions and 617 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
app/src/frontend/building/data-containers/age-history.tsx
View File

@ -424,7 +424,14 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
}
</DataEntryGroup>
<DataEntryGroup name="Historical map data options" collapsed={true} >
<InfoBox type='warning'>
This section is under development
</InfoBox>
<div className={`alert alert-dark`} role="alert" style={{ fontSize: 13, backgroundColor: "#f6f8f9" }}>
<i>
This section provides links to open digitised historical maps/mapping data that we are using in the Colouring Cities platform.
</i>
</div>
</DataEntryGroup>
</Fragment>
);

25
app/src/frontend/building/data-containers/community.tsx
View File

@ -1,4 +1,4 @@
import React from 'react';
import React, { Fragment } from 'react';
import '../../map/map-button.css';
import withCopyEdit from '../data-container';
@ -15,6 +15,7 @@ import SelectDataEntry from '../data-components/select-data-entry';
import Verification from '../data-components/verification';
import { MultiDataEntry } from '../data-components/multi-data-entry/multi-data-entry';
import { useDisplayPreferences } from '../../displayPreferences-context';
import DataEntry from '../data-components/data-entry';
/**
* Community view/edit section
@ -38,14 +39,22 @@ const CommunityView: React.FunctionComponent<CategoryViewProps> = (props) => {
}
const { darkLightTheme } = useDisplayPreferences();
const worthKeepingReasonsNonEmpty = Object.values(props.building.community_type_worth_keeping_reasons ?? {}).some(x => x);
return <>
<DataEntryGroup name="Community views on building types">
return (
<Fragment>
<DataEntryGroup name="Community views on how well buildings work">
<div className={`alert alert-dark`} role="alert" style={{ fontSize: 13, backgroundColor: "#f6f8f9" }}>
<i>
Note: We are currently only collecting data on non-residential buildings.
</i>
</div>
<div className='community-opinion-pane'>
<DataEntry
title="Do you like this building and think it contributes to the city?"
slug=""
value=""
mode='view'
tooltip='Coming Soon'
/>
{(props.building.is_domestic === "no" || props.building.is_domestic === "mixed domestic/non-domestic") ?
<>
<UserOpinionEntry
@ -133,6 +142,11 @@ const CommunityView: React.FunctionComponent<CategoryViewProps> = (props) => {
mode={props.mode}
copy={props.copy}
/>
<div className={`alert alert-dark`} role="alert" style={{ fontSize: 13, backgroundColor: "#f6f8f9" }}>
<i>
For more information on current planning applications, refer to the Planning Controls category.
</i>
</div>
{(props.mapColourScale == "community_expected_planning_application_total") ?
<button className={`map-switcher-inline enabled-state btn btn-outline btn-outline-dark ${darkLightTheme}`} onClick={switchToTypologyMapStyle}>
{'Click to return to liked typologies mapped.'}
@ -144,7 +158,7 @@ const CommunityView: React.FunctionComponent<CategoryViewProps> = (props) => {
}
</div>
</DataEntryGroup>
<DataEntryGroup name="Building use for community activities">
<DataEntryGroup name="Buildings in community use">
<div className={`alert alert-dark`} role="alert" style={{ fontSize: 13, backgroundColor: "#f6f8f9" }}>
<i>
Here we are collecting information on the location of buildings used for community activities so we can track loss of/additions to community space over time.
@ -223,7 +237,8 @@ const CommunityView: React.FunctionComponent<CategoryViewProps> = (props) => {
</button>
}
</DataEntryGroup>
</>
</Fragment>
);
};
const CommunityContainer = withCopyEdit(CommunityView);

92
app/src/frontend/building/data-containers/energy-performance.tsx
View File

@ -25,9 +25,20 @@ const BreeamRatingOptions = [
* Sustainability view/edit section
*/
const SustainabilityView: React.FunctionComponent<CategoryViewProps> = (props) => {
const currentYear = new Date().getFullYear();
return (
<Fragment>
<DataEntryGroup name="Energy rating data">
<DataEntryGroup name="Environmental quality rating">
<DataEntry
title="Official environmental quality rating"
slug=""
value=""
mode='view'
/>
</DataEntryGroup>
<DataEntryGroup name="Energy rating">
<SelectDataEntry
title={dataFields.sust_breeam_rating.title}
slug="sust_breeam_rating"
@ -46,7 +57,6 @@ const SustainabilityView: React.FunctionComponent<CategoryViewProps> = (props) =
user_verified_as={props.user_verified.sust_breeam_rating}
verified_count={props.building.verified.sust_breeam_rating}
/>
<SelectDataEntry
title={dataFields.sust_dec.title}
slug="sust_dec"
@ -65,7 +75,6 @@ const SustainabilityView: React.FunctionComponent<CategoryViewProps> = (props) =
user_verified_as={props.user_verified.sust_dec}
verified_count={props.building.verified.sust_dec}
/>
<SelectDataEntry
title={dataFields.sust_aggregate_estimate_epc.title}
slug="sust_aggregate_estimate_epc"
@ -78,85 +87,66 @@ const SustainabilityView: React.FunctionComponent<CategoryViewProps> = (props) =
onChange={props.onChange}
/>
</DataEntryGroup>
<DataEntryGroup name="Retrofit Data">
<DataEntryGroup name="Retrofit history">
<NumericDataEntry
title={dataFields.sust_retrofit_date.title}
slug="sust_retrofit_date"
value={props.building.sust_retrofit_date}
tooltip={dataFields.sust_retrofit_date.tooltip}
step={1}
min={1086}
max={new Date().getFullYear()}
slug='age_retrofit_date'
title={dataFields.age_retrofit_date.title}
value={props.building.age_retrofit_date}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
step={1}
min={1}
max={currentYear}
tooltip={dataFields.extension_year.tooltip}
/>
<Verification
slug="sust_retrofit_date"
allow_verify={props.user !== undefined && props.building.sust_retrofit_date !== null && !props.edited}
slug="age_retrofit_date"
allow_verify={props.user !== undefined && props.building.age_retrofit_date !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("sust_retrofit_date")}
user_verified_as={props.user_verified.sust_retrofit_date}
verified_count={props.building.verified.sust_retrofit_date}
user_verified={props.user_verified.hasOwnProperty("age_retrofit_date")}
user_verified_as={props.user_verified.age_retrofit_date}
verified_count={props.building.verified.age_retrofit_date}
/>
<SelectDataEntry
title={dataFields.sust_retrofit_source_type.title}
slug="sust_retrofit_source_type"
value={props.building.sust_retrofit_source_type}
title={dataFields.age_retrofit_date_source_type.title}
slug="age_retrofit_date_source_type"
value={props.building.age_retrofit_date_source_type}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.sust_retrofit_source_type.tooltip}
options={dataFields.sust_retrofit_source_type.items}
placeholder={dataFields.sust_retrofit_source_type.example}
tooltip={dataFields.age_retrofit_date_source_type.tooltip}
options={dataFields.age_retrofit_date_source_type.items}
placeholder={dataFields.age_retrofit_date_source_type.example}
/>
{(props.building.sust_retrofit_source_type == dataFields.sust_retrofit_source_type.items[0] ||
props.building.sust_retrofit_source_type == dataFields.sust_retrofit_source_type.items[1] ||
props.building.sust_retrofit_source_type == null) ? <></> :
{(props.building.age_retrofit_date_source_type == dataFields.age_retrofit_date_source_type.items[0] ||
props.building.age_retrofit_date_source_type == dataFields.age_retrofit_date_source_type.items[1] ||
props.building.age_retrofit_date_source_type == null) ? <></> :
<>
<MultiDataEntry
title={dataFields.sust_retrofit_source_links.title}
slug="sust_retrofit_source_links"
value={props.building.sust_retrofit_source_links}
title={dataFields.age_retrofit_date_source_links.title}
slug="age_retrofit_date_source_links"
value={props.building.age_retrofit_date_source_links}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.sust_retrofit_source_links.tooltip}
tooltip={dataFields.age_retrofit_date_source_links.tooltip}
placeholder="https://..."
editableEntries={true}
isUrl={true}
/>
</>
}
{/* <hr/>
<DataEntry
title="Date of Significant Retrofits"
slug=""
value=""
mode='view'
/>
<Verification
slug="date_link"
allow_verify={props.user !== undefined && props.building.date_link !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("date_link")}
user_verified_as={props.user_verified.date_link}
verified_count={props.building.verified.date_link}
/>
<DataEntry
title="Source"
slug=""
value=""
mode='view'
/> */}
</DataEntryGroup>
<DataEntryGroup name="Other sustainability features">
<DataEntryGroup name="Solar panels">
<DataEntry
title="Does the building have Solar Panels?"
slug=""
value=""
mode='view'
/>
</DataEntryGroup>
<DataEntryGroup name="Green walls/roof">
<DataEntry
title="Does the building have Green Walls / Green Roof"
slug=""

4
app/src/frontend/building/data-containers/land-use.tsx
View File

@ -32,7 +32,7 @@ const UseView: React.FunctionComponent<CategoryViewProps> = (props) => {
const { darkLightTheme } = useDisplayPreferences();
return (
<Fragment>
<DataEntryGroup name="Residential/non-residential land use data (general)">
<DataEntryGroup name="General Land Use">
<div className={`alert alert-dark`} role="alert" style={{ fontSize: 13, backgroundColor: "#f6f8f9" }}>
<i>
The vast majority of properties are residential (93% in the UK), so we have set 'residential' as the default value. Can you help us identify non-residential and mixed use buildings (and verify residential buildings too)?
@ -87,7 +87,7 @@ const UseView: React.FunctionComponent<CategoryViewProps> = (props) => {
</>
}
</DataEntryGroup>
<DataEntryGroup name="Specific land use data">
<DataEntryGroup name="Specific land use(s)">
<MultiDataEntry
title={dataFields.current_landuse_group.title}
slug="current_landuse_group"

4
app/src/frontend/building/data-containers/location.tsx
View File

@ -17,7 +17,7 @@ const LocationView: React.FunctionComponent<CategoryViewProps> = (props) => {
const osm_url = "https://www.openstreetmap.org/way/"+props.building.ref_osm_id;
return (
<Fragment>
<DataEntryGroup name="Address data">
<DataEntryGroup name="Addresses">
<DataEntry
title={dataFields.location_name.title}
slug="location_name"
@ -161,7 +161,7 @@ const LocationView: React.FunctionComponent<CategoryViewProps> = (props) => {
</>
}
</DataEntryGroup>
<DataEntryGroup name="Property/footprint IDs and coordinate data">
<DataEntryGroup name="Property/footprint IDs and coordinates">
<DataEntry
title={dataFields.ref_toid.title}
slug="ref_toid"

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

@ -19,6 +19,8 @@ import { CategoryViewProps } from './category-view-props';
import { Category } from '../../config/categories-config';
import { useDisplayPreferences } from '../../displayPreferences-context';
import { processParam } from '../../../api/parameters';
import { MultiDataEntry } from '../data-components/multi-data-entry/multi-data-entry';
import YearDataEntry from '../data-components/year-data-entry';
const currentTimestamp = new Date().valueOf();
const milisecondsInYear = 1000 * 60 * 60 * 24 * 365;
@ -65,8 +67,8 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
const communityLinkUrl = `/${props.mode}/${Category.Community}/${props.building.building_id}`;
return (
<Fragment>
<DataEntryGroup name="Planning application information" collapsed={true} >
<DataEntryGroup name="Current/active applications (official data)">
<DataEntryGroup name="Current planning applications" collapsed={true} >
<DataEntryGroup name="Official data">
<InfoBox>
This section provides data on active applications. We define these as applications with any activity in the last year.
<br />
@ -85,7 +87,23 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
: <></>
}
</DataEntryGroup>
<DataEntryGroup name="Past applications (official data)" collapsed={true} >
<DataEntryGroup name="Year of completion (crowdsourced)" collapsed={true} >
<DataEntry
title="Year of completion"
slug=""
value=""
mode='view'
tooltip='Coming Soon'
/>
</DataEntryGroup>
<DataEntryGroup name="Incomplete/missing data" collapsed={true} >
<InfoBox>
If you feel there are incorrect or missing data relating to this building please contact:
planningdata@London.gov.uk
</InfoBox>
</DataEntryGroup>
</DataEntryGroup>
<DataEntryGroup name="Past applications" collapsed={true} >
<InfoBox>
This section provides data on past applications where available from the GLA, including those with no decision in over a year
</InfoBox>
@ -102,7 +120,7 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
: <></>
}
</DataEntryGroup>
<DataEntryGroup name="Possible future applications (crowdsourced data)" collapsed={true} >
<DataEntryGroup name="Possible future applications" 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>
{
props.mapColourScale != "community_expected_planning_application_total" ?
@ -127,7 +145,6 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
Further improvements to this feature are currently being made.
</InfoBox>
</DataEntryGroup>
</DataEntryGroup>
<DataEntryGroup name="Planning zones" collapsed={true} >
<InfoBox>
To view planning zone data for London click the buttons below. You may need to <u>zoom out</u>.
@ -358,6 +375,24 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
user_verified_as={props.user_verified.planning_in_conservation_area_url}
verified_count={props.building.verified.planning_in_conservation_area_url}
/>
<DataEntry
title={dataFields.planning_in_apa_url.title}
slug="planning_in_apa_url"
value={props.building.planning_in_apa_url}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
isUrl={true}
placeholder="Please add relevant link here"
/>
<Verification
slug="planning_in_apa_url"
allow_verify={props.user !== undefined && props.building.planning_in_apa_url !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("planning_in_apa_url")}
user_verified_as={props.user_verified.planning_in_apa_url}
verified_count={props.building.verified.planning_in_apa_url}
/>
{/*
<DataEntry
title={dataFields.planning_conservation_area_name.title}
@ -394,125 +429,16 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
user_verified_as={props.user_verified.planning_historic_area_assessment_url}
verified_count={props.building.verified.planning_historic_area_assessment_url}
/>
<DataEntry
title={dataFields.planning_in_apa_url.title}
slug="planning_in_apa_url"
value={props.building.planning_in_apa_url}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
isUrl={true}
placeholder="Please add relevant link here"
/>
<Verification
slug="planning_in_apa_url"
allow_verify={props.user !== undefined && props.building.planning_in_apa_url !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("planning_in_apa_url")}
user_verified_as={props.user_verified.planning_in_apa_url}
verified_count={props.building.verified.planning_in_apa_url}
/>
</DataEntryGroup>
<DataEntryGroup name="Forthcoming data (sections to be activated)" collapsed={true} >
<DataEntryGroup name="Active application info (crowdsourced)" collapsed={true} >
{/* will be titled "Other active application info (crowdsourced data)" once active" */}
<InfoBox type='warning'>
This category is not yet activated - Until this section is activated please report inaccuracies or problems on the <a href=" https://github.com/colouring-cities/colouring-london/discussions/categories/planning-section-comments">Discussion Forum</a>.
</InfoBox>
{/* that is placeholder display, will be replaced by actual code */}
<div className="data-title">
<div className="data-title-text">
<ul>
<li>Year of completion if known</li>
<li>If you know of a planning application that has been recently submitted for this site, and is not listed in the blue box above, please enter its planning application ID below:</li>
<li>If any of the active planning applications are not mapped onto the correct site, please tick here</li>
</ul>
</div>
</div>
{
/*
<NumericDataEntry
title={dataFields.planning_crowdsourced_site_completion_year.title}
slug="planning_crowdsourced_site_completion_year"
value={props.building.planning_crowdsourced_site_completion_year}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
disabled={true}
/>
<Verification
slug="planning_crowdsourced_site_completion_year"
allow_verify={false}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("planning_crowdsourced_site_completion_year")}
user_verified_as={props.user_verified.planning_crowdsourced_site_completion_year}
verified_count={props.building.verified.planning_crowdsourced_site_completion_year}
/>
<DataEntry
title={dataFields.planning_crowdsourced_planning_id.title}
slug="planning_crowdsourced_planning_id"
value={props.building.planning_crowdsourced_planning_id}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
disabled={true}
/>
<Verification
slug="planning_crowdsourced_planning_id"
allow_verify={false && props.user !== undefined && props.building.planning_crowdsourced_planning_id !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("planning_crowdsourced_planning_id")}
user_verified_as={props.user_verified.planning_crowdsourced_planning_id}
verified_count={props.building.verified.planning_crowdsourced_planning_id}
/>
<LogicalDataEntry
slug='community_expected_planning_application_is_inaccurate'
title={"If any of the active planning applications are not mapped onto the correct site, please tick here"}
value={null}
onChange={props.onSaveChange}
mode={props.mode}
copy={props.copy}
disabled={true}
/>
on enabling switch it to UserOpinionEntry, remove value and restore userValue
*/
}
</DataEntryGroup>
<DataEntryGroup name="Land ownership type" collapsed={true} >
<InfoBox type='warning'>
This category is not yet activated.
</InfoBox>
<DataEntryGroup name="Land ownership" collapsed={true} >
<InfoBox>
This section is designed to provide information on land parcels and their ownership type. Can you help us to crowdsource this information?
</InfoBox>
<button className={`map-switcher-inline ${parcel}-state btn btn-outline btn-outline-dark ${darkLightTheme}`} onClick={parcelSwitchOnClick}>
{(parcel === 'enabled')? 'Click to hide sample of parcel data (in City)' : 'Click to see sample of parcel data (in City) mapped'}
</button>
<div className="data-title">
<div className="data-title-text">
<ul>
<li>What type of owner owns this land parcel?</li>
</ul>
</div>
</div>
{/*
<SelectDataEntry
slug='community_public_ownership'
title={"What type of owner owns this land parcel? "}
title={dataFields.community_public_ownership.title}
value={props.building.community_public_ownership}
options={[
'Government-owned',
'Charity-owned',
'Community-owned/cooperative',
'Owned by other non-profit body',
'Not in public/community ownership',
]}
options={dataFields.community_public_ownership.items}
onChange={props.onChange}
mode={props.mode}
copy={props.copy}
@ -525,9 +451,27 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
user_verified_as={props.user_verified.community_public_ownership}
verified_count={props.building.verified.community_public_ownership}
/>
*/
}
</DataEntryGroup>
<DataEntry
title="Source Type"
slug=""
value=""
mode='view'
tooltip='Coming Soon'
/>
<MultiDataEntry
slug='community_public_ownership_sources'
title={dataFields.community_public_ownership_sources.title}
isUrl={true}
placeholder={'https://...'}
editableEntries={true}
value={props.building.community_public_ownership_sources}
onChange={props.onChange}
mode={props.mode}
copy={props.copy}
/>
<button className={`map-switcher-inline ${parcel}-state btn btn-outline btn-outline-dark ${darkLightTheme}`} onClick={parcelSwitchOnClick}>
{(parcel === 'enabled')? 'Click to hide sample land parcel data' : 'Click to show sample land parcel data'}
</button>
</DataEntryGroup>
</Fragment>
)};

6
app/src/frontend/building/data-containers/size.tsx
View File

@ -103,7 +103,7 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
</>
}
</DataEntryGroup>
<DataEntryGroup name="Building height data">
<DataEntryGroup name="Height">
<NumericDataEntry
title={dataFields.size_height_apex.title}
slug="size_height_apex"
@ -196,7 +196,7 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
</>
}
</DataEntryGroup>
<DataEntryGroup name="Floor area data">
<DataEntryGroup name="Floor area">
<NumericDataEntry
title={dataFields.size_floor_area_ground.title}
slug="size_floor_area_ground"
@ -261,7 +261,7 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
</>
}
</DataEntryGroup>
<DataEntryGroup name="Plot size data">
<DataEntryGroup name="Plot size">
<NumericDataEntry
title={dataFields.size_width_frontage.title}
slug="size_width_frontage"

197
app/src/frontend/building/data-containers/street-context.tsx
View File

@ -17,7 +17,7 @@ import Verification from '../data-components/verification';
*/
const StreetscapeView: React.FunctionComponent<CategoryViewProps> = (props) => (
<Fragment>
<DataEntryGroup name="Does the building have a garden?">
<DataEntryGroup name="Green Space">
<SelectDataEntry
title={dataFields.context_front_garden.title}
slug="context_front_garden"
@ -104,8 +104,102 @@ const StreetscapeView: React.FunctionComponent<CategoryViewProps> = (props) => (
/>
</>
}
<hr/>
<NumericDataEntry
title={dataFields.context_green_space_distance.title}
value={props.building.context_green_space_distance}
slug="context_green_space_distance"
tooltip={dataFields.context_green_space_distance.tooltip}
//placeholder={dataFields.context_green_space_distance.example}
mode={props.mode}
onChange={props.onChange}
step={1}
min={0}
/>
<Verification
slug="context_green_space_distance"
allow_verify={props.user !== undefined && props.building.context_green_space_distance !== null}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("context_green_space_distance")}
user_verified_as={props.user_verified.context_green_space_distance}
verified_count={props.building.verified.context_green_space_distance}
/>
<SelectDataEntry
title={dataFields.context_green_space_distance_source_type.title}
slug="context_green_space_distance_source_type"
value={props.building.context_green_space_distance_source_type}
options={dataFields.context_green_space_distance_source_type.items}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.context_green_space_distance_source_type.tooltip}
/>
{(props.building.context_green_space_distance_source_type == commonSourceTypes[0] ||
props.building.context_green_space_distance_source_type == commonSourceTypes[1] ||
props.building.context_green_space_distance_source_type == null) ? <></> :
<><MultiDataEntry
title={dataFields.context_green_space_distance_source_links.title}
slug="context_green_space_distance_source_links"
value={props.building.context_green_space_distance_source_links}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.context_green_space_distance_source_links.tooltip}
placeholder="https://..."
editableEntries={true}
isUrl={true}
/>
</>
}
<hr/>
<NumericDataEntry
title={dataFields.context_tree_distance.title}
value={props.building.context_tree_distance}
slug="context_tree_distance"
tooltip={dataFields.context_tree_distance.tooltip}
//placeholder={dataFields.context_tree_distance.example}
mode={props.mode}
onChange={props.onChange}
step={1}
min={0}
/>
<Verification
slug="context_tree_distance"
allow_verify={props.user !== undefined && props.building.context_tree_distance !== null}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("context_tree_distance")}
user_verified_as={props.user_verified.context_tree_distance}
verified_count={props.building.verified.context_tree_distance}
/>
<SelectDataEntry
title={dataFields.context_tree_distance_source_type.title}
slug="context_tree_distance_source_type"
value={props.building.context_tree_distance_source_type}
options={dataFields.context_tree_distance_source_type.items}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.context_tree_distance_source_type.tooltip}
/>
{(props.building.context_tree_distance_source_type == commonSourceTypes[0] ||
props.building.context_tree_distance_source_type == commonSourceTypes[1] ||
props.building.context_tree_distance_source_type == null) ? <></> :
<><MultiDataEntry
title={dataFields.context_tree_distance_source_links.title}
slug="context_tree_distance_source_links"
value={props.building.context_tree_distance_source_links}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.context_tree_distance_source_links.tooltip}
placeholder="https://..."
editableEntries={true}
isUrl={true}
/>
</>
}
</DataEntryGroup>
<DataEntryGroup name="Street/pavement properties">
<DataEntryGroup name="Street/pavement">
<NumericDataEntry
title={dataFields.context_street_width.title}
value={props.building.context_street_width}
@ -247,100 +341,13 @@ const StreetscapeView: React.FunctionComponent<CategoryViewProps> = (props) => (
</>
}
</DataEntryGroup>
<DataEntryGroup name="Access to green space">
<NumericDataEntry
title={dataFields.context_green_space_distance.title}
value={props.building.context_green_space_distance}
slug="context_green_space_distance"
tooltip={dataFields.context_green_space_distance.tooltip}
//placeholder={dataFields.context_green_space_distance.example}
mode={props.mode}
onChange={props.onChange}
step={1}
min={0}
<DataEntryGroup name="Number of entrances facing street">
<DataEntry
title="Number of entrances facing street"
slug=""
value=""
mode='view'
/>
<Verification
slug="context_green_space_distance"
allow_verify={props.user !== undefined && props.building.context_green_space_distance !== null}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("context_green_space_distance")}
user_verified_as={props.user_verified.context_green_space_distance}
verified_count={props.building.verified.context_green_space_distance}
/>
<SelectDataEntry
title={dataFields.context_green_space_distance_source_type.title}
slug="context_green_space_distance_source_type"
value={props.building.context_green_space_distance_source_type}
options={dataFields.context_green_space_distance_source_type.items}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.context_green_space_distance_source_type.tooltip}
/>
{(props.building.context_green_space_distance_source_type == commonSourceTypes[0] ||
props.building.context_green_space_distance_source_type == commonSourceTypes[1] ||
props.building.context_green_space_distance_source_type == null) ? <></> :
<><MultiDataEntry
title={dataFields.context_green_space_distance_source_links.title}
slug="context_green_space_distance_source_links"
value={props.building.context_green_space_distance_source_links}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.context_green_space_distance_source_links.tooltip}
placeholder="https://..."
editableEntries={true}
isUrl={true}
/>
</>
}
<hr/>
<NumericDataEntry
title={dataFields.context_tree_distance.title}
value={props.building.context_tree_distance}
slug="context_tree_distance"
tooltip={dataFields.context_tree_distance.tooltip}
//placeholder={dataFields.context_tree_distance.example}
mode={props.mode}
onChange={props.onChange}
step={1}
min={0}
/>
<Verification
slug="context_tree_distance"
allow_verify={props.user !== undefined && props.building.context_tree_distance !== null}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("context_tree_distance")}
user_verified_as={props.user_verified.context_tree_distance}
verified_count={props.building.verified.context_tree_distance}
/>
<SelectDataEntry
title={dataFields.context_tree_distance_source_type.title}
slug="context_tree_distance_source_type"
value={props.building.context_tree_distance_source_type}
options={dataFields.context_tree_distance_source_type.items}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.context_tree_distance_source_type.tooltip}
/>
{(props.building.context_tree_distance_source_type == commonSourceTypes[0] ||
props.building.context_tree_distance_source_type == commonSourceTypes[1] ||
props.building.context_tree_distance_source_type == null) ? <></> :
<><MultiDataEntry
title={dataFields.context_tree_distance_source_links.title}
slug="context_tree_distance_source_links"
value={props.building.context_tree_distance_source_links}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.context_tree_distance_source_links.tooltip}
placeholder="https://..."
editableEntries={true}
isUrl={true}
/>
</>
}
</DataEntryGroup>
</Fragment>
);

97
app/src/frontend/building/data-containers/team.tsx
View File

@ -21,7 +21,7 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
const currentBuildingConstructionYear = building.date_year || undefined;
return (
<form>
<DataEntryGroup name="Data relating to original building or extension?">
<DataEntryGroup name="General info">
<NumericDataEntry
slug='date_year'
title={dataFields.date_year.title}
@ -135,7 +135,7 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
</>
) : (null)}
</DataEntryGroup>
<DataEntryGroup name="Land ownership data">
<DataEntryGroup name="Land ownership">
<MultiDataEntry
title={dataFields.landowner.title}
slug="landowner"
@ -185,7 +185,7 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
</>
}
</DataEntryGroup>
<DataEntryGroup name="Developer data">
<DataEntryGroup name="Developer">
<SelectDataEntry
slug='developer_type'
title={dataFields.developer_type.title}
@ -252,7 +252,7 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
</>
}
</DataEntryGroup>
<DataEntryGroup name="Designer data">
<DataEntryGroup name="Designer">
<MultiDataEntry
title={dataFields.designers.title}
slug="designers"
@ -319,51 +319,8 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
/>
</>
}
<hr/>
<LogicalDataEntryYesOnly
slug='designer_awards'
title={dataFields.designer_awards.title}
tooltip={dataFields.designer_awards.tooltip}
value={props.building.designer_awards}
copy={props.copy}
onChange={props.onChange}
mode={props.mode}
/>
<Verification
slug="designer_awards"
allow_verify={props.user !== undefined && props.building.designer_awards !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("designer_awards")}
user_verified_as={props.user_verified.designer_awards}
verified_count={props.building.verified.designer_awards}
/>
{props.building.designer_awards ? (
<>
<MultiDataEntry
title={dataFields.awards_source_link.title}
slug="awards_source_link"
value={props.building.awards_source_link}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.awards_source_link.tooltip}
placeholder="https://..."
editableEntries={true}
isUrl={true}
/>
<Verification
slug="awards_source_link"
allow_verify={props.user !== undefined && props.building.awards_source_link !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("awards_source_link")}
user_verified_as={props.user_verified.awards_source_link}
verified_count={props.building.verified.awards_source_link}
/>
</>
) : (null)
}
</DataEntryGroup>
<DataEntryGroup name="Builder data">
<DataEntryGroup name="Builder">
<MultiDataEntry
title={dataFields.builder.title}
slug="builder"
@ -411,6 +368,50 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
</>
}
</DataEntryGroup>
<DataEntryGroup name="Awards">
<LogicalDataEntryYesOnly
slug='designer_awards'
title={dataFields.designer_awards.title}
tooltip={dataFields.designer_awards.tooltip}
value={props.building.designer_awards}
copy={props.copy}
onChange={props.onChange}
mode={props.mode}
/>
<Verification
slug="designer_awards"
allow_verify={props.user !== undefined && props.building.designer_awards !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("designer_awards")}
user_verified_as={props.user_verified.designer_awards}
verified_count={props.building.verified.designer_awards}
/>
{props.building.designer_awards ? (
<>
<MultiDataEntry
title={dataFields.awards_source_link.title}
slug="awards_source_link"
value={props.building.awards_source_link}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.awards_source_link.tooltip}
placeholder="https://..."
editableEntries={true}
isUrl={true}
/>
<Verification
slug="awards_source_link"
allow_verify={props.user !== undefined && props.building.awards_source_link !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("awards_source_link")}
user_verified_as={props.user_verified.awards_source_link}
verified_count={props.building.verified.awards_source_link}
/>
</>
) : (null)
}
</DataEntryGroup>
</form>
);
};

72
app/src/frontend/config/data-fields-config.ts
View File

@ -6,9 +6,9 @@ let ccconfig: CCConfig = require('../../cc-config.json')
* Common list of Source Types, used in multiple menus
*/
export const commonSourceTypes = [
"Assessed by eye",
"Assessed by eye/personal knowledge of the building",
"Assessed using expert knowledge of building or building type",
"Assessed using streetview photographs or satellite imagery",
"Assessed using streetview photographs, satellite imagery or maps",
"Assessed by specialist emergency group",
"Live streamed from a government source",
"Current government record/dataset",
@ -156,7 +156,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
location_street: {
category: Category.Location,
title: "Street",
title: "Street name",
example: "Gower Street",
//tooltip: ,
},
@ -342,7 +342,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
facade_year: {
category: Category.Age,
title: "Date of front of building",
title: "Date of front of building (best estimate)",
tooltip: "Best estimate",
example: 1900,
},
@ -416,7 +416,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
category: Category.Size,
title: "Height to apex (m)",
example: 100.5,
tooltip: "i.e. the highest part of the roof.",
tooltip: "i.e. the highest part of the roof (in meters).",
},
size_height_apex_source_type: {
category: Category.Team,
@ -435,7 +435,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
category: Category.Size,
title: "Height to eaves (m)",
example: 20.33,
tooltip: "i.e. to where the top of the wall meets the roof",
tooltip: "i.e. to where the top of the wall meets the roof (in meters)",
},
size_height_eaves_source_type: {
category: Category.Team,
@ -479,7 +479,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
category: Category.Size,
title: "Frontage width (m)",
example: 12.2,
//tooltip: ,
tooltip: "Size of the frontage of the building (in meters)",
},
size_width_frontage_source_type: {
category: Category.Team,
@ -583,7 +583,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
sust_breeam_rating: {
category: Category.EnergyPerformance,
title: "Official environmental quality rating",
title: "Residential energy rating",
tooltip: ccconfig.energy_rating,
example: "",
},
@ -716,7 +716,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
planning_list_grade: {
category: Category.Planning,
title: "What is its rating?",
title: "What is its protection rating?",
example: "II",
//tooltip: ,
},
@ -740,19 +740,19 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
planning_in_apa_url: {
category: Category.Planning,
title: "Is it in an area if archaeological priority?",
title: "Is the building in an area of archaeological priority?",
example: "",
//tooltip: ,
},
planning_local_list_url: {
category: Category.Planning,
title: "Is it a locally listed heritage asset?",
title: "Is the building a locally listed heritage asset?",
example: "",
//tooltip: ,
},
planning_historic_area_assessment_url: {
category: Category.Planning,
title: "Does it have any other kind of historic area assessment?",
title: "Does it have any other type of designation?",
example: "",
//tooltip: ,
},
@ -811,19 +811,19 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
community_activities_current: {
category: Category.Community,
title: "Are activities open to the community currently taking place in the building?",
title: "Is this building currently used for community activities?",
tooltip: "E.g. youth club, place of worship, GP surgery, pub",
example: true
},
community_activities: {
category: Category.Community,
title: "Has this ever been used for community activities in the past?",
title: "If not been used for community activities in the past?",
tooltip: "E.g. youth club, place of worship, GP surgery, pub",
example: true
},
community_activities_always: {
category: Category.Community,
title: "Has the building always been used for community activities?",
title: "If in community use now, has it always been used for community activities?",
tooltip: "E.g. youth club, place of worship, GP surgery, pub",
example: true
},
@ -837,11 +837,15 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
title: "Is the building in public/community ownership?",
example: "Privately owned (non-corporate)",
items: [
'Government-owned',
'Charity-owned',
'Community-owned/cooperative',
'Owned by other non-profit body',
'Not in public/community ownership'
"Public/State body",
"Public body with Private company",
"Charity",
"Community group/Cooperative",
"Other non-profit body",
"Privately owned company",
"Privately owned offshore company",
"Private individual",
"Other",
]
},
community_public_ownership_sources: {
@ -953,7 +957,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
landowner: {
category: Category.Team,
title: "Landowner(s) at time of construction",
tooltip: "Free text. First name, space, then Last name",
tooltip: "Land owner when the building was constructed.<br/>For info on current land ownership, see 'Planning Controls'.",
example: ["", "", ""],
},
landowner_source_type: {
@ -1003,14 +1007,14 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
designer_awards: {
category: Category.Team,
title: "Did the design team win any awards for this building?",
title: "Has the building won any?",
tooltip: "",
example: false
},
awards_source_link: {
category: Category.Team,
title: "Source link(s) for designer award(s)",
tooltip: "URL for source for designer award(s)",
title: "Source link(s) for building award(s)",
tooltip: "URL for source for building award(s)",
example: ["", "", ""],
},
builder: {
@ -1116,7 +1120,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
context_flats_garden: {
category: Category.StreetContext,
title: "Is the building flats with a dedicated green space?",
title: "Are flats with a dedicated green space?",
tooltip: "If the building is a block of flats, does it have a dedicated garden area/green space?",
example: "",
items: [
@ -1139,8 +1143,8 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
context_street_width: {
category: Category.Team,
title: "Street width (m)",
tooltip: "Width of the street in metres.",
title: "Average street width (m)",
tooltip: "Average width of the street in metres.",
example: 10
},
context_street_width_source_type: {
@ -1158,8 +1162,8 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
context_pavement_width: {
category: Category.Team,
title: "Pavement width (m)",
tooltip: "Width of the pavement in metres.",
title: "Average pavement width (m)",
tooltip: "Average width of the pavement in metres.",
example: 10
},
context_pavement_width_source_type: {
@ -1178,7 +1182,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
context_green_space_distance: {
category: Category.Team,
title: "Distance to nearest green space (m)",
tooltip: "Approximate distance from the front door of the building to the nearest public green space.",
tooltip: "Approximate distance from the front door of the building to the nearest public green space (in meters).",
example: 10
},
context_green_space_distance_source_type: {
@ -1197,7 +1201,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
context_tree_distance: {
category: Category.Team,
title: "Distance to nearest tree (m)",
tooltip: "Approximate distance from the front door of the building to the nearest tree.",
tooltip: "Approximate distance from the front door of the building to the nearest tree in meters.",
example: 10
},
context_tree_distance_source_type: {
@ -1234,7 +1238,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
age_cladding_date: {
category: Category.Age,
title: "Cladding date",
title: "Cladding date (best estimate)",
tooltip: "Width of the street in metres.",
example: 1970
},
@ -1253,7 +1257,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
age_extension_date: {
category: Category.Age,
title: "Date of significant extensions",
title: "Date of significant extensions (best estimate)",
tooltip: "Width of the street in metres.",
example: 1970
},
@ -1272,7 +1276,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
age_retrofit_date: {
category: Category.Age,
title: "Date of significant retrofits",
title: "Date of last significant retrofit (best estimate)",
tooltip: "Width of the street in metres.",
example: 1970
},