Merge pull request #205 from orangemug/fix/fetch-sources-get-called-on-each-change

Fix to stop fetchSources getting called on each change
This commit is contained in:
Orange Mug 2017-11-30 07:31:32 +00:00 committed by GitHub
commit 4dc8fc9696
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -19,6 +19,7 @@ import { ApiStyleStore } from '../libs/apistore'
import { RevisionStore } from '../libs/revisions' import { RevisionStore } from '../libs/revisions'
import LayerWatcher from '../libs/layerwatcher' import LayerWatcher from '../libs/layerwatcher'
import tokens from '../config/tokens.json' import tokens from '../config/tokens.json'
import isEqual from 'lodash.isequal'
function updateRootSpec(spec, fieldName, newValues) { function updateRootSpec(spec, fieldName, newValues) {
return { return {
@ -185,15 +186,19 @@ export default class App extends React.Component {
} }
fetchSources() { fetchSources() {
const sourceList = {}; const sourceList = {...this.state.sources};
for(let [key, val] of Object.entries(this.state.mapStyle.sources)) { for(let [key, val] of Object.entries(this.state.mapStyle.sources)) {
if(sourceList.hasOwnProperty(key)) {
continue;
}
sourceList[key] = { sourceList[key] = {
type: val.type, type: val.type,
layers: [] layers: []
}; };
if(val.type === "vector") { if(!this.state.sources.hasOwnProperty(key) && val.type === "vector") {
const url = val.url; const url = val.url;
fetch(url) fetch(url)
.then((response) => { .then((response) => {
@ -201,15 +206,15 @@ export default class App extends React.Component {
}) })
.then((json) => { .then((json) => {
// Create new objects before setState // Create new objects before setState
const sourceList = {...this.state.sources}; const sources = Object.assign({}, this.state.sources);
sourceList[key] = {...sourceList[key]};
for(let layer of json.vector_layers) { for(let layer of json.vector_layers) {
sourceList[key].layers.push(layer.id) sources[key].layers.push(layer.id)
} }
console.debug("Updating source: "+key);
this.setState({ this.setState({
sources: sourceList sources: sources
}); });
}) })
.catch((err) => { .catch((err) => {
@ -218,11 +223,12 @@ export default class App extends React.Component {
} }
} }
// Note: Each source will be missing layers initially until the fetch is complete if(!isEqual(this.state.sources, sourceList)) {
this.setState({ console.debug("Setting sources");
sources: sourceList this.setState({
}) sources: sourceList
})
}
} }
mapRenderer() { mapRenderer() {