From f444ebf65db1fee523473c2f1d83484e00e863c7 Mon Sep 17 00:00:00 2001 From: lukasmartinelli Date: Sat, 10 Sep 2016 16:37:41 +0200 Subject: [PATCH] Fetch basic default style on startup --- src/app.jsx | 8 ++++++-- src/stylestore.js | 32 +++++++++++++++++++++++++++----- 2 files changed, 33 insertions(+), 7 deletions(-) diff --git a/src/app.jsx b/src/app.jsx index f28214b..7a97d4e 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 { SettingsStore, StyleStore } from './stylestore.js' +import { loadDefaultStyle, SettingsStore, StyleStore } from './stylestore.js' import { WorkspaceDrawer } from './workspace.jsx' import theme from './theme.js' @@ -25,6 +25,10 @@ export default class App extends React.Component { workContext: "layers", currentStyle: this.styleStore.latestStyle(), } + + loadDefaultStyle(mapStyle => { + this.onStyleUpload(mapStyle) + }) } getChildContext() { @@ -35,10 +39,10 @@ export default class App extends React.Component { } onStyleDownload() { - this.styleStore.save(newStyle) const mapStyle = JSON.stringify(this.state.currentStyle.toJS(), null, 4) const blob = new Blob([mapStyle], {type: "application/json;charset=utf-8"}); saveAs(blob, mapStyle.id + ".json"); + this.onStyleSave(mapStyle) } onStyleUpload(newStyle) { diff --git a/src/stylestore.js b/src/stylestore.js index 99ea7c1..cf05e48 100644 --- a/src/stylestore.js +++ b/src/stylestore.js @@ -7,13 +7,37 @@ const storageKeys = { accessToken: [storagePrefix, 'access_token'].join('') } -const emptyStyle = { +// Empty style is always used if no style could be restored or fetched +const emptyStyle = ensureOptionalStyleProps(Immutable.fromJS({ version: 8, sources: {}, layers: [], +})) + +const defaultStyleUrl = "https://raw.githubusercontent.com/osm2vectortiles/mapbox-gl-styles/master/styles/basic-v9-cdn.json" + +// Fetch a default style via URL and return it or a fallback style via callback +export function loadDefaultStyle(cb) { + var request = new XMLHttpRequest(); + request.open('GET', defaultStyleUrl, true); + + request.onload = () => { + if (request.status >= 200 && request.status < 400) { + cb(Immutable.fromJS(JSON.parse(request.responseText))) + } else { + cb(emptyStyle) + } + }; + + request.onerror = function() { + console.log('Could not fetch default style') + cb(emptyStyle) + }; + + request.send(); } - // Return style ids and dates of all styles stored in local storage +// Return style ids and dates of all styles stored in local storage function loadStoredStyles() { const styles = [] for (let i = 0; i < localStorage.length; i++) { @@ -78,9 +102,7 @@ export class StyleStore { // Find the last edited style latestStyle() { - if(this.mapStyles.length == 0) { - return ensureOptionalStyleProps(Immutable.fromJS(emptyStyle)) - } + if(this.mapStyles.length == 0) return emptyStyle const styleId = window.localStorage.getItem(storageKeys.latest) const styleItem = window.localStorage.getItem(styleKey(styleId)) return Immutable.fromJS(JSON.parse(styleItem))