Browse Source

button for adding tile layer

Nils Schneider 9 years ago
parent
commit
a0120221ae
2 changed files with 30 additions and 0 deletions
  1. 26 0
      lib/map.js
  2. 4 0
      scss/_map.scss

+ 26 - 0
lib/map.js

@@ -5,6 +5,28 @@ define(["d3", "leaflet", "moment", "locationmarker", "leaflet.label",
                    zoomControl: false
                  }
 
+   var AddLayerButton = L.Control.extend({
+       options: {
+         position: "bottomright"
+       },
+
+       initialize: function (f, options) {
+         L.Util.setOptions(this, options)
+         this.f = f
+       },
+
+       onAdd: function () {
+         var button = L.DomUtil.create("button", "add-layer")
+
+         L.DomEvent.disableClickPropagation(button)
+         L.DomEvent.addListener(button, "click", this.f, this)
+
+         this.button = button
+
+         return button
+       }
+   })
+
    var LocateButton = L.Control.extend({
        options: {
          position: "bottomright"
@@ -156,6 +178,10 @@ define(["d3", "leaflet", "moment", "locationmarker", "leaflet.label",
 
     map.addControl(locateUserButton)
 
+    map.addControl(new AddLayerButton(function () {
+      L.tileLayer.provider(prompt()).addTo(map)
+    }))
+
     var nodeDict = {}
     var linkDict = {}
     var highlight

+ 4 - 0
scss/_map.scss

@@ -10,6 +10,10 @@
     content: '\f2a7';
   }
 
+  button.add-layer:after {
+    content: '\f217';
+  }
+
  .node-alert {
     -webkit-animation: blink 2s linear;
     -webkit-animation-iteration-count: infinite;