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

Support visibility toggle

Browse source
This commit is contained in:
lukasmartinelli 2016-09-09 19:14:55 +02:00
parent bbf75876f3
commit 2978210a4d
1 changed files with 27 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
src/layers.jsx
View file

@ -2,7 +2,7 @@ import React from 'react'
import randomColor from 'randomcolor'
import { Block, ButtonCircle, Heading, Checkbox, Slider, Switch, Input, Panel, PanelHeader, Toolbar, NavItem, Tooltip, Container, Space} from 'rebass'
import { Button, Text } from 'rebass'
import {MdArrowDropDown, MdArrowDropUp, MdAddToPhotos, MdDelete, MdVisibilityOff} from 'react-icons/lib/md';
import {MdVisibility, MdArrowDropDown, MdArrowDropUp, MdAddToPhotos, MdDelete, MdVisibilityOff} from 'react-icons/lib/md';
import Collapse from 'react-collapse'
import theme from './theme.js'
import scrollbars from './scrollbars.scss'
@ -118,6 +118,16 @@ export class LayerPanel extends React.Component {
this.setState({ layer });
}
onLayoutChanged(property, newValue) {
let layer = this.state.layer
layer.layout[property] = newValue;
this.props.styleManager.changeStyle({
command: 'setLayoutProperty',
args: [layer.id, property, newValue]
})
this.setState({ layer });
}
toggleLayer() {
this.setState({isOpened: !this.state.isOpened})
}
@ -141,7 +151,21 @@ export class LayerPanel extends React.Component {
return <NoLayer />
}
toggleVisibility() {
console.log(this.state.layer)
if(this.state.layer.layout.visibility === 'none') {
this.onLayoutChanged('visibility', 'visible')
} else {
this.onLayoutChanged('visibility', 'none')
}
}
render() {
let visibleIcon = <MdVisibilityOff />
if(this.state.layer.layout && this.state.layer.layout.visibility === 'none') {
visibleIcon = <MdVisibility />
}
return <div style={{
padding: theme.scale[0],
borderBottom: 1,
@ -157,8 +181,8 @@ export class LayerPanel extends React.Component {
#{this.state.layer.id}
</NavItem>
<Space auto x={1} />
<NavItem>
<MdVisibilityOff />
<NavItem onClick={this.toggleVisibility.bind(this)}>
{visibleIcon}
</NavItem>
<NavItem>
<MdDelete />