Skip to content

Commit

Permalink
Merge pull request #1364 from colouring-cities/interface/ui-tweaks
Browse files Browse the repository at this point in the history 
Tweaks to Interface Text
  • Loading branch information
@mdsimpson42
mdsimpson42 authored Mar 28, 2024
2 parents 3e7869b + 2eabd58 commit d713dfb
Show file tree
Hide file tree
Showing 5 changed files with 57 additions and 56 deletions.
65 changes: 28 additions & 37 deletions app/src/frontend/building/data-containers/age-history.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,6 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
const thisYear = (new Date()).getFullYear();
const currentBuildingConstructionYear = building.date_year || undefined;

const ageLinkUrl = `/${props.mode}/${Category.Age}/${props.building.building_id}`;

const { historicData, historicDataSwitchOnClick, darkLightTheme } = useDisplayPreferences();
const { historicMap, historicMapSwitchOnClick } = useDisplayPreferences();

Expand Down Expand Up @@ -190,28 +188,28 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
/>
<hr/>
<SelectDataEntry
title={dataFields.date_source.title}
slug="date_source"
value={props.building.date_source}
title={dataFields.date_source_type.title}
slug="date_source_type"
value={props.building.date_source_type}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.date_source.tooltip}
options={dataFields.date_source.items}
placeholder={dataFields.date_source.example}
tooltip={dataFields.date_source_type.tooltip}
options={dataFields.date_source_type.items}
placeholder={dataFields.date_source_type.example}
/>
{(props.building.date_source == dataFields.date_source.items[0] ||
props.building.date_source == dataFields.date_source.items[1] ||
props.building.date_source == null) ? <></> :
{(props.building.date_source_type == dataFields.date_source_type.items[0] ||
props.building.date_source_type == dataFields.date_source_type.items[1] ||
props.building.date_source_type == null) ? <></> :
<>
<MultiDataEntry
title={dataFields.date_link.title}
slug="date_link"
value={props.building.date_link}
title={dataFields.date_source_links.title}
slug="date_source_links"
value={props.building.date_source_links}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.date_link.tooltip}
tooltip={dataFields.date_source_links.tooltip}
placeholder="https://..."
editableEntries={true}
isUrl={true}
Expand All @@ -220,41 +218,34 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
}
<hr/>
<SelectDataEntry
title={dataFields.date_source_type.title}
slug="date_source_type"
value={props.building.date_source_type}
title={dataFields.date_source.title}
slug="date_source"
value={props.building.date_source}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.date_source_type.tooltip}
options={dataFields.date_source_type.items}
placeholder={dataFields.date_source_type.example}
tooltip={dataFields.date_source.tooltip}
options={dataFields.date_source.items}
placeholder={dataFields.date_source.example}
/>
{(props.building.date_source_type == dataFields.date_source_type.items[0] ||
props.building.date_source_type == dataFields.date_source_type.items[1] ||
props.building.date_source_type == null) ? <></> :
{(props.building.date_source == dataFields.date_source.items[0] ||
props.building.date_source == dataFields.date_source.items[1] ||
props.building.date_source == null) ? <></> :
<>
<MultiDataEntry
title={dataFields.date_source_links.title}
slug="date_source_links"
value={props.building.date_source_links}
title={dataFields.date_link.title}
slug="date_link"
value={props.building.date_link}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.date_source_links.tooltip}
tooltip={dataFields.date_link.tooltip}
placeholder="https://..."
editableEntries={true}
isUrl={true}
/>
</>
}
{/*<DataEntry
title="Year of completion (best estimate)"
slug=""
value=""
mode='view'
tooltip='Coming Soon'
/>*/}
</DataEntryGroup>
<DataEntryGroup name="Cladding, extensions and retrofits" collapsed={subcat==null || subcat!="3"}>
<NumericDataEntry
Expand Down Expand Up @@ -410,7 +401,7 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
<DataEntryGroup name="Lifespan and site history" collapsed={subcat==null || subcat!="4"}>
<DataEntryGroup name="Constructions and demolitions on this site" collapsed={subcat==null || subcat!="4"}>
<DynamicsBuildingPane>
<label>Current building (age data <Link to={ageLinkUrl}>editable here</Link>)</label>
<label>Current building (building age data editable above)</label>
<FieldRow>
<div>
<NumericDataEntry
Expand Down Expand Up @@ -444,7 +435,7 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
</DynamicsBuildingPane>
{
currentBuildingConstructionYear == undefined ?
<InfoBox>To add historical records, fill in the <Link to={ageLinkUrl}>Age</Link> data first.</InfoBox> :
<InfoBox>To add historical records, fill in the building age data (above) first.</InfoBox> :

<>
<LogicalDataEntry
Expand Down
4 changes: 2 additions & 2 deletions app/src/frontend/building/data-containers/location.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ const LocationView: React.FunctionComponent<CategoryViewProps> = (props) => {
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.location_name_link.tooltip}
placeholder={dataFields.location_name_link.example}
placeholder={props.mode=="edit"?dataFields.location_name_link.example:""}
isUrl={true}
/>
{
Expand All @@ -77,7 +77,7 @@ const LocationView: React.FunctionComponent<CategoryViewProps> = (props) => {
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.location_residential_name_link.tooltip}
placeholder={dataFields.location_residential_name_link.example}
placeholder={props.mode=="edit"?dataFields.location_residential_name_link.example:""}
isUrl={true}
/>
{
Expand Down
6 changes: 6 additions & 0 deletions app/src/frontend/config/category-maps-config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -290,6 +290,7 @@ export const categoryMapsConfig: {[key in Category]: CategoryMapDefinition[]} =
mapStyle: 'community_building_hominess_avg',
legend: {
title: 'Building hominess',
description: 'The average of all scores for the building',
elements: [
{ color: '#e1fce5', text: '1' },
{ color: '#a8fab5', text: '2' },
Expand All @@ -303,6 +304,7 @@ export const categoryMapsConfig: {[key in Category]: CategoryMapDefinition[]} =
mapStyle: 'community_building_coherence_avg',
legend: {
title: 'Building coherence',
description: 'The average of all scores for the building',
elements: [
{ color: '#e1ebfc', text: '1' },
{ color: '#bbd3fa', text: '2' },
Expand All @@ -316,6 +318,7 @@ export const categoryMapsConfig: {[key in Category]: CategoryMapDefinition[]} =
mapStyle: 'community_building_fascination_avg',
legend: {
title: 'Building fascination',
description: 'The average of all scores for the building',
elements: [
{ color: '#f1e1f7', text: '1' },
{ color: '#e8bbfa', text: '2' },
Expand All @@ -342,6 +345,7 @@ export const categoryMapsConfig: {[key in Category]: CategoryMapDefinition[]} =
mapStyle: 'community_streetscape_hominess_avg',
legend: {
title: 'Streetscape hominess',
description: 'The average of all scores for the building',
elements: [
{ color: '#f0fcde', text: '1' },
{ color: '#d8faa8', text: '2' },
Expand All @@ -355,6 +359,7 @@ export const categoryMapsConfig: {[key in Category]: CategoryMapDefinition[]} =
mapStyle: 'community_streetscape_coherence_avg',
legend: {
title: 'Streetscape coherence',
description: 'The average of all scores for the building',
elements: [
{ color: '#e3fafc', text: '1' },
{ color: '#bbf5fa', text: '2' },
Expand All @@ -368,6 +373,7 @@ export const categoryMapsConfig: {[key in Category]: CategoryMapDefinition[]} =
mapStyle: 'community_streetscape_fascination_avg',
legend: {
title: 'Streetscape fascination',
description: 'The average of all scores for the building',
elements: [
{ color: '#fce8f0', text: '1' },
{ color: '#fabbd3', text: '2' },
Expand Down
8 changes: 4 additions & 4 deletions app/src/frontend/config/data-fields-config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -546,7 +546,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
date_source: {
category: Category.Age,
title: "Historical source type",
title: "Specific historical source type",
tooltip: "Specific historical data source type for the building dates above.",
items: [
"Expert knowledge of building",
Expand Down Expand Up @@ -580,8 +580,8 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
date_source_type: {
category: Category.Age,
title: "Alternative source type",
tooltip: "Source type for the building dates above, if not included in the historical source types listed above.",
title: "Source type",
tooltip: "Source type for the building dates above, more specific historical source types listed below.",
items: commonSourceTypes,
example: "",
},
Expand All @@ -606,7 +606,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
size_storeys_basement: {
category: Category.Size,
title: "Number of floors beneath ground Level",
title: "Number of floors beneath ground level",
tooltip: "How many floors below pavement level?",
example: 1,
},
Expand Down
30 changes: 17 additions & 13 deletions app/src/frontend/pages/welcome.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,26 +13,30 @@ const Welcome = () => (
<h1 className="h2">Welcome to Colouring {config.cityName}!</h1>
<p>

Colouring {config.cityName} is a free knowledge exchange platform designed to provide over fifty types
of open data on buildings in the city, to help make the city more sustainable.
Colouring {config.cityName} is a research-led, free public resource, providing open spatial data
on {config.cityName}'s buildings. It is also an open knowledge initiative, built collectively by,
and for, academia, communities, government, industry and the third sector.
Any information you can add to our open platform is greatly appreciated.

</p>
<p>
{config.projectBlurb}
&nbsp;The Colouring Cities Research Programme (CCRP), led by the Alan Turing Institute,
is <a href="https://github.com/colouring-cities/colouring-cities.github.io">an international consortium of academic institutions</a> involved
in building research. Our aim is to maximise accessibility to building-level data across countries,
to help improve stock quality, efficiency, sustainability and resilience and meet net-zero goals.
Colouring {config.cityName} forms part of the Colouring Cities Research Programme (CCRP),
managed by <a href="https://www.turing.ac.uk/research/research-projects/colouring-cities-research-programme">
The Alan Turing Institute</a>, which allows international academic institutions to co-work on a global network
of interoperable open data platforms on national building stocks, and to accelerate sharing of resources and expertise.
The CCRP's overall aim is to help improve the quality, efficiency, resilience and sustainability of buildings,
and urban areas, and to accelerate the move to net zero in line with United Nations Sustainable Development Goals.
</p>
<p>
New data and features are added all the time. We are keen to engage as many people as possible in platform development. Whether you are a resident,
or a stakeholder in academia, government, industry or the third sector, any help you can give colouring in our Colouring Cities maps,
and enriching and verifying our open databases with your knowledge, is greatly appreciated.
New data and features are added all the time. We are keen to engage as many people as possible in platform development.
Whether you are a resident, or a stakeholder in academia, government, industry or the third sector, any help you can give
colouring in our Colouring Cities maps, and enriching and verifying our open databases with your knowledge, is greatly appreciated.
</p>
<p>
All our <Link to="/data-extracts.html">data</Link> and <a href="https://github.com/colouring-cities/colouring-core">code</a> are
free to download, use and share under our open licence terms.
Our <a href="https://github.com/colouring-cities/manual/wiki">open manual</a> also provides non-technical information on the CCRP for anyone interested in our research.
All data collected (e.g <a href="/data-extracts.html">data-extracts</a>)
and <a href="https://github.com/colouring-cities/colouring-core">code</a> are free to download,
use and share under open licence terms. Our <a href="https://github.com/colouring-cities/manual/wiki">
open manual</a> also provides non-technical information for anyone interested in our research.
</p>
<Link to="/view/categories"
className="btn btn-outline-dark btn-lg btn-block">
Expand Down

0 comments on commit d713dfb

Please sign in to comment.