diff --git a/package.json b/package.json index e2d6f73..b18398f 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,8 @@ "react-height": "^2.1.1", "react-icons": "^2.2.1", "react-motion": "^0.4.4", - "rebass": "^0.3.1" + "rebass": "^0.3.1", + "request": "^2.79.0" }, "babel": { "presets": [ diff --git a/src/apistore.js b/src/apistore.js new file mode 100644 index 0000000..21502a2 --- /dev/null +++ b/src/apistore.js @@ -0,0 +1,42 @@ +import request from 'request' +import style from './style.js' + +// Empty style is always used if no style could be restored or fetched +export const emptyStyle = style.ensureMetadataExists(style.fromJSON({ + version: 8, + sources: {}, + layers: [], +})) + +export class ApiStyleStore { + latestStyle(cb) { + if(this.latestStyleId) { + request('http://localhost:8000/styles/' + this.latestStyleId, (error, response, body) => { + cb(JSON.parse(body)) + }) + } else { + request('http://localhost:8000/styles', (error, response, body) => { + if (!error && response.statusCode == 200) { + const styleIds = JSON.parse(body); + this.latestStyleId = styleIds[0]; + request('http://localhost:8000/styles/' + this.latestStyleId, (error, response, body) => { + cb(style.fromJSON(JSON.parse(body))) + }) + } + }) + } + } + + // Save current style replacing previous version + save(mapStyle) { + const id = mapStyle.get('id') + request.put({ + url: 'http://localhost:8000/styles/' + id, + json: true, + body: style.toJSON(mapStyle) + }, (error, response, body) => { + console.log('Saved style'); + }) + return mapStyle + } +} diff --git a/src/app.jsx b/src/app.jsx index 85a9d09..d77235a 100644 --- a/src/app.jsx +++ b/src/app.jsx @@ -9,7 +9,8 @@ import Fixed from 'rebass/dist/Fixed' import { Map } from './map.jsx' import {Toolbar} from './toolbar.jsx' import style from './style.js' -import { loadDefaultStyle, SettingsStore, StyleStore } from './stylestore.js' +import { loadDefaultStyle, SettingsStore } from './stylestore.js' +import { emptyStyle, ApiStyleStore } from './apistore.js' import { WorkspaceDrawer } from './workspace.jsx' import theme from './theme.js' @@ -23,16 +24,22 @@ export default class App extends React.Component { constructor(props) { super(props) - this.styleStore = new StyleStore() + this.styleStore = new ApiStyleStore() this.settingsStore = new SettingsStore() this.state = { accessToken: this.settingsStore.accessToken, workContext: "layers", - currentStyle: this.styleStore.latestStyle(), + currentStyle: emptyStyle } + + this.styleStore.latestStyle(mapStyle => { + this.onStyleUpload(mapStyle) + }) + /* if(this.state.currentStyle.get('layers').size === 0) { loadDefaultStyle(mapStyle => this.onStyleUpload(mapStyle)) } + */ } onReset() { @@ -62,6 +69,7 @@ export default class App extends React.Component { onStyleSave() { const snapshotStyle = this.state.currentStyle.set('modified', new Date().toJSON()) this.setState({ currentStyle: snapshotStyle }) + console.log('Save') this.styleStore.save(snapshotStyle) } diff --git a/src/map.jsx b/src/map.jsx index df3969e..e6634c0 100644 --- a/src/map.jsx +++ b/src/map.jsx @@ -12,14 +12,15 @@ export class Map extends React.Component { } componentWillReceiveProps(nextProps) { - const tokenChanged = nextProps.accessToken !== MapboxGl.accessToken + const hasTokenChanged = nextProps.accessToken !== MapboxGl.accessToken + MapboxGl.accessToken = nextProps.accessToken // If the id has changed a new style has been uplaoded and // it is safer to do a full new render // TODO: might already be handled in diff algorithm? const mapIdChanged = this.props.mapStyle.get('id') !== nextProps.mapStyle.get('id') - if(mapIdChanged || tokenChanged) { + if(mapIdChanged || hasTokenChanged) { this.state.map.setStyle(style.toJSON(nextProps.mapStyle)) return } diff --git a/webpack.config.js b/webpack.config.js index 1159966..97d14a4 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -62,7 +62,9 @@ module.exports = { }] }, node: { - fs: "empty" + fs: "empty", + net: 'empty', + tls: 'empty' }, devServer: { contentBase: "./public",