mirror of
https://github.com/a-nyx/maputnik-with-pmtiles.git
synced 2024-12-27 10:35:23 +01:00
Fix visibility toggle
This commit is contained in:
parent
f444ebf65d
commit
0693dc3d42
2 changed files with 20 additions and 6 deletions
|
@ -1,6 +1,8 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
|
import Immutable from 'immutable'
|
||||||
import { Toolbar, NavItem, Space} from 'rebass'
|
import { Toolbar, NavItem, Space} from 'rebass'
|
||||||
import Collapse from 'react-collapse'
|
import Collapse from 'react-collapse'
|
||||||
|
|
||||||
import theme from '../theme.js'
|
import theme from '../theme.js'
|
||||||
import FillLayer from './fill.jsx'
|
import FillLayer from './fill.jsx'
|
||||||
import LineLayer from './line.jsx'
|
import LineLayer from './line.jsx'
|
||||||
|
@ -46,12 +48,24 @@ export class LayerEditor extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
onPaintChanged(property, newValue) {
|
onPaintChanged(property, newValue) {
|
||||||
const changedLayer = this.props.layer.setIn(['paint', property], newValue)
|
let layer = this.props.layer
|
||||||
|
//TODO: by using immutable records we can avoid this checking if object exists
|
||||||
|
if(!layer.has('paint')) {
|
||||||
|
layer = layer.set('paint', Immutable.Map())
|
||||||
|
}
|
||||||
|
|
||||||
|
const changedLayer = layer.setIn(['paint', property], newValue)
|
||||||
this.props.onLayerChanged(changedLayer)
|
this.props.onLayerChanged(changedLayer)
|
||||||
}
|
}
|
||||||
|
|
||||||
onLayoutChanged(property, newValue) {
|
onLayoutChanged(property, newValue) {
|
||||||
const changedLayer = this.props.layer.setIn(['layout', property], newValue)
|
let layer = this.props.layer
|
||||||
|
//TODO: by using immutable records we can avoid this checking if object exists
|
||||||
|
if(!layer.has('layout')) {
|
||||||
|
layer = layer.set('layout', Immutable.Map())
|
||||||
|
}
|
||||||
|
|
||||||
|
const changedLayer = layer.setIn(['layout', property], newValue)
|
||||||
this.props.onLayerChanged(changedLayer)
|
this.props.onLayerChanged(changedLayer)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -86,7 +100,7 @@ export class LayerEditor extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
toggleVisibility() {
|
toggleVisibility() {
|
||||||
if(this.props.layer.layout.visibility === 'none') {
|
if(this.props.layer.has('layout') && this.props.layer.getIn(['layout', 'visibility']) === 'none') {
|
||||||
this.onLayoutChanged('visibility', 'visible')
|
this.onLayoutChanged('visibility', 'visible')
|
||||||
} else {
|
} else {
|
||||||
this.onLayoutChanged('visibility', 'none')
|
this.onLayoutChanged('visibility', 'none')
|
||||||
|
@ -95,7 +109,7 @@ export class LayerEditor extends React.Component {
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
let visibleIcon = <MdVisibilityOff />
|
let visibleIcon = <MdVisibilityOff />
|
||||||
if(this.props.layer.layout && this.props.layer.layout.visibility === 'none') {
|
if(this.props.layer.has('layout') && this.props.layer.getIn(['layout', 'visibility']) === 'none') {
|
||||||
visibleIcon = <MdVisibility />
|
visibleIcon = <MdVisibility />
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -72,10 +72,10 @@ function styleKey(styleId) {
|
||||||
|
|
||||||
// Ensure a style has a unique id and a created date
|
// Ensure a style has a unique id and a created date
|
||||||
function ensureOptionalStyleProps(mapStyle) {
|
function ensureOptionalStyleProps(mapStyle) {
|
||||||
if(!('id' in mapStyle)) {
|
if(!mapStyle.has('id')) {
|
||||||
mapStyle = mapStyle.set('id', Math.random().toString(36).substr(2, 9))
|
mapStyle = mapStyle.set('id', Math.random().toString(36).substr(2, 9))
|
||||||
}
|
}
|
||||||
if(!("created" in mapStyle)) {
|
if(!mapStyle.has('created')) {
|
||||||
mapStyle = mapStyle.set('created', new Date())
|
mapStyle = mapStyle.set('created', new Date())
|
||||||
}
|
}
|
||||||
return mapStyle
|
return mapStyle
|
||||||
|
|
Loading…
Reference in a new issue