schnabu/maputnik
1
0
Fork 0
mirror of https://github.com/a-nyx/maputnik-with-pmtiles.git synced 2024-11-10 12:17:46 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Handle data functions without zoom

Browse source
This commit is contained in:
pjsier 2018-04-15 17:08:54 -05:00
parent b60df8b074
commit 3d4579288c
2 changed files with 14 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/components/fields/_DataProperty.jsx
View file

@ -51,7 +51,8 @@ export default class DataProperty extends React.Component {
changeStop(changeIdx, stopData, value) {
const stops = this.props.value.stops.slice(0)
stops[changeIdx] = [stopData, value]
const changedStop = stopData.zoom === undefined ? stopData.value : stopData
stops[changeIdx] = [changedStop, value]
const changedValue = {
...this.props.value,
stops: stops,
@ -75,8 +76,8 @@ export default class DataProperty extends React.Component {
}
const dataFields = this.props.value.stops.map((stop, idx) => {
const zoomLevel = stop[0].zoom
const dataLevel = stop[0].value
const zoomLevel = typeof stop[0] === 'object' ? stop[0].zoom : undefined;
const dataLevel = typeof stop[0] === 'object' ? stop[0].value : stop[0];
const value = stop[1]
const deleteStopBtn = <DeleteStopButton onClick={this.props.onDeleteStop.bind(this, idx)} />
@ -94,8 +95,9 @@ export default class DataProperty extends React.Component {
dataInput = <NumberInput {...dataProps} />
}
return <InputBlock key={idx} action={deleteStopBtn} label="">
<div className="maputnik-data-spec-property-stop-edit">
let zoomInput = null;
if(zoomLevel !== undefined) {
zoomInput = <div className="maputnik-data-spec-property-stop-edit">
<NumberInput
value={zoomLevel}
onChange={newZoom => this.changeStop(idx, {zoom: newZoom, value: dataLevel}, value)}
@ -103,6 +105,10 @@ export default class DataProperty extends React.Component {
max={22}
/>
</div>
}
return <InputBlock key={idx} action={deleteStopBtn} label="">
{zoomInput}
<div className="maputnik-data-spec-property-stop-data">
{dataInput}
</div>

3
src/styles/_zoomproperty.scss
View file

@ -129,6 +129,9 @@
}
.maputnik-data-spec-property-stop-data {
width: 100%;
}
.maputnik-data-spec-property-stop-edit + .maputnik-data-spec-property-stop-data {
width: 78%;
}
}