mirror of
https://github.com/a-nyx/maputnik-with-pmtiles.git
synced 2024-12-28 17:21:18 +01:00
Fall back to local style store
And convert tabs to spaces in process
This commit is contained in:
parent
f7fabd1bc8
commit
e5c6af3fad
4 changed files with 225 additions and 221 deletions
|
@ -1,14 +1,13 @@
|
||||||
import request from 'request'
|
import request from 'request'
|
||||||
import style from './style.js'
|
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 {
|
export class ApiStyleStore {
|
||||||
|
supported(cb) {
|
||||||
|
request('http://localhost:8000/styles', (error, response, body) => {
|
||||||
|
cb(error === undefined)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
latestStyle(cb) {
|
latestStyle(cb) {
|
||||||
if(this.latestStyleId) {
|
if(this.latestStyleId) {
|
||||||
request('http://localhost:8000/styles/' + this.latestStyleId, (error, response, body) => {
|
request('http://localhost:8000/styles/' + this.latestStyleId, (error, response, body) => {
|
||||||
|
|
24
src/app.jsx
24
src/app.jsx
|
@ -9,8 +9,8 @@ import Fixed from 'rebass/dist/Fixed'
|
||||||
import { Map } from './map.jsx'
|
import { Map } from './map.jsx'
|
||||||
import {Toolbar} from './toolbar.jsx'
|
import {Toolbar} from './toolbar.jsx'
|
||||||
import style from './style.js'
|
import style from './style.js'
|
||||||
import { loadDefaultStyle, SettingsStore } from './stylestore.js'
|
import { loadDefaultStyle, SettingsStore, StyleStore } from './stylestore.js'
|
||||||
import { emptyStyle, ApiStyleStore } from './apistore.js'
|
import { ApiStyleStore } from './apistore.js'
|
||||||
import { WorkspaceDrawer } from './workspace.jsx'
|
import { WorkspaceDrawer } from './workspace.jsx'
|
||||||
|
|
||||||
import theme from './theme.js'
|
import theme from './theme.js'
|
||||||
|
@ -24,22 +24,22 @@ export default class App extends React.Component {
|
||||||
|
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props)
|
super(props)
|
||||||
|
|
||||||
this.styleStore = new ApiStyleStore()
|
this.styleStore = new ApiStyleStore()
|
||||||
|
this.styleStore.supported(isSupported => {
|
||||||
|
if(!isSupported) {
|
||||||
|
console.log('Falling back to local storage for storing styles')
|
||||||
|
this.styleStore = new StyleStore()
|
||||||
|
}
|
||||||
|
this.styleStore.latestStyle(mapStyle => this.onStyleUpload(mapStyle))
|
||||||
|
})
|
||||||
|
|
||||||
this.settingsStore = new SettingsStore()
|
this.settingsStore = new SettingsStore()
|
||||||
this.state = {
|
this.state = {
|
||||||
accessToken: this.settingsStore.accessToken,
|
accessToken: this.settingsStore.accessToken,
|
||||||
workContext: "layers",
|
workContext: "layers",
|
||||||
currentStyle: emptyStyle
|
currentStyle: style.emptyStyle
|
||||||
}
|
}
|
||||||
|
|
||||||
this.styleStore.latestStyle(mapStyle => {
|
|
||||||
this.onStyleUpload(mapStyle)
|
|
||||||
})
|
|
||||||
/*
|
|
||||||
if(this.state.currentStyle.get('layers').size === 0) {
|
|
||||||
loadDefaultStyle(mapStyle => this.onStyleUpload(mapStyle))
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onReset() {
|
onReset() {
|
||||||
|
|
|
@ -25,6 +25,13 @@ function fromJSON(jsonStyle) {
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Empty style is always used if no style could be restored or fetched
|
||||||
|
const emptyStyle = ensureMetadataExists(fromJSON({
|
||||||
|
version: 8,
|
||||||
|
sources: {},
|
||||||
|
layers: [],
|
||||||
|
}))
|
||||||
|
|
||||||
function ensureHasId(style) {
|
function ensureHasId(style) {
|
||||||
if(style.has('id')) return style
|
if(style.has('id')) return style
|
||||||
return style.set('id', Math.random().toString(36).substr(2, 9))
|
return style.set('id', Math.random().toString(36).substr(2, 9))
|
||||||
|
@ -81,4 +88,5 @@ export default {
|
||||||
fromJSON,
|
fromJSON,
|
||||||
diffStyles,
|
diffStyles,
|
||||||
ensureMetadataExists,
|
ensureMetadataExists,
|
||||||
|
emptyStyle,
|
||||||
}
|
}
|
||||||
|
|
|
@ -9,13 +9,6 @@ const storageKeys = {
|
||||||
accessToken: [storagePrefix, 'access_token'].join(':')
|
accessToken: [storagePrefix, 'access_token'].join(':')
|
||||||
}
|
}
|
||||||
|
|
||||||
// Empty style is always used if no style could be restored or fetched
|
|
||||||
const emptyStyle = style.ensureMetadataExists(style.fromJSON({
|
|
||||||
version: 8,
|
|
||||||
sources: {},
|
|
||||||
layers: [],
|
|
||||||
}))
|
|
||||||
|
|
||||||
const defaultStyleUrl = "https://raw.githubusercontent.com/osm2vectortiles/mapbox-gl-styles/master/styles/basic-v9-cdn.json"
|
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
|
// Fetch a default style via URL and return it or a fallback style via callback
|
||||||
export function loadDefaultStyle(cb) {
|
export function loadDefaultStyle(cb) {
|
||||||
|
@ -27,13 +20,13 @@ export function loadDefaultStyle(cb) {
|
||||||
if (request.status >= 200 && request.status < 400) {
|
if (request.status >= 200 && request.status < 400) {
|
||||||
cb(style.ensureMetadataExists(style.fromJSON(request.responseText)))
|
cb(style.ensureMetadataExists(style.fromJSON(request.responseText)))
|
||||||
} else {
|
} else {
|
||||||
cb(emptyStyle)
|
cb(style.emptyStyle)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
request.onerror = function() {
|
request.onerror = function() {
|
||||||
console.log('Could not fetch default style')
|
console.log('Could not fetch default style')
|
||||||
cb(emptyStyle)
|
cb(style.emptyStyle)
|
||||||
}
|
}
|
||||||
|
|
||||||
request.send()
|
request.send()
|
||||||
|
@ -91,6 +84,10 @@ export class StyleStore {
|
||||||
this.mapStyles = loadStoredStyles()
|
this.mapStyles = loadStoredStyles()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
supported(cb) {
|
||||||
|
cb(window.localStorage !== undefined)
|
||||||
|
}
|
||||||
|
|
||||||
// Delete entire style history
|
// Delete entire style history
|
||||||
purge() {
|
purge() {
|
||||||
for (let i = 0; i < window.localStorage.length; i++) {
|
for (let i = 0; i < window.localStorage.length; i++) {
|
||||||
|
@ -102,13 +99,13 @@ export class StyleStore {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Find the last edited style
|
// Find the last edited style
|
||||||
latestStyle() {
|
latestStyle(cb) {
|
||||||
if(this.mapStyles.length === 0) return emptyStyle
|
if(this.mapStyles.length === 0) return cb(style.emptyStyle)
|
||||||
const styleId = window.localStorage.getItem(storageKeys.latest)
|
const styleId = window.localStorage.getItem(storageKeys.latest)
|
||||||
const styleItem = window.localStorage.getItem(styleKey(styleId))
|
const styleItem = window.localStorage.getItem(styleKey(styleId))
|
||||||
|
|
||||||
if(styleItem) return style.fromJSON(styleItem)
|
if(styleItem) return cb(style.fromJSON(styleItem))
|
||||||
return emptyStyle
|
cb(style.emptyStyle)
|
||||||
}
|
}
|
||||||
|
|
||||||
// Save current style replacing previous version
|
// Save current style replacing previous version
|
||||||
|
|
Loading…
Reference in a new issue