-
Notifications
You must be signed in to change notification settings - Fork 67
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
7d0b8b5
commit c61ef32
Showing
3 changed files
with
94 additions
and
91 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,110 +1,112 @@ | ||
| L.Dropchop = L.Dropchop || {}; | ||
| L.Dropchop.MapView = L.Class.extend({ | ||
|
|
||
| statics: {}, | ||
| statics: {}, | ||
|
|
||
| // default options | ||
| options: {}, | ||
| // default options | ||
| options: {}, | ||
|
|
||
|
|
||
| initialize : function( options ) { | ||
| initialize: function(options) { | ||
|
|
||
| // override defaults with passed options | ||
| L.setOptions(this, options); | ||
| // override defaults with passed options | ||
| L.setOptions(this, options); | ||
|
|
||
| this.numLayers = 0; | ||
| this._map = null; | ||
| this.numLayers = 0; | ||
| this._map = null; | ||
|
|
||
| // init hooks | ||
| this._setupMap(); | ||
| // init hooks | ||
| this._setupMap(); | ||
|
|
||
| } , | ||
| }, | ||
|
|
||
|
|
||
| _setupMap : function () { | ||
| _setupMap: function() { | ||
|
|
||
| // mapbox token | ||
| L.mapbox.accessToken = 'pk.eyJ1Ijoic3ZtYXR0aGV3cyIsImEiOiJVMUlUR0xrIn0.NweS_AttjswtN5wRuWCSNA'; | ||
| // mapbox token | ||
| L.mapbox.accessToken = 'pk.eyJ1Ijoic3ZtYXR0aGV3cyIsImEiOiJVMUlUR0xrIn0.NweS_AttjswtN5wRuWCSNA'; | ||
|
|
||
| //add locate me button | ||
| var geolocate = document.getElementById('geolocate'); | ||
| //add locate me button | ||
| var geolocate = document.getElementById('geolocate'); | ||
|
|
||
| // create a map object on the `map` element id | ||
| this._map = L.mapbox.map('map', null, { | ||
| zoomControl: false, | ||
| worldCopyJump: true | ||
| }).setView([0,0], 3); | ||
| // create a map object on the `map` element id | ||
| this._map = L.mapbox.map('map', null, { | ||
| zoomControl: false, | ||
| worldCopyJump: true | ||
| }).setView([0, 0], 3); | ||
|
|
||
| // locate me js shhtuffs | ||
| // locate me js shhtuffs | ||
|
|
||
|
|
||
| var myLayer = L.mapbox.featureLayer().addTo(this._map); | ||
| var myLayer = L.mapbox.featureLayer().addTo(this._map); | ||
|
|
||
| // This uses the HTML5 geolocation API, which is available on | ||
| // most mobile browsers and modern browsers, but not in Internet Explorer | ||
| // | ||
| // See this chart of compatibility for details: | ||
| // http://caniuse.com/#feat=geolocation | ||
| if (!navigator.geolocation) { | ||
| geolocate.innerHTML = 'Geolocation is not available'; | ||
| } else { | ||
| geolocate.onclick = function (e) { | ||
| // This uses the HTML5 geolocation API, which is available on | ||
| // most mobile browsers and modern browsers, but not in Internet Explorer | ||
| // | ||
| // See this chart of compatibility for details: | ||
| // http://caniuse.com/#feat=geolocation | ||
| if (!navigator.geolocation) { | ||
| geolocate.innerHTML = 'Geolocation is not available'; | ||
| } else { | ||
| geolocate.onclick = function(e) { | ||
| e.preventDefault(); | ||
| e.stopPropagation(); | ||
| this._map.locate(); | ||
| }; | ||
| } | ||
| }.bind(this); | ||
| } | ||
|
|
||
| // Once we've got a position, zoom and center the map | ||
| // on it, and add a single marker. | ||
| this._map.on('locationfound', function(e) { | ||
| this._map.fitBounds(e.bounds); | ||
|
|
||
| // Once we've got a position, zoom and center the map | ||
| // on it, and add a single marker. | ||
| this._map.on('locationfound', function(e) { | ||
| this._map.fitBounds(e.bounds); | ||
|
|
||
| myLayer.setGeoJSON({ | ||
| myLayer.setGeoJSON({ | ||
| type: 'Feature', | ||
| geometry: { | ||
| type: 'Point', | ||
| coordinates: [e.latlng.lng, e.latlng.lat] | ||
| type: 'Point', | ||
| coordinates: [e.latlng.lng, e.latlng.lat] | ||
| }, | ||
| properties: { | ||
| 'title': 'Here I am!', | ||
| 'marker-color': '#ff8888', | ||
| 'marker-symbol': 'star' | ||
| 'title': 'There You Are', | ||
| 'marker-color': '#207178', | ||
| 'marker-symbol': 'heart' | ||
| } | ||
| }); | ||
|
|
||
| // And hide the geolocation button | ||
| //geolocate.parentNode.removeChild(geolocate); | ||
| }.bind(this) | ||
| ); | ||
|
|
||
| // If the user chooses not to allow their location | ||
| // to be shared, display an error message. | ||
| this._map.on('locationerror', function() { | ||
| geolocate.innerHTML = 'Position could not be found'; | ||
| }); | ||
| // define our baselayers from mapbox defaults | ||
| var baseLayers = { | ||
| "Mapbox Streets": L.mapbox.tileLayer('mapbox.streets'), | ||
| "Mapbox Outdoors": L.mapbox.tileLayer('mapbox.outdoors'), | ||
| "Mapbox Light": L.mapbox.tileLayer('mapbox.light'), | ||
| "Mapbox Dark": L.mapbox.tileLayer('mapbox.dark'), | ||
| "Mapbox Satellite": L.mapbox.tileLayer('mapbox.satellite') | ||
| }; | ||
|
|
||
| // And hide the geolocation button | ||
| geolocate.parentNode.removeChild(geolocate); | ||
| }); | ||
| // sets the base layer default as mapbox streets | ||
| baseLayers['Mapbox Streets'].addTo(this._map); | ||
|
|
||
| // If the user chooses not to allow their location | ||
| // to be shared, display an error message. | ||
| this._map.on('locationerror', function() { | ||
| geolocate.innerHTML = 'Position could not be found'; | ||
| }); | ||
| // define our baselayers from mapbox defaults | ||
| var baseLayers = { | ||
| "Mapbox Streets": L.mapbox.tileLayer('mapbox.streets'), | ||
| "Mapbox Outdoors": L.mapbox.tileLayer('mapbox.outdoors'), | ||
| "Mapbox Light": L.mapbox.tileLayer('mapbox.light'), | ||
| "Mapbox Dark": L.mapbox.tileLayer('mapbox.dark'), | ||
| "Mapbox Satellite": L.mapbox.tileLayer('mapbox.satellite') | ||
| }; | ||
|
|
||
| // sets the base layer default as mapbox streets | ||
| baseLayers['Mapbox Streets'].addTo(this._map); | ||
|
|
||
| // sets location of base layer control to the bottom right | ||
| L.control.layers(baseLayers, {}, { | ||
| position: 'bottomright', | ||
| collapsed: false | ||
| }).addTo(this._map); | ||
|
|
||
| // sets the location of the zoom buttons to the top right | ||
| L.control.zoom({ | ||
| position: 'topright' | ||
| }).addTo(this._map); | ||
| // sets location of base layer control to the bottom right | ||
| L.control.layers(baseLayers, {}, { | ||
| position: 'bottomright', | ||
| collapsed: false | ||
| }).addTo(this._map); | ||
|
|
||
| } | ||
| // sets the location of the zoom buttons to the top right | ||
| L.control.zoom({ | ||
| position: 'topright' | ||
| }).addTo(this._map); | ||
|
|
||
| } | ||
|
|
||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters