schnabu/maputnik
1
0
Fork 0
mirror of https://github.com/a-nyx/maputnik-with-pmtiles.git synced 2025-01-15 09:31:22 +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) { changeStop(changeIdx, stopData, value) {
const stops = this.props.value.stops.slice(0) 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 = { const changedValue = {
...this.props.value, ...this.props.value,
stops: stops, stops: stops,
@ -75,8 +76,8 @@ export default class DataProperty extends React.Component {
} }
const dataFields = this.props.value.stops.map((stop, idx) => { const dataFields = this.props.value.stops.map((stop, idx) => {
const zoomLevel = stop[0].zoom const zoomLevel = typeof stop[0] === 'object' ? stop[0].zoom : undefined;
const dataLevel = stop[0].value const dataLevel = typeof stop[0] === 'object' ? stop[0].value : stop[0];
const value = stop[1] const value = stop[1]
const deleteStopBtn = <DeleteStopButton onClick={this.props.onDeleteStop.bind(this, idx)} /> const deleteStopBtn = <DeleteStopButton onClick={this.props.onDeleteStop.bind(this, idx)} />
@ -94,8 +95,9 @@ export default class DataProperty extends React.Component {
dataInput = <NumberInput {...dataProps} /> dataInput = <NumberInput {...dataProps} />
} }
return <InputBlock key={idx} action={deleteStopBtn} label=""> let zoomInput = null;
<div className="maputnik-data-spec-property-stop-edit"> if(zoomLevel !== undefined) {
zoomInput = <div className="maputnik-data-spec-property-stop-edit">
<NumberInput <NumberInput
value={zoomLevel} value={zoomLevel}
onChange={newZoom => this.changeStop(idx, {zoom: newZoom, value: dataLevel}, value)} onChange={newZoom => this.changeStop(idx, {zoom: newZoom, value: dataLevel}, value)}
@ -103,6 +105,10 @@ export default class DataProperty extends React.Component {
max={22} max={22}
/> />
</div> </div>
}
return <InputBlock key={idx} action={deleteStopBtn} label="">
{zoomInput}
<div className="maputnik-data-spec-property-stop-data"> <div className="maputnik-data-spec-property-stop-data">
{dataInput} {dataInput}
</div> </div>

3
src/styles/_zoomproperty.scss
View file

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