mirror of
https://github.com/a-nyx/maputnik-with-pmtiles.git
synced 2024-12-27 09:15:29 +01:00
Remove layer specific components
This commit is contained in:
parent
a52a548e51
commit
21bad041ab
5 changed files with 17 additions and 185 deletions
|
@ -1,37 +0,0 @@
|
|||
import React from 'react'
|
||||
import Immutable from 'immutable'
|
||||
import Input from 'rebass/dist/Input'
|
||||
import { PropertyGroup } from '../fields/spec'
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
|
||||
//TODO: All layers contain a lot of redundancy
|
||||
export default class BackgroundLayer extends React.Component {
|
||||
static propTypes = {
|
||||
layer: React.PropTypes.instanceOf(Immutable.Map).isRequired,
|
||||
onPaintChanged: React.PropTypes.func.isRequired,
|
||||
onLayoutChanged: React.PropTypes.func.isRequired,
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
|
||||
}
|
||||
|
||||
render() {
|
||||
return <div>
|
||||
<PropertyGroup
|
||||
onChange={this.props.onLayoutChanged.bind(this)}
|
||||
layerType="background"
|
||||
groupType="layout"
|
||||
properties={this.props.layer.get('layout', Immutable.Map())}
|
||||
/>
|
||||
<PropertyGroup
|
||||
onChange={this.props.onPaintChanged.bind(this)}
|
||||
layerType="background"
|
||||
groupType="paint"
|
||||
properties={this.props.layer.get('paint', Immutable.Map())}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
|
@ -7,14 +7,9 @@ import Space from 'rebass/dist/Space'
|
|||
import Tabs from 'react-simpletabs'
|
||||
|
||||
import theme from '../theme.js'
|
||||
import FillLayer from './fill.jsx'
|
||||
import LineLayer from './line.jsx'
|
||||
import SymbolLayer from './symbol.jsx'
|
||||
import BackgroundLayer from './background.jsx'
|
||||
import SourceEditor from './source.jsx'
|
||||
import FilterEditor from '../filter/editor.jsx'
|
||||
|
||||
|
||||
import { PropertyGroup } from '../fields/spec.jsx'
|
||||
|
||||
import MdVisibility from 'react-icons/lib/md/visibility'
|
||||
import MdVisibilityOff from 'react-icons/lib/md/visibility-off'
|
||||
|
@ -90,42 +85,6 @@ export class LayerEditor extends React.Component {
|
|||
this.props.onLayerChanged(changedLayer)
|
||||
}
|
||||
|
||||
layerFromType(type) {
|
||||
if (type === "fill") {
|
||||
return <FillLayer
|
||||
layer={this.props.layer}
|
||||
onPaintChanged={this.onPaintChanged.bind(this)}
|
||||
onLayoutChanged={this.onLayoutChanged.bind(this)}
|
||||
/>
|
||||
}
|
||||
|
||||
if (type === "background") {
|
||||
return <BackgroundLayer
|
||||
layer={this.props.layer}
|
||||
onPaintChanged={this.onPaintChanged.bind(this)}
|
||||
onLayoutChanged={this.onLayoutChanged.bind(this)}
|
||||
/>
|
||||
}
|
||||
|
||||
if (type === "line") {
|
||||
return <LineLayer
|
||||
layer={this.props.layer}
|
||||
onPaintChanged={this.onPaintChanged.bind(this)}
|
||||
onLayoutChanged={this.onLayoutChanged.bind(this)}
|
||||
/>
|
||||
}
|
||||
|
||||
if (type === "symbol") {
|
||||
return <SymbolLayer
|
||||
layer={this.props.layer}
|
||||
onPaintChanged={this.onPaintChanged.bind(this)}
|
||||
onLayoutChanged={this.onLayoutChanged.bind(this)}
|
||||
/>
|
||||
}
|
||||
|
||||
return <UnsupportedLayer />
|
||||
}
|
||||
|
||||
toggleVisibility() {
|
||||
if(this.props.layer.has('layout') && this.props.layer.getIn(['layout', 'visibility']) === 'none') {
|
||||
this.onLayoutChanged('visibility', 'visible')
|
||||
|
@ -158,7 +117,22 @@ export class LayerEditor extends React.Component {
|
|||
<Tabs>
|
||||
<Tabs.Panel title='Paint'>
|
||||
<div style={{padding: theme.scale[2], paddingRight: 0, backgroundColor: theme.colors.black}}>
|
||||
{this.layerFromType(this.props.layer.get('type'))}
|
||||
<PropertyGroup
|
||||
onChange={this.onPaintChanged.bind(this)}
|
||||
layerType={this.props.layer.get('type')}
|
||||
groupType="paint"
|
||||
properties={this.props.layer.get('paint', Immutable.Map())}
|
||||
/>
|
||||
</div>
|
||||
</Tabs.Panel>
|
||||
<Tabs.Panel title='Layout'>
|
||||
<div style={{padding: theme.scale[2], paddingRight: 0, backgroundColor: theme.colors.black}}>
|
||||
<PropertyGroup
|
||||
onChange={this.onLayoutChanged.bind(this)}
|
||||
layerType={this.props.layer.get('type')}
|
||||
groupType="layout"
|
||||
properties={this.props.layer.get('layout', Immutable.Map())}
|
||||
/>
|
||||
</div>
|
||||
</Tabs.Panel>
|
||||
<Tabs.Panel title='Data'>
|
||||
|
|
|
@ -1,35 +0,0 @@
|
|||
import React from 'react'
|
||||
import Immutable from 'immutable'
|
||||
import { PropertyGroup } from '../fields/spec'
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
|
||||
//TODO: All layers contain a lot of redundancy
|
||||
export default class FillLayer extends React.Component {
|
||||
static propTypes = {
|
||||
layer: React.PropTypes.instanceOf(Immutable.Map).isRequired,
|
||||
onPaintChanged: React.PropTypes.func.isRequired,
|
||||
onLayoutChanged: React.PropTypes.func.isRequired,
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
|
||||
}
|
||||
|
||||
render() {
|
||||
return <div>
|
||||
<PropertyGroup
|
||||
onChange={this.props.onLayoutChanged.bind(this)}
|
||||
layerType="fill"
|
||||
groupType="layout"
|
||||
properties={this.props.layer.get('layout', Immutable.Map())}
|
||||
/>
|
||||
<PropertyGroup
|
||||
onChange={this.props.onPaintChanged.bind(this)}
|
||||
layerType="fill"
|
||||
groupType="paint"
|
||||
properties={this.props.layer.get('paint', Immutable.Map())}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
}
|
|
@ -1,35 +0,0 @@
|
|||
import React from 'react'
|
||||
import Immutable from 'immutable'
|
||||
import { PropertyGroup } from '../fields/spec'
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
|
||||
//TODO: All layers contain a lot of redundancy
|
||||
export default class LineLayer extends React.Component {
|
||||
static propTypes = {
|
||||
layer: React.PropTypes.instanceOf(Immutable.Map).isRequired,
|
||||
onPaintChanged: React.PropTypes.func.isRequired,
|
||||
onLayoutChanged: React.PropTypes.func.isRequired,
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
|
||||
}
|
||||
|
||||
render() {
|
||||
return <div>
|
||||
<PropertyGroup
|
||||
onChange={this.props.onLayoutChanged.bind(this)}
|
||||
layerType="line"
|
||||
groupType="layout"
|
||||
properties={this.props.layer.get('layout', Immutable.Map())}
|
||||
/>
|
||||
<PropertyGroup
|
||||
onChange={this.props.onPaintChanged.bind(this)}
|
||||
layerType="line"
|
||||
groupType="paint"
|
||||
properties={this.props.layer.get('paint', Immutable.Map())}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
}
|
|
@ -1,35 +0,0 @@
|
|||
import React from 'react'
|
||||
import Immutable from 'immutable'
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
import { PropertyGroup } from '../fields/spec'
|
||||
|
||||
//TODO: All layers contain a lot of redundancy
|
||||
export default class SymbolLayer extends React.Component {
|
||||
static propTypes = {
|
||||
layer: React.PropTypes.instanceOf(Immutable.Map).isRequired,
|
||||
onPaintChanged: React.PropTypes.func.isRequired,
|
||||
onLayoutChanged: React.PropTypes.func.isRequired,
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
|
||||
}
|
||||
|
||||
render() {
|
||||
return <div>
|
||||
<PropertyGroup
|
||||
onChange={this.props.onLayoutChanged.bind(this)}
|
||||
layerType="symbol"
|
||||
groupType="layout"
|
||||
properties={this.props.layer.get('layout', Immutable.Map())}
|
||||
/>
|
||||
<PropertyGroup
|
||||
onChange={this.props.onPaintChanged.bind(this)}
|
||||
layerType="symbol"
|
||||
groupType="paint"
|
||||
properties={this.props.layer.get('paint', Immutable.Map())}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue