ashatora/editor
1
0
Fork 0
mirror of https://github.com/maputnik/editor.git synced 2026-01-06 05:20:01 +00:00
Code Issues Projects Releases Wiki Activity

Work on selecting source type before adding

Browse Source
This commit is contained in:
Lukas Martinelli
2016-12-21 19:59:37 +01:00
parent 6c69a91f2f
commit 57ab4be42c
3 changed files with 76 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/sources/SourceTypeEditor.jsx
View File

@@ -5,12 +5,14 @@ import StringInput from '../inputs/StringInput'
class TileJSONSourceEditor extends React.Component {
static propTypes = {
url: React.PropTypes.string.isRequired,
onChange: React.PropTypes.func.isRequired,
}
render() {
return <InputBlock label={"TileJSON URL"}>
<StringInput
value={this.props.url}
onChange={this.props.onChange}
/>
</InputBlock>
}
@@ -21,26 +23,24 @@ class TileURLSourceEditor extends React.Component {
tiles: React.PropTypes.array.isRequired,
minZoom: React.PropTypes.number.isRequired,
maxZoom: React.PropTypes.number.isRequired,
onChange: React.PropTypes.func.isRequired,
}
renderTileUrls() {
const prefix = ['1st', '2nd', '3rd', '4th', '5th', '6th', '7th']
return this.props.tiles.map((tileUrl, tileIndex) => {
<InputBlock key={tileIndex} label={"Tile URL " + tileIndex}>
return <InputBlock key={tileIndex} label={prefix[tileIndex] + " Tile URL"}>
<StringInput
value={this.props.data}
value={tileUrl}
/>
</InputBlock>
})
}
render() {
console.log(this.props.tiles)
return <div>
{this.renderTileUrls()}
<InputBlock label={"GeoJSON Data"}>
<StringInput
value={this.props.data}
/>
</InputBlock>
<InputBlock label={"Min Zoom"}>
<StringInput
value={this.props.minZoom}
@@ -59,12 +59,14 @@ class TileURLSourceEditor extends React.Component {
class GeoJSONSourceEditor extends React.Component {
static propTypes = {
data: React.PropTypes.string.isRequired,
onChange: React.PropTypes.func.isRequired,
}
render() {
return <InputBlock label={"GeoJSON Data"}>
<StringInput
value={this.props.data}
onChange={this.props.onChange}
/>
</InputBlock>
}
@@ -72,22 +74,19 @@ class GeoJSONSourceEditor extends React.Component {
class SourceTypeEditor extends React.Component {
static propTypes = {
mode: React.PropTypes.string.isRequired,
source: React.PropTypes.object.isRequired,
onChange: React.PropTypes.func.isRequired,
}
render() {
const source = this.props.source
if(source.type === "geojson") {
return <GeoJSONSourceEditor data={source.data} />
switch(this.props.mode) {
case 'geojson': return <GeoJSONSourceEditor data={source.data || 'http://localhost:3000/mygeojson.json'} />
case 'tilejson': return <TileJSONSourceEditor url={source.url || 'http://localhost:3000/tiles.json'}/>
case 'tilexyz': return <TileURLSourceEditor tiles={source.tiles || ['http://localhost:3000/{x}/{y}/{z}.pbf']} minZoom={source.minZoom || 0} maxZoom={source.maxZoom || 14}/>
default: return null
}
if(source.type === "vector") {
if(source.url) {
return <TileJSONSourceEditor url={source.url}/>
} else {
return <TileURLSourceEditor tiles={source.tiles} minZoom={source.minZoom} maxZoom={source.maxZoom}/>
}
}
return null
}
}