diff --git a/src/app.jsx b/src/app.jsx
index 9f80c6b..f28214b 100644
--- a/src/app.jsx
+++ b/src/app.jsx
@@ -5,7 +5,7 @@ import { Drawer, Container, Block, Fixed } from 'rebass'
import {Map} from './map.jsx'
import {Toolbar} from './toolbar.jsx'
import { StyleManager } from './style.js'
-import { StyleStore } from './stylestore.js'
+import { SettingsStore, StyleStore } from './stylestore.js'
import { WorkspaceDrawer } from './workspace.jsx'
import theme from './theme.js'
@@ -19,7 +19,9 @@ export default class App extends React.Component {
constructor(props) {
super(props)
this.styleStore = new StyleStore()
+ this.settingsStore = new SettingsStore()
this.state = {
+ accessToken: this.settingsStore.accessToken,
workContext: "layers",
currentStyle: this.styleStore.latestStyle(),
}
@@ -62,6 +64,11 @@ export default class App extends React.Component {
this.setState({ workContext: "layers", })
}
+ onAccessTokenChanged(newToken) {
+ this.settingsStore.accessToken = newToken
+ this.setState({ accessToken: newToken })
+ }
+
render() {
return
+
-
}
}
diff --git a/src/map.jsx b/src/map.jsx
index 126e59f..9dd52f0 100644
--- a/src/map.jsx
+++ b/src/map.jsx
@@ -7,13 +7,17 @@ import Immutable from 'immutable'
export class Map extends React.Component {
static propTypes = {
mapStyle: React.PropTypes.instanceOf(Immutable.Map).isRequired,
+ accessToken: React.PropTypes.string,
}
componentWillReceiveProps(nextProps) {
+ const tokenChanged = nextProps.accessToken !== MapboxGl.accessToken
+
// If the id has changed a new style has been uplaoded and
// it is safer to do a full new render
const mapIdChanged = this.props.mapStyle.get('id') !== nextProps.mapStyle.get('id')
- if(mapIdChanged) {
+
+ if(mapIdChanged || tokenChanged) {
this.state.map.setStyle(nextProps.mapStyle.toJS())
return
}
@@ -36,8 +40,7 @@ export class Map extends React.Component {
}
componentDidMount() {
- //TODO: Read MapboxGL token from settings
- MapboxGl.accessToken = "pk.eyJ1IjoibW9yZ2Vua2FmZmVlIiwiYSI6IjIzcmN0NlkifQ.0LRTNgCc-envt9d5MzR75w";
+ MapboxGl.accessToken = this.props.accessToken
const map = new MapboxGl.Map({
container: this.container,
diff --git a/src/settings.jsx b/src/settings.jsx
index 464dcdb..8c607a0 100644
--- a/src/settings.jsx
+++ b/src/settings.jsx
@@ -7,7 +7,9 @@ import Immutable from 'immutable'
export class SettingsEditor extends React.Component {
static propTypes = {
mapStyle: React.PropTypes.instanceOf(Immutable.Map).isRequired,
- onStyleChanged: React.PropTypes.func.isRequired
+ onStyleChanged: React.PropTypes.func.isRequired,
+ accessToken: React.PropTypes.string,
+ onAccessTokenChanged: React.PropTypes.func
}
onChange(property, e) {
@@ -23,6 +25,12 @@ export class SettingsEditor extends React.Component {
+ this.props.onAccessTokenChanged(e.target.value)}
+ />
}