added new buttons for map zooming and requesting important locations

This commit is contained in:
DennisSchiefer
2012-08-27 10:27:19 +01:00
parent 94ad1003e9
commit d3d3ebb5de
25 changed files with 302 additions and 290 deletions
+10 -7
View File
@@ -52,20 +52,23 @@ init: function() {
zoom: OSRM.DEFAULTS.ONLOAD_ZOOM_LEVEL,
layers: [base_maps[tile_servers[0].display_name]],
zoomAnimation: false, // animations have to be inactive during initialization (leaflet issue #918)
fadeAnimation: false
fadeAnimation: false,
zoomControl: false // use OSRM zoom buttons
});
// // add locations control
// var locationsControl = new L.Control.Locations();
// OSRM.G.map.addControl(locationsControl);
// add locations control
var locationsControl = new OSRM.Control.Locations();
OSRM.G.map.addControl(locationsControl);
// add layer control
var layerControl = new L.Control.QueryableLayers(base_maps, {});
OSRM.G.map.addLayerControl(layerControl);
// move zoom markers
OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom')[0].style.left=(OSRM.G.main_handle.boxWidth()+10)+"px";
OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom')[0].style.top="5px";
// add zoom control
var zoomControl = new OSRM.Control.Zoom();
OSRM.G.map.addControl(zoomControl);
zoomControl.show();
// add scale control
OSRM.G.map.scaleControl = new L.Control.Scale();
@@ -1,65 +0,0 @@
/*
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU AFFERO General Public License as published by
the Free Software Foundation; either version 3 of the License, or
any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
or see http://www.gnu.org/licenses/agpl.txt.
*/
// locations control
// [buttons to important locations - zoom on route, zoom on user]
L.Control.Locations = L.Control.extend({
options: {
position: 'topright'
},
onAdd: function (map) {
var className = 'leaflet-control-locations',
container = L.DomUtil.create('div', className);
this._createButton('Goto Location', className + '-user', container, OSRM.GUI.zoomOnUser, map);
this._createButton('Goto Route', className + '-route', container, OSRM.GUI.zoomOnRoute, map);
return container;
},
_createButton: function (title, className, container, fn, context) {
var link = L.DomUtil.create('a', className, container);
link.id = className;
link.title = title;
L.DomEvent
.on(link, 'click', L.DomEvent.stopPropagation)
.on(link, 'click', L.DomEvent.preventDefault)
.on(link, 'click', fn, context)
.on(link, 'mousedown', function() { this.className = this.id + "-active"; } )
.on(link, 'mouseup', function() { this.className = this.id + ""; } )
.on(link, 'dblclick', L.DomEvent.stopPropagation);
return link;
}
});
L.Map.mergeOptions({
locationsControl: false
});
L.Map.addInitHook(function () {
if (this.options.locationsControl) {
this.locationsControl = new L.Control.Locations();
this.addControl(this.locationsControl);
}
});
L.control.locations = function (options) {
return new L.Control.Locations(options);
};
@@ -16,10 +16,10 @@ or see http://www.gnu.org/licenses/agpl.txt.
*/
// queryable Layers control
// [simply Control.Layers extended by query functions]
// [extension of Layers.Control with OSRM styling and additional query methods]
L.Control.QueryableLayers = L.Control.Layers.extend({
// new query functionality
// query functionality
getActiveLayerName: function () {
var i, input, obj,
inputs = this._form.getElementsByTagName('input'),
@@ -45,5 +45,15 @@ getActiveLayer: function () {
return obj.layer;
}
}
},
// overwrite Control.Layers methods to get OSRM styling
_expand: function () {
L.DomUtil.addClass(this._container, 'leaflet-control-layers-expanded');
},
_collapse: function () {
this._container.className = this._container.className.replace(' leaflet-control-layers-expanded', '');
}
});
-63
View File
@@ -1,63 +0,0 @@
/*
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU AFFERO General Public License as published by
the Free Software Foundation; either version 3 of the License, or
any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
or see http://www.gnu.org/licenses/agpl.txt.
*/
// zoom control
// [control moves with sidebar and changes color when clicked]
L.Control.Zoom = L.Control.extend({
options: {
position: 'topleft'
},
onAdd: function (map) {
var className = 'leaflet-control-zoom',
container = L.DomUtil.create('div', className);
this._createButton('Zoom in', className + '-in', container, map.zoomIn, map);
this._createButton('Zoom out', className + '-out', container, map.zoomOut, map);
return container;
},
_createButton: function (title, className, container, fn, context) {
var link = L.DomUtil.create('a', className, container);
link.href = '#';
link.title = title;
L.DomEvent
.on(link, 'click', L.DomEvent.stopPropagation)
.on(link, 'click', L.DomEvent.preventDefault)
.on(link, 'click', fn, context)
.on(link, 'dblclick', L.DomEvent.stopPropagation);
return link;
}
});
L.Map.mergeOptions({
zoomControl: true
});
L.Map.addInitHook(function () {
if (this.options.zoomControl) {
this.zoomControl = new L.Control.Zoom();
this.addControl(this.zoomControl);
}
});
L.control.zoom = function (options) {
return new L.Control.Zoom(options);
};
@@ -0,0 +1,65 @@
/*
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU AFFERO General Public License as published by
the Free Software Foundation; either version 3 of the License, or
any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
or see http://www.gnu.org/licenses/agpl.txt.
*/
// locations control
// [navigation buttons for important locations - zoom on route, zoom on user]
OSRM.Control = OSRM.Control || {};
OSRM.Control.Locations = L.Control.extend({
options: {
position: 'topright'
},
onAdd: function (map) {
// unique control
if( document.getElementById('gui-control-locations') )
return document.getElementById('gui-control-locations');
// create wrapper
var container = L.DomUtil.create('div', 'box-wrapper gui-control-wrapper');
container.id = 'gui-control-locations';
L.DomEvent.disableClickPropagation(container);
// create buttons
this._createButton('gui-locations-user', container, OSRM.GUI.zoomOnUser, map, navigator.geolocation );
this._createButton('gui-locations-route', container, OSRM.GUI.zoomOnRoute, map, false);
return container;
},
_createButton: function (id, container, fn, context, isActive) {
var inactive = (isActive == false) ? "-inactive" : "";
var classNames = "box-content" + " " + "gui-control"+inactive + " " + id+inactive;
var link = L.DomUtil.create('a', classNames, container);
link.id = id;
link.title = id;
L.DomEvent
.on(link, 'click', L.DomEvent.stopPropagation)
.on(link, 'click', L.DomEvent.preventDefault)
.on(link, 'click', fn, context)
.on(link, 'dblclick', L.DomEvent.stopPropagation);
return link;
},
activate: function (id) {
document.getElementById(id).className = "box-content gui-control " + id;
},
deactivate: function (id) {
document.getElementById(id).className = "box-content gui-control-inactive " + id + "-inactive";
}
});
+73
View File
@@ -0,0 +1,73 @@
/*
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU AFFERO General Public License as published by
the Free Software Foundation; either version 3 of the License, or
any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
or see http://www.gnu.org/licenses/agpl.txt.
*/
// zoom control
// [modified zoom control with ids, prevention of click propagation, show/hide with respect to main OSRM window]
OSRM.Control = OSRM.Control || {};
OSRM.Control.Zoom = L.Control.extend({
options: {
position: 'topleft'
},
onAdd: function (map) {
// unique control
if( document.getElementById('gui-control-zoom') )
return document.getElementById('gui-control-zoom');
// create wrapper
var container = L.DomUtil.create('div', 'box-wrapper gui-control-wrapper');
container.id = 'gui-control-zoom';
L.DomEvent.disableClickPropagation(container);
// create buttons
this._createButton('gui-zoom-in', container, map.zoomIn, map, true);
this._createButton('gui-zoom-out', container, map.zoomOut, map, true);
return container;
},
_createButton: function (id, container, fn, context, isActive) {
var inactive = (isActive == false) ? "-inactive" : "";
var classNames = "box-content" + " " + "gui-control"+inactive + " " + id+inactive;
var link = L.DomUtil.create('a', classNames, container);
link.id = id;
link.title = id;
L.DomEvent
.on(link, 'click', L.DomEvent.stopPropagation)
.on(link, 'click', L.DomEvent.preventDefault)
.on(link, 'click', fn, context)
.on(link, 'dblclick', L.DomEvent.stopPropagation);
return link;
},
hide: function() {
var zoom_controls = document.getElementById("gui-control-zoom");
if( zoom_controls )
zoom_controls.style.visibility="hidden";
},
show: function() {
var zoom_controls = document.getElementById("gui-control-zoom");
if( zoom_controls ) {
zoom_controls.style.top = "5px";
zoom_controls.style.left = ( OSRM.G.main_handle.boxVisible() == true ? (OSRM.G.main_handle.boxWidth()+10) : "30") + "px";
zoom_controls.style.visibility="visible";
}
}
});