Merge branch 'develop'

Conflicts: AUTHORS.md WebContent/OSRM.config.js WebContent/localization/OSRM.Locale.dk.js WebContent/localization/OSRM.Locale.pl.js
2012-05-16 12:37:01 +01:00 · 2012-05-16 12:37:01 +01:00 · 4cdf683447
commit 4cdf683447
parent 357ec5acfc 3bce384f9b
62 changed files with 1903 additions and 610 deletions
--- a/AUTHORS.md
+++ b/AUTHORS.md
@ -8,4 +8,6 @@ Nicolas Belett Vigneron
 Moyg
 Jean-Frederic
 Zbigniew Czernik
-Jonas Häggqvist
+Jonas Häggqvist
+Sabas
+Paul Spencer
--- a/README.md
+++ b/README.md
@ -29,9 +29,10 @@ Please use the OSRM-Project bug tracker [(4)] for submitting any bug reports or

 Contribute
 ----------
-If you like to contribute, you can simply fork the project and start coding.
-When you are going to provide a more substantial addition, please create a new branch first.
-For pull requests use the develop branch as target, never the master branch. 
+If you like to contribute, simply fork the project and start coding.
+It is best practice to create a new branch (from the current master) with a descriptive name for your contributions.
+When you are done, send a pull request from that branch.
+With this workflow, each pull request is isolated and can be easily merged.


 Integration into Project-OSRM repository
@ -49,6 +50,14 @@ To successfully work a repository that contains submodules, use the following gi
 Note that the frontend can also be checked out independently of the Project-OSRM repository.


+Compatibility
+-------------
+The frontend has been tested with Firefox 3.0+, Internet Explorer 8+ and Chrome 18+.
+Certain visuals like rounded corners or moving boxes will only show in newer browser versions.
+But no actual functionality is affected by this.
+Note that the frontend will not work with Internet Explorer 6 or 7.
+
+
 References
 ----------
 [(1)] Cloudmade Leaflet: http://leaflet.cloudmade.com/  
--- a/WebContent/OSRM.config.js
+++ b/WebContent/OSRM.config.js
@ -21,6 +21,7 @@ or see http://www.gnu.org/licenses/agpl.txt.
 OSRM.DEFAULTS = {
 	HOST_ROUTING_URL: 'http://router.project-osrm.org/viaroute',
 	HOST_SHORTENER_URL: 'http://map.project-osrm.org/shorten/',
+	HOST_TIMESTAMP_URL: 'http://router.project-osrm.org/timestamp',
 	HOST_GEOCODER_URL: 'http://nominatim.openstreetmap.org/search',
 	HOST_REVERSE_GEOCODER_URL: 'http://nominatim.openstreetmap.org/reverse',
 	WEBSITE_URL: document.URL.replace(/#*(\?.*|$)/i,""),					// truncates URL before first ?, and removes tailing #
@ -32,6 +33,7 @@ OSRM.DEFAULTS = {
 	ONLOAD_SOURCE: "",
 	ONLOAD_TARGET: "",
 	HIGHLIGHT_ZOOM_LEVEL: 16,
+	DISTANCE_FORMAT: 0,														// 0: km, 1: miles
 	GEOCODER_BOUNDS: '',													// the world is not enough!
 	//GEOCODER_BOUNDS: '&bounded=1&viewbox=-27.0,72.0,46.0,36.0',			// bounds for Europe
 	
@ -39,15 +41,15 @@ OSRM.DEFAULTS = {
 	SHORTENER_REPLY_PARAMETER: 'ShortURL',
 	
 	LANGUAGE: "en",
-	LANGUAGE_FILES_DIRECTORY: "localization/",	
 	LANUGAGE_ONDEMAND_RELOADING: true,
 	LANGUAGE_SUPPORTED: [ 
-		{display_name:"en", encoding:"en"},
-		{display_name:"dk", encoding:"dk"},
-		{display_name:"de", encoding:"de"},
-		{display_name:"fi", encoding:"fi"},
-		{display_name:"fr", encoding:"fr"},
-		{display_name:"pl", encoding:"pl"}
+		{encoding:"en", name:"English"},
+		{encoding:"de", name:"Deutsch"},
+		{encoding:"dk", name:"Dansk"},
+		{encoding:"fi", name:"Suomi"},
+		{encoding:"fr", name:"Français"},
+		{encoding:"it", name:"Italiano"},
+		{encoding:"pl", name:"Polski", culture:"en-US"}
 	],
 		
 	TILE_SERVERS: [
@ -70,6 +72,24 @@ OSRM.DEFAULTS = {
 			url:'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png',
 			attribution:'Map data &copy; 2011 OpenStreetMap contributors, Imagery &copy; 2011 CloudMade',
 			options:{maxZoom: 18}
+		},
+		{
+			display_name: 'Bing Road',
+			apikey:'AjCb2f6Azv_xt9c6pl_xok96bgAYrXQNctnG4o07sTj4iS9N68Za4B3pRJyeCjGr',	// please use your own apikey (http://msdn.microsoft.com/en-us/library/ff428642.aspx) 
+			type:"Road",
+			options:{minZoom: 1},
+			bing:true,
+		},
+		{
+			display_name: 'Bing Aerial',
+			apikey:'AjCb2f6Azv_xt9c6pl_xok96bgAYrXQNctnG4o07sTj4iS9N68Za4B3pRJyeCjGr',	// please use your own apikey (http://msdn.microsoft.com/en-us/library/ff428642.aspx)
+			type:"Aerial",
+			options:{minZoom: 1},
+			bing:true,
 		}
-	]
+	],
+	
+	MAINTENANCE: false,
+	MAINTENANCE_HEADER: "Scheduled Maintenance",
+	MAINTENANCE_TEXT: "The OSRM Website is down for a scheduled maintenance. Please be patient while required updates are performed. The site will be back online shortly.<br/><br/>In the meantime you may want to go out an map a friendly neighborhood near you...<br/><br/><br/>[OSRM]",	
 };
--- a/WebContent/base/OSRM.HistoryRoutes.js
+++ b/WebContent/base/OSRM.HistoryRoutes.js
@ -0,0 +1,193 @@
+/*
+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.
+*/
+
+// OSRM route management (handles drawing of route geometry - current route, old route, unnamed route, highlight unnamed streets) 
+// [this holds the route geometry]
+
+
+OSRM.HistoryRoute = function() {
+	// style and count of history routes
+	this._history_styles = [{dashed:false, color:'#FFFFFF', opacity:0.5, weight:5},
+	                        {dashed:false, color:'#0000DD', opacity:0.45, weight:5},
+	                        {dashed:false, color:'#0000BB', opacity:0.40, weight:5},
+	                        {dashed:false, color:'#000099', opacity:0.35, weight:5},
+	                        {dashed:false, color:'#000077', opacity:0.30, weight:5},
+	                        {dashed:false, color:'#000055', opacity:0.25, weight:5},
+	                        {dashed:false, color:'#000033', opacity:0.20, weight:5},
+	                        {dashed:false, color:'#000011', opacity:0.15, weight:5},
+	                        {dashed:false, color:'#000000', opacity:0.10, weight:5}	                              
+	                        ];
+	this._history_length = this._history_styles.length;
+	
+	// actual history data
+	this._history = [];
+	for(var i=0, size=this._history_length; i<size; i++) {
+		var history = {};
+		history.route = new OSRM.SimpleRoute("current" , {dashed:false} );
+		history.markers = [];
+		history.checksum = null;
+		this._history.push(history);
+	}
+	
+	// helper functions bound to this
+	this._initiate_redrawHistory = OSRM.bind(this, this._getRoute_RedrawHistory);
+	this._callback_redrawHistory = OSRM.bind(this, this._showRoute_RedrawHistory);
+};
+OSRM.extend( OSRM.HistoryRoute,{
+	// switch history routes on/off
+	activate: function() {
+		this.storeHistoryRoute = this._storeHistoryRoute;
+		this.fetchHistoryRoute = this._fetchHistoryRoute;
+		this.showHistoryRoutes = this._showHistoryRoutes;
+		this.clearHistoryRoutes = this._clearHistoryRoutes;
+		OSRM.G.map.on('zoomend', this._initiate_redrawHistory );
+		
+		this.storeHistoryRoute();
+	},
+	deactivate: function() {
+		this.clearHistoryRoutes();
+		
+		this.storeHistoryRoute = this.empty;
+		this.fetchHistoryRoute = this.empty;
+		this.showHistoryRoutes = this.empty;
+		this.clearHistoryRoutes = this.empty;
+		OSRM.G.map.off('zoomend', this._initiate_redrawHistory );
+	},
+	
+	// empty function
+	empty: function() {},
+	storeHistoryRoute: function() {},
+	fetchHistoryRoute: function() {},
+	showHistoryRoutes: function() {},
+	clearHistoryRoutes: function() {},
+	
+	// actual functions
+	_storeHistoryRoute: function() {
+		var route = OSRM.G.route;
+		if( !route.isShown() || !route.isRoute() )
+			return;
+			
+		// store current route in staging spot
+		var hint_data = OSRM.G.response.hint_data;
+		this._history[0].route.setPositions( route.getPositions() );
+		this._history[0].checksum = hint_data.checksum;
+		this._history[0].markers = [];
+
+		var markers = this._getCurrentMarkers();
+		for(var i=0,size=markers.length; i<size; i++) {
+			var position = { lat:markers[i].lat, lng:markers[i].lng, hint:hint_data.locations[i] };
+			this._history[0].markers.push(position);
+		}
+	},
+	_fetchHistoryRoute: function() {
+		if( this._history[0].markers.length == 0 )
+			return;
+		if( OSRM.G.route.isShown() && this._equalMarkers(this._history[0].markers, this._getCurrentMarkers()) )
+			return;
+		if( this._equalMarkers(this._history[0].markers, this._history[1].markers) )
+			return;		
+
+		// move all routes down one position
+		for(var i=this._history_length-1; i>0; i--) {
+			this._history[i].route.setPositions( this._history[i-1].route.getPositions() ); // copying positions quicker than creating new route!
+			this._history[i].markers = this._history[i-1].markers;
+			this._history[i].checksum = this._history[i-1].checksum;
+		}		
+		// reset staging spot
+		this._history[0].route.setPositions( [] );
+		this._history[0].markers = [];
+		this._history[0].checksum = null;
+	},	
+	_showHistoryRoutes: function() {
+		for(var i=1,size=this._history_length; i<size; i++) {
+			this._history[i].route.setStyle( this._history_styles[i] );
+			this._history[i].route.show();
+			OSRM.G.route.hideOldRoute();
+		}
+	},
+	_clearHistoryRoutes: function() {
+		for(var i=0,size=this._history_length; i<size; i++) {
+			this._history[i].route.hide();
+			this._history[i].route.setPositions( [] );
+			this._history[i].markers = [];
+			this._history[i].checksum = null;
+		}
+	},
+	
+	// get positions of current markers (data of jsonp response used, as not all data structures up-to-date!)
+	_getCurrentMarkers: function() {
+		var route = [];
+		
+		var positions = OSRM.G.route.getPositions();
+		if(positions.length == 0)
+			return route;
+		
+		for(var i=0; i<OSRM.G.response.via_points.length; i++)
+			route.push( {lat:OSRM.G.response.via_points[i][0], lng:OSRM.G.response.via_points[i][1]} );
+		return route;
+	},
+	
+	// check if two routes are equivalent by checking their markers
+	_equalMarkers: function(lhs, rhs) {
+		if(lhs.length != rhs.length)
+			return false;
+		for(var i=0,size=lhs.length; i<size; i++) {
+			if( lhs[i].lat.toFixed(5) != rhs[i].lat.toFixed(5) || lhs[i].lng.toFixed(5) != rhs[i].lng.toFixed(5) )
+				return false;
+		}
+		return true;
+	},
+	
+	// requery history routes
+	_showRoute_RedrawHistory: function(response, history_id) {
+		if(!response)
+			return;
+		
+		var positions = OSRM.RoutingGeometry._decode(response.route_geometry, 5);
+		this._history[history_id].route.setPositions(positions);
+		this._updateHints(response, history_id);
+	},
+	_getRoute_RedrawHistory: function() {
+		for(var i=0,size=this._history_length; i<size; i++)
+			if( this._history[i].markers.length > 0 ) {
+				OSRM.JSONP.clear('history'+i);
+				OSRM.JSONP.call(this._buildCall(i)+'&instructions=false', this._callback_redrawHistory, OSRM.JSONP.empty, OSRM.DEFAULTS.JSONP_TIMEOUT, 'history'+i, i);
+			}
+	},
+	_buildCall: function(history_id) {
+		var source = OSRM.DEFAULTS.HOST_ROUTING_URL;
+		source += '?z=' + OSRM.G.map.getZoom() + '&output=json&jsonp=%jsonp&geomformat=cmp';
+		
+		if(this._history[history_id].checksum)
+			source += '&checksum=' + this._history[history_id].checksum;
+		
+		var history_markers = this._history[history_id].markers; 
+		for(var i=0,size=history_markers.length; i<size; i++) {
+			source += '&loc='  + history_markers[i].lat.toFixed(6) + ',' + history_markers[i].lng.toFixed(6);
+			if( history_markers[i].hint )
+				source += '&hint=' + history_markers[i].hint;
+		}
+		return source;
+	},
+	_updateHints: function(response, history_id) {
+		this._history[history_id].checksum = response.hint_data.checksum;
+		
+		var hints = response.hint_data.locations;
+		for(var i=0; i<hints.length; i++)
+			this._history[history_id].markers[i].hint = hints[i];		
+	}
+});
--- a/WebContent/base/OSRM.Map.js
+++ b/WebContent/base/OSRM.Map.js
@ -29,15 +29,19 @@ OSRM.Map = {
 // map initialization
 init: function() {
 	// check if GUI is initialized!
-	if(OSRM.GUI.visible == null)
+	if(OSRM.G.main_handle == null)
 		OSRM.GUI.init();
 	
 	// setup tile servers
 	var tile_servers = OSRM.DEFAULTS.TILE_SERVERS;
 	var base_maps = {};
 	for(var i=0, size=tile_servers.length; i<size; i++) {
-		tile_servers[i].options.attribution = tile_servers[i].attribution; 
-		base_maps[ tile_servers[i].display_name ] = new L.TileLayer( tile_servers[i].url, tile_servers[i].options );
+		if( tile_servers[i].bing == true ) {
+			base_maps[ tile_servers[i].display_name ] = new L.TileLayer.Bing( tile_servers[i].apikey, tile_servers[i].type, tile_servers[i].options );		
+		} else {
+			tile_servers[i].options.attribution = tile_servers[i].attribution; 
+			base_maps[ tile_servers[i].display_name ] = new L.TileLayer( tile_servers[i].url, tile_servers[i].options );
+		}
 	}

 	// setup map
@ -54,7 +58,7 @@ init: function() {
 	OSRM.G.map.addLayerControl(layerControl);

    // move zoom markers
-	OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom')[0].style.left=(OSRM.GUI.width+10)+"px";
+	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";

 	// map events
@ -75,9 +79,9 @@ initPosition: function() {
 // map event handlers
 zoomed: function(e) {
 	if(OSRM.G.dragging)
-		OSRM.Routing.getDragRoute();
+		OSRM.Routing.getRoute_Dragging();
 	else
-		OSRM.Routing.getZoomRoute();
+		OSRM.Routing.getRoute_Redraw();
 },
 contextmenu: function(e) {;},
 mousemove: function(e) { OSRM.Via.drawDragMarker(e); },
--- a/WebContent/base/OSRM.Markers.js
+++ b/WebContent/base/OSRM.Markers.js
@ -24,12 +24,16 @@ OSRM.Markers = function() {
 	this.dragger = new OSRM.DragMarker("drag", {draggable:true,icon:OSRM.G.icons['marker-drag'],dragicon:OSRM.G.icons['marker-drag']});;
 };
 OSRM.extend( OSRM.Markers,{
-removeAll: function() {
+reset: function() {
+	// remove route markers
 	for(var i=0; i<this.route.length;i++)
 		this.route[i].hide();
 	this.route.splice(0, this.route.length);
 	document.getElementById('gui-delete-source').style.visibility = "hidden";
 	document.getElementById('gui-delete-target').style.visibility = "hidden";
+	// remove special markers
+	this.highlight.hide();
+	this.dragger.hide();
 },
 removeVias: function() {
 	// assert correct route array s - v - t
@ -94,13 +98,13 @@ reverseMarkers: function() {
 		// switch positions in nodes
 		var temp_position = this.route[0].getPosition();
 		this.route[0].setPosition( this.route[size-1].getPosition() );
-		OSRM.G.markers.route[size-1].setPosition( temp_position );
+		this.route[size-1].setPosition( temp_position );
 		// switch nodes in array
-		var temp_node = OSRM.G.markers.route[0];
-		OSRM.G.markers.route[0] = OSRM.G.markers.route[size-1];
-		OSRM.G.markers.route[size-1] = temp_node;
+		var temp_node = this.route[0];
+		this.route[0] = this.route[size-1];
+		this.route[size-1] = temp_node;
 		// reverse route
-		OSRM.G.markers.route.reverse();
+		this.route.reverse();
 		// clear information (both delete markers stay visible)
 		document.getElementById('information-box').innerHTML = "";
 		document.getElementById('information-box-header').innerHTML = "";
@ -119,13 +123,19 @@ reverseMarkers: function() {

 },
 hasSource: function() {
-	if( OSRM.G.markers.route[0] && OSRM.G.markers.route[0].label == OSRM.C.SOURCE_LABEL )
+	if( this.route[0] && this.route[0].label == OSRM.C.SOURCE_LABEL )
 		return true;
 	return false;
 },
 hasTarget: function() {
-	if( OSRM.G.markers.route[OSRM.G.markers.route.length-1] && OSRM.G.markers.route[OSRM.G.markers.route.length-1].label == OSRM.C.TARGET_LABEL )
+	if( this.route[this.route.length-1] && this.route[this.route.length-1].label == OSRM.C.TARGET_LABEL )
 		return true;
 	return false;
+},
+
+//relabel all via markers
+relabelViaMarkers: function() {
+	for(var i=1, size=this.route.length-1; i<size; i++)
+		this.route[i].marker.setLabel(i);
 }
 });
--- a/WebContent/base/OSRM.Routes.js
+++ b/WebContent/base/OSRM.Routes.js
@ -18,6 +18,7 @@ or see http://www.gnu.org/licenses/agpl.txt.
 // OSRM route management (handles drawing of route geometry - current route, old route, unnamed route, highlight unnamed streets) 
 // [this holds the route geometry]

+
 OSRM.Route = function() {
 	this._current_route	= new OSRM.SimpleRoute("current" , {dashed:false} );
 	this._old_route		= new OSRM.SimpleRoute("old", {dashed:false,color:"#123"} );
@ -31,11 +32,13 @@ OSRM.Route = function() {
 	this._old_unnamed_route_style = {dashed:false, color:'#990099', weight:10};
 	
 	this._noroute = OSRM.Route.ROUTE;
+	this._history = new OSRM.HistoryRoute();
 };
 OSRM.Route.NOROUTE = true;
 OSRM.Route.ROUTE = false;
 OSRM.extend( OSRM.Route,{

+	// show/hide route
 	showRoute: function(positions, noroute) {
 		this._noroute = noroute;
 		this._current_route.setPositions( positions );
@ -45,22 +48,22 @@ OSRM.extend( OSRM.Route,{
 			this._current_route.setStyle( this._current_route_style );
 		this._current_route.show();
 		//this._raiseUnnamedRoute();
+
+		this._history.fetchHistoryRoute();
+		this._history.showHistoryRoutes();		
+		this._history.storeHistoryRoute();		
 	},
 	hideRoute: function() {
 		this._current_route.hide();
 		this._unnamed_route.hide();
-		// activate printing
-		OSRM.Printing.deactivate();		
-	},
-	hideAll: function() {
-		this._current_route.hide();
-		this._unnamed_route.hide();
-		this._old_route.hide();
-		this._noroute = OSRM.Route.ROUTE;
-		// activate printing
+		
+		this._history.fetchHistoryRoute();
+		this._history.showHistoryRoutes();		
+		// deactivate printing
 		OSRM.Printing.deactivate();		
 	},
 	
+	// show/hide highlighting for unnamed routes
 	showUnnamedRoute: function(positions) {
 		this._unnamed_route.clearRoutes();
 		for(var i=0; i<positions.length; i++) {
@ -79,6 +82,8 @@ OSRM.extend( OSRM.Route,{
 			this._unnamed_route.show();
 		}		
 	},
+	
+	// show/hide previous route as shadow
 	showOldRoute: function() {
 		this._old_route.setPositions( this._current_route.getPositions() );
 		if ( this._noroute == OSRM.Route.NOROUTE)
@ -94,6 +99,7 @@ OSRM.extend( OSRM.Route,{
 		this._old_route.hide();
 	},
 	
+	// query routines
 	isShown: function() {
 		return this._current_route.isShown();
 	},
@ -106,10 +112,26 @@ OSRM.extend( OSRM.Route,{
 	getPoints: function() {
 		return this._current_route.getPoints();
 	},
+	
+	// helper routines
+	reset: function() {
+		this.hideRoute();
+		this._old_route.hide();
+		this._noroute = OSRM.Route.ROUTE;
+		this._history.clearHistoryRoutes();
+	},
 	fire: function(type,event) {
 		this._current_route.route.fire(type,event);
 	},
 	centerView: function() {
 		this._current_route.centerView();
+	},	
+	
+	// handle history routes
+	activateHistoryRoutes: function() {
+		this._history.activate();
+	},
+	deactivateHistoryRoutes: function() {
+		this._history.deactivate();
 	}	
 });
--- a/WebContent/base/OSRM.Via.js
+++ b/WebContent/base/OSRM.Via.js
@ -18,9 +18,6 @@ or see http://www.gnu.org/licenses/agpl.txt.
 // OSRM via marker routines
 // [find correct position for a via marker]

-// store location of via points returned by server
-OSRM.GLOBALS.via_points = [];
-

 OSRM.Via = {
 		
@ -49,12 +46,13 @@ findViaIndex: function( new_via_position ) {
 	var nearest_index = OSRM.Via._findNearestRouteSegment( new_via_position );

 	// find correct index to insert new via node
-	var new_via_index = OSRM.G.via_points.length;
+	var via_points = OSRM.G.response.via_points;
+	var new_via_index = via_points.length-2;
 	var via_index = Array();
-	for(var i=0; i<OSRM.G.via_points.length; i++) {
-		via_index[i] = OSRM.Via._findNearestRouteSegment( new L.LatLng(OSRM.G.via_points[i][0], OSRM.G.via_points[i][1]) );
-		if(via_index[i] > nearest_index) {
-			new_via_index = i;
+	for(var i=1; i<via_points.length-1; i++) {
+		via_index[i-1] = OSRM.Via._findNearestRouteSegment( new L.LatLng(via_points[i][0], via_points[i][1]) );
+		if(via_index[i-1] > nearest_index) {
+			new_via_index = i-1;
 			break;
 		}
 	}
--- a/WebContent/base/leaflet/L.Bugfixes.js
+++ b/WebContent/base/leaflet/L.Bugfixes.js
@ -19,12 +19,6 @@ or see http://www.gnu.org/licenses/agpl.txt.
 // [assorted bugfixes to Leaflet functions we use]


-// find relative leaflet URL
-var i = 0;
-while( L.ROOT_URL[i] == document.URL[i] ) { i++; }
-L.RELATIVE_ROOT_URL = L.ROOT_URL.slice(i);
-
-
 // return closest point on segment or distance to that point
 L.LineUtil._sqClosestPointOnSegment = function (p, p1, p2, sqDist) {
 	var x = p1.x,
--- a/WebContent/base/leaflet/L.Control.QueryableLayers.js
+++ b/WebContent/base/leaflet/L.Control.QueryableLayers.js
@ -30,5 +30,18 @@ getActiveLayerName: function () {
 			return obj.name;
 		}
 	}
+},
+getActiveLayer: function () {
+	var i, input, obj,
+	inputs = this._form.getElementsByTagName('input'),
+	inputsLen = inputs.length;
+
+	for (i = 0; i < inputsLen; i++) {
+		input = inputs[i];
+		obj = this._layers[input.layerId];
+		if (input.checked && !obj.overlay) {
+			return obj.layer;
+		}
+	}
 }
 });
--- a/WebContent/base/leaflet/L.MouseMarker.js
+++ b/WebContent/base/leaflet/L.MouseMarker.js
@ -34,6 +34,13 @@ L.MouseMarker = L.Marker.extend({
 		}
 	},
 	
+	setLabel: function( label ) {
+		if(this._icon) {
+			this._icon.lastChild.innerHTML=label;
+			this._icon.lastChild.style.display = "block";
+		}
+	},
+	
 	_changeIcon: function () {
 		var options = this.options;

--- a/WebContent/base/leaflet/L.SwitchableIcon.js
+++ b/WebContent/base/leaflet/L.SwitchableIcon.js
@ -80,8 +80,16 @@ L.SwitchableIcon = L.Class.extend({
 	_createImg: function (src) {
 		var el;
 		if (!L.Browser.ie6) {
-			el = document.createElement('img');
-			el.src = src;
+			el = document.createElement('div');
+			
+			var img = document.createElement('img');
+			var num = document.createElement('div');
+			img.src = src;
+			num.className = 'via-counter';
+			num.innerHTML = "";
+			
+			el.appendChild(img);
+			el.appendChild(num);
 		} else {
 			el = document.createElement('div');
 			el.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + src + '")';
@ -106,7 +114,7 @@ L.SwitchableIcon = L.Class.extend({
 	
 	_switchImg: function (src, el) {
 		if (!L.Browser.ie6) {
-			el.src = src;
+			el.firstChild.src = src;
 		} else {
 			el.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + src + '")';
 		}
--- a/WebContent/base/leaflet/L.TileLayer.Bing.js
+++ b/WebContent/base/leaflet/L.TileLayer.Bing.js
@ -0,0 +1,191 @@
+/* 
+ * Portions of this code and logic copied from OpenLayers and
+ * redistributed under the original Clear BSD license terms:
+ * 
+ * http://trac.osgeo.org/openlayers/browser/license.txt
+ *
+ * Copyright 2005-2010 OpenLayers Contributors, released under 
+ * the Clear BSD license. See authors.txt for a list of contributors.
+ * All rights reserved.
+ *
+ * --
+ *
+ * Leaflet-specific modifications are released under the following
+ * terms:
+ *
+ * This program is free software. It comes without any warranty, to
+ * the extent permitted by applicable law. You can redistribute it
+ * and/or modify it under the terms of the Do What The Fuck You Want
+ * To Public License, Version 2, as published by Sam Hocevar. See
+ * http://sam.zoy.org/wtfpl/COPYING for more details. 
+ */
+
+L.TileLayer.Bing = L.TileLayer.extend({
+  
+  supportedTypes: ['Road', 'Aerial', 'AerialWithLabels'],
+  
+  attributionTemplate: '<span style="display:inline-block">' +
+       '<a target="_blank" href="http://www.bing.com/maps/">' +
+       //'<img src="{logo}" /></a><br><span>{copyrights}' +
+       '</a><span>{copyrights}' +
+       '<a style="white-space: nowrap" target="_blank" '+
+       'href="http://www.microsoft.com/maps/product/terms.html">' +
+       'Terms of Use</a></span></span>',
+       
+  supportedCultures: {"en":"en-US", "de":"de-DE", "fr":"fr-FR", "it":"it-IT", "es":"es-ES", "nl":"nl-BE"},
+  
+  initialize: function(/*String*/ apiKey, /*String*/ mapType, /*Object*/ options) {
+    
+    this._apiKey = apiKey;
+    this._mapType = mapType;
+    
+    this._loadMetadata();
+    
+    L.Util.setOptions(this, options);
+  },
+  
+  redraw: function() {
+    this._reset();
+    this._update();  
+  },
+  
+  _loadMetadata: function() {
+    this._callbackId = "_l_tilelayer_bing_" + (L.TileLayer.Bing._callbackId++);
+    var that = this;
+    window[this._callbackId] = function() {
+      L.TileLayer.Bing.processMetadata.apply(that, arguments);
+    };
+    
+    var params = {
+      key: this._apiKey,
+      jsonp: this._callbackId,
+      include: 'ImageryProviders'
+    },
+        url = "http://dev.virtualearth.net/REST/v1/Imagery/Metadata/" +
+              this._mapType + L.Util.getParamString(params),
+        script = document.createElement("script");
+        
+    script.type = "text/javascript";
+    script.src = url;
+    script.id = this._callbackId;
+    document.getElementsByTagName("head")[0].appendChild(script);
+  },
+  
+  _onMetadataLoaded: function() {},
+  
+  onAdd: function(map, insertAtTheBottom) {
+    if (!this.metadata) {
+      this._onMetadataLoaded = L.Util.bind(function() {
+        L.TileLayer.prototype.onAdd.call(this, map, insertAtTheBottom);
+        map.on('moveend', this._updateAttribution, this);
+        this._updateAttribution();
+      }, this);
+    } else {
+      L.TileLayer.prototype.onAdd.call(this, map, insertAtTheBottom);
+      map.on('moveend', this._updateAttribution, this);
+      this._updateAttribution();
+    }
+  },
+  
+  onRemove: function(map) {
+    if (this._map.attributionControl) {
+      this._map.attributionControl.removeAttribution(this.attribution);
+    }
+    this._map.off('moveend', this._updateAttribution, this);
+    L.TileLayer.prototype.onRemove.call(this, map);
+  },
+  
+  getTileUrl: function(xy, z) {
+    var subdomains = this.options.subdomains,
+			  quadDigits = [],
+			  i = z,
+			  digit,
+			  mask,
+			  quadKey;
+    // borrowed directly from OpenLayers
+    for (; i > 0; --i) {
+        digit = '0';
+        mask = 1 << (i - 1);
+        if ((xy.x & mask) != 0) {
+            digit++;
+        }
+        if ((xy.y & mask) != 0) {
+            digit++;
+            digit++;
+        }
+        quadDigits.push(digit);
+    }
+
+		return this._url
+				.replace('{culture}', this.supportedCultures[OSRM.Localization.current_language] || "en-US" )
+				.replace('{subdomain}', subdomains[(xy.x + xy.y) % subdomains.length])
+				.replace('{quadkey}', quadDigits.join(""));		
+  },
+  
+  _updateAttribution: function() {
+    if (this._map.attributionControl) {
+      var metadata = this.metadata;
+      var res = metadata.resourceSets[0].resources[0];
+      var bounds = this._map.getBounds();
+      var providers = res.imageryProviders, zoom = this._map.getZoom() + 1,
+          copyrights = "", provider, i, ii, j, jj, bbox, coverage;
+      for (i=0,ii=providers.length; i<ii; ++i) {
+          provider = providers[i];
+          for (j=0,jj=provider.coverageAreas.length; j<jj; ++j) {
+              coverage = provider.coverageAreas[j];
+              if (zoom <= coverage.zoomMax && zoom >= coverage.zoomMin && coverage.bbox.intersects(bounds)) {
+                  copyrights += provider.attribution + " ";
+                  j = jj;
+              }
+          }
+      }
+      this._map.attributionControl.removeAttribution(this.attribution);
+      this._map.attributionControl._attributions = {};
+      this._map.attributionControl._update();
+      this.attribution = this.attributionTemplate
+        .replace('{logo}', metadata.brandLogoUri)
+        .replace('{copyrights}', copyrights);
+      this._map.attributionControl.addAttribution(this.attribution);
+    }
+  }    
+});
+
+L.TileLayer.Bing._callbackId = 0;
+
+L.TileLayer.Bing.processMetadata = function(metadata) {
+  if (metadata.authenticationResultCode != 'ValidCredentials') {
+    throw "Invalid Bing Maps API Key"
+  }
+  
+  if (!metadata.resourceSets.length || !metadata.resourceSets[0].resources.length) {
+    throw "No resources returned, perhaps " + this._mapType + " is an invalid map type?";
+  }
+  
+  if (metadata.statusCode != 200) {
+    throw "Bing Maps API request failed with status code " + metadata.statusCode;
+  }
+  
+  this.metadata = metadata;
+  var res = metadata.resourceSets[0].resources[0],
+      providers = res.imageryProviders,
+      i = 0,
+      j,
+      provider,
+      bbox,
+      script = document.getElementById(this._callbackId);
+  
+  for (; i<providers.length; i++) {
+    provider = providers[i];
+    for (j=0; j<provider.coverageAreas.length; j++) {
+      bbox = provider.coverageAreas[j].bbox;
+      provider.coverageAreas[j].bbox = new L.LatLngBounds(new L.LatLng(bbox[0],bbox[1],true),new L.LatLng(bbox[2],bbox[3], true));
+    }
+  }
+  
+  this._url = res.imageUrl;
+  this.options.subdomains = [].concat(res.imageUrlSubdomains);
+  script.parentNode.removeChild(script);
+  window[this._callbackId] = undefined; // cannot delete from window in IE
+  delete this._callbackId;
+  this._onMetadataLoaded();
+}
--- a/WebContent/base/osrm/OSRM.MapView.js
+++ b/WebContent/base/osrm/OSRM.MapView.js
@ -19,9 +19,9 @@ or see http://www.gnu.org/licenses/agpl.txt.
 // [extending Leaflet L.Map with setView/fitBounds methods that respect UI visibility, better layerControl] 
 OSRM.MapView = L.Map.extend({
 	setViewUI: function(position, zoom, no_animation) {
-		if( OSRM.GUI.visible == true ) {
+		if( OSRM.G.main_handle.boxVisible() ) {
 			var point = this.project( position, zoom);
-			point.x-=OSRM.GUI.width/2;
+			point.x-=OSRM.G.main_handle.boxWidth()/2;
 			position = this.unproject(point,zoom);		
 		}
 		this.setView( position, zoom, no_animation);	
@ -31,8 +31,8 @@ OSRM.MapView = L.Map.extend({
 		var northeast = bounds.getNorthEast();
 		var zoom = this.getBoundsZoom(bounds);
 		var sw_point = this.project( southwest, zoom);
-		if( OSRM.GUI.visible == true )
-			sw_point.x-=OSRM.GUI.width+20;
+		if( OSRM.G.main_handle.boxVisible() )
+			sw_point.x-=OSRM.G.main_handle.boxWidth()+20;
 		else
 			sw_point.x-=20;
 		sw_point.y+=20;
@ -45,16 +45,16 @@ OSRM.MapView = L.Map.extend({
 	},
 	getBoundsUI: function(unbounded) {
 		var bounds = this.getPixelBounds();
-		if( OSRM.GUI.visible == true )
-			bounds.min.x+=OSRM.GUI.width;
+		if( OSRM.G.main_handle.boxVisible() )
+			bounds.min.x+=OSRM.G.main_handle.boxWidth();
 		var sw = this.unproject(new L.Point(bounds.min.x, bounds.max.y), this._zoom, true),
 			ne = this.unproject(new L.Point(bounds.max.x, bounds.min.y), this._zoom, true);
 		return new L.LatLngBounds(sw, ne);		
 	},	
 	getCenterUI: function(unbounded) {
 		var viewHalf = this.getSize();
-		if( OSRM.GUI.visible == true )
-			viewHalf.x += OSRM.GUI.width;
+		if( OSRM.G.main_handle.boxVisible() )
+			viewHalf.x += OSRM.G.main_handle.boxWidth();
 		var centerPoint = this._getTopLeftPoint().add(viewHalf.divideBy(2));
 		
 		return this.unproject(centerPoint, this._zoom, unbounded);
--- a/WebContent/base/osrm/OSRM.Marker.js
+++ b/WebContent/base/osrm/OSRM.Marker.js
@ -95,7 +95,7 @@ onClick: function(e) {
 onDrag: function(e) {
 	this.parent.setPosition( e.target.getLatLng() );
 	if(OSRM.G.markers.route.length>1)
-		OSRM.Routing.getDragRoute();
+		OSRM.Routing.getRoute_Dragging();
 	OSRM.Geocoder.updateLocation( this.parent.label );
 },
 onDragStart: function(e) {
--- a/WebContent/gui/OSRM.GUIBoxGroup.js
+++ b/WebContent/gui/OSRM.GUIBoxGroup.js
@ -0,0 +1,53 @@
+/*
+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.
+*/
+
+// OSRM MainGUI
+// [handles all GUI events that interact with appearance of main window]
+
+
+// OSRM GUIBoxGroup
+// [group UI boxes so that handles can be shown/hidden together]
+
+OSRM.GUIBoxGroup = function() {
+	this._handles = [];
+};
+
+OSRM.extend( OSRM.GUIBoxGroup, {
+add: function( handle ) {
+	this._handles.push( handle );
+	handle.$addToGroup(this);
+},
+select: function( handle ) {
+	for(var i=0; i< this._handles.length; i++) {
+		if( this._handles[i] != handle )
+			this._handles[i].$hideBox();
+		else
+			this._handles[i].$showBox();
+	}
+},
+
+$hide: function() {
+	for(var i=0; i< this._handles.length; i++) {
+		this._handles[i].$hide();
+	}
+},
+$show: function() {
+	for(var i=0; i< this._handles.length; i++) {
+		this._handles[i].$show();
+	}
+}
+});
--- a/WebContent/gui/OSRM.GUIBoxHandle.js
+++ b/WebContent/gui/OSRM.GUIBoxHandle.js
@ -0,0 +1,128 @@
+/*
+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.
+*/
+
+// OSRM GUIBoxHandle
+// [performs showing and hiding of UI boxes]
+
+OSRM.GUIBoxHandle = function( box_name, side, css, transitionStartFct, transitionEndFct  ) {
+	// do not create handle if box does not contain a toggle button
+	var toggle = document.getElementById( box_name + '-toggle');
+	if( toggle == null ) {
+		console.log("[error] No toggle button for " + box_name);
+		return;
+	}
+	
+	// create handle DOM elements
+	var wrapper = document.createElement('div');
+	wrapper.id = box_name + '-handle-wrapper';
+	wrapper.className = 'not-selectable box-wrapper box-handle-wrapper-'+side;
+	wrapper.style.cssText += css;
+	var content = document.createElement('div');
+	content.id = box_name + '-handle-content';
+	content.className = 'box-content box-handle-content-'+side;
+	var icon = document.createElement('div');
+	icon.id = box_name + '-handle-icon';
+	icon.className = 'iconic-button';
+	
+	content.appendChild(icon);
+	wrapper.appendChild(content);
+	document.body.appendChild(wrapper);
+	
+	// create attributes
+	this._box = document.getElementById( box_name + '-wrapper' );
+	this._class = this._box.className;
+	this._width = this._box.clientWidth;
+	this._side = side;
+	this._handle = wrapper;
+	this._box_group = null;
+	this._transitionEndFct = transitionEndFct;
+
+	// hide box and show handle by default
+	this._box.style[this._side]=-this._width+"px";
+	this._box_visible = false;
+	this._handle.style.visibility="visible";
+
+	// add functionality
+	var full_fct = transitionStartFct ? OSRM.concat(this._toggle, transitionStartFct) : this._toggle;
+	var fct = OSRM.bind( this, full_fct );
+	toggle.onclick = fct;
+	icon.onclick = fct;
+	
+	var full_fct = transitionEndFct ? OSRM.concat(this._onTransitionEnd, transitionEndFct) : this._onTransitionEnd;
+	var fct = OSRM.bind( this, full_fct );	
+	if( OSRM.Browser.FF3==-1 && OSRM.Browser.IE6_9==-1 ) {
+		var box_wrapper = document.getElementById(box_name + '-wrapper');
+		box_wrapper.addEventListener("transitionend", fct, false);
+		box_wrapper.addEventListener("webkitTransitionEnd", fct, false);
+		box_wrapper.addEventListener("oTransitionEnd", fct, false);
+		box_wrapper.addEventListener("MSTransitionEnd", fct, false);
+	} else {
+		this._legacyTransitionEndFct = fct;			// legacy browser support
+	}
+};
+
+OSRM.extend( OSRM.GUIBoxHandle, {
+boxVisible: function() {
+	return this._box_visible;
+},
+boxWidth: function() {
+	return this._width;
+},
+
+$addToGroup: function(group) {
+	this._box_group = group;
+},
+$show: function() {
+	this._handle.style.visibility="visible";
+},
+$hide: function() {
+	this._handle.style.visibility="hidden";
+},
+$showBox: function() {
+	this._box_visible = true;
+	this._handle.style.visibility="hidden";
+	this._box.style[this._side]="5px";
+	this._transitionEndFct();
+},
+$hideBox: function() {
+	this._box_visible = false;
+	this._handle.style.visibility="visible";
+	this._box.style[this._side]=-this._width+"px";
+},
+
+_toggle: function() {
+	this._box.className += " box-animated";
+	if( this._box_visible == false ) {
+		this._box_group.$hide();
+		this._box.style[this._side]="5px";
+	} else {
+		this._box.style[this._side]=-this._width+"px";
+	}
+	// legacy browser support
+	if( OSRM.Browser.FF3!=-1 || OSRM.Browser.IE6_9!=-1 )
+		setTimeout(this._legacyTransitionEndFct, 0);
+},
+_onTransitionEnd: function() {
+	this._box.className = this._class;
+	if( this._box_visible == true ) {
+		this._box_group.$show();
+		this._box_visible = false;
+	} else {
+		this._box_visible = true;		
+	}	
+}
+});
--- a/WebContent/gui/OSRM.MainGUI.js
+++ b/WebContent/gui/OSRM.MainGUI.js
@ -21,33 +21,32 @@ or see http://www.gnu.org/licenses/agpl.txt.

 OSRM.GUI.extend( {
 		
-// defaults
-visible: null,
-width: null,
-
 // init GUI
 init: function() {
-	OSRM.GUI.visible = true;
-	OSRM.GUI.width = document.getElementById("main-wrapper").clientWidth;
+	// init main box
+	var main_group = new OSRM.GUIBoxGroup();
+	OSRM.G.main_handle = new OSRM.GUIBoxHandle("main", "left", "left:-5px;top:5px;", OSRM.GUI.beforeMainTransition, OSRM.GUI.afterMainTransition);
+	main_group.add( OSRM.G.main_handle );
+	main_group.select( OSRM.G.main_handle );
+	
+	// init additional boxes
+	var option_group = new OSRM.GUIBoxGroup();
+	var config_handle = new OSRM.GUIBoxHandle("config", "right", "right:-5px;bottom:70px;");
+	var mapping_handle = new OSRM.GUIBoxHandle("mapping", "right", "right:-5px;bottom:25px;");
+	option_group.add( config_handle );
+	option_group.add( mapping_handle );
+	option_group.select( null );
 	
 	// init starting source/target
 	document.getElementById('gui-input-source').value = OSRM.DEFAULTS.ONLOAD_SOURCE;
 	document.getElementById('gui-input-target').value = OSRM.DEFAULTS.ONLOAD_TARGET;
 	
-	// init events
-	document.getElementById("gui-toggle-in").onclick = OSRM.GUI.toggleMain;
-	document.getElementById("gui-toggle-out").onclick = OSRM.GUI.toggleMain;
+	// init units selector
+	OSRM.GUI.selectorInit( "gui-units-toggle", [{display:"Kilometers",value:0},{display:"Miles",value:1}], 0, OSRM.GUI.onUnitsChanged );
 	
-	// gui after transition events
-	if( OSRM.Browser.FF3==-1 && OSRM.Browser.IE6_9==-1 ) {
-		document.getElementById('main-wrapper').addEventListener("transitionend", OSRM.GUI._onMainTransitionEnd, false);
-		document.getElementById('main-wrapper').addEventListener("webkitTransitionEnd", OSRM.GUI._onMainTransitionEnd, false);
-		document.getElementById('main-wrapper').addEventListener("oTransitionEnd", OSRM.GUI._onMainTransitionEnd, false);
-		document.getElementById('main-wrapper').addEventListener("MSTransitionEnd", OSRM.GUI._onMainTransitionEnd, false);
-	}
-	
-	// set default language
-	OSRM.Localization.setLanguage( OSRM.DEFAULTS.LANGUAGE );
+	// query last update of data
+	OSRM.G.data_timestamp = "n/a";
+	OSRM.JSONP.call(OSRM.DEFAULTS.HOST_TIMESTAMP_URL+"?jsonp=%jsonp", OSRM.GUI.setDataTimestamp, OSRM.JSONP.empty, OSRM.DEFAULTS.JSONP_TIMEOUT, 'data_timestamp');
 },

 // set language dependent labels
@ -57,7 +56,7 @@ setLabels: function() {
 	document.getElementById("gui-reset").innerHTML = OSRM.loc("GUI_RESET");
 	document.getElementById("gui-reverse").innerHTML = OSRM.loc("GUI_REVERSE");
 	document.getElementById("gui-option-highlight-nonames-label").innerHTML = OSRM.loc("GUI_HIGHLIGHT_UNNAMED_ROADS");
-	document.getElementById("gui-options-toggle").innerHTML = OSRM.loc("GUI_OPTIONS");
+	document.getElementById("gui-option-show-previous-routes-label").innerHTML = OSRM.loc("GUI_SHOW_PREVIOUS_ROUTES");
 	document.getElementById("gui-search-source").innerHTML = OSRM.loc("GUI_SEARCH");
 	document.getElementById("gui-search-target").innerHTML = OSRM.loc("GUI_SEARCH");
 	document.getElementById("gui-search-source-label").innerHTML = OSRM.loc("GUI_START")+":";
@ -65,57 +64,52 @@ setLabels: function() {
 	document.getElementById("gui-input-source").title = OSRM.loc("GUI_START_TOOLTIP");
 	document.getElementById("gui-input-target").title = OSRM.loc("GUI_END_TOOLTIP");
 	document.getElementById("legal-notice").innerHTML = OSRM.loc("GUI_LEGAL_NOTICE");
+	document.getElementById("gui-mapping-label").innerHTML = OSRM.loc("GUI_MAPPING_TOOLS");
+	document.getElementById("gui-config-label").innerHTML = OSRM.loc("GUI_CONFIGURATION");
+	document.getElementById("gui-language-2-label").innerHTML = OSRM.loc("GUI_LANGUAGE")+":";
+	document.getElementById("gui-units-label").innerHTML = OSRM.loc("GUI_UNITS")+":";
+	document.getElementById('gui-data-timestamp').innerHTML = OSRM.loc("GUI_DATA_TIMESTAMP")+": " + OSRM.G.data_timestamp;
+	
+	document.getElementById("gui-units-toggle").getElementsByTagName("option")[0].innerHTML = OSRM.loc("GUI_KILOMETERS");
+	document.getElementById("gui-units-toggle").getElementsByTagName("option")[1].innerHTML = OSRM.loc("GUI_MILES");
+	OSRM.GUI.selectorOnChange( document.getElementById("gui-units-toggle") );
 },

-//clear output area
+// clear output area
 clearResults: function() {
 	document.getElementById('information-box').innerHTML = "";
 	document.getElementById('information-box-header').innerHTML = "";	
 },

-//show/hide small options bubble
-toggleOptions: function() {
-	if(document.getElementById('options-box').style.visibility=="visible") {
-		document.getElementById('options-box').style.visibility="hidden";
-	} else {
-		document.getElementById('options-box').style.visibility="visible";
+// reposition and hide zoom controls before main box animation
+beforeMainTransition: function() {
+	var zoom_controls = OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom');
+	if( zoom_controls.length > 0)
+		zoom_controls[0].style.visibility="hidden";
+},
+
+// show zoom controls after main box animation
+afterMainTransition: function() {
+	var zoom_controls = OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom');
+	if( zoom_controls.length > 0) {
+		zoom_controls[0].style.left = ( OSRM.G.main_handle.boxVisible() == true ? (OSRM.G.main_handle.boxWidth()+10) : "30") + "px";
+		zoom_controls[0].style.visibility="visible";
 	}
 },

-// show/hide main-gui
-toggleMain: function() {
-	// show main-gui
-	if( OSRM.GUI.visible == false ) {
-		OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom')[0].style.visibility="hidden";
-		OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom')[0].style.left=(OSRM.GUI.width+10)+"px";;
-		
-		document.getElementById('blob-wrapper').style.visibility="hidden";
-		document.getElementById('main-wrapper').style.left="5px";
-	// hide main-gui
-	} else {
-		OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom')[0].style.visibility="hidden";
-		OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom')[0].style.left="30px";
-			
-		document.getElementById('main-wrapper').style.left=-OSRM.GUI.width+"px";
-	}
-
-	// execute after animation (old browser support)
-	if( OSRM.Browser.FF3!=-1 || OSRM.Browser.IE6_9!=-1 )
-		OSRM.GUI._onMainTransitionEnd();		
+// toggle distance units
+onUnitsChanged: function(value) {
+	OSRM.Utils.setToHumanDistanceFunction(value);
+	OSRM.Routing.getRoute();
 },

-// do stuff after main-gui animation finished
-_onMainTransitionEnd: function() {
-	// after hiding main-gui
-	if( OSRM.GUI.visible == true ) {
-		document.getElementById('blob-wrapper').style.visibility="visible";
-		OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom')[0].style.visibility="visible";
-		OSRM.GUI.visible = false;		
-	// after showing main-gui
-	} else {
-		OSRM.Browser.getElementsByClassName(document,'leaflet-control-zoom')[0].style.visibility="visible";
- 		OSRM.GUI.visible = true;		
-	}
+// set timestamp of data
+setDataTimestamp: function(response) {
+	if(!response)
+		return;
+	
+	OSRM.G.data_timestamp = response.timestamp.slice(0,25).replace(/<\/?[^>]+(>|$)/g ,"");	// discard tags
+	document.getElementById('gui-data-timestamp').innerHTML = OSRM.loc("GUI_DATA_TIMESTAMP")+": " + OSRM.G.data_timestamp;
 }

 });
--- a/WebContent/gui/OSRM.RoutingGUI.js
+++ b/WebContent/gui/OSRM.RoutingGUI.js
@ -23,6 +23,9 @@ OSRM.GUI.extend( {
 		
 // init
 init: function() {
+	// init variables
+	OSRM.Utils.setToHumanDistanceFunction(OSRM.DEFAULTS.DISTANCE_FORMAT);
+	
 	// init events
 	document.getElementById("gui-input-source").onchange = function() {OSRM.GUI.inputChanged(OSRM.C.SOURCE_LABEL);};
 	document.getElementById("gui-delete-source").onclick = function() {OSRM.GUI.deleteMarker(OSRM.C.SOURCE_LABEL);};
@ -34,10 +37,10 @@ init: function() {
 	
 	document.getElementById("gui-reset").onclick = OSRM.GUI.resetRouting;
 	document.getElementById("gui-reverse").onclick = OSRM.GUI.reverseRouting;
-	document.getElementById("gui-options-toggle").onclick = OSRM.GUI.toggleOptions;
 	document.getElementById("open-josm").onclick = OSRM.GUI.openJOSM;
 	document.getElementById("open-osmbugs").onclick = OSRM.GUI.openOSMBugs;
-	document.getElementById("option-highlight-nonames").onclick = OSRM.Routing.getZoomRoute;	
+	document.getElementById("option-highlight-nonames").onclick = OSRM.Routing.getRoute_Redraw;
+	document.getElementById("option-show-previous-routes").onclick = OSRM.GUI.showPreviousRoutes;
 },

 // click: button "reset"
@ -45,9 +48,8 @@ resetRouting: function() {
 	document.getElementById('gui-input-source').value = "";
 	document.getElementById('gui-input-target').value = "";
 	
-	OSRM.G.route.hideAll();
-	OSRM.G.markers.removeAll();
-	OSRM.G.markers.highlight.hide();
+	OSRM.G.route.reset();
+	OSRM.G.markers.reset();
 	
 	document.getElementById('information-box').innerHTML = "";
 	document.getElementById('information-box-header').innerHTML = "";
@ -65,7 +67,7 @@ reverseRouting: function() {
 	// recompute route if needed
 	if( OSRM.G.route.isShown() ) {
 		OSRM.G.markers.route.reverse();
-		OSRM.Routing.getRoute();				// temporary route reversal for query, actual reversal done after receiving response
+		OSRM.Routing.getRoute_Reversed();				// temporary route reversal for query, actual reversal done after receiving response
 		OSRM.G.markers.route.reverse();
 		OSRM.G.markers.highlight.hide();
 		OSRM.RoutingDescription.showSimple( OSRM.G.response );
@ -78,7 +80,7 @@ reverseRouting: function() {

 // click: button "show"
 showMarker: function(marker_id) {
-	if( OSRM.JSONP.fences["geocoder_source"] || OSRM.JSONP.fences["geocoder_target"] )
+	if( OSRM.JSONP.fences["geocoder_source"] || OSRM.JSONP.fences["geocoder_target"] )	// needed when focus was on input box and user clicked on button
 		return;
 	
 	if( marker_id == OSRM.C.SOURCE_LABEL && OSRM.G.markers.hasSource() )
@ -134,6 +136,14 @@ deleteMarker: function(marker_id) {
 	OSRM.G.markers.removeMarker( id );
 	OSRM.Routing.getRoute();
 	OSRM.G.markers.highlight.hide();	
+},
+
+//click: checkbox "show previous routes"
+showPreviousRoutes: function(value) {
+	if( document.getElementById('option-show-previous-routes').checked == false)
+		OSRM.G.route.deactivateHistoryRoutes();
+	else
+		OSRM.G.route.activateHistoryRoutes();
 }

 });
--- a/WebContent/gui/OSRM.Selector.js
+++ b/WebContent/gui/OSRM.Selector.js
@ -0,0 +1,67 @@
+/*
+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.
+*/
+
+// OSRM selector
+// [create special selector elements]
+
+
+OSRM.GUI.extend( {
+
+// initialize selector with all options and our look&feel
+selectorInit: function(id, options, selected, onchange_fct) {
+	// create dropdown menu
+	var select = document.getElementById(id);
+	select.className += " styled-select-helper base-font";
+	select.onchange = function() { OSRM.GUI.selectorOnChange(this); onchange_fct(this.value); };	
+		
+	// fill dropdown menu
+	for(var i=0, size=options.length; i<size; i++) {
+		var option=document.createElement("option");
+		option.innerHTML = options[i].display;
+		option.value = options[i].value;
+		select.appendChild(option);
+	}
+	select.value = options[selected].value;
+	
+	// create visible dropdown menu
+	var textnode = document.createTextNode( options[selected].display );
+	var myspan = document.createElement("span");
+	myspan.className = "styled-select base-font";
+	myspan.id = "styled-select-" + select.id;
+	myspan.appendChild(textnode);
+	select.parentNode.insertBefore(myspan, select);
+	myspan.style.width = (select.clientWidth-2)+"px";
+	myspan.style.height = (select.clientHeight)+"px";
+},
+
+// required behaviour of selector on change to switch shown name
+selectorOnChange: function(select) {
+	var option = select.getElementsByTagName("option");	
+	for(var i = 0; i < option.length; i++)
+	if(option[i].selected == true) {
+		document.getElementById("styled-select-" + select.id).childNodes[0].nodeValue = option[i].childNodes[0].nodeValue;
+		break;
+	}
+},
+
+// change selector value
+selectorChange: function(select, value) {
+	select.value = value;
+	OSRM.GUI.selectorOnChange(select);
+}
+
+});
--- a/WebContent/images/config.png
+++ b/WebContent/images/config.png
--- a/WebContent/images/config_active.png
+++ b/WebContent/images/config_active.png
--- a/WebContent/images/config_hover.png
+++ b/WebContent/images/config_hover.png
--- a/WebContent/images/continue.png
+++ b/WebContent/images/continue.png
--- a/WebContent/images/default.png
+++ b/WebContent/images/default.png
--- a/WebContent/images/head.png
+++ b/WebContent/images/head.png
--- a/WebContent/images/mapping.png
+++ b/WebContent/images/mapping.png
--- a/WebContent/images/mapping_active.png
+++ b/WebContent/images/mapping_active.png
--- a/WebContent/images/mapping_hover.png
+++ b/WebContent/images/mapping_hover.png
--- a/WebContent/images/raw/gui.pdf
+++ b/WebContent/images/raw/gui.pdf
--- a/WebContent/images/round-about.png
+++ b/WebContent/images/round-about.png
--- a/WebContent/images/sharp-left.png
+++ b/WebContent/images/sharp-left.png
--- a/WebContent/images/sharp-right.png
+++ b/WebContent/images/sharp-right.png
--- a/WebContent/images/slight-left.png
+++ b/WebContent/images/slight-left.png
--- a/WebContent/images/slight-right.png
+++ b/WebContent/images/slight-right.png
--- a/WebContent/images/target.png
+++ b/WebContent/images/target.png
--- a/WebContent/images/turn-left.png
+++ b/WebContent/images/turn-left.png
--- a/WebContent/images/turn-right.png
+++ b/WebContent/images/turn-right.png
--- a/WebContent/images/u-turn.png
+++ b/WebContent/images/u-turn.png
--- a/WebContent/leaflet/leaflet-src.js
+++ b/WebContent/leaflet/leaflet-src.js
@ -4912,7 +4912,7 @@ L.Control.Attribution = L.Class.extend({
 		var attribs = [];

 		for (var i in this._attributions) {
-			if (this._attributions.hasOwnProperty(i)) {
+			if (this._attributions.hasOwnProperty(i) && this._attributions[i]) {		// DS_CHANGE: fix for attribution bug (also changed in leaflet.js!)
 				attribs.push(i);
 			}
 		}
--- a/WebContent/leaflet/leaflet.js
+++ b/WebContent/leaflet/leaflet.js
--- a/WebContent/localization/OSRM.Locale.de.js
+++ b/WebContent/localization/OSRM.Locale.de.js
@ -20,19 +20,30 @@ or see http://www.gnu.org/licenses/agpl.txt.


 OSRM.Localization["de"] = {
+// own language
+"LANGUAGE": "Deutsch",
 //gui
-"OPEN_JOSM": "JOSM",
-"OPEN_OSMBUGS": "OSM Bugs",
 "GUI_START": "Start",
 "GUI_END": "Ziel",
 "GUI_RESET": "Reset",
 "GUI_SEARCH": "Zeigen",
 "GUI_REVERSE": "Umdrehen",
-"GUI_OPTIONS": "Kartenwerkzeuge",
-"GUI_HIGHLIGHT_UNNAMED_ROADS": "Unbenannte Straßen hervorheben",
 "GUI_START_TOOLTIP": "Startposition eingeben",
 "GUI_END_TOOLTIP": "Zielposition eingeben",
 "GUI_LEGAL_NOTICE": "GUI2 v"+OSRM.VERSION+" "+OSRM.DATE+" - OSRM hosting by <a href='http://algo2.iti.kit.edu/'>KIT</a> - Geocoder by <a href='http://www.osm.org/'>OSM</a>",
+//config
+"GUI_CONFIGURATION": "Einstellungen",
+"GUI_LANGUAGE": "Sprache",
+"GUI_UNITS": "Einheiten",
+"GUI_KILOMETERS": "Kilometer",
+"GUI_MILES": "Meilen",
+"GUI_DATA_TIMESTAMP": "data",
+// mapping
+"GUI_MAPPING_TOOLS": "Kartenwerkzeuge",
+"GUI_HIGHLIGHT_UNNAMED_ROADS": "Unbenannte Straßen hervorheben",
+"GUI_SHOW_PREVIOUS_ROUTES": "Frühere Routen zeigen",
+"OPEN_JOSM": "JOSM",
+"OPEN_OSMBUGS": "OSM Bugs",
 // geocoder
 "SEARCH_RESULTS": "Suchergebnisse",
 "FOUND_X_RESULTS": "%i Ergebnisse gefunden",
@ -52,6 +63,7 @@ OSRM.Localization["de"] = {
 "NO_ROUTE_FOUND": "Keine Route hierher möglich",
 // printing
 "OVERVIEW_MAP": "Übersichtskarte",
+"NO_ROUTE_SELECTED": "Keine Route ausgewählt",
 // directions
 "N": "Norden",
 "E": "Ost",
--- a/WebContent/localization/OSRM.Locale.dk.js
+++ b/WebContent/localization/OSRM.Locale.dk.js
@ -20,19 +20,30 @@ or see http://www.gnu.org/licenses/agpl.txt.


 OSRM.Localization["dk"] = {
+// own language
+"LANGUAGE": "Dansk",
 //gui
-"OPEN_JOSM": "JOSM",
-"OPEN_OSMBUGS": "OSM Fejl",
 "GUI_START": "Start",
 "GUI_END": "Destination",
-"GUI_RESET": "&nbsp;&nbsp;Nulstil&nbsp;&nbsp;",
-"GUI_SEARCH": "&nbsp;&nbsp;Vis&nbsp;&nbsp;",
+"GUI_RESET": "Nulstil",
+"GUI_SEARCH": "Vis",
 "GUI_REVERSE": "Omvendt",
-"GUI_OPTIONS": "Kortlægnings værktøjer",
-"GUI_HIGHLIGHT_UNNAMED_ROADS": "Fremhæv unavngivne veje",
 "GUI_START_TOOLTIP": "Indtast start",
 "GUI_END_TOOLTIP": "Indtast destination",
 "GUI_LEGAL_NOTICE": "GUI2 v"+OSRM.VERSION+" "+OSRM.DATE+" - OSRM hosting af <a href='http://algo2.iti.kit.edu/'>KIT</a> - Geocoder af <a href='http://www.osm.org/'>OSM</a>",
+//config
+"GUI_CONFIGURATION": "Konfiguration",
+"GUI_LANGUAGE": "Sprog",
+"GUI_UNITS": "Enheder",
+"GUI_KILOMETERS": "Kilometer",
+"GUI_MILES": "Miles",
+"GUI_DATA_TIMESTAMP": "data",
+// mapping
+"GUI_MAPPING_TOOLS": "Kortlægnings værktøjer",
+"GUI_HIGHLIGHT_UNNAMED_ROADS": "Fremhæv unavngivne veje",
+"GUI_SHOW_PREVIOUS_ROUTES": "Vis tidligere ruter",
+"OPEN_JOSM": "JOSM",
+"OPEN_OSMBUGS": "OSM Bugs",
 // geocoder
 "SEARCH_RESULTS": "Søgeresultater",
 "FOUND_X_RESULTS": "fandt %i resultater",
--- a/WebContent/localization/OSRM.Locale.en.js
+++ b/WebContent/localization/OSRM.Locale.en.js
@ -20,19 +20,30 @@ or see http://www.gnu.org/licenses/agpl.txt.


 OSRM.Localization["en"] = {
-//gui
-"OPEN_JOSM": "JOSM",
-"OPEN_OSMBUGS": "OSM Bugs",
+// own language
+"LANGUAGE": "English",
+// gui
 "GUI_START": "Start",
 "GUI_END": "End",
 "GUI_RESET": "&nbsp;&nbsp;Reset&nbsp;&nbsp;",
 "GUI_SEARCH": "&nbsp;&nbsp;Show&nbsp;&nbsp;",
 "GUI_REVERSE": "Reverse",
-"GUI_OPTIONS": "Mapping Tools",
-"GUI_HIGHLIGHT_UNNAMED_ROADS": "Highlight unnamed streets",
 "GUI_START_TOOLTIP": "Enter start",
 "GUI_END_TOOLTIP": "Enter destination",
 "GUI_LEGAL_NOTICE": "GUI2 v"+OSRM.VERSION+" "+OSRM.DATE+" - OSRM hosting by <a href='http://algo2.iti.kit.edu/'>KIT</a> - Geocoder by <a href='http://www.osm.org/'>OSM</a>",
+// config
+"GUI_CONFIGURATION": "Configuration",
+"GUI_LANGUAGE": "Language",
+"GUI_UNITS": "Units",
+"GUI_KILOMETERS": "Kilometers",
+"GUI_MILES": "Miles",
+"GUI_DATA_TIMESTAMP": "data",
+// mapping
+"GUI_MAPPING_TOOLS": "Mapping Tools",
+"GUI_HIGHLIGHT_UNNAMED_ROADS": "Highlight unnamed streets",
+"GUI_SHOW_PREVIOUS_ROUTES": "Show previous routes",
+"OPEN_JOSM": "JOSM",
+"OPEN_OSMBUGS": "OSM Bugs",
 // geocoder
 "SEARCH_RESULTS": "Search Results",
 "FOUND_X_RESULTS": "found %i results",
@ -40,7 +51,7 @@ OSRM.Localization["en"] = {
 "NO_RESULTS_FOUND": "No results found",
 "NO_RESULTS_FOUND_SOURCE": "No results found for start",
 "NO_RESULTS_FOUND_TARGET": "No results found for end",
-//routing
+// routing
 "ROUTE_DESCRIPTION": "Route Description",
 "GET_LINK_TO_ROUTE": "Generate Link",
 "GENERATE_LINK_TO_ROUTE": "waiting for link",
@ -50,8 +61,9 @@ OSRM.Localization["en"] = {
 "DURATION": "Duration",
 "YOUR_ROUTE_IS_BEING_COMPUTED": "Your route is being computed",
 "NO_ROUTE_FOUND": "No route possible",
-//printing
+// printing
 "OVERVIEW_MAP": "Overview Map",
+"NO_ROUTE_SELECTED": "No route selected",
 // directions
 "N": "north",
 "E": "east",
@ -88,6 +100,6 @@ OSRM.Localization["en"] = {
 "DIRECTION_15":"You have reached your destination"
 };

-//set GUI language on load
+// set GUI language on load
 if( OSRM.DEFAULTS.LANUGAGE_ONDEMAND_RELOADING == true )
 	OSRM.Localization.setLanguage("en");
--- a/WebContent/localization/OSRM.Locale.fi.js
+++ b/WebContent/localization/OSRM.Locale.fi.js
@ -20,19 +20,30 @@ or see http://www.gnu.org/licenses/agpl.txt.


 OSRM.Localization["fi"] = {
+// own language
+"LANGUAGE": "Suomi",
 //gui
-"OPEN_JOSM": "JOSM",
-"OPEN_OSMBUGS": "OSM Bugs",
 "GUI_START": "Lähtöpaikka",
 "GUI_END": "Määränpää",
-"GUI_RESET": "&nbsp;&nbsp;Tyhjennä&nbsp;&nbsp;",
-"GUI_SEARCH": "&nbsp;&nbsp;Etsi&nbsp;&nbsp;",
+"GUI_RESET": "Tyhjennä",
+"GUI_SEARCH": "Etsi",
 "GUI_REVERSE": "Käänteinen reitti",
-"GUI_OPTIONS": "Kartoitustyökalut",
-"GUI_HIGHLIGHT_UNNAMED_ROADS": "Korosta nimettömät tiet",
 "GUI_START_TOOLTIP": "Syötä lähtöpaikka",
 "GUI_END_TOOLTIP": "Syötä määränpää",
 "GUI_LEGAL_NOTICE": "GUI2 v"+OSRM.VERSION+" "+OSRM.DATE+" - OSRM hosting by <a href='http://algo2.iti.kit.edu/'>KIT</a> - Geocoder by <a href='http://www.osm.org/'>OSM</a>",
+//config
+"GUI_CONFIGURATION": "Kokoonpano",
+"GUI_LANGUAGE": "Kieli",
+"GUI_UNITS": "Yksiköt",
+"GUI_KILOMETERS": "Kilometri",
+"GUI_MILES": "Miles",
+"GUI_DATA_TIMESTAMP": "data",
+// mapping
+"GUI_MAPPING_TOOLS": "Kartoitustyökalut",
+"GUI_HIGHLIGHT_UNNAMED_ROADS": "Korosta nimettömät tiet",
+"GUI_SHOW_PREVIOUS_ROUTES": "Näytä edelliset reitit",
+"OPEN_JOSM": "JOSM",
+"OPEN_OSMBUGS": "OSM Bugs",
 // geocoder
 "SEARCH_RESULTS": "Haun tulokset",
 "FOUND_X_RESULTS": "Löytyi %i vaihtoehtoa",
@ -52,6 +63,7 @@ OSRM.Localization["fi"] = {
 "NO_ROUTE_FOUND": "Reittiä ei löytynyt",
 //printing
 "OVERVIEW_MAP": "Yleiskuvakartta",
+"NO_ROUTE_SELECTED": "Ei reitti valittu",
 // directions
 "N": "pohjoiseen",
 "E": "itään",
--- a/WebContent/localization/OSRM.Locale.fr.js
+++ b/WebContent/localization/OSRM.Locale.fr.js
@ -20,19 +20,30 @@ or see http://www.gnu.org/licenses/agpl.txt.


 OSRM.Localization["fr"] = {
+// own language
+"LANGUAGE": "Français",
 //gui
-"OPEN_JOSM": "JOSM",
-"OPEN_OSMBUGS": "Bugs OSM",
 "GUI_START": "Départ",
 "GUI_END": "Arrivée",
 "GUI_RESET": "Réinitialiser",
 "GUI_SEARCH": "Montrer",
 "GUI_REVERSE": "Inverser",
-"GUI_OPTIONS": "Outils de cartographie",
-"GUI_HIGHLIGHT_UNNAMED_ROADS": "Surligner les rues sans nom",
 "GUI_START_TOOLTIP": "Entrez le lieu de départ",
 "GUI_END_TOOLTIP": "Entrez le lieu d’arrivée",
 "GUI_LEGAL_NOTICE": "GUI2 v"+OSRM.VERSION+" "+OSRM.DATE+" - hébergement par <a href='http://algo2.iti.kit.edu/'>KIT</a> - géocodage par <a href='http://www.osm.org/'>OSM</a>",
+//config
+"GUI_CONFIGURATION": "Configuration",
+"GUI_LANGUAGE": "Langue",
+"GUI_UNITS": "Unités",
+"GUI_KILOMETERS": "Kilomètres",
+"GUI_MILES": "Miles",
+"GUI_DATA_TIMESTAMP": "data",
+// mapping
+"GUI_MAPPING_TOOLS": "Outils de cartographie",
+"GUI_HIGHLIGHT_UNNAMED_ROADS": "Surligner les rues sans nom",
+"GUI_SHOW_PREVIOUS_ROUTES": "Afficher itinéraires précédents",
+"OPEN_JOSM": "JOSM",
+"OPEN_OSMBUGS": "OSM Bugs",
 // geocoder
 "SEARCH_RESULTS": "Résultats de recherche",
 "FOUND_X_RESULTS": "%i résultat(s)",
@ -51,7 +62,8 @@ OSRM.Localization["fr"] = {
 "YOUR_ROUTE_IS_BEING_COMPUTED": "Votre itinéraire est en cours de calcul",
 "NO_ROUTE_FOUND": "Pas d’itinéraire possible",
 //printing
-"OVERVIEW_MAP": "Overview Map",
+"OVERVIEW_MAP": "Carte",
+"NO_ROUTE_SELECTED": "Pas d’itinéraire choisi",
 // directions
 "N": "nord",
 "E": "est",
--- a/WebContent/localization/OSRM.Locale.it.js
+++ b/WebContent/localization/OSRM.Locale.it.js
@ -0,0 +1,104 @@
+/*
+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.
+*/
+
+// OSRM localization
+// [Italian language support]
+
+
+OSRM.Localization["it"] = {
+// own language
+"LANGUAGE": "Italiano",
+//gui
+"GUI_START": "Partenza",
+"GUI_END": "Destinazione",
+"GUI_RESET": "Reset",
+"GUI_SEARCH": "Mostra",
+"GUI_REVERSE": "Inverti",
+"GUI_START_TOOLTIP": "Inserire la Partenza",
+"GUI_END_TOOLTIP": "Inserire la destinazione",
+"GUI_LEGAL_NOTICE": "GUI2 v"+OSRM.VERSION+" "+OSRM.DATE+" - OSRM hosting by <a href='http://algo2.iti.kit.edu/'>KIT</a> - Geocoder by <a href='http://www.osm.org/'>OSM</a>",
+//config
+"GUI_CONFIGURATION": "Configurazione",
+"GUI_LANGUAGE": "Lingua",
+"GUI_UNITS": "Unità",
+"GUI_KILOMETERS": "Chilometri",
+"GUI_MILES": "Miles",
+"GUI_DATA_TIMESTAMP": "data",
+// mapping
+"GUI_MAPPING_TOOLS": "Strumenti per la Mappatura",
+"GUI_HIGHLIGHT_UNNAMED_ROADS": "Evidenzia strade senza nome",
+"GUI_SHOW_PREVIOUS_ROUTES": "Show previous routes",
+"OPEN_JOSM": "JOSM",
+"OPEN_OSMBUGS": "OSM Bugs",
+// geocoder
+"SEARCH_RESULTS": "Risultati della ricerca",
+"FOUND_X_RESULTS": "trovati %i risultati",
+"TIMED_OUT": "Timeout",
+"NO_RESULTS_FOUND": "Nessun risultato trovato",
+"NO_RESULTS_FOUND_SOURCE": "Nessun risultato trovato per la partenza",
+"NO_RESULTS_FOUND_TARGET": "Nessun risultato trovato per la destinazione",
+//routing
+"ROUTE_DESCRIPTION": "Descrizione del percorso",
+"GET_LINK_TO_ROUTE": "Genera un Link",
+"GENERATE_LINK_TO_ROUTE": "in attesa del link",
+"LINK_TO_ROUTE_TIMEOUT": "non disponibile",
+"GPX_FILE": "File GPX",
+"DISTANCE": "Distanza",
+"DURATION": "Durata",
+"YOUR_ROUTE_IS_BEING_COMPUTED": "Sto calcolando il tuo percorso",
+"NO_ROUTE_FOUND": "Nessun percorso possibile",
+//printing
+"OVERVIEW_MAP": "Mappa d'insieme",
+// directions
+"N": "nord",
+"E": "est",
+"S": "sud",
+"W": "ovest",
+"NE": "nordest",
+"SE": "sudest",
+"SW": "sudovest",
+"NW": "nordovest",
+// driving directions
+// %s: road name
+// %d: direction
+// [*]: will only be printed when there actually is a road name
+"DIRECTION_0":"Istruzione sconosciuta[ su <b>%s</b>]",
+"DIRECTION_1":"Continuare[ su <b>%s</b>]",
+"DIRECTION_2":"Girare leggermente a destra[ su <b>%s</b>]",
+"DIRECTION_3":"Girare a destra[ su <b>%s</b>]",
+"DIRECTION_4":"Girare decisamente a destra[ su <b>%s</b>]",
+"DIRECTION_5":"Compire una inversione ad U[ su <b>%s</b>]",
+"DIRECTION_6":"Girare leggermente a sinistra[ su <b>%s</b>]",
+"DIRECTION_7":"Girare a sinistra[ su <b>%s</b>]",
+"DIRECTION_8":"Girare decisamente a sinistra[ su <b>%s</b>]",
+"DIRECTION_10":"Dirigersi a <b>%d</b>[ su <b>%s</b>]",
+"DIRECTION_11-1":"Immettersi nella rotonda ed abbandonarla alla prima uscita[ su <b>%s</b>]",
+"DIRECTION_11-2":"Immettersi nella rotonda ed abbandonarla alla seconda uscita[ su <b>%s</b>]",
+"DIRECTION_11-3":"Immettersi nella rotonda ed abbandonarla alla terza uscita[ su <b>%s</b>]",
+"DIRECTION_11-4":"Immettersi nella rotonda ed abbandonarla alla quarta uscita[ su <b>%s</b>]",
+"DIRECTION_11-5":"Immettersi nella rotonda ed abbandonarla alla quinta uscita[ su <b>%s</b>]",
+"DIRECTION_11-6":"Immettersi nella rotonda ed abbandonarla alla sesta uscita[ su <b>%s</b>]",
+"DIRECTION_11-7":"Immettersi nella rotonda ed abbandonarla alla settima uscita[ su <b>%s</b>]",
+"DIRECTION_11-8":"Immettersi nella rotonda ed abbandonarla alla ottava uscita[ su <b>%s</b>]",
+"DIRECTION_11-9":"Immettersi nella rotonda ed abbandonarla alla nona uscita[ su <b>%s</b>]",
+"DIRECTION_11-x":"Immettersi nella rotonda ed abbandonarla ad una delle tante uscite[ su <b>%s</b>]",
+"DIRECTION_15":"Hai raggiunto la tua destinazione"
+};
+
+//set GUI language on load
+if( OSRM.DEFAULTS.LANUGAGE_ONDEMAND_RELOADING == true )
+	OSRM.Localization.setLanguage("it");
--- a/WebContent/localization/OSRM.Locale.pl.js
+++ b/WebContent/localization/OSRM.Locale.pl.js
@ -20,19 +20,30 @@ or see http://www.gnu.org/licenses/agpl.txt.


 OSRM.Localization["pl"] = {
+// own language
+"LANGUAGE": "Polski",		
 //gui
-"OPEN_JOSM": "JOSM",
-"OPEN_OSMBUGS": "OSM Bugs",
 "GUI_START": "Początek",
 "GUI_END": "Koniec",
-"GUI_RESET": "&nbsp;&nbsp;Reset&nbsp;&nbsp;",
-"GUI_SEARCH": "&nbsp;&nbsp;Pokaż&nbsp;&nbsp;",
+"GUI_RESET": "Reset",
+"GUI_SEARCH": "Pokaż",
 "GUI_REVERSE": "Odwróć",
-"GUI_OPTIONS": "Narzędzia",
-"GUI_HIGHLIGHT_UNNAMED_ROADS": "Zaznacz ulice bez nazwy",
 "GUI_START_TOOLTIP": "Wprowadź początek",
 "GUI_END_TOOLTIP": "Wprowadź koniec",
 "GUI_LEGAL_NOTICE": "GUI2 v"+OSRM.VERSION+" "+OSRM.DATE+" - OSRM hosting: <a href='http://algo2.iti.kit.edu/'>KIT</a> - Geocoder: <a href='http://www.osm.org/'>OSM</a>",
+//config
+"GUI_CONFIGURATION": "Konfiguracja",
+"GUI_LANGUAGE": "Język",
+"GUI_UNITS": "Jednostki",
+"GUI_KILOMETERS": "Kilometrów",
+"GUI_MILES": "Miles",
+"GUI_DATA_TIMESTAMP": "data",
+// mapping
+"GUI_MAPPING_TOOLS": "Narzędzia mapowania",
+"GUI_HIGHLIGHT_UNNAMED_ROADS": "Zaznacz ulice bez nazwy",
+"GUI_SHOW_PREVIOUS_ROUTES": "Pokaż poprzednie trasy",
+"OPEN_JOSM": "JOSM",
+"OPEN_OSMBUGS": "OSM Bugs",
 // geocoder
 "SEARCH_RESULTS": "Wyniki wyszukiwania",
 "FOUND_X_RESULTS": "znaleziono %i wyników",
@ -66,7 +77,7 @@ OSRM.Localization["pl"] = {
 // %d: direction
 // [*]: will only be printed when there actually is a road name
 "DIRECTION_0":"Nieznana instrukcja[ na <b>%s</b>]",
-"DIRECTION_1":"Podążaj[ drogą <b>%s</b>]",
+"DIRECTION_1":"Kontynuuj[ drogą <b>%s</b>]",
 "DIRECTION_2":"Skręć lekko w prawo[ na drogę <b>%s</b>]",
 "DIRECTION_3":"Skręć w prawo[ na drogę <b>%s</b>]",
 "DIRECTION_4":"Skręć ostro w prawo[ na drogę <b>%s</b>]",
@ -74,7 +85,7 @@ OSRM.Localization["pl"] = {
 "DIRECTION_6":"Skręć lekko w lewo[ na drogę <b>%s</b>]",
 "DIRECTION_7":"Skręć w lewo[ na drogę <b>%s</b>]",
 "DIRECTION_8":"Skręć ostro w lewo[ na drogę <b>%s</b>]",
-"DIRECTION_10":"Podążaj <b>%d</b>[ drogą <b>%s</b>]",
+"DIRECTION_10":"Podążaj na <b>%d</b>[ drogą <b>%s</b>]",
 "DIRECTION_11-1":"Wjedź na rondo, zjedź pierwszym zjazdem[ na drogę <b>%s</b>]",
 "DIRECTION_11-2":"Wjedź na rondo, zjedź drugim zjazdem[ na drogę <b>%s</b>]",
 "DIRECTION_11-3":"Wjedź na rondo, zjedź trzecim zjazdem[ na drogę <b>%s</b>]",
--- a/WebContent/localization/OSRM.Localization.js
+++ b/WebContent/localization/OSRM.Localization.js
@ -21,57 +21,45 @@ or see http://www.gnu.org/licenses/agpl.txt.

 OSRM.Localization = {

+// default directory for localization files
+DIRECTORY: "localization/",
+
+// holds currently active language
 current_language: OSRM.DEFAULTS.LANGUAGE,

-// initialize localization
+//initialize localization
 init: function() {
-	// create dropdown menu
-	var select = document.createElement('select');
-	select.id = "gui-language-toggle";
-	select.className = "top-left-button";
-	select.onchange = function() { OSRM.Localization.setLanguage(this.value); };	
-		
-	// fill dropdown menu
+	// fill option list and find default entry
+	var options = [];
+	var options_2 = [];
+	var selected = 0;	
 	var supported_languages = OSRM.DEFAULTS.LANGUAGE_SUPPORTED;
 	for(var i=0, size=supported_languages.length; i<size; i++) {
-		var option=document.createElement("option");
-		option.innerHTML = supported_languages[i].display_name;
-		option.value = supported_languages[i].encoding;
-		select.appendChild(option);
+		options.push( {display:supported_languages[i].encoding, value:supported_languages[i].encoding} );
+		options_2.push( {display:supported_languages[i].name, value:supported_languages[i].encoding} );
+		if( supported_languages[i].encoding == OSRM.DEFAULTS.LANGUAGE )
+			selected=i;
 	}
-	select.value = OSRM.DEFAULTS.LANGUAGE; 
 	
-	// add element to DOM
-	var input_mask_header = document.getElementById('input-mask-header'); 
-	input_mask_header.insertBefore(select,input_mask_header.firstChild);
+	// generate selectors
+	OSRM.GUI.selectorInit("gui-language-toggle", options, selected, OSRM.Localization.setLanguage);
+	OSRM.GUI.selectorInit("gui-language-2-toggle", options_2, selected, OSRM.Localization.setLanguage);
 	
-	// create visible dropdown menu
-	var textnode = document.createTextNode(OSRM.DEFAULTS.LANGUAGE);
-	var myspan = document.createElement("span");
-	myspan.className = "styled-select";
-	myspan.id = "styled-select" + select.id;
-	myspan.appendChild(textnode);
-	select.parentNode.insertBefore(myspan, select);
-	myspan.style.width = (select.clientWidth-2)+"px";
-	myspan.style.height = (select.clientHeight)+"px";
+	// set default language
+	OSRM.Localization.setLanguage( OSRM.DEFAULTS.LANGUAGE );
 },
-
-// perform language change
 setLanguage: function(language) {
+	// change value of both language selectors
+	OSRM.GUI.selectorChange( document.getElementById('gui-language-toggle'), language );
+	OSRM.GUI.selectorChange( document.getElementById('gui-language-2-toggle'), language );
+	
 	if( OSRM.Localization[language]) {
 		OSRM.Localization.current_language = language;
-		// update selector
-		if( select = document.getElementById('gui-language-toggle') ) {		// yes, = not == !
-			var option = select.getElementsByTagName("option");
-			select.value = language;
-			for(var i = 0; i < option.length; i++)
-				if(option[i].selected == true) {
-					document.getElementById("styled-select" + select.id).childNodes[0].nodeValue = option[i].childNodes[0].nodeValue;
-					break;
-				}
-		}		
 		// change gui language		
 		OSRM.GUI.setLabels();
+		// change map language
+		if(OSRM.G.map.layerControl.getActiveLayer().redraw)
+			OSRM.G.map.layerControl.getActiveLayer().redraw();
 		// requery data
 		if( OSRM.G.markers == null )
 			return;
@ -92,7 +80,7 @@ setLanguage: function(language) {
 			if( supported_languages[i].encoding == language) {
 				var script = document.createElement('script');
 				script.type = 'text/javascript';
-				script.src = OSRM.DEFAULTS.LANGUAGE_FILES_DIRECTORY + "OSRM.Locale."+language+".js";
+				script.src = OSRM.Localization.DIRECTORY+"OSRM.Locale."+language+".js";
 				document.head.appendChild(script);
 				break;
 			}
--- a/WebContent/main.css
+++ b/WebContent/main.css
@ -17,35 +17,60 @@ or see http://www.gnu.org/licenses/agpl.txt.

 /* OSRM CSS styles */

+/* ------------------------------------------------------------------------ */

 /* fullscreen map */
 html, body {
    padding: 0;
    margin: 0;
    height: 100%;
+    overflow:hidden;
 }
 #map {
 	height: 100%;
 	z-index: 0;
 }

+/* ------------------------------------------------------------------------ */
+
+/* changes/additions to leaflet styles */
+.via-counter
+{
+	position:absolute;
+	top:-3px;
+	right:-6px;
+	width:16px;
+	border-radius:5px;
+	-moz-border-radius:5px;
+	-webkit-border-radius:5px;
+	background-color:#FFFFFF;
+	text-align:center;
+	vertical-align:middle;	
+	font-size:9px;
+	display:none;
+}
+
+/* ------------------------------------------------------------------------ */

 /* general styles for gui boxes */
-.gui-wrapper
+.box-wrapper
 {
 	position:absolute;
 	border-radius:10px;
 	-moz-border-radius:10px;
 	-webkit-border-radius:10px;
-	background-color:#666666;
 	background-color:rgba(0, 0, 0, 0.25);
-	transition:left 1s;
-	-moz-transition:left 1s;
-	-webkit-transition:left 1s;
-	-o-transition:left 1s;
-	-ms-transition:left 1s;
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3f000000, endColorstr=#3f000000);	
 }
-.gui-box
+.box-animated
+{	
+	transition:left 1s, right 1s;
+	-moz-transition:left 1s,right 1s;
+	-webkit-transition:left 1s,right 1s;
+	-o-transition:left 1s,right 1s;
+	-ms-transition:left 1s,right 1s;	
+}
+.box-content
 {
 	position:absolute;
 	background-color:#ffffff;	
@ -56,31 +81,30 @@ html, body {
 	margin:5px;
 	padding:5px;	
 }
-
-
-/* styles for specific gui boxes */
-#main-wrapper
+.box-handle-wrapper-right
 {
-	width:410px;
-	top:5px;
-	bottom:25px;
-	left:5px;
+	width:36px;
+	height:36px;
+	border-top-right-radius:0px;
+	border-bottom-right-radius:0px;
+	-moz-border-radius-topright:0px;
+	-moz-border-radius-bottomright:0px;
+	-webkit-border-top-right-radius:0px;
+	-webkit-border-bottom-right-radius:0px;
 }
-#main-input
+.box-handle-content-right
 {
-	width:390px;
-	height:200px;
+	width:16px;
+	height:16px;
+	border-top-right-radius:0px;
+	border-bottom-right-radius:0px;
+	-moz-border-radius-topright:0px;
+	-moz-border-radius-bottomright:0px;
+	-webkit-border-top-right-radius:0px;
+	-webkit-border-bottom-right-radius:0px;	
 }
-#main-output
+.box-handle-wrapper-left
 {
-	width:390px;
-	top:220px;			/* main-input.height+2*gui-box.margin+2*gui-box.padding */
-	bottom:0px;
-}
-#blob-wrapper
-{
-	left:-5px;
-	top:5px;
 	width:36px;
 	height:36px;
 	border-top-left-radius:0px;
@ -89,9 +113,8 @@ html, body {
 	-moz-border-radius-bottomleft:0px;
 	-webkit-border-top-left-radius:0px;
 	-webkit-border-bottom-left-radius:0px;
-	visibility:hidden;
 }
-#blob-content
+.box-handle-content-left
 {
 	width:16px;
 	height:16px;
@ -104,6 +127,41 @@ html, body {
 }


+/* general styles for gui box headers */
+.top-left-button
+{
+	float:left;
+	vertical-align:top;
+}
+.top-right-button
+{
+	float:right;
+	vertical-align:top;
+}
+
+/* ------------------------------------------------------------------------ */
+
+/* styles for main gui boxes */
+#main-wrapper
+{
+	width:410px;
+	top:5px;
+	bottom:25px;
+	left:5px;
+}
+#main-input
+{
+	width:390px;
+	height:140px;
+}
+#main-output
+{
+	width:390px;
+	top:160px;			/* main-input.height+2*gui-box.margin+2*gui-box.padding */
+	bottom:0px;
+}
+
+
 /* styles for main-input areas */
 #input-mask-header
 {
@ -113,7 +171,6 @@ html, body {
 	height:50px;
 	background-repeat:no-repeat;
 	background-position:center;
-	background-image:url("images/osrm-logo.png");		
 }
 #input-mask
 {
@ -129,30 +186,6 @@ html, body {
 #gui-language-toggle
 {
 	position:absolute;
-	border: 0px;
-	text-decoration:none;
- 	opacity: 0;
-	filter: alpha(opacity=0);
-	z-index: 5;
-}
-
-.styled-select
-{
-	position:absolute;
-	background: url("images/selector.png");
-	background-repeat:no-repeat;	
-	background-position: top right;
-	padding: 1px 1px 1px 1px;
-	overflow: hidden;
-}
-
-.top-left-button
-{
-	float:left;
-}
-.top-right-button
-{
-	float:right;
 }


@ -220,29 +253,7 @@ html, body {
 }


-/* workaround for invisible scrollbars in Chrome */
-#information-box::-webkit-scrollbar {
-	height: 10px;
-	width: 10px;
-}
-#information-box::-webkit-scrollbar-track {
-    background: #FFFFFF;
-}
-#information-box::-webkit-scrollbar-thumb {
-	min-height: 30px;
-    background: #EEEEEE;
-    border: 1px solid #999999;
-    -webkit-border-radius: 5ex;
-}
-#information-box::-webkit-scrollbar-thumb:hover {
-    background: #F9F9F9;
-}
-#information-box::-webkit-scrollbar-thumb:active {
-    background: #F4F4F4;
-}
-
-
-/* styles for information-box-header */
+/* styles for main-output information-box-header */
 .header-title
 {
 	font-weight:bold;
@ -269,7 +280,29 @@ html, body {
 }


-/* style for information-box table (general) */
+/* styles for main-output information-box -> workaround for invisible scrollbars in Chrome */
+#information-box::-webkit-scrollbar {
+	height: 10px;
+	width: 10px;
+}
+#information-box::-webkit-scrollbar-track {
+    background: #FFFFFF;
+}
+#information-box::-webkit-scrollbar-thumb {
+	min-height: 30px;
+    background: #EEEEEE;
+    border: 1px solid #999999;
+    -webkit-border-radius: 5ex;
+}
+#information-box::-webkit-scrollbar-thumb:hover {
+    background: #F9F9F9;
+}
+#information-box::-webkit-scrollbar-thumb:active {
+    background: #F4F4F4;
+}
+
+
+/* style for main-output information-box -> table (general) */
 .no-results
 {
 	text-align:center;
@ -277,7 +310,7 @@ html, body {
 }


-/* style for information-box table (search results) */
+/* style for main-output information-box -> table (search results) */
 .results
 {
 	border-spacing:0px;
@ -316,7 +349,7 @@ html, body {
 }


-/* style for information-box table (driving directions) */
+/* style for main-output information-box -> table (driving directions) */
 .description
 {
 	border-spacing:0px;
@ -365,6 +398,98 @@ html, body {
 	color:#ff0000
 }

+/* ------------------------------------------------------------------------ */
+
+/* styles for other gui boxes */
+#mapping-wrapper
+{
+	width:410px;
+	height:100px;
+	bottom:25px;
+	right:5px;
+}
+#mapping-content
+{
+	width:390px;
+	height:80px;	
+}
+#config-wrapper
+{
+	width:410px;
+	height:100px;
+	bottom:25px;
+	right:5px;
+}
+#config-content
+{
+	width:390px;
+	height:80px;	
+}
+#notification-wrapper
+{
+	width:600px;
+	height:170px;
+	top: 50%;
+	left: 50%;
+	margin-top:-85px;
+	margin-left:-300px;
+}
+#notification-content
+{
+	width:580px;
+	height:150px;
+}
+#notification-blanket
+{
+	position:absolute;
+	top:0px;
+	left:0px;
+	width:100%;
+	height:100%;
+	background-color:rgba(0, 0, 0, 0.25);
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3f000000, endColorstr=#3f000000);
+	z-index:100;
+	display:none;
+}
+
+
+/* styles for content of other gui boxes */
+#gui-language-2-toggle
+{
+	position:relative;
+}
+#gui-units-toggle
+{
+	position:relative;
+}
+.box-label
+{
+	font-weight:bold;
+	margin-bottom:10px;
+}
+.config-label
+{
+	margin: 0px 0px 0px 5px;
+}
+.config-select
+{
+	width:100px;
+}
+.mapping-checkbox
+{
+	margin: 0px 5px 3px 5px;
+	padding: 0px;
+}
+.mapping-button
+{
+	float: right;
+}
+#notification-box
+{
+	margin:5px 5px 5px 5px;
+}
+
+/* ------------------------------------------------------------------------ */

 /* buttons */
 .button
@ -404,88 +529,45 @@ html, body {
 	background-position:center;
 }

-#gui-toggle-out
-{
-	background-image:url("images/cancel.png");	
-}
-#gui-toggle-out:hover
-{
-	background-image:url("images/cancel_hover.png");
-}
-#gui-toggle-out:active
-{
-	background-image:url("images/cancel_active.png");
-}
-
-#gui-toggle-in
-{
-	background-image:url("images/restore.png");	
-}
-#gui-toggle-in:hover
-{
-	background-image:url("images/restore_hover.png");
-}
-#gui-toggle-in:active
-{
-	background-image:url("images/restore_active.png");
-}
-
-#gui-printer
-{
-	background-image:url("images/printer.png");
-}
 #gui-printer-inactive
 {
 	cursor:default;
-	background-image:url("images/printer_inactive.png");
-}
-#gui-printer:hover
-{
-	background-image:url("images/printer_hover.png");
-}
-#gui-printer:active
-{
-	background-image:url("images/printer_active.png");
-}
-
-.delete-marker
-{
-	background-image:url("images/cancel.png");
-}
-.delete-marker:hover
-{
-	background-image:url("images/cancel_hover.png");
-}
-.delete-marker:active
-{
-	background-image:url("images/cancel_active.png");
 }


-/* fonts */
-.base-font {
-	font-family: Verdana, Arial, Helvetica, sans-serif;
-	font-size: 12px;
-	font-weight: normal;
+/* styled select */
+.styled-select-helper
+{
+	border: 0px;
+	text-decoration:none;
+ 	opacity: 0;
+	filter: alpha(opacity=0);
+	z-index: 5;
+	cursor:pointer;
 }
-.big-font {
-	font-family: Verdana, Arial, Helvetica, sans-serif;
-	font-size: 14px;
-	font-weight: bold;	
-}
-.medium-font {
-	font-family: Verdana, Arial, Helvetica, sans-serif;
-	font-size: 10.5px;
-	font-weight: normal;	
-}
-.small-font {
-	font-family: Verdana, Arial, Helvetica, sans-serif;
-	font-size: 9px;
-	font-weight: normal;	
+.styled-select
+{
+	position:absolute;
+	background-repeat:no-repeat;	
+	background-position: top right;
+	padding: 1px 1px 1px 1px;
+	overflow: hidden;
 }


-/* utility styles (defined above buttons, so that buttons retain cursor:pointer)*/
+/* checkboxes */
+input[type=checkbox],
+{
+	cursor:pointer;
+}
+.checkbox-label
+{
+	vertical-align:2px;
+}
+
+/* ------------------------------------------------------------------------ */
+
+/* utility styles */
 .quad
 {
 	min-width:10px;
@ -500,7 +582,6 @@ html, body {
 	-ms-user-select: none;
 	user-select: none;
 }
-
 .text-selectable
 {
 	cursor:default;
@ -510,11 +591,9 @@ html, body {
 	user-select: text;
 }

-.checkbox-label
-{
-	vertical-align:2px;
-}
+/* ------------------------------------------------------------------------ */

+/* table styles */
 .full
 {
 	display:table;
@ -546,3 +625,31 @@ html, body {
 {
 	width:100%;
 }
+.fixed
+{
+	min-width:100px;
+}
+
+/* ------------------------------------------------------------------------ */
+
+/* fonts */
+.base-font {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 12px;
+	font-weight: normal;
+}
+.big-font {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 14px;
+	font-weight: bold;	
+}
+.medium-font {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 10.5px;
+	font-weight: normal;	
+}
+.small-font {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 9px;
+	font-weight: normal;	
+}
--- a/WebContent/main.html
+++ b/WebContent/main.html
@ -41,6 +41,7 @@ or see http://www.gnu.org/licenses/agpl.txt.
 <script src="base/leaflet/L.DashedPolyline.js" type="text/javascript"></script>
 <script src="base/leaflet/L.MouseMarker.js" type="text/javascript"></script>
 <script src="base/leaflet/L.SwitchableIcon.js" type="text/javascript"></script>
+<script src="base/leaflet/L.TileLayer.Bing.js" type="text/javascript"></script>

 <script src="OSRM.base.js" type="text/javascript"></script>
 <script src="OSRM.config.js" type="text/javascript"></script>
@ -57,7 +58,11 @@ or see http://www.gnu.org/licenses/agpl.txt.
 <script src="base/OSRM.Map.js" type="text/javascript"></script>
 <script src="base/OSRM.Markers.js" type="text/javascript"></script>
 <script src="base/OSRM.Routes.js" type="text/javascript"></script>
+<script src="base/OSRM.HistoryRoutes.js" type="text/javascript"></script>
 <script src="gui/OSRM.GUI.js" type="text/javascript"></script>
+<script src="gui/OSRM.GUIBoxGroup.js" type="text/javascript"></script>
+<script src="gui/OSRM.GUIBoxHandle.js" type="text/javascript"></script>
+<script src="gui/OSRM.Selector.js" type="text/javascript"></script>
 <script src="gui/OSRM.MainGUI.js" type="text/javascript"></script>
 <script src="routing/OSRM.Routing.js" type="text/javascript"></script>
 <script src="routing/OSRM.RoutingDescription.js" type="text/javascript"></script>
@ -67,6 +72,7 @@ or see http://www.gnu.org/licenses/agpl.txt.
 <script src="base/OSRM.Via.js" type="text/javascript"></script>
 <script src="base/OSRM.Geocoder.js" type="text/javascript"></script>

+<script src="utils/OSRM.CSS.js" type="text/javascript"></script>
 <script src="utils/OSRM.JSONP.js" type="text/javascript"></script>
 <script src="localization/OSRM.Localization.js" type="text/javascript"></script>
 <script src="printing/OSRM.Printing.js" type="text/javascript"></script>
@ -77,24 +83,82 @@ or see http://www.gnu.org/licenses/agpl.txt.
 <!-- body -->
 <body class="base-font not-selectable">

-<!--map-->
+<!-- map -->
 <div id="map"></div>

-<!-- show ui blob -->
-<div id="blob-wrapper" class="gui-wrapper">
-<div id="blob-content" class="gui-box">
-   	<div id="gui-toggle-in" class="iconic-button"></div>
+<!-- notification -->
+<div id="notification-blanket">
+<div id="notification-wrapper" class="box-wrapper not-selectable">
+<div id="notification-content" class="box-content">
+	<!-- header -->
+	<div id="notification-toggle" class="iconic-button cancel-marker top-right-button"></div>
+	<div id="notification-label" class="box-label">Notification</div>
+
+	<!-- notification text -->
+	<div id="notification-box"></div>
+</div>
 </div>
 </div>

-<!-- show main gui -->
-<div id="main-wrapper" class="gui-wrapper not-selectable">
+<!-- config gui -->
+<div id="config-wrapper" class="box-wrapper not-selectable">
+<div id="config-content" class="box-content">
+	<!-- header -->
+	<div id="config-toggle" class="iconic-button cancel-marker top-right-button"></div>
+	<div id="gui-config-label" class="box-label">Configuraion</div>
+
+	<!-- config options -->
+	<div class="full">
+	<div class="row">
+	<div class="left fixed"><span id="gui-language-2-label" class="config-label">Language:</span></div>
+	<div class="left stretch"><select id="gui-language-2-toggle" class="config-select"></select></div>
+	</div>
+	<div class="row">
+	<div class="left fixed"><span id="gui-units-label" class="config-label">Units:</span></div>
+	<div class="left stretch"><select id="gui-units-toggle" class="config-select"></select></div>
+	</div>
+	</div>
+	
+	<!-- data timestamp -->
+	<div class="full">
+	<div class="row">	
+	<div class="right small-font"><span id="gui-data-timestamp">data: n/a</span></div>
+	</div>
+	</div>
+</div>
+</div>
+
+<!-- mapping gui -->
+<div id="mapping-wrapper" class="box-wrapper not-selectable">
+<div id="mapping-content" class="box-content">
+	<!-- header -->
+	<div id="mapping-toggle" class="iconic-button cancel-marker top-right-button"></div>
+	<div id="gui-mapping-label" class="box-label">Mapping Tools</div>
+	
+	<!-- header -->
+	<div class="full">
+	<div class="row">
+	<div class="left"><input type="checkbox" id="option-highlight-nonames" value="highlight-nonames" class="mapping-checkbox"/></div>
+	<div class="left stretch"><span id="gui-option-highlight-nonames-label" class="checkbox-label small-font">Highlight unnamed streets</span></div>
+	</div>
+	<div class="row">
+	<div class="left"><input type="checkbox" id="option-show-previous-routes" value="show-previous-routes" class="mapping-checkbox"/></div>
+	<div class="left stretch"><span id="gui-option-show-previous-routes-label" class="checkbox-label small-font">Show previous routes</span></div>
+	</div>
+	</div>
+	<a class="button mapping-button" id="open-osmbugs">OSM Bugs</a><span class="quad mapping-button"></span><a class="button mapping-button" id="open-josm">JOSM</a>
+</div>
+</div>
+
+<!-- main gui -->
+<div id="main-wrapper" class="box-wrapper not-selectable">

 <!-- input box -->
-<div id="main-input" class="gui-box">
+<div id="main-input" class="box-content">
 	<!--  header -->
 	<div id="input-mask-header">
-	<div id="gui-toggle-out" class="iconic-button top-right-button"></div>
+	<select id="gui-language-toggle" class="top-left-button"></select>
+	<div id="main-toggle" class="iconic-button cancel-marker top-right-button"></div>
 	</div>
 	
 	<!--  input mask -->
@ -105,13 +169,13 @@ or see http://www.gnu.org/licenses/agpl.txt.
 	<div id="input-source" class="input-marker">
 	<div class="left"><span  id="gui-search-source-label" class="input-label">Start:</span></div>
 	<div class="center input-box"><input id="gui-input-source" class="input-box" type="text" maxlength="200" value="" title="Enter start" /></div>
-	<div class="left"><div id="gui-delete-source" class="iconic-button delete-marker input-delete"></div></div>
+	<div class="left"><div id="gui-delete-source" class="iconic-button cancel-marker input-delete"></div></div>
 	<div class="right"><a class="button" id="gui-search-source">Show</a></div>
 	</div>
 	<div id="input-target" class="input-marker">
 	<div class="left"><span id="gui-search-target-label" class="input-label">End:</span></div>
 	<div class="center input-box"><input id="gui-input-target" class="input-box" type="text" maxlength="200" value="" title="Enter destination" /></div>	
-	<div class="left"><div id="gui-delete-target" class="iconic-button delete-marker input-delete"></div></div>
+	<div class="left"><div id="gui-delete-target" class="iconic-button cancel-marker input-delete"></div></div>
 	<div class="right"><a class="button" id="gui-search-target">Show</a></div>	
 	</div>
 	</div>
@ -124,31 +188,10 @@ or see http://www.gnu.org/licenses/agpl.txt.
 	<div class="right"><a class="button" id="gui-reverse">Reverse</a></div>
    </div>
    </div>
-
-	<div class="quad"></div>
-
-	<!-- options -->
-	<div id="input-mask-options">
-	
-	<!-- option toggle -->
-	<span id="gui-options-toggle" class="small-font">Mapping Tools</span>
-	
-	<!-- actual options -->
-	<div id="options-box" class="full">
-	<div class="left">
-	<input type="checkbox" id="option-highlight-nonames" value="highlight-nonames" />
-	<span id="gui-option-highlight-nonames-label" class="checkbox-label small-font">Highlight unnamed streets</span>
-	</div>
-	<div class="right">
-	<a class="button" id="open-josm">JOSM</a>
-	<a class="button" id="open-osmbugs">OSM Bugs</a>
-	</div>
-	</div>
-	</div>
 </div>

 <!-- output box -->
-<div id="main-output" class="gui-box">
+<div id="main-output" class="box-content">
 	<div id="information-box-header"></div>
 	<div id="information-box"></div>
 	<div id="legal-notice" class="small-font">GUI2 - OSRM hosting by <a href='http://algo2.iti.kit.edu/'>KIT</a> - Geocoder by <a href='http://www.osm.org/'>OSM</a></div>
--- a/WebContent/main.js
+++ b/WebContent/main.js
@ -23,12 +23,17 @@ or see http://www.gnu.org/licenses/agpl.txt.
 OSRM.init = function() {
 	OSRM.prefetchImages();
 	OSRM.prefetchIcons();
+	OSRM.prefetchCSSIcons();
 	
-	OSRM.Localization.init();
 	OSRM.GUI.init();
 	OSRM.Map.init();
 	OSRM.Printing.init();
 	OSRM.Routing.init();
+	OSRM.Localization.init();	
+	
+	// stop if in maintenance mode
+	if( OSRM.inMaintenance() == true )
+		return;
 	
 	// check if the URL contains some GET parameter, e.g. for showing a route
 	OSRM.parseParameters();
@ -42,7 +47,7 @@ OSRM.init = function() {
 // prefetch images
 OSRM.GLOBALS.images = {};
 OSRM.prefetchImages = function() {
-	var image_list = [	{id:'marker-shadow',					url:L.RELATIVE_ROOT_URL + 'images/marker-shadow.png'},
+	var image_list = [	{id:'marker-shadow',					url:'leaflet/images/marker-shadow.png'},
 	                  	{id:'marker-source',					url:'images/marker-source.png'},
 						{id:'marker-target',					url:'images/marker-target.png'},
 						{id:'marker-via',						url:'images/marker-via.png'},
@ -58,6 +63,12 @@ OSRM.prefetchImages = function() {
 		              	{id:'restore',							url:'images/restore.png'},
 		              	{id:'restore_active',					url:'images/restore_active.png'},
 		              	{id:'restore_hover',					url:'images/restore_hover.png'},
+		              	{id:'config',							url:'images/config.png'},
+		              	{id:'config_active',					url:'images/config_active.png'},
+		              	{id:'config_hover',						url:'images/config_hover.png'},		              	
+		              	{id:'mapping',							url:'images/mapping.png'},
+		              	{id:'mapping_active',					url:'images/mapping_active.png'},
+		              	{id:'mapping_hover',					url:'images/mapping_hover.png'},		              	
 		              	{id:'printer',							url:'images/printer.png'},
 		              	{id:'printer_active',					url:'images/printer_active.png'},
 		              	{id:'printer_hover',					url:'images/printer_hover.png'},
@ -73,7 +84,9 @@ OSRM.prefetchImages = function() {
 		              	{id:'direction_8',						url:'images/sharp-left.png'},
 		              	{id:'direction_10',						url:'images/head.png'},
 		        		{id:'direction_11',						url:'images/round-about.png'},
-		        		{id:'direction_15',						url:'images/target.png'}
+		        		{id:'direction_15',						url:'images/target.png'},
+		        		{id:'osrm-logo',						url:'images/osrm-logo.png'},
+		        		{id:'selector',							url:'images/selector.png'}
 	               ];
 		
 	for(var i=0; i<image_list.length; i++) {
@ -111,6 +124,41 @@ OSRM.prefetchIcons = function() {
 };


+// set css styles for images
+OSRM.prefetchCSSIcons = function() {
+	var css_list = [
+	                	{ id:'#gui-printer-inactive',		image_id:'printer_inactive'},
+	                	{ id:'#gui-printer',				image_id:'printer'},
+	                	{ id:'#gui-printer:hover',			image_id:'printer_hover'},
+	                	{ id:'#gui-printer:active',			image_id:'printer_active'},
+	                	
+	                	{ id:'.cancel-marker',				image_id:'cancel'},
+	                	{ id:'.cancel-marker:hover',		image_id:'cancel_hover'},
+	                	{ id:'.cancel-marker:active',		image_id:'cancel_active'},
+	                	
+	                	{ id:'#input-mask-header',			image_id:'osrm-logo'},
+	                	{ id:'.styled-select',				image_id:'selector'},
+	                	
+	                	{ id:'#config-handle-icon',			image_id:'config'},
+	                	{ id:'#config-handle-icon:hover',	image_id:'config_hover'},
+	                	{ id:'#config-handle-icon:active',	image_id:'config_active'},
+	                	           	
+	                	{ id:'#mapping-handle-icon',		image_id:'mapping'},
+	                	{ id:'#mapping-handle-icon:hover',	image_id:'mapping_hover'},
+	                	{ id:'#mapping-handle-icon:active',	image_id:'mapping_active'},
+	                	          	
+	                	{ id:'#main-handle-icon',			image_id:'restore'},
+	                	{ id:'#main-handle-icon:hover',		image_id:'restore_hover'},
+	                	{ id:'#main-handle-icon:active',	image_id:'restore_active'}	                	
+	                ];
+	
+	var stylesheet = OSRM.CSS.getStylesheet("main.css");
+	for(var i=0; i<css_list.length; i++) {
+		OSRM.CSS.insert( stylesheet, css_list[i].id, "background-image:url("+ OSRM.G.images[css_list[i].image_id].getAttribute("src") + ");" );
+	}
+};
+
+
 //parse URL GET parameters
 OSRM.parseParameters = function(){
 	var called_url = document.location.search.substr(1,document.location.search.length);
@ -135,6 +183,12 @@ OSRM.parseParameters = function(){
 		if(name_val[0] == 'hl') {
 			OSRM.Localization.setLanguage(name_val[1]);
 		}
+		else if(name_val[0] == 'df') {
+			var type = parseInt(name_val[1]);
+			if(type != 0 && type != 1)
+				return;
+			OSRM.Utils.setToHumanDistanceFunction(type);
+		}		
 		else if(name_val[0] == 'loc') {
 			var coordinates = unescape(name_val[1]).split(',');
 			if(coordinates.length!=2 || !OSRM.Utils.isLatitude(coordinates[0]) || !OSRM.Utils.isLongitude(coordinates[1]) )
@ -213,5 +267,17 @@ OSRM.parseParameters = function(){
 };


+// check whether to activate maintenance mode
+OSRM.inMaintenance = function(){
+	if( OSRM.DEFAULTS.MAINTENANCE == true ) {
+		document.getElementById('notification-blanket').style.display = "block";
+		document.getElementById('notification-label').innerHTML = OSRM.DEFAULTS.MAINTENANCE_HEADER;
+		document.getElementById('notification-box').innerHTML = OSRM.DEFAULTS.MAINTENANCE_TEXT;
+		document.getElementById('notification-toggle').style.display = "none";
+		return true;
+	}
+	return false;
+};
+
 // onload event
 OSRM.Browser.onLoadHandler( OSRM.init );
--- a/WebContent/printing/OSRM.Printing.js
+++ b/WebContent/printing/OSRM.Printing.js
@ -21,6 +21,10 @@ or see http://www.gnu.org/licenses/agpl.txt.

 OSRM.Printing = {
 		
+// directory with printing code, and base OSRM directory relative to this directory
+DIRECTORY: 'printing/',
+BASE_DIRECTORY: '../',
+		
 // create UI for printing in mainwindow
 init: function() {
 	var icon = document.createElement('div');
@ -35,6 +39,12 @@ init: function() {
 	input_mask_header.appendChild(icon,input_mask_header.lastChild);
 	
 	document.getElementById("gui-printer-inactive").onclick = OSRM.Printing.openPrintWindow;
+	
+	OSRM.Browser.onUnloadHandler( OSRM.Printing.uninit );	
+},
+uninit: function() {
+	if(OSRM.G.printwindow)
+		OSRM.G.printwindow.close();
 },
 		

@ -52,7 +62,47 @@ deactivate: function() {	// use hide route as trigger
 // create UI in printwindow
 show: function(response) {
 	// create header
-	var header = 
+	var header;
+	if( OSRM.Browser.IE6_8 ) {	// tables used for compatibility with legacy IE (quirks mode)
+		header =
+		'<thead class="description-header"><tr><td colspan="3">' +
+		
+		'<table class="full">' +
+		'<tr class="row">' +
+		
+		'<td class="left stretch">' +
+		'<table class="full">' +
+		'<tr class="row">' +
+		'<td class="left description-header-label">' + OSRM.loc("GUI_START")+ ': </td>' +
+		'<td class="left description-header-content stretch">' + document.getElementById("gui-input-source").value + '</td>' +
+		'</tr>' +
+		'<tr class="row">' +
+		'<td class="left description-header-label">' + OSRM.loc("GUI_END")+ ': </td>' +
+		'<td class="left description-header-content stretch">' + document.getElementById("gui-input-target").value + '</td>' +
+		'</tr>' +		
+		'</table>' +
+		'</td>' +
+		
+		'<td class="left">' +
+		'<table class="full">' +
+		'<tr class="row">' +
+		'<td class="left description-header-label">' +  OSRM.loc("DISTANCE")+': </td>' +
+		'<td class="left description-header-content">' + OSRM.Utils.toHumanDistance(response.route_summary.total_distance) + '</td>' +
+		'</tr>' +
+		'<tr class="row">' +
+		'<td class="left description-header-label">' +  OSRM.loc("DURATION")+': </td>' +
+		'<td class="left description-header-content">' + OSRM.Utils.toHumanTime(response.route_summary.total_time) + '</td>' +
+		'</tr>' +
+		'</table>' +
+		'</td>' +
+		
+		'</tr>' +
+		'</table>' +
+		
+		'<div class="quad"></div>' + 
+		'</td></tr></thead>';
+	} else {
+		header = 
 		'<thead class="description-header"><tr><td colspan="3">' +
 		
 		'<div class="full">' +
@ -75,11 +125,11 @@ show: function(response) {
 		'<div class="full">' +
 		'<div class="row">' +
 		'<div class="left description-header-label">' +  OSRM.loc("DISTANCE")+': </div>' +
-		'<div class="left description-header-content">' + OSRM.Utils.metersToDistance(response.route_summary.total_distance) + '</div>' +
+		'<div class="left description-header-content">' + OSRM.Utils.toHumanDistance(response.route_summary.total_distance) + '</div>' +
 		'</div>' +
 		'<div class="row">' +
 		'<div class="left description-header-label">' +  OSRM.loc("DURATION")+': </div>' +
-		'<div class="left description-header-content">' + OSRM.Utils.secondsToTime(response.route_summary.total_time) + '</div>' +
+		'<div class="left description-header-content">' + OSRM.Utils.toHumanTime(response.route_summary.total_time) + '</div>' +
 		'</div>' +
 		'</div>' +
 		'</div>' +
@ -89,6 +139,7 @@ show: function(response) {
 		
 		'<div class="quad"></div>' + 
 		'</td></tr></thead>';
+	}

 	// create route description
 	var body = '<tbody class="description-body">';
@ -100,7 +151,7 @@ show: function(response) {
 		body += '<tr class="'+rowstyle+'">';
 		
 		body += '<td class="description-body-directions">';
-		body += '<img class="description-body-direction" src="../'+OSRM.RoutingDescription._getDrivingInstructionIcon(response.route_instructions[i][0])+'" alt="" />';
+		body += '<img class="description-body-direction" src="'+OSRM.Printing.BASE_DIRECTORY+OSRM.RoutingDescription._getDrivingInstructionIcon(response.route_instructions[i][0])+'" alt="" />';
 		body += "</td>";		

 		// build route description
@ -112,8 +163,7 @@ show: function(response) {
 		body += "</td>";
 		
 		body += '<td class="description-body-distance">';
-		if( i != response.route_instructions.length-1 )
-		body += '<b>'+OSRM.Utils.metersToDistance(response.route_instructions[i][2])+'</b>';
+		body += (i == response.route_instructions.length-1) ? '&nbsp;' : '<b>'+OSRM.Utils.toHumanDistance(response.route_instructions[i][2])+'</b>';	// fill last entry with a space
 		body += "</td>";
 		
 		body += "</tr>";
@ -128,28 +178,29 @@ show: function(response) {
 	// draw map
 	var positions = OSRM.G.route.getPositions();
 	var tile_server_id = OSRM.G.map.getActiveLayerId();
-	var zoom = print_window.drawMap( OSRM.DEFAULTS.TILE_SERVERS[tile_server_id], new L.LatLngBounds( positions ) );
+	var zoom = print_window.OSRM.drawMap( OSRM.DEFAULTS.TILE_SERVERS[tile_server_id], new L.LatLngBounds( positions ) );
 	
 	// draw markers
-	print_window.prefetchIcons( OSRM.G.images );
-	print_window.drawMarkers( OSRM.G.markers.route );
+	print_window.OSRM.prefetchIcons( OSRM.G.images );
+	print_window.OSRM.drawMarkers( OSRM.G.markers.route );
 	
 	// draw route & query for better geometry
-	print_window.drawRoute( positions );
+	print_window.OSRM.drawRoute( positions );
 	OSRM.JSONP.call(OSRM.Routing._buildCall()+'&z='+zoom+'&instructions=false', OSRM.Printing.drawRoute, OSRM.Printing.timeoutRoute, OSRM.DEFAULTS.JSONP_TIMEOUT, 'print');
+	// NOTE: simply appended correct zoom level as second zoom parameter to JSONP call -> OSRM API only considers the last one! 
 },
 timeoutRoute: function() {},
 drawRoute: function(response) {
 	if(!response)
 		return;
 	var positions = OSRM.RoutingGeometry._decode(response.route_geometry, 5);
-	OSRM.G.printwindow.drawRoute( positions );
+	OSRM.G.printwindow.OSRM.drawRoute( positions );
 },


 // opens the print window and closes old instances
 openPrintWindow: function() {
-	// do not open window if there is no route to draw
+	// do not open window if there is no route to draw (should never trigger!)
 	if( !OSRM.G.route.isRoute() || !OSRM.G.route.isShown() )
 		return;
 	
@ -158,7 +209,7 @@ openPrintWindow: function() {
 		OSRM.G.printwindow.close();
 	
 	// generate a new window and wait till it has finished loading
-	OSRM.G.printwindow = window.open("printing/printing.html","","width=540,height=500,left=100,top=100,dependent=yes,location=no,menubar=no,scrollbars=yes,status=no,toolbar=no,resizable=yes");
+	OSRM.G.printwindow = window.open( OSRM.Printing.DIRECTORY + "printing.html","","width=540,height=500,left=100,top=100,dependent=yes,location=no,menubar=no,scrollbars=yes,status=no,toolbar=no,resizable=yes");
 },


@ -167,16 +218,34 @@ printWindowLoaded: function(){
 	var print_window = OSRM.G.printwindow;
 	var print_document = print_window.document;
 	
-	// add events
-	print_document.getElementById('gui-printer').onclick = print_window.printWindow;
+	// add css images
+	var css_list = [
+                	{ id:'#gui-printer-inactive',		image_id:'printer_inactive'},
+                	{ id:'#gui-printer',				image_id:'printer'},
+                	{ id:'#gui-printer:hover',			image_id:'printer_hover'},
+                	{ id:'#gui-printer:active',			image_id:'printer_active'}
+                ];
+	var stylesheet = OSRM.CSS.getStylesheet("printing.css", print_document);
+	for(var i=0; i<css_list.length; i++) {
+		OSRM.CSS.insert( stylesheet, css_list[i].id, "background-image:url("+ OSRM.Printing.BASE_DIRECTORY + OSRM.G.images[css_list[i].image_id].getAttribute("src") + ");" );
+	}	
 	
 	// localization 
+	print_window.OSRM.Localization.current_language = OSRM.Localization.current_language; 
 	print_document.getElementById('description-label').innerHTML = OSRM.loc( "ROUTE_DESCRIPTION" );
 	print_document.getElementById('overview-map-label').innerHTML = OSRM.loc( "OVERVIEW_MAP" );	
+	if( !OSRM.G.route.isRoute() || !OSRM.G.route.isShown() ) {		// error message if no route available (can trigger if user refreshes print-window)
+		print_document.getElementById("description").innerHTML = OSRM.loc("NO_ROUTE_SELECTED");
+		return;	
+	}
 	
 	// add routing content
 	OSRM.Printing.show( OSRM.G.response );
 	
+	// add events
+	print_document.getElementById("gui-printer-inactive").id = "gui-printer";	
+	print_document.getElementById('gui-printer').onclick = print_window.printWindow;	
+	
 	// finally, focus on printwindow
 	print_window.focus();
 }
--- a/WebContent/printing/printing.css
+++ b/WebContent/printing/printing.css
@ -17,12 +17,34 @@ or see http://www.gnu.org/licenses/agpl.txt.

 /* OSRM CSS styles for printing*/

+/* ------------------------------------------------------------------------ */
+
 /* page setup */
 body
 {
 	margin: 8px;
 }

+/* ------------------------------------------------------------------------ */
+
+/* changes/additions to leaflet styles */
+.via-counter
+{
+	position:absolute;
+	top:-3px;
+	right:-6px;
+	width:16px;
+	border-radius:5px;
+	-moz-border-radius:5px;
+	-webkit-border-radius:5px;
+	background-color:#FFFFFF;
+	text-align:center;
+	vertical-align:middle;	
+	font-size:9px;
+	display:none;
+}
+
+/* ------------------------------------------------------------------------ */

 /* header area */
 #printing-header
@ -32,13 +54,10 @@ body
 	top:0px;
 	height:20px;
 }
-.top-left-button
-{
-	float:left;
-}
 .top-right-button
 {
 	float:right;
+	vertical-align:top;
 }


@ -60,6 +79,7 @@ div.label
 	margin:5px;
 }

+/* ------------------------------------------------------------------------ */

 /* description content */
 .description
@ -128,72 +148,7 @@ div.label
 }
 }

-
-/* utility styles */
-.quad
-{
-	min-width:10px;
-	min-height:10px;
-}
-@media print {
-.pagebreak
-{
-	page-break-before:always;
-}
-.noprint
-{
-	display:none;
-}
-}
-
-
-/* fonts */
-@media print {
-.base-font {
-	font-family: Times New Roman, Times, serif;
-	font-size: 16px;
-	font-weight: normal;
-}
-.big-font {
-	font-family: Times New Roman, Times, serif;
-	font-size: 18px;
-	font-weight: bold;	
-}
-.medium-font {
-	font-family: Times New Roman, Times, serif;
-	font-size: 14px;
-	font-weight: normal;	
-}
-.small-font {
-	font-family: Times New Roman, Times, serif;
-	font-size: 12px;
-	font-weight: normal;	
-}
-}
-
-@media screen {
-.base-font {
-	font-family: Verdana, Arial, Helvetica, sans-serif;
-	font-size: 12px;
-	font-weight: normal;
-}
-.big-font {
-	font-family: Verdana, Arial, Helvetica, sans-serif;
-	font-size: 14px;
-	font-weight: bold;	
-}
-.medium-font {
-	font-family: Verdana, Arial, Helvetica, sans-serif;
-	font-size: 10.5px;
-	font-weight: normal;	
-}
-.small-font {
-	font-family: Verdana, Arial, Helvetica, sans-serif;
-	font-size: 9px;
-	font-weight: normal;	
-}	
-}
-
+/* ------------------------------------------------------------------------ */

 /* iconic buttons */
 .iconic-button
@ -205,19 +160,39 @@ div.label
 	background-position:center;
 }

-#gui-printer
+#gui-printer-inactive
 {
-	background-image:url("../images/printer.png");
-}
-#gui-printer:hover
-{
-	background-image:url("../images/printer_hover.png");
-}
-#gui-printer:active
-{
-	background-image:url("../images/printer_active.png");
+	cursor:default;
 }

+/* ------------------------------------------------------------------------ */
+
+/* utility styles */
+.quad
+{
+	min-width:10px;
+	min-height:10px;
+}
+.not-selectable
+{
+	cursor:default;
+	-moz-user-select: -moz-none;  
+	-webkit-user-select: none;  
+	-ms-user-select: none;
+	user-select: none;
+}
+@media print {
+.pagebreak
+{
+	page-break-after:always;
+}
+.noprint
+{
+	display:none;
+}
+}
+
+/* ------------------------------------------------------------------------ */

 /* table */
 .full
@ -251,3 +226,52 @@ div.label
 {
 	width:100%;	
 }
+
+/* ------------------------------------------------------------------------ */
+
+/* fonts */
+@media print {
+.base-font {
+	font-family: Times New Roman, Times, serif;
+	font-size: 16px;
+	font-weight: normal;
+}
+.big-font {
+	font-family: Times New Roman, Times, serif;
+	font-size: 18px;
+	font-weight: bold;	
+}
+.medium-font {
+	font-family: Times New Roman, Times, serif;
+	font-size: 14px;
+	font-weight: normal;	
+}
+.small-font {
+	font-family: Times New Roman, Times, serif;
+	font-size: 12px;
+	font-weight: normal;	
+}
+}
+
+@media screen {
+.base-font {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 13px;
+	font-weight: normal;
+}
+.big-font {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 15px;
+	font-weight: bold;	
+}
+.medium-font {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 11px;
+	font-weight: normal;	
+}
+.small-font {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 9px;
+	font-weight: normal;	
+}	
+}
--- a/WebContent/printing/printing.html
+++ b/WebContent/printing/printing.html
@ -28,6 +28,7 @@ or see http://www.gnu.org/licenses/agpl.txt.
 <title>OSRM Website</title>
 <meta name="description" content="OSRM Website"/>
 <meta name="author" content="Dennis Schieferdecker" />
+<meta http-equiv="X-UA-Compatible" content="IE=7,9" />	<!-- use quirks mode to correctly print the map in IE8 -->

 <!-- stylesheets -->
 <link rel="stylesheet" href="../leaflet/leaflet.css" type="text/css"/>
@ -40,27 +41,28 @@ or see http://www.gnu.org/licenses/agpl.txt.
 <script src="../base/leaflet/L.DashedPolyline.js" type="text/javascript"></script>
 <script src="../base/leaflet/L.MouseMarker.js" type="text/javascript"></script>
 <script src="../base/leaflet/L.SwitchableIcon.js" type="text/javascript"></script>
+<script src="../base/leaflet/L.TileLayer.Bing.js" type="text/javascript"></script>
 <script src="../base/osrm/OSRM.MapView.js" type="text/javascript"></script>
 </head>


 <!-- body -->
-<body class="base-font">
+<body class="base-font not-selectable">

 <!--  header -->
 <div id="printing-header" class="noprint">
-<div id="gui-printer" class="iconic-button top-right-button"></div>
+<div id="gui-printer-inactive" class="iconic-button top-right-button"></div>
 </div>

 <!--description-->
-<div id="description-label" class="label">Route Description</div>
+<div id="description-label" class="label"></div>
 <div id="description" class="box"></div>

 <!--map-->
-<div class="pagebreak"></div>
+<div class="pagebreak">&nbsp;</div>
 <div class="quad noprint"></div>
 <div class="quad noprint"></div>
-<div id="overview-map-label" class="label">Overview Map</div>
+<div id="overview-map-label" class="label"></div>
 <div id="overview-map-description" class="box"></div>
 <div id="overview-map"></div>

--- a/WebContent/printing/printing.js
+++ b/WebContent/printing/printing.js
@ -19,8 +19,8 @@ or see http://www.gnu.org/licenses/agpl.txt.
 // [for printing window]

 OSRM = {};
-OSRM.GLOBALS = {};
-OSRM.GUI = { visible:false };
+OSRM.GLOBALS = { main_handle:{boxVisible:function(){return false;}} };	// needed for fitBoundsUI to work
+OSRM.Localization = { current_language:"en"};							// needed for localized map tiles
 OSRM.G = OSRM.GLOBALS;


@ -32,7 +32,7 @@ function printWindow() {

 //prefetch icons
 OSRM.GLOBALS.icons = {};
-prefetchIcons = function(images_list) {
+OSRM.prefetchIcons = function(images_list) {
 	var icon_list = [	{id:'marker-source',					image_id:'marker-source'},
 						{id:'marker-target',					image_id:'marker-target'},
 						{id:'marker-via',						image_id:'marker-via'},
@ -41,8 +41,9 @@ prefetchIcons = function(images_list) {

 	for(var i=0; i<icon_list.length; i++) {
 		var icon = {
-				iconUrl: "../"+images_list[icon_list[i].image_id].getAttribute("src"), iconSize: new L.Point(25, 41), iconAnchor: new L.Point(13, 41),
-				shadowUrl: "../"+images_list["marker-shadow"].getAttribute("src"), shadowSize: new L.Point(41, 41),
+				// absolute directories used for compatibility with legacy IE (quirks mode)
+				iconUrl: images_list[icon_list[i].image_id].src, iconSize: new L.Point(25, 41), iconAnchor: new L.Point(13, 41),
+				shadowUrl: images_list["marker-shadow"].src, shadowSize: new L.Point(41, 41),
 				popupAnchor: new L.Point(0, -33)
 			};
 		OSRM.G.icons[icon_list[i].id] = new L.SwitchableIcon(icon);
@ -51,9 +52,11 @@ prefetchIcons = function(images_list) {


 // function to initialize a map in the new window
-function drawMap(tile_server, bounds) {
+OSRM.drawMap = function(tile_server, bounds) {
 	// setup map
-	var tile_layer = new L.TileLayer(tile_server.url, tile_server.options);
+	var tile_layer;
+	if( tile_server.bing )	tile_layer = new L.TileLayer.Bing(tile_server.apikey, tile_server.type, tile_server.options);
+	else 					tile_layer = new L.TileLayer(tile_server.url, tile_server.options);
 	OSRM.G.map = new OSRM.MapView("overview-map", {
    	center: new L.LatLng(48.84, 10.10),
 	    zoom: 13,
@ -70,29 +73,34 @@ function drawMap(tile_server, bounds) {
 	
 	OSRM.G.map.fitBoundsUI(bounds);
 	return OSRM.G.map.getBoundsZoom(bounds);
-}
+};


 // manage makers
-function drawMarkers( markers ) {
+OSRM.drawMarkers = function( markers ) {
 	OSRM.G.map.addLayer( new L.MouseMarker( markers[0].getPosition(), {draggable:false,clickable:false,icon:OSRM.G.icons['marker-source']} ) );
-	for(var i=1, size=markers.length-1; i<size; i++)
-		OSRM.G.map.addLayer( new L.MouseMarker( markers[i].getPosition(), {draggable:false,clickable:false,icon:OSRM.G.icons['marker-via']} ) );
+	for(var i=1, size=markers.length-1; i<size; i++) {
+		var via_marker = new L.MouseMarker( markers[i].getPosition(), {draggable:false,clickable:false,icon:OSRM.G.icons['marker-via']} );
+		OSRM.G.map.addLayer( via_marker );
+		via_marker.setLabel(i);
+	}
 	OSRM.G.map.addLayer( new L.MouseMarker( markers[markers.length-1].getPosition(), {draggable:false,clickable:false,icon:OSRM.G.icons['marker-target']} ) );
-}
+};


 // manage route
-function drawRoute( positions ) {
-	OSRM.G.route = new L.DashedPolyline();
+OSRM.drawRoute = function( positions ) {
+	if( OSRM.G.route == undefined )
+		OSRM.G.route = new L.DashedPolyline();
 	OSRM.G.route.setLatLngs( positions );
 	OSRM.G.route.setStyle( {dashed:false,clickable:false,color:'#0033FF', weight:5} );
 	OSRM.G.map.addLayer( OSRM.G.route );	
-}
-function updateRoute( positions ) {
+};
+OSRM.updateRoute = function( positions ) {
 	OSRM.G.route.setLatLngs( positions );
-}
+};


-// start populating the window when it is fully loaded
-window.opener.OSRM.Browser.onLoadHandler( window.opener.OSRM.Printing.printWindowLoaded, window );
+// start populating the window when it is fully loaded - and only if it was loaded from OSRM 
+if(window.opener && window.opener.OSRM)
+	window.opener.OSRM.Browser.onLoadHandler( window.opener.OSRM.Printing.printWindowLoaded, window );
--- a/WebContent/routing/OSRM.Routing.js
+++ b/WebContent/routing/OSRM.Routing.js
@ -31,52 +31,34 @@ OSRM.Routing = {
 		
 // init routing data structures
 init: function() {
-	OSRM.G.route = new OSRM.Route();
 	OSRM.G.markers = new OSRM.Markers();	
+	OSRM.G.route = new OSRM.Route();
+	OSRM.G.response = { via_points:[] };
 },


 // -- JSONP processing -- 

 // process JSONP response of routing server
-timeoutRouteSimple: function() {
-	OSRM.RoutingGeometry.showNA();
-	OSRM.RoutingDescription.showNA( OSRM.loc("TIMED_OUT") );
-},
 timeoutRoute: function() {
 	OSRM.RoutingGeometry.showNA();
 	OSRM.RoutingNoNames.showNA();
 	OSRM.RoutingDescription.showNA( OSRM.loc("TIMED_OUT") );
 	OSRM.Routing._snapRoute();	
 },
-timeoutRouteReverse: function() {
-	OSRM.G.markers.reverseMarkers();
-	timeoutRoute();
+timeoutRoute_Dragging: function() {
+	OSRM.RoutingGeometry.showNA();
+	OSRM.RoutingDescription.showNA( OSRM.loc("TIMED_OUT") );
 },
-showRouteSimple: function(response) {
- 	if(!response)
- 		return;
- 	if( !OSRM.G.dragging )		// prevent simple routing when not dragging (required as there can be drag events after a dragstop event!)
- 		return;
- 	
-	if( response.status == 207) {
-		OSRM.RoutingGeometry.showNA();
-		OSRM.RoutingDescription.showNA( OSRM.loc("YOUR_ROUTE_IS_BEING_COMPUTED") );
-	} else {
-		OSRM.RoutingGeometry.show(response);
-		OSRM.RoutingDescription.showSimple(response);
-	}
-	OSRM.Routing._updateHints(response);
-
-	if(OSRM.G.pending)
-		setTimeout(OSRM.Routing.draggingTimeout,1);		
+timeoutRoute_Reversed: function() {
+	OSRM.G.markers.reverseMarkers();
+	OSRM.Routing.timeoutRoute();
 },
 showRoute: function(response) {
 	if(!response)
 		return;
 	
-	OSRM.G.response = response; 
-	OSRM.G.via_points = response.via_points.slice(0);
+	OSRM.G.response = response;	// needed for printing & history routes!
 	if(response.status == 207) {
 		OSRM.RoutingGeometry.showNA();
 		OSRM.RoutingNoNames.showNA();
@ -90,10 +72,30 @@ showRoute: function(response) {
 	}
 	OSRM.Routing._updateHints(response);
 },
-showRouteZooming: function(response) {
+showRoute_Dragging: function(response) {
+ 	if(!response)
+ 		return;
+ 	if( !OSRM.G.dragging )		// prevent simple routing when not dragging (required as there can be drag events after a dragstop event!)
+ 		return;
+
+	OSRM.G.response = response;	// needed for history routes!
+	if( response.status == 207) {
+		OSRM.RoutingGeometry.showNA();
+		OSRM.RoutingDescription.showNA( OSRM.loc("YOUR_ROUTE_IS_BEING_COMPUTED") );
+	} else {
+		OSRM.RoutingGeometry.show(response);
+		OSRM.RoutingDescription.showSimple(response);
+	}
+	OSRM.Routing._updateHints(response);
+
+	if(OSRM.G.pending)
+		setTimeout(OSRM.Routing.draggingTimeout,1);		
+},
+showRoute_Redraw: function(response) {
 	if(!response)
 		return;
 	
+	//OSRM.G.response = response;	// not needed, even harmful as important information is not stored!
 	if(response.status != 207) {
 		OSRM.RoutingGeometry.show(response);
 		OSRM.RoutingNoNames.show(response);
@ -102,7 +104,6 @@ showRouteZooming: function(response) {
 },


-
 //-- main function --

 //generate server calls to query routes
@ -114,33 +115,33 @@ getRoute: function() {
 		return;
 	}
 	OSRM.JSONP.clear('dragging');
-	OSRM.JSONP.clear('zooming');
+	OSRM.JSONP.clear('redraw');
 	OSRM.JSONP.clear('route');
 	OSRM.JSONP.call(OSRM.Routing._buildCall()+'&instructions=true', OSRM.Routing.showRoute, OSRM.Routing.timeoutRoute, OSRM.DEFAULTS.JSONP_TIMEOUT, 'route');
 },
-getZoomRoute: function() {
+getRoute_Reversed: function() {
 	if( OSRM.G.markers.route.length < 2 )
 		return;
 	
 	OSRM.JSONP.clear('dragging');
-	OSRM.JSONP.clear('zooming');
-	OSRM.JSONP.call(OSRM.Routing._buildCall()+'&instructions=true', OSRM.Routing.showRouteZooming, OSRM.Routing.timeoutRoute, OSRM.DEFAULTS.JSONP_TIMEOUT, 'zooming');	
-},
-getDragRoute: function() {
-	OSRM.G.pending = !OSRM.JSONP.call(OSRM.Routing._buildCall()+'&instructions=false', OSRM.Routing.showRouteSimple, OSRM.Routing.timeoutRouteSimple, OSRM.DEFAULTS.JSONP_TIMEOUT, 'dragging');;
-},
-getReverseRoute: function() {
-	if( OSRM.G.markers.route.length < 2 )
-		return;
-	
-	OSRM.JSONP.clear('dragging');
-	OSRM.JSONP.clear('zooming');
+	OSRM.JSONP.clear('redraw');
 	OSRM.JSONP.clear('route');
-	OSRM.JSONP.call(OSRM.Routing._buildCall()+'&instructions=true', OSRM.Routing.showRoute, OSRM.Routing.timeoutRouteReverse, OSRM.DEFAULTS.JSONP_TIMEOUT, 'route');	
+	OSRM.JSONP.call(OSRM.Routing._buildCall()+'&instructions=true', OSRM.Routing.showRoute, OSRM.Routing.timeoutRoute_Reversed, OSRM.DEFAULTS.JSONP_TIMEOUT, 'route');	
+},
+getRoute_Redraw: function() {
+	if( OSRM.G.markers.route.length < 2 )
+		return;
+	
+	OSRM.JSONP.clear('dragging');
+	OSRM.JSONP.clear('redraw');
+	OSRM.JSONP.call(OSRM.Routing._buildCall()+'&instructions=true', OSRM.Routing.showRoute_Redraw, OSRM.Routing.timeoutRoute, OSRM.DEFAULTS.JSONP_TIMEOUT, 'redraw');
+},
+getRoute_Dragging: function() {
+	OSRM.G.pending = !OSRM.JSONP.call(OSRM.Routing._buildCall()+'&instructions=false', OSRM.Routing.showRoute_Dragging, OSRM.Routing.timeoutRoute_Dragging, OSRM.DEFAULTS.JSONP_TIMEOUT, 'dragging');;
 },
 draggingTimeout: function() {
 	OSRM.G.markers.route[OSRM.G.dragid].hint = null;
-	OSRM.Routing.getDragRoute();
+	OSRM.Routing.getRoute_Dragging();
 },

 _buildCall: function() {
@ -148,10 +149,11 @@ _buildCall: function() {
 	source += '?z=' + OSRM.G.map.getZoom() + '&output=json&jsonp=%jsonp&geomformat=cmp';	
 	if(OSRM.G.markers.checksum)
 		source += '&checksum=' + OSRM.G.markers.checksum;
-	for(var i=0,size=OSRM.G.markers.route.length; i<size; i++) {
-		source += '&loc='  + OSRM.G.markers.route[i].getLat().toFixed(6) + ',' + OSRM.G.markers.route[i].getLng().toFixed(6);
-		if( OSRM.G.markers.route[i].hint)
-			source += '&hint=' + OSRM.G.markers.route[i].hint;
+	var markers = OSRM.G.markers.route;
+	for(var i=0,size=markers.length; i<size; i++) {
+		source += '&loc='  + markers[i].getLat().toFixed(6) + ',' + markers[i].getLng().toFixed(6);
+		if( markers[i].hint)
+			source += '&hint=' + markers[i].hint;
 	}
 	return source;
 },
@ -169,15 +171,16 @@ _updateHints: function(response) {

 // snap all markers to the received route
 _snapRoute: function() {
-	var positions = OSRM.G.route.getPositions();
+	var markers = OSRM.G.markers.route;
+	var via_points = OSRM.G.response.via_points;
 	
- 	OSRM.G.markers.route[0].setPosition( positions[0] );
- 	OSRM.G.markers.route[OSRM.G.markers.route.length-1].setPosition( positions[positions.length-1] );
- 	for(var i=0; i<OSRM.G.via_points.length; i++)
-		OSRM.G.markers.route[i+1].setPosition( new L.LatLng(OSRM.G.via_points[i][0], OSRM.G.via_points[i][1]) );
+ 	for(var i=0; i<via_points.length; i++)
+		markers[i].setPosition( new L.LatLng(via_points[i][0], via_points[i][1]) );	

 	OSRM.Geocoder.updateAddress(OSRM.C.SOURCE_LABEL);
 	OSRM.Geocoder.updateAddress(OSRM.C.TARGET_LABEL);
+
+	OSRM.G.markers.relabelViaMarkers();
 }

 };
--- a/WebContent/routing/OSRM.RoutingDescription.js
+++ b/WebContent/routing/OSRM.RoutingDescription.js
@ -22,15 +22,14 @@ or see http://www.gnu.org/licenses/agpl.txt.
 OSRM.RoutingDescription = {
 		
 // route description events
-onClickRouteDescription: function(geometry_index) {
-	var positions = OSRM.G.route.getPositions();
-
-	OSRM.G.markers.highlight.setPosition( positions[geometry_index] );
+onClickRouteDescription: function(lat, lng) {
+	OSRM.G.markers.highlight.setPosition( new L.LatLng(lat, lng) );
 	OSRM.G.markers.highlight.show();
 	OSRM.G.markers.highlight.centerView(OSRM.DEFAULTS.HIGHLIGHT_ZOOM_LEVEL);	
 },
 onClickCreateShortcut: function(src){
 	src += '&z='+ OSRM.G.map.getZoom() + '&center=' + OSRM.G.map.getCenter().lat.toFixed(6) + ',' + OSRM.G.map.getCenter().lng.toFixed(6);
+	src += '&df=' + OSRM.G.DISTANCE_FORMAT;
 	
 	var source = OSRM.DEFAULTS.SHORTENER_PARAMETERS.replace(/%url/, OSRM.DEFAULTS.HOST_SHORTENER_URL+src); 
 	
@ -41,7 +40,7 @@ showRouteLink: function(response){
 	if(!response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER])
 		OSRM.RoutingDescription.showRouteLink_TimeOut();
 	else
-		document.getElementById('route-link').innerHTML = '[<a class="route-link text-selectable" href="' +response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER]+ '">'+response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER]+'</a>]';
+		document.getElementById('route-link').innerHTML = '[<a class="route-link" href="' +response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER]+ '">'+response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER]+'</a>]';
 },
 showRouteLink_TimeOut: function(){
 	document.getElementById('route-link').innerHTML = '['+OSRM.loc("LINK_TO_ROUTE_TIMEOUT")+']';
@ -64,8 +63,8 @@ show: function(response) {
 	var gpx_link = '[<a class="route-link" onClick="document.location.href=\'' + OSRM.DEFAULTS.HOST_ROUTING_URL + query_string + '&output=gpx\';">'+OSRM.loc("GPX_FILE")+'</a>]';
 		
 	// create route description
+	var positions = OSRM.G.route.getPositions();
 	var body = "";
-	
 	body += '<table class="description medium-font">';
 	for(var i=0; i < response.route_instructions.length; i++){
 		//odd or even ?
@ -79,7 +78,8 @@ show: function(response) {
 		body += '</td>';
 		
 		body += '<td class="description-body-items">';
-		body += '<div class="description-body-item" onclick="OSRM.RoutingDescription.onClickRouteDescription('+response.route_instructions[i][3]+')">';
+		var pos = positions[response.route_instructions[i][3]];
+		body += '<div class="description-body-item" onclick="OSRM.RoutingDescription.onClickRouteDescription('+pos.lat.toFixed(6)+","+pos.lng.toFixed(6)+')">';

 		// build route description
 		if( response.route_instructions[i][1] != "" )
@ -92,7 +92,7 @@ show: function(response) {
 		
 		body += '<td class="description-body-distance">';
 		if( i != response.route_instructions.length-1 )
-		body += '<b>'+OSRM.Utils.metersToDistance(response.route_instructions[i][2])+'</b>';
+		body += '<b>'+OSRM.Utils.toHumanDistance(response.route_instructions[i][2])+'</b>';
 		body += "</td>";
 		
 		body += "</tr>";
@ -100,7 +100,7 @@ show: function(response) {
 	body += '</table>';
 	
 	// build header
-	header = OSRM.RoutingDescription._buildHeader(OSRM.Utils.metersToDistance(response.route_summary.total_distance), OSRM.Utils.secondsToTime(response.route_summary.total_time), route_link, gpx_link);	
+	header = OSRM.RoutingDescription._buildHeader(OSRM.Utils.toHumanDistance(response.route_summary.total_distance), OSRM.Utils.toHumanTime(response.route_summary.total_time), route_link, gpx_link);	

 	// update DOM
 	document.getElementById('information-box-header').innerHTML = header;
@ -110,7 +110,7 @@ show: function(response) {
 // simple description
 showSimple: function(response) {
 	// build header
-	header = OSRM.RoutingDescription._buildHeader(OSRM.Utils.metersToDistance(response.route_summary.total_distance), OSRM.Utils.secondsToTime(response.route_summary.total_time), "", "");
+	header = OSRM.RoutingDescription._buildHeader(OSRM.Utils.toHumanDistance(response.route_summary.total_distance), OSRM.Utils.toHumanTime(response.route_summary.total_time), "", "");

 	// update DOM
 	document.getElementById('information-box-header').innerHTML = header;
--- a/WebContent/utils/OSRM.CSS.js
+++ b/WebContent/utils/OSRM.CSS.js
@ -0,0 +1,39 @@
+/*
+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.
+*/
+
+// OSRM CSS manipulator
+// [edit css styles]
+
+OSRM.CSS = {
+	getStylesheet: function(filename, the_document) {
+		the_document = the_document || document;
+		var stylesheets = the_document.styleSheets;
+		for(var i=0, size=stylesheets.length; i<size; i++) {
+			if( stylesheets[i].href.indexOf(filename) >= 0)
+				return stylesheets[i];
+		}
+		return null;
+	},
+	
+	insert: function(stylesheet, selector, rule) {
+		if( stylesheet.addRule ){
+			stylesheet.addRule(selector, rule);
+		} else if( stylesheet.insertRule ){
+            stylesheet.insertRule(selector + ' { ' + rule + ' }', stylesheet.cssRules.length);
+		}
+	}		
+};
--- a/WebContent/utils/OSRM.Utils.js
+++ b/WebContent/utils/OSRM.Utils.js
@ -24,28 +24,46 @@ OSRM.Utils = {
 // [human readabilty functions]

 // human readable time
-secondsToTime: function(seconds){
+toHumanTime: function(seconds){
   seconds = parseInt(seconds);
   minutes = parseInt(seconds/60);
   seconds = seconds%60;
   hours = parseInt(minutes/60);
   minutes = minutes%60;
   if(hours==0){
-   	return minutes + '&nbsp;' + 'min';
+	   return minutes + '&nbsp;' + 'min';
   }
   else{
-   	return hours + '&nbsp;' + 'h' + '&nbsp;' + minutes + '&nbsp;' + 'min';
+	   return hours + '&nbsp;' + 'h' + '&nbsp;' + minutes + '&nbsp;' + 'min';
   }
 },
 //human readable distance
-metersToDistance: function(distance){
-	distance = parseInt(distance);
-	
-	if(distance >= 100000){ return (parseInt(distance/1000))+'&nbsp;' + 'km'; }
-	else if(distance >= 10000){ return (parseInt(distance/1000).toFixed(1))+'&nbsp;' + 'km'; }
-	else if(distance >= 1000){ return (parseFloat(distance/1000).toFixed(2))+'&nbsp;' + 'km'; }
-	else{ return distance+'&nbsp;' + 'm'; }
+setToHumanDistanceFunction: function(type) {
+	OSRM.G.DISTANCE_FORMAT = type;
+	if( type == 1 )
+		OSRM.Utils.toHumanDistance = OSRM.Utils.toHumanDistanceMiles;
+	else
+		OSRM.Utils.toHumanDistance = OSRM.Utils.toHumanDistanceMeters;	
 },
+toHumanDistanceMeters: function(meters){
+	var distance = parseInt(meters);
+	
+	distance = distance / 1000;
+	if(distance >= 100){ return (distance).toFixed(0)+'&nbsp;' + 'km'; }
+	else if(distance >= 10){ return (distance).toFixed(1)+'&nbsp;' + 'km'; }
+	else if(distance >= 0.1){ return (distance).toFixed(2)+'&nbsp;' + 'km'; }
+	else{ return (distance*1000).toFixed(0)+'&nbsp;' + 'm'; }		
+},
+toHumanDistanceMiles: function(meters){
+	var distance = parseInt(meters);
+	
+	distance = distance / 1609.344;
+	if(distance >= 100){ return (distance).toFixed(0)+'&nbsp;' + 'mi'; }
+	else if(distance >= 10){ return (distance).toFixed(1)+'&nbsp;' + 'mi'; }
+	else if(distance >= 0.1){ return (distance).toFixed(2)+'&nbsp;' + 'mi'; }
+	else{ return (distance*5280).toFixed(0)+'&nbsp;' + 'ft'; }
+},
+toHumanDistance: null,


 // [verification routines]
--- a/WebContent/utils/OSRM.browsers.js
+++ b/WebContent/utils/OSRM.browsers.js
@ -25,6 +25,7 @@ or see http://www.gnu.org/licenses/agpl.txt.
 	
 	OSRM.Browser = {
 		FF3:	useragent.search(/Firefox\/3/),
+ 		IE6_8:	useragent.search(/MSIE (6|7|8)/),
 		IE6_9:	useragent.search(/MSIE (6|7|8|9)/)
 	};
 }());
@ -68,3 +69,14 @@ OSRM.Browser.onLoadHandler = function( function_pointer, the_window ) {
 		the_document.attachEvent("onreadystatechange", temp_function);
 	}
 };
+OSRM.Browser.onUnloadHandler = function( function_pointer, the_window ) {
+	the_window = the_window || window;			// default document
+	var the_document = the_window.document;
+	
+	if(the_window.addEventListener) {			// FF, CH, IE9+
+		the_window.addEventListener("unload", function_pointer, false);
+	}
+	else if(the_document.attachEvent) {			// IE8-
+		the_document.attachEvent("onunload", function_pointer);
+	}
+};
--- a/WebContent/utils/OSRM.classes.js
+++ b/WebContent/utils/OSRM.classes.js
@ -15,8 +15,8 @@ Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA
 or see http://www.gnu.org/licenses/agpl.txt.
 */

-// OSRM base class
-// [support for inheritance]
+// OSRM classes
+// [support for inheritance and other function related functionality]

 // declare one class to be a subclass of another class
 // (runs anonymous function to prevent local functions cluttering global namespace)
@ -39,6 +39,23 @@ OSRM.extend = function( target_class, properties ) {
 };


+// bind a function to an execution context, i.e. an object (needed for correcting this pointers)
+OSRM.bind = function( context, fct1 ) {
+	return function() {
+		fct1.apply(context, arguments);
+	};
+};
+
+
+// concatenate the execution of two functions with the same set of parameters
+OSRM.concat = function( fct1, fct2 ) {
+	return function() { 
+		fct1.apply(this,arguments); 
+		fct2.apply(this,arguments); 
+	};
+};
+
+
 // [usage of convenience functions]
 // SubClass = function() {
 // 	SubClass.prototype.base.constructor.apply(this, arguments);