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

Add <DynamicArrayInput/> to source tile urls to support multiple values.

Browse source
This commit is contained in:
orangemug 2020-04-25 11:38:13 +01:00
parent 1d48ab7ecf
commit 8e6c54564b
2 changed files with 21 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/components/inputs/DynamicArrayInput.jsx
View file

@ -7,6 +7,7 @@ import {MdDelete} from 'react-icons/md'
import DocLabel from '../fields/DocLabel' import DocLabel from '../fields/DocLabel'
import EnumInput from '../inputs/SelectInput' import EnumInput from '../inputs/SelectInput'
import capitalize from 'lodash.capitalize' import capitalize from 'lodash.capitalize'
import UrlInput from '../inputs/UrlInput'
class DynamicArrayInput extends React.Component { class DynamicArrayInput extends React.Component {
@ -35,6 +36,9 @@ class DynamicArrayInput extends React.Component {
if (this.props.type === 'number') { if (this.props.type === 'number') {
values.push(0) values.push(0)
} }
else if (this.props.type === 'url') {
values.push("");
}
else if (this.props.type === 'enum') { else if (this.props.type === 'enum') {
const {fieldSpec} = this.props; const {fieldSpec} = this.props;
const defaultValue = Object.keys(fieldSpec.values)[0]; const defaultValue = Object.keys(fieldSpec.values)[0];
@ -57,7 +61,13 @@ class DynamicArrayInput extends React.Component {
const inputs = this.values.map((v, i) => { const inputs = this.values.map((v, i) => {
const deleteValueBtn= <DeleteValueButton onClick={this.deleteValue.bind(this, i)} /> const deleteValueBtn= <DeleteValueButton onClick={this.deleteValue.bind(this, i)} />
let input; let input;
if (this.props.type === 'number') { if(this.props.type === 'url') {
input = <UrlInput
value={v}
onChange={this.changeValue.bind(this, i)}
/>
}
else if (this.props.type === 'number') {
input = <NumberInput input = <NumberInput
value={v} value={v}
onChange={this.changeValue.bind(this, i)} onChange={this.changeValue.bind(this, i)}

24
src/components/sources/SourceTypeEditor.jsx
View file

@ -41,26 +41,22 @@ class TileURLSourceEditor extends React.Component {
children: PropTypes.node, children: PropTypes.node,
} }
changeTileUrl(idx, value) { changeTileUrls(tiles) {
const tiles = this.props.source.tiles.slice(0)
tiles[idx] = value
this.props.onChange({ this.props.onChange({
...this.props.source, ...this.props.source,
tiles: tiles tiles,
}) })
} }
renderTileUrls() { renderTileUrls() {
const prefix = ['1st', '2nd', '3rd', '4th', '5th', '6th', '7th'] const tiles = this.props.source.tiles || [];
const tiles = this.props.source.tiles || [] return <InputBlock label={"Tile URL"} fieldSpec={latest.source_vector.tiles}>
return tiles.map((tileUrl, tileIndex) => { <DynamicArrayInput
return <InputBlock key={tileIndex} label={prefix[tileIndex] + " Tile URL"} fieldSpec={latest.source_vector.tiles}> type="url"
<UrlInput value={tiles}
value={tileUrl} onChange={this.changeTileUrls.bind(this)}
onChange={this.changeTileUrl.bind(this, tileIndex)} />
/> </InputBlock>
</InputBlock>
})
} }
render() { render() {