Support resetting styles

This commit is contained in:
lukasmartinelli 2016-09-21 08:34:48 +02:00
parent 9d4053dd78
commit 442a7f612c
4 changed files with 24 additions and 1 deletions

View file

@ -34,6 +34,11 @@ export default class App extends React.Component {
} }
} }
onReset() {
this.styleStore.purge()
loadDefaultStyle(mapStyle => this.onStyleUpload(mapStyle))
}
getChildContext() { getChildContext() {
return { return {
rebass: theme, rebass: theme,
@ -98,6 +103,7 @@ export default class App extends React.Component {
/> />
<WorkspaceDrawer <WorkspaceDrawer
onStyleChanged={this.onStyleChanged.bind(this)} onStyleChanged={this.onStyleChanged.bind(this)}
onReset={this.onReset.bind(this)}
workContext={this.state.workContext} workContext={this.state.workContext}
mapStyle={this.state.currentStyle} mapStyle={this.state.currentStyle}
accessToken={this.state.accessToken} accessToken={this.state.accessToken}

View file

@ -7,6 +7,7 @@ import Input from 'rebass/dist/Input'
import Toolbar from 'rebass/dist/Toolbar' import Toolbar from 'rebass/dist/Toolbar'
import NavItem from 'rebass/dist/NavItem' import NavItem from 'rebass/dist/NavItem'
import Space from 'rebass/dist/Space' import Space from 'rebass/dist/Space'
import Button from 'rebass/dist/Button'
import Immutable from 'immutable' import Immutable from 'immutable'
import PureRenderMixin from 'react-addons-pure-render-mixin'; import PureRenderMixin from 'react-addons-pure-render-mixin';
@ -17,7 +18,8 @@ export class SettingsEditor extends React.Component {
mapStyle: React.PropTypes.instanceOf(Immutable.Map).isRequired, mapStyle: React.PropTypes.instanceOf(Immutable.Map).isRequired,
onStyleChanged: React.PropTypes.func.isRequired, onStyleChanged: React.PropTypes.func.isRequired,
accessToken: React.PropTypes.string, accessToken: React.PropTypes.string,
onAccessTokenChanged: React.PropTypes.func onAccessTokenChanged: React.PropTypes.func,
onReset: React.PropTypes.func
} }
constructor(props) { constructor(props) {
@ -68,6 +70,9 @@ export class SettingsEditor extends React.Component {
value={this.props.mapStyle.get('glyphs')} value={this.props.mapStyle.get('glyphs')}
onChange={this.onChange.bind(this, "glyphs")} onChange={this.onChange.bind(this, "glyphs")}
/> />
<Button
onClick={this.props.onReset}
>Reset style</Button>
</Container> </Container>
</div> </div>
} }

View file

@ -91,6 +91,16 @@ export class StyleStore {
this.mapStyles = loadStoredStyles() this.mapStyles = loadStoredStyles()
} }
// Delete entire style history
purge() {
for (let i = 0; i < window.localStorage.length; i++) {
const key = window.localStorage.key(i)
if(key.startsWith(storagePrefix)) {
window.localStorage.removeItem(key)
}
}
}
// Find the last edited style // Find the last edited style
latestStyle() { latestStyle() {
if(this.mapStyles.length === 0) return emptyStyle if(this.mapStyles.length === 0) return emptyStyle

View file

@ -14,6 +14,7 @@ export class WorkspaceDrawer extends React.Component {
workContext: React.PropTypes.oneOf(['layers', 'settings', 'sources']).isRequired, workContext: React.PropTypes.oneOf(['layers', 'settings', 'sources']).isRequired,
accessToken: React.PropTypes.string, accessToken: React.PropTypes.string,
onAccessTokenChanged: React.PropTypes.func, onAccessTokenChanged: React.PropTypes.func,
onReset: React.PropTypes.func,
} }
onLayersChanged(changedLayers) { onLayersChanged(changedLayers) {
@ -39,6 +40,7 @@ export class WorkspaceDrawer extends React.Component {
if(this.props.workContext === "settings") { if(this.props.workContext === "settings") {
workspaceContent = <SettingsEditor workspaceContent = <SettingsEditor
onReset={this.props.onReset}
onStyleChanged={this.props.onStyleChanged} onStyleChanged={this.props.onStyleChanged}
mapStyle={this.props.mapStyle} mapStyle={this.props.mapStyle}
accessToken={this.props.accessToken} accessToken={this.props.accessToken}