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

Set up section header for multi

Browse Source
This commit is contained in:
Tom Russell 2019-05-27 21:28:47 +01:00
parent c02839d46a
commit 64b50c02d2
1 changed files with 26 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
app/src/frontend/multi-edit.js
View File

@ -5,6 +5,7 @@ import PropTypes from 'prop-types';
import Sidebar from './sidebar';
import CONFIG from './fields-config.json';
import InfoBox from './info-box';
const MultiEdit = (props) => {
if (!props.user){
@ -15,15 +16,18 @@ const MultiEdit = (props) => {
// special case for likes
return (
<Sidebar
title='Quick like'
title='Quick edit'
back={`/edit/${cat}.html`}>
<section className='data-section'>
<p className='data-intro'>Click all the buildings that you like and think contribute to the city!</p>
<header className={`section-header view ${cat} active`}>
<a><h3 className="h3">Like me!</h3></a>
</header>
<form className='buttons-container'>
<InfoBox msg='Click all the buildings that you like and think contribute to the city!' />
<div className='buttons-container ml-3 mr-3'>
<Link to='/view/like.html' className='btn btn-secondary'>Back to view</Link>
<Link to='/edit/like.html' className='btn btn-secondary'>Back to edit</Link>
</div>
</form>
</section>
</Sidebar>
);
@ -31,18 +35,22 @@ const MultiEdit = (props) => {
const q = parse(props.location.search);
const label = fieldTitleFromSlug(q.k);
const title = sectionTitleFromCat(cat);
return (
<Sidebar
title='Quick edit'
back={`/edit/${cat}.html`}>
<section className='data-section'>
<p className='data-intro'>Click a building to colour</p>
<p className='data-intro'>Set <strong>{label}</strong> to <strong>{q.v}</strong></p>
<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>
<form className='buttons-container'>
<InfoBox msg='Click buildings to colour' />
<div className='buttons-container ml-3'>
<Link to={`/view/${cat}.html`} className='btn btn-secondary'>Back to view</Link>
<Link to={`/edit/${cat}.html`} className='btn btn-secondary'>Back to edit</Link>
</div>
</form>
</section>
</Sidebar>
);
@ -54,6 +62,16 @@ MultiEdit.propTypes = {
location: PropTypes.object
}
function sectionTitleFromCat(cat) {
for (let index = 0; index < CONFIG.length; index++) {
const section = CONFIG[index];
if (section.slug === cat) {
return section.title
}
}
return undefined
}
function fieldTitleFromSlug(slug) {
const fields = CONFIG.reduce(
(prev, section) => {