Merge remote-tracking branch 'upstream/master' into feature/add-range-slider

src/components/App.jsx

@@ -23,7 +23,7 @@ import SurveyModal from './modals/SurveyModal'
 import { downloadGlyphsMetadata, downloadSpriteMetadata } from '../libs/metadata'
 import {latest, validate} from '@mapbox/mapbox-gl-style-spec'
 import style from '../libs/style'
-import { initialStyleUrl, loadStyleUrl } from '../libs/urlopen'
+import { initialStyleUrl, loadStyleUrl, removeStyleQuerystring } from '../libs/urlopen'
 import { undoMessages, redoMessages } from '../libs/diffmessage'
 import { StyleStore } from '../libs/stylestore'
 import { ApiStyleStore } from '../libs/apistore'
@@ -147,10 +147,14 @@ export default class App extends React.Component {
     })
 
     const styleUrl = initialStyleUrl()
-    if(styleUrl) {
+    if(styleUrl && window.confirm("Load style from URL: " + styleUrl + " and discard current changes?")) {
       this.styleStore = new StyleStore()
       loadStyleUrl(styleUrl, mapStyle => this.onStyleChanged(mapStyle))
+      removeStyleQuerystring()
     } else {
+      if(styleUrl) {
+        removeStyleQuerystring()
+      }
       this.styleStore.init(err => {
         if(err) {
           console.log('Falling back to local storage for storing styles')

src/libs/urlopen.js

@@ -1,4 +1,5 @@
 import url from 'url'
+import querystring from 'querystring'
 import style from './style.js'
 
 export function initialStyleUrl() {
@@ -24,6 +25,23 @@ export function loadStyleUrl(styleUrl, cb) {
   })
 }
 
+export function removeStyleQuerystring() {
+  const initialUrl = url.parse(window.location.href, true)
+  let qs = querystring.parse(window.location.search.slice(1))
+  delete qs["style"]
+  if(Object.getOwnPropertyNames(qs).length === 0) {
+    qs = ""
+  } else {
+    qs = "?" + querystring.stringify(qs)
+  }
+  let newUrlHash = initialUrl.hash
+  if(newUrlHash === null) {
+    newUrlHash = ""
+  } 
+  const newUrl = initialUrl.protocol + "//" + initialUrl.host + initialUrl.pathname + qs + newUrlHash
+  window.history.replaceState({}, document.title, newUrl)
+}
+
 export function loadJSON(url, defaultValue, cb) {
   fetch(url, {
     mode: 'cors',

src/styles/_toolbar.scss

@@ -100,10 +100,17 @@
   background: inherit;
   border-width: 0;
   @extend .maputnik-toolbar-link;
-}
 
-.maputnik-toolbar-select select {
-  margin-left: 4px;
+  select {
+    // HACK: <https://github.com/maputnik/editor/pull/392#issuecomment-427595172>
+    color: $color-black !important;
+    margin-left: 4px;
+
+    option {
+      // HACK: <https://github.com/maputnik/editor/pull/392#issuecomment-427595172>
+      color: $color-black !important;
+    }
+  }
 }
 
 .maputnik-icon-text {