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

Support turning property into zoom func #52

Browse source
This commit is contained in:
Lukas Martinelli 2017-01-09 16:08:22 +01:00
parent 887b23ce1f
commit cfeaf2cdce
2 changed files with 41 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -28,7 +28,7 @@
"lodash.throttle": "^4.1.1",
"lodash.topairs": "^4.3.0",
"mapbox-gl": "^0.29.0",
"mapbox-gl-inspect": "^1.0.7",
"mapbox-gl-inspect": "^1.0.8",
"mapbox-gl-style-spec": "^8.11.0",
"mousetrap": "^1.6.0",
"ol-mapbox-style": "0.0.11",

50
src/components/fields/ZoomSpecField.jsx
View file

@ -8,6 +8,7 @@ import DocLabel from './DocLabel'
import AddIcon from 'react-icons/lib/md/add-circle-outline'
import DeleteIcon from 'react-icons/lib/md/delete'
import FunctionIcon from 'react-icons/lib/md/functions'
import capitalize from 'lodash.capitalize'
import input from '../../config/input.js'
@ -64,6 +65,16 @@ export default class ZoomSpecField extends React.Component {
this.props.onChange(this.props.fieldName, changedValue)
}
makeZoomFunction() {
const zoomFunc = {
stops: [
[6, this.props.value],
[10, this.props.value]
]
}
this.props.onChange(this.props.fieldName, zoomFunc)
}
changeStop(changeIdx, zoomLevel, value) {
const stops = this.props.value.stops.slice(0)
stops[changeIdx] = [zoomLevel, value]
@ -75,15 +86,15 @@ export default class ZoomSpecField extends React.Component {
}
render() {
let label = <DocLabel
label={labelFromFieldName(this.props.fieldName)}
doc={this.props.fieldSpec.doc}
style={{
width: '50%',
}}
/>
if(isZoomField(this.props.value)) {
let label = <DocLabel
label={labelFromFieldName(this.props.fieldName)}
doc={this.props.fieldSpec.doc}
style={{
width: '50%',
}}
/>
const zoomFields = this.props.value.stops.map((stop, idx) => {
label = <DocLabel
doc={this.props.fieldSpec.doc}
@ -143,9 +154,28 @@ export default class ZoomSpecField extends React.Component {
{zoomFields}
</div>
} else {
if(this.props.fieldSpec['zoom-function']) {
}
return <div style={input.property}>
{label}
<SpecField {...this.props} style={{ width: '50%' } }/>
<DocLabel
label={labelFromFieldName(this.props.fieldName)}
doc={this.props.fieldSpec.doc}
style={{
width: this.props.fieldSpec['zoom-function'] ? '42.25%' : '50%',
}}
/>
{this.props.fieldSpec['zoom-function'] &&
<Button
style={{backgroundColor: null}}
onClick={this.makeZoomFunction.bind(this)}
>
<FunctionIcon />
</Button>
}
<SpecField {...this.props} style={{ width: '47%' } }/>
</div>
}
}