diff --git a/config/webpack.loaders.js b/config/webpack.loaders.js index f931b7b..fa6c4cc 100644 --- a/config/webpack.loaders.js +++ b/config/webpack.loaders.js @@ -4,6 +4,17 @@ module.exports = [ exclude: /(node_modules|bower_components|public)/, loaders: ['react-hot-loader/webpack'] }, + // HACK: This is a massive hack and reaches into the mapbox-gl private API. + // We have to include this for access to `normalizeSourceURL`. We should + // remove this ASAP, see + { + test: /.*node_modules[\/\\]mapbox-gl[\/\\]src[\/\\]util[\/\\].*\.js/, + loader: 'babel-loader', + query: { + presets: ['env', 'react', 'flow'], + plugins: ['transform-runtime', 'transform-decorators-legacy', 'transform-class-properties'], + } + }, { test: /\.jsx?$/, exclude: /(.*node_modules(?![\/\\]@mapbox[\/\\]mapbox-gl-style-spec)|bower_components|public)/, diff --git a/package.json b/package.json index c325f3e..e7aa9e6 100644 --- a/package.json +++ b/package.json @@ -96,6 +96,7 @@ "babel-plugin-transform-object-rest-spread": "^6.26.0", "babel-plugin-transform-runtime": "^6.23.0", "babel-preset-env": "^1.6.1", + "babel-preset-flow": "^6.23.0", "babel-preset-react": "^6.24.1", "babel-runtime": "^6.26.0", "base64-loader": "^1.0.0", diff --git a/src/components/App.jsx b/src/components/App.jsx index d90415a..c76bf70 100644 --- a/src/components/App.jsx +++ b/src/components/App.jsx @@ -21,6 +21,10 @@ import LayerWatcher from '../libs/layerwatcher' import tokens from '../config/tokens.json' import isEqual from 'lodash.isequal' +import MapboxGl from 'mapbox-gl' +import mapboxUtil from 'mapbox-gl/src/util/mapbox' + + function updateRootSpec(spec, fieldName, newValues) { return { ...spec, @@ -199,7 +203,13 @@ export default class App extends React.Component { }; if(!this.state.sources.hasOwnProperty(key) && val.type === "vector") { - const url = val.url; + let url = val.url; + try { + url = mapboxUtil.normalizeSourceURL(url, MapboxGl.accessToken); + } catch(err) { + console.warn("Failed to normalizeSourceURL: ", err); + } + fetch(url) .then((response) => { return response.json(); diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss index 5674060..6ec5109 100644 --- a/src/styles/_modal.scss +++ b/src/styles/_modal.scss @@ -6,6 +6,7 @@ background-color: $color-black; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3); z-index: 3; + position: relative; } .maputnik-modal-section {