mirror of
https://github.com/a-nyx/maputnik-with-pmtiles.git
synced 2024-12-27 23:35:23 +01:00
Merge pull request #667 from orangemug/fix/issue-656
Support multiple tiles URLs for source
This commit is contained in:
commit
a191c36f96
2 changed files with 23 additions and 17 deletions
|
@ -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)}
|
||||||
|
|
|
@ -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() {
|
||||||
|
@ -108,7 +104,7 @@ class ImageSourceEditor extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
return <div>
|
return <div>
|
||||||
<InputBlock label={"Image URL"} doc={latest.source_image.url.doc}>
|
<InputBlock label={"Image URL"} fieldSpec={latest.source_image.url}>
|
||||||
<UrlInput
|
<UrlInput
|
||||||
value={this.props.source.url}
|
value={this.props.source.url}
|
||||||
onChange={url => this.props.onChange({
|
onChange={url => this.props.onChange({
|
||||||
|
@ -159,7 +155,7 @@ class VideoSourceEditor extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
return <div>
|
return <div>
|
||||||
<InputBlock label={"Video URL"} doc={latest.source_video.urls.doc}>
|
<InputBlock label={"Video URL"} fieldSpec={latest.source_video.urls}>
|
||||||
<DynamicArrayInput
|
<DynamicArrayInput
|
||||||
type="string"
|
type="string"
|
||||||
value={this.props.source.urls}
|
value={this.props.source.urls}
|
||||||
|
|
Loading…
Reference in a new issue