Switch to JSON in URL for copy

In preparation for multi-attribute copy.
This commit is contained in:
Tom Russell 2019-08-01 10:29:32 +01:00
parent 4105ad93a8
commit 00687dbaed
4 changed files with 96 additions and 70 deletions

View File

@ -118,16 +118,22 @@ class App extends React.Component {
});
}
/**
* Colour building
*
* Used in multi-edit mode to colour buildings on map click
*
* Pulls data from URL to form update
*
* @param {object} building
*/
colourBuilding(building) {
const cat = parseCategoryURL(window.location.pathname);
const q = parse(window.location.search);
let data;
const data = (cat === 'like')? {like: true}: JSON.parse(q.data);
if (cat === 'like'){
data = {like: true}
this.likeBuilding(building.building_id)
} else {
data = {}
data[q.k] = q.v;
this.updateBuilding(building.building_id, data)
}
}

View File

@ -564,14 +564,18 @@ LikeButton.propTypes = {
handleLike: PropTypes.func
}
const Label = (props) => (
const Label = (props) => {
const data = {};
data[props.slug] = props.value;
const data_string = JSON.stringify(data);
return (
<label htmlFor={props.slug}>
{props.title}
{ props.tooltip? <Tooltip text={ props.tooltip } /> : null }
{ (props.cat && props.slug && !props.disabled)?
<div className="icon-buttons">
<NavLink
to={`/multi-edit/${props.cat}.html?k=${props.slug}&v=${props.value}`}
to={`/multi-edit/${props.cat}.html?data=${data_string}`}
className="icon-button copy">
Copy
</NavLink>
@ -579,6 +583,7 @@ const Label = (props) => (
}
</label>
);
}
Label.propTypes = {
slug: PropTypes.string,

View File

@ -135,7 +135,11 @@ DataSection.propTypes = {
children: PropTypes.node
}
const DataEntry = (props) => (
const DataEntry = (props) => {
const data = {};
data[props.slug] = props.value;
const data_string = JSON.stringify(data);
return (
<Fragment>
<dt>
{ props.title }
@ -143,7 +147,7 @@ const DataEntry = (props) => (
{ (props.cat && props.slug && !props.disabled)?
<div className="icon-buttons">
<NavLink
to={`/multi-edit/${props.cat}.html?k=${props.slug}&v=${props.value}`}
to={`/multi-edit/${props.cat}.html?data=${data_string}`}
className="icon-button copy">
Copy
</NavLink>
@ -159,6 +163,7 @@ const DataEntry = (props) => (
: '\u00A0'}</dd>
</Fragment>
);
}
DataEntry.propTypes = {
title: PropTypes.string,
@ -169,14 +174,16 @@ DataEntry.propTypes = {
value: PropTypes.any
}
const LikeDataEntry = (props) => (
const LikeDataEntry = (props) => {
const data_string = JSON.stringify({like: true});
(
<Fragment>
<dt>
{ props.title }
{ props.tooltip? <Tooltip text={ props.tooltip } /> : null }
<div className="icon-buttons">
<NavLink
to={`/multi-edit/${props.cat}.html?k=like&v=${true}`}
to={`/multi-edit/${props.cat}.html?data=${data_string}`}
className="icon-button copy">
Copy
</NavLink>
@ -196,6 +203,7 @@ const LikeDataEntry = (props) => (
}
</Fragment>
);
}
LikeDataEntry.propTypes = {
title: PropTypes.string,

View File

@ -34,7 +34,7 @@ const MultiEdit = (props) => {
}
const q = parse(props.location.search);
const label = fieldTitleFromSlug(q.k);
const data = JSON.parse(q.data)
const title = sectionTitleFromCat(cat);
return (
<Sidebar
@ -44,7 +44,14 @@ const MultiEdit = (props) => {
<header className={`section-header view ${cat} active`}>
<a><h3 className="h3">{title}</h3></a>
</header>
<p class='data-intro'>Set <strong>{label}</strong> to <strong>{q.v}</strong></p>
{
Object.keys(data).map((key => {
const label = fieldTitleFromSlug(key);
return (<p className='data-intro' key={key}>
Set <strong>{label}</strong> to <strong>{data[key]}</strong>
</p>)
}))
}
<form className='buttons-container'>
<InfoBox msg='Click buildings to colour' />