Open-Harbor/osrm-backend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

Merge branch 'trial/printing' into develop

Browse Source 
Conflicts:
	WebContent/OSRM.debug.js
This commit is contained in:
DennisSchiefer 2012-04-11 23:03:24 +02:00
commit 9b599c90f8
22 changed files with 1117 additions and 491 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
WebContent/OSRM.GUI.js
View File

@ -30,23 +30,57 @@ init: function() {
OSRM.GUI.visible = true;
OSRM.GUI.width = document.getElementById("main-wrapper").clientWidth;
// translate
// init favicon
document.getElementById('favicon').href=OSRM.G.images["favicon"].src;
// 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
// [TODO: switch to new event model]
document.getElementById("gui-toggle-in").onclick = OSRM.GUI.toggleMain;
document.getElementById("gui-toggle-out").onclick = OSRM.GUI.toggleMain;
document.getElementById("gui-input-source").onchange = function() {OSRM.RoutingGUI.inputChanged(OSRM.C.SOURCE_LABEL);};
document.getElementById("gui-delete-source").onclick = function() {OSRM.RoutingGUI.deleteMarker(OSRM.C.SOURCE_LABEL);};
document.getElementById("gui-search-source").onclick = function() {OSRM.RoutingGUI.showMarker(OSRM.C.SOURCE_LABEL);};
document.getElementById("gui-input-target").onchange = function() {OSRM.RoutingGUI.inputChanged(OSRM.C.TARGET_LABEL);};
document.getElementById("gui-delete-target").onclick = function() {OSRM.RoutingGUI.deleteMarker(OSRM.C.TARGET_LABEL);};
document.getElementById("gui-search-target").onclick = function() {OSRM.RoutingGUI.showMarker(OSRM.C.TARGET_LABEL);};
document.getElementById("gui-reset").onclick = OSRM.RoutingGUI.resetRouting;
document.getElementById("gui-reverse").onclick = OSRM.RoutingGUI.reverseRouting;
document.getElementById("gui-options-toggle").onclick = OSRM.GUI.toggleOptions;
document.getElementById("open-josm").onclick = OSRM.RoutingGUI.openJOSM;
document.getElementById("open-osmbugs").onclick = OSRM.RoutingGUI.openOSMBugs;
document.getElementById("option-highlight-nonames").onclick = OSRM.Routing.getRoute;
// 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 language dependent labels
setLanguage: function() {
document.getElementById("open-josm").innerHTML = OSRM.loc("OPEN_JOSM");
document.getElementById("open-osmbugs").innerHTML = OSRM.loc("OPEN_OSMBUGS");
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("options-toggle").innerHTML = OSRM.loc("GUI_OPTIONS");
document.getElementById("gui-options-toggle").innerHTML = OSRM.loc("GUI_OPTIONS");
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")+":";
document.getElementById("gui-search-target-label").innerHTML = OSRM.loc("GUI_END")+":";
document.getElementById("input-source-name").title = OSRM.loc("GUI_START_TOOLTIP");
document.getElementById("input-target-name").title = OSRM.loc("GUI_END_TOOLTIP");
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('input-source-name').value = OSRM.DEFAULTS.ONLOAD_SOURCE;
document.getElementById('input-target-name').value = OSRM.DEFAULTS.ONLOAD_TARGET;
},
// show/hide main-gui
@ -66,15 +100,9 @@ toggleMain: function() {
document.getElementById('main-wrapper').style.left=-OSRM.GUI.width+"px";
}
// execute after animation
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);
} else {
// execute after animation (old browser support)
if( OSRM.Browser.FF3!=-1 || OSRM.Browser.IE6_9!=-1 )
OSRM.GUI.onMainTransitionEnd();
}
},
// do stuff after main-gui animation finished
@ -98,6 +126,12 @@ toggleOptions: function() {
} else {
document.getElementById('options-box').style.visibility="visible";
}
},
// clear output area
clearResults: function() {
document.getElementById('information-box').innerHTML = "";
document.getElementById('information-box-header').innerHTML = "";
}
};
};

46
WebContent/OSRM.Geocoder.js
View File

@ -43,7 +43,7 @@ call: function(marker_id, query) {
}
//build request for geocoder
var call = OSRM.DEFAULTS.HOST_GEOCODER_URL + "?format=json" + OSRM.DEFAULTS.GEOCODER_BOUNDS + "&q=" + query;
var call = OSRM.DEFAULTS.HOST_GEOCODER_URL + "?format=json" + OSRM.DEFAULTS.GEOCODER_BOUNDS + "&accept-language="+OSRM.DEFAULTS.LANGUAGE+"&q=" + query;
OSRM.JSONP.call( call, OSRM.Geocoder._showResults, OSRM.Geocoder._showResults_Timeout, OSRM.DEFAULTS.JSONP_TIMEOUT, "geocoder_"+marker_id, {marker_id:marker_id,query:query} );
},
@ -60,7 +60,8 @@ _onclickResult: function(marker_id, lat, lon) {
OSRM.G.markers.route[index].show();
OSRM.G.markers.route[index].centerView();
OSRM.Routing.getRoute();
if( OSRM.G.markers.route.length > 1 )
OSRM.Routing.getRoute();
},
@ -76,9 +77,14 @@ _showResults: function(response, parameters) {
return;
}
// show first result
OSRM.Geocoder._onclickResult(parameters.marker_id, response[0].lat, response[0].lon);
if( OSRM.G.markers.route.length > 1 ) // if a route is displayed, we don't need to show other possible geocoding results
return;
// show possible results for input
var html = "";
html += '<table class="results-table">';
html += '<table class="results-table medium-font">';
for(var i=0; i < response.length; i++){
var result = response[i];
@ -97,23 +103,27 @@ _showResults: function(response, parameters) {
}
html += '</table>';
document.getElementById('information-box-headline').innerHTML = OSRM.loc("SEARCH_RESULTS")+":";
document.getElementById('information-box-header').innerHTML =
"<div class='header-title'>"+OSRM.loc("SEARCH_RESULTS")+"</div>" +
"<div class='header-content'>(found "+response.length+" results)"+"</div>";
document.getElementById('information-box').innerHTML = html;
OSRM.Geocoder._onclickResult(parameters.marker_id, response[0].lat, response[0].lon);
},
_showResults_Empty: function(parameters) {
document.getElementById('information-box-headline').innerHTML = OSRM.loc("SEARCH_RESULTS")+":";
document.getElementById('information-box-header').innerHTML =
"<div class='header-title'>"+OSRM.loc("SEARCH_RESULTS")+"</div>" +
"<div class='header-content'>(found 0 results)"+"</div>";
if(parameters.marker_id == OSRM.C.SOURCE_LABEL)
document.getElementById('information-box').innerHTML = "<br><p style='font-size:14px;font-weight:bold;text-align:center;'>"+OSRM.loc("NO_RESULTS_FOUND_SOURCE")+": "+parameters.query +".<p>";
document.getElementById('information-box').innerHTML = "<div class='no-results big-font'>"+OSRM.loc("NO_RESULTS_FOUND_SOURCE")+": "+parameters.query +"</div>";
else if(parameters.marker_id == OSRM.C.TARGET_LABEL)
document.getElementById('information-box').innerHTML = "<br><p style='font-size:14px;font-weight:bold;text-align:center;'>"+OSRM.loc("NO_RESULTS_FOUND_TARGET")+": "+parameters.query +".<p>";
document.getElementById('information-box').innerHTML = "<div class='no-results big-font'>"+OSRM.loc("NO_RESULTS_FOUND_TARGET")+": "+parameters.query +"</div>";
else
document.getElementById('information-box').innerHTML = "<br><p style='font-size:14px;font-weight:bold;text-align:center;'>"+OSRM.loc("NO_RESULTS_FOUND")+": "+parameters.query +".<p>";
document.getElementById('information-box').innerHTML = "<div class='no-results big-font'>"+OSRM.loc("NO_RESULTS_FOUND")+": "+parameters.query +"</div>";
},
_showResults_Timeout: function() {
document.getElementById('information-box-headline').innerHTML = OSRM.loc("SEARCH_RESULTS")+":";
document.getElementById('information-box').innerHTML = "<br><p style='font-size:14px;font-weight:bold;text-align:center;'>"+OSRM.loc("TIMED_OUT")+".<p>";
document.getElementById('information-box-header').innerHTML =
"<div class='header-title'>"+OSRM.loc("SEARCH_RESULTS")+"</div>" +
"<div class='header-content'>(found 0 results)"+"</div>";
document.getElementById('information-box').innerHTML = "<div class='no-results big-font'>"+OSRM.loc("TIMED_OUT")+"</div>";
},
@ -122,9 +132,9 @@ _showResults_Timeout: function() {
//update geo coordinates in input boxes
updateLocation: function(marker_id) {
if (marker_id == OSRM.C.SOURCE_LABEL && OSRM.G.markers.hasSource()) {
document.getElementById("input-source-name").value = OSRM.G.markers.route[0].getLat().toFixed(6) + ", " + OSRM.G.markers.route[0].getLng().toFixed(6);
document.getElementById("gui-input-source").value = OSRM.G.markers.route[0].getLat().toFixed(6) + ", " + OSRM.G.markers.route[0].getLng().toFixed(6);
} else if (marker_id == OSRM.C.TARGET_LABEL && OSRM.G.markers.hasTarget()) {
document.getElementById("input-target-name").value = OSRM.G.markers.route[OSRM.G.markers.route.length-1].getLat().toFixed(6) + ", " + OSRM.G.markers.route[OSRM.G.markers.route.length-1].getLng().toFixed(6);
document.getElementById("gui-input-target").value = OSRM.G.markers.route[OSRM.G.markers.route.length-1].getLat().toFixed(6) + ", " + OSRM.G.markers.route[OSRM.G.markers.route.length-1].getLng().toFixed(6);
}
},
@ -144,7 +154,7 @@ updateAddress: function(marker_id, do_fallback_to_lat_lng) {
} else
return;
var call = OSRM.DEFAULTS.HOST_REVERSE_GEOCODER_URL + "?format=json" + "&lat=" + lat + "&lon=" + lng;
var call = OSRM.DEFAULTS.HOST_REVERSE_GEOCODER_URL + "?format=json" + "&accept-language="+OSRM.DEFAULTS.LANGUAGE + "&lat=" + lat + "&lon=" + lng;
OSRM.JSONP.call( call, OSRM.Geocoder._showReverseResults, OSRM.Geocoder._showReverseResults_Timeout, OSRM.DEFAULTS.JSONP_TIMEOUT, "reverse_geocoder_"+marker_id, {marker_id:marker_id, do_fallback: do_fallback_to_lat_lng} );
},
@ -192,9 +202,9 @@ _showReverseResults: function(response, parameters) {
// add result to DOM
if(parameters.marker_id == OSRM.C.SOURCE_LABEL && OSRM.G.markers.hasSource() )
document.getElementById("input-source-name").value = address;
document.getElementById("gui-input-source").value = address;
else if(parameters.marker_id == OSRM.C.TARGET_LABEL && OSRM.G.markers.hasTarget() )
document.getElementById("input-target-name").value = address;
document.getElementById("gui-input-target").value = address;
},
_showReverseResults_Timeout: function(response, parameters) {
if(!parameters.do_fallback)
@ -203,4 +213,4 @@ _showReverseResults_Timeout: function(response, parameters) {
OSRM.Geocoder.updateLocation(parameters.marker_id);
}
};
};

8
WebContent/OSRM.Map.js
View File

@ -121,6 +121,8 @@ init: function() {
// initial map position and zoom
var position = new L.LatLng( OSRM.DEFAULTS.ONLOAD_LATITUDE, OSRM.DEFAULTS.ONLOAD_LONGITUDE);
OSRM.G.map.setViewUI( position, OSRM.DEFAULTS.ZOOM_LEVEL);
if (navigator.geolocation && document.URL.indexOf("file://") == -1)
navigator.geolocation.getCurrentPosition(OSRM.Map.geolocationResponse);
// map events
OSRM.G.map.on('zoomend', OSRM.Map.zoomed );
@ -146,6 +148,10 @@ click: function(e) {
OSRM.G.markers.route[index].show();
OSRM.G.markers.route[index].centerView( OSRM.G.map.getZoom() );
OSRM.Routing.getRoute();
}
}
},
geolocationResponse: function(response) {
var latlng = new L.LatLng(response.coords.latitude, response.coords.longitude);
OSRM.G.map.setViewUI(latlng, OSRM.DEFAULTS.ZOOM_LEVEL );
}
};

33
WebContent/OSRM.Markers.js
View File

@ -90,6 +90,7 @@ onClick: function(e) {
OSRM.Routing.getRoute();
OSRM.G.markers.highlight.hide();
OSRM.G.markers.dragger.hide();
},
onDrag: function(e) {
this.parent.setPosition( e.target.getLatLng() );
@ -109,7 +110,9 @@ onDragStart: function(e) {
}
if( this.parent != OSRM.G.markers.highlight)
OSRM.G.markers.highlight.hide();
OSRM.G.markers.highlight.hide();
if( this.parent != OSRM.G.markers.dragger)
OSRM.G.markers.dragger.hide();
if (OSRM.G.route.isShown())
OSRM.G.route.showOldRoute();
},
@ -118,14 +121,14 @@ onDragEnd: function(e) {
this.switchIcon(this.options.baseicon);
this.parent.setPosition( e.target.getLatLng() );
OSRM.Routing.getRoute();
if (OSRM.G.route.isShown()) {
OSRM.Routing.getRoute();
OSRM.G.route.hideOldRoute();
OSRM.G.route.hideUnnamedRoute();
}
if(OSRM.G.route.isShown()==false)
} else {
OSRM.Geocoder.updateAddress(this.parent.label);
OSRM.GUI.clearResults();
}
},
toString: function() {
return "OSRM.RouteMarker: \""+this.label+"\", "+this.position+")";
@ -175,8 +178,8 @@ removeAll: function() {
for(var i=0; i<this.route.length;i++)
this.route[i].hide();
this.route.splice(0, this.route.length);
document.getElementById('delete-source-marker').style.visibility = "hidden";
document.getElementById('delete-target-marker').style.visibility = "hidden";
document.getElementById('gui-delete-source').style.visibility = "hidden";
document.getElementById('gui-delete-target').style.visibility = "hidden";
},
removeVias: function() {
// assert correct route array s - v - t
@ -190,7 +193,7 @@ setSource: function(position) {
this.route[0].setPosition(position);
else
this.route.splice(0,0, new OSRM.RouteMarker(OSRM.C.SOURCE_LABEL, {draggable:true,icon:OSRM.G.icons['marker-source'],dragicon:OSRM.G.icons['marker-source-drag']}, position));
document.getElementById('delete-source-marker').style.visibility = "visible";
document.getElementById('gui-delete-source').style.visibility = "visible";
return 0;
},
setTarget: function(position) {
@ -199,7 +202,7 @@ setTarget: function(position) {
this.route[this.route.length-1].setPosition(position);
else
this.route.splice( this.route.length,0, new OSRM.RouteMarker(OSRM.C.TARGET_LABEL, {draggable:true,icon:OSRM.G.icons['marker-target'],dragicon:OSRM.G.icons['marker-target-drag']}, position));
document.getElementById('delete-target-marker').style.visibility = "visible";
document.getElementById('gui-delete-target').style.visibility = "visible";
return this.route.length-1;
},
setVia: function(id, position) {
@ -217,17 +220,17 @@ removeMarker: function(id) {
// also remove vias if source or target are removed
if( id==0 && this.route[0].label == OSRM.C.SOURCE_LABEL ) {
this.removeVias();
document.getElementById('input-source-name').value = "";
document.getElementById('gui-input-source').value = "";
document.getElementById('information-box').innerHTML = "";
document.getElementById('information-box-headline').innerHTML = "";
document.getElementById('delete-source-marker').style.visibility = "hidden";
document.getElementById('information-box-header').innerHTML = "";
document.getElementById('gui-delete-source').style.visibility = "hidden";
} else if( id == this.route.length-1 && this.route[ this.route.length-1 ].label == OSRM.C.TARGET_LABEL ) {
this.removeVias();
id = this.route.length-1;
document.getElementById('input-target-name').value = "";
document.getElementById('gui-input-target').value = "";
document.getElementById('information-box').innerHTML = "";
document.getElementById('information-box-headline').innerHTML = "";
document.getElementById('delete-target-marker').style.visibility = "hidden";
document.getElementById('information-box-header').innerHTML = "";
document.getElementById('gui-delete-target').style.visibility = "hidden";
}
this.route[id].hide();

7
WebContent/OSRM.debug.js
View File

@ -60,7 +60,10 @@ OSRM.debug.init = function() {
box.appendChild(clear);
box.appendChild(OSRM.debug.content);
};
// onload event
if(document.addEventListener) // FF, CH
document.addEventListener("DOMContentLoaded", OSRM.debug.init, false);
else // IE
OSRM.debug.init();
else
document.onreadystatechange = function(){if(document.readyState == "interactive" || document.readyState == "complete") OSRM.debug.init();};

BIN
WebContent/images/printer.pdf Normal file
View File

Binary file not shown.

BIN
WebContent/images/printer.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 347 B

BIN
WebContent/images/printer_active.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 349 B

BIN
WebContent/images/printer_hover.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 350 B

BIN
WebContent/images/printer_inactive.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 322 B

87
WebContent/localization/OSRM.Locale.de.js Normal file
View File

@ -0,0 +1,87 @@
/*
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
// [German language support]
OSRM.Localization["de"] = {
//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>",
// geocoder
"SEARCH_RESULTS": "Suchergebnisse",
"TIMED_OUT": "Zeitüberschreitung",
"NO_RESULTS_FOUND": "Keine Ergebnisse gefunden",
"NO_RESULTS_FOUND_SOURCE": "Keine Ergebnisse gefunden für Start",
"NO_RESULTS_FOUND_TARGET": "Keine Ergebnisse gefunden für Ziel",
// routing
"ROUTE_DESCRIPTION": "Routenbeschreibung",
"GET_LINK_TO_ROUTE": "Generiere Link",
"GENERATE_LINK_TO_ROUTE": "Warte auf Antwort",
"LINK_TO_ROUTE_TIMEOUT": "nicht möglich",
"GPX_FILE": "GPX Datei",
"DISTANCE": "Distanz",
"DURATION": "Dauer",
"YOUR_ROUTE_IS_BEING_COMPUTED": "Ihre Route wird berechnet",
"NO_ROUTE_FOUND": "Keine Route hierher möglich",
// directions
"N": "Norden",
"O": "Ost",
"S": "Süden",
"W": "Westen",
"NE": "Nordost",
"SE": "Südost",
"SW": "Südwest",
"NW": "Nordwest",
// driving directions
"DIRECTION_0":"Unbekannte Anweisung[ auf <b>%s</b>]",
"DIRECTION_1":"Links abbiegen[ auf <b>%s</b>]",
"DIRECTION_2":"Rechts abbiegen[ auf <b>%s</b>]",
"DIRECTION_3":"Wenden[ auf <b>%s</b>]",
"DIRECTION_4":"Fahren Sie Richtung <b>%s</b>",
"DIRECTION_5":"Geradeaus weiterfahren[ auf <b>%s</b>]",
"DIRECTION_6":"Leicht links abbiegen[ auf <b>%s</b>]",
"DIRECTION_7":"Leicht rechts abbiegen[ auf <b>%s</b>]",
"DIRECTION_8":"Scharf links abbiegen[ auf <b>%s</b>]",
"DIRECTION_9":"Scharf rechts abbiegen[ auf <b>%s</b>]",
"DIRECTION_10":"In den Kreisverkehr einfahren und bei erster Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11":"In den Kreisverkehr einfahren und bei zweiter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_12":"In den Kreisverkehr einfahren und bei dritter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_13":"In den Kreisverkehr einfahren und bei vierter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_14":"In den Kreisverkehr einfahren und bei fünfter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_15":"In den Kreisverkehr einfahren und bei sechster Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_16":"In den Kreisverkehr einfahren und bei siebter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_17":"In den Kreisverkehr einfahren und bei achter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_18":"In den Kreisverkehr einfahren und bei neunter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_19":"In den Kreisverkehr einfahren und bei zehnter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_20":"In den Kreisverkehr einfahren und bei einer der vielen Möglichkeiten[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_21":"Sie haben Ihr Ziel erreicht"
};
// set GUI language on load
OSRM.Localization.change("de");

93
WebContent/OSRM.Localization.js → WebContent/localization/OSRM.Locale.en.js
View File

@ -16,70 +16,9 @@ or see http://www.gnu.org/licenses/agpl.txt.
*/
// OSRM localization
// [basic localization options]
// [English language support]
OSRM.Localization = {
// if existing, return localized string -> English string -> input string
translate: function(text) {
if( OSRM.Localization[OSRM.DEFAULTS.LANGUAGE][text] )
return OSRM.Localization[OSRM.DEFAULTS.LANGUAGE][text];
else if( OSRM.Localization["en"][text] )
return OSRM.Localization["en"][text];
else
return text;
}
};
// shorter call to translate function
OSRM.loc = OSRM.Localization.translate;
// German language support
OSRM.Localization["de"] = {
//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>",
// geocoder
"SEARCH_RESULTS": "Suchergebnisse",
"TIMED_OUT": "Zeitüberschreitung",
"NO_RESULTS_FOUND": "Keine Ergebnisse gefunden",
"NO_RESULTS_FOUND_SOURCE": "Keine Ergebnisse gefunden für Start",
"NO_RESULTS_FOUND_TARGET": "Keine Ergebnisse gefunden für Ziel",
// routing
"ROUTE_DESCRIPTION": "Routenbeschreibung",
"GET_LINK_TO_ROUTE": "Generiere Link",
"GENERATE_LINK_TO_ROUTE": "Warte auf Antwort",
"LINK_TO_ROUTE_TIMEOUT": "nicht möglich",
"GPX_FILE": "GPX Datei",
"DISTANCE": "Distanz",
"DURATION": "Dauer",
"YOUR_ROUTE_IS_BEING_COMPUTED": "Ihre Route wird berechnet",
"NO_ROUTE_FOUND": "Keine Route hierher möglich",
// directions
"N": "Norden",
"O": "Ost",
"S": "Süden",
"W": "Westen",
"NO": "Nordost",
"SO": "Südost",
"SW": "Südwest",
"NW": "Nordwest"
};
// English language support
OSRM.Localization["en"] = {
//gui
"OPEN_JOSM": "JOSM",
@ -118,5 +57,31 @@ OSRM.Localization["en"] = {
"NE": "northeast",
"SE": "southeast",
"SW": "southwest",
"NW": "northwest"
};
"NW": "northwest",
// driving directions
"DIRECTION_0":"Unknown instruction[ on <b>%s</b>]",
"DIRECTION_1":"Turn left[ on <b>%s</b>]",
"DIRECTION_2":"Turn right[ on <b>%s</b>]",
"DIRECTION_3":"U-Turn[ on <b>%s</b>]",
"DIRECTION_4":"Head <b>%s</b>",
"DIRECTION_5":"Continue[ on <b>%s</b>]",
"DIRECTION_6":"Turn slight left[ on <b>%s</b>]",
"DIRECTION_7":"Turn slight right[ on <b>%s</b>]",
"DIRECTION_8":"Turn sharp left[ on <b>%s</b>]",
"DIRECTION_9":"Turn sharp right[ on <b>%s</b>]",
"DIRECTION_10":"Enter roundabout and leave at first exit[ on <b>%s</b>]",
"DIRECTION_11":"Enter roundabout and leave at second exit[ on <b>%s</b>]",
"DIRECTION_12":"Enter roundabout and leave at third exit[ on <b>%s</b>]",
"DIRECTION_13":"Enter roundabout and leave at fourth exit[ on <b>%s</b>]",
"DIRECTION_14":"Enter roundabout and leave at fifth exit[ on <b>%s</b>]",
"DIRECTION_15":"Enter roundabout and leave at sixth exit[ on <b>%s</b>]",
"DIRECTION_16":"Enter roundabout and leave at seventh exit[ on <b>%s</b>]",
"DIRECTION_17":"Enter roundabout and leave at eighth exit[ on <b>%s</b>]",
"DIRECTION_18":"Enter roundabout and leave at nineth exit[ on <b>%s</b>]",
"DIRECTION_19":"Enter roundabout and leave at tenth exit[ on <b>%s</b>]",
"DIRECTION_20":"Enter roundabout and leave at one of the too many exits[ on <b>%s</b>]",
"DIRECTION_21":"You have reached your destination"
};
//set GUI language on load
OSRM.Localization.change("en");

89
WebContent/localization/OSRM.Localization.js Normal file
View File

@ -0,0 +1,89 @@
/*
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
// [basic localization options]
OSRM.Localization = {
supported_languages: [ {display_name:"en", encoding:"en"},
{display_name:"de", encoding:"de"}
],
// 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.change(this.value); };
// fill dropdown menu
for(var i=0, size=OSRM.Localization.supported_languages.length; i<size; i++) {
var option=document.createElement("option");
option.innerHTML = OSRM.Localization.supported_languages[i].display_name;
option.value = OSRM.Localization.supported_languages[i].encoding;
select.appendChild(option);
}
// add element to DOM
var input_mask_header = document.getElementById('input-mask-header');
input_mask_header.insertBefore(select,input_mask_header.firstChild);
// initialize default language
OSRM.Localization.change( OSRM.DEFAULTS.LANGUAGE );
},
// perform language change
change: function(language) {
OSRM.DEFAULTS.LANGUAGE = language;
document.getElementById('gui-language-toggle').value = language;
if( OSRM.Localization[language]) {
OSRM.GUI.setLanguage();
if( OSRM.G.markers.route.length > 1)
OSRM.Routing.getRoute();
else if(OSRM.G.markers.route.length > 0 && document.getElementById('information-box').innerHTML != "" ) {
OSRM.Geocoder.call( OSRM.C.SOURCE_LABEL, document.getElementById("gui-input-source").value );
OSRM.Geocoder.call( OSRM.C.TARGET_LABEL, document.getElementById("gui-input-target").value );
} else {
OSRM.Geocoder.updateAddress(OSRM.C.SOURCE_LABEL, false);
OSRM.Geocoder.updateAddress(OSRM.C.TARGET_LABEL, false);
document.getElementById('information-box').innerHTML = "";
document.getElementById('information-box-header').innerHTML = "";
}
} else {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = "localization/OSRM.Locale."+language+".js";
document.head.appendChild(script);
}
},
// if existing, return localized string -> English string -> input string
translate: function(text) {
if( OSRM.Localization[OSRM.DEFAULTS.LANGUAGE] && OSRM.Localization[OSRM.DEFAULTS.LANGUAGE][text] )
return OSRM.Localization[OSRM.DEFAULTS.LANGUAGE][text];
else if( OSRM.Localization["en"] && OSRM.Localization["en"][text] )
return OSRM.Localization["en"][text];
else
return text;
}
};
// shorter call to translate function
OSRM.loc = OSRM.Localization.translate;

415
WebContent/main.css
View File

@ -18,25 +18,19 @@ or see http://www.gnu.org/licenses/agpl.txt.
/* OSRM CSS styles */
/* map -> fullscreen */
body {
/* fullscreen map */
html, body {
padding: 0;
margin: 0;
}
html, body, #map {
height: 100%;
}
#map {
height: 100%;
z-index: 0;
}
/* styles for gui */
.vquad
{
height:10px;
}
/* general styles for gui boxes */
.gui-wrapper
{
position:absolute;
@ -63,11 +57,13 @@ html, body, #map {
padding:5px;
}
/* styles for specific gui boxes */
#main-wrapper
{
width:410px;
height:95%;
top:5px;
bottom:25px;
left:5px;
}
#main-input
@ -78,10 +74,9 @@ html, body, #map {
#main-output
{
width:390px;
top:220px;
top:220px; /* main-input.height+2*gui-box.margin+2*gui-box.padding */
bottom:0px;
}
#blob-wrapper
{
left:-5px;
@ -96,79 +91,79 @@ html, body, #map {
-webkit-border-bottom-left-radius:0px;
visibility:hidden;
}
#blob-input
#blob-content
{
width:26px;
height:26px;
width:16px;
height:16px;
border-top-left-radius:0px;
border-bottom-left-radius:0px;
-moz-border-radius-topleft:0px;
-moz-border-radius-bottomleft:0px;
-webkit-border-top-left-radius:0px;
-webkit-border-bottom-left-radius:0px;
padding:0px;
}
.main-toggle-out
{
cursor:pointer;
position:absolute;
right:5px;
top:5px;
width:16px;
height:16px;
background-image:url("images/cancel.png");
}
.main-toggle-out:hover
{
background-image:url("images/cancel_hover.png");
}
.main-toggle-out:active
{
background-image:url("images/cancel_active.png");
}
.main-toggle-in
{
cursor:pointer;
position:absolute;
right:5px;
top:5px;
width:16px;
height:16px;
background-image:url("images/restore.png");
}
.main-toggle-in:hover
{
background-image:url("images/restore_hover.png");
}
.main-toggle-in:active
{
background-image:url("images/restore_active.png");
}
.main-options
/* styles for main-input areas */
#input-mask-header
{
position:relative;
font-size:10px;
}
.main-options-left-box
{
position:absolute;
left:5px;
left:0px;
right:0px;
top:0px;
height:50px;
background-repeat:no-repeat;
background-position:center;
background-image:url("images/osrm-logo.png");
}
.main-options-right-box
#input-mask
{
position:absolute;
right:5px;
top:5px;
margin:3px;
}
#options-toggle
#input-mask-options
{
margin:3px;
}
/* styles for main-input input-mask-header */
#gui-language-toggle
{
border: 0px;
text-decoration:none;
}
.top-left-button
{
float:left;
}
.top-right-button
{
float:right;
}
/* styles for main-input input-mask */
.input-marker
{
display:table-row;
}
.input-marker > div
{
padding-bottom:4px;
}
.input-box
{
width: 250px;
padding-right: 2px;
}
/* styles for main-input input-mask-options */
#gui-options-toggle
{
cursor:pointer;
color:#0000ff
}
#options-toggle:hover
#gui-options-toggle:hover
{
color:#ff0000
}
@ -177,111 +172,92 @@ html, body, #map {
visibility:hidden;
}
#osrm-logo
{
display: block;
margin-left: auto;
margin-right: auto;
width: 192px;
height: 50px;
text-align:center;
vertical-align: middle;
}
.input-box
/* styles for main-output areas */
#information-box-header
{
width: 250px;
margin:5px;
height:60px;
}
.full
{
width:100%;
}
.right
{
text-align:right;
}
.center
{
text-align:center;
}
#information-box
{
position:absolute;
bottom:15px;
top:60px;
bottom:20px;
top:65px;
width:380px;
font-size:12px;
overflow:auto;
margin:5px;
}
.route-summary
#legal-notice
{
font-size: 12px;
position:absolute;
right:0px;
bottom:0px;
margin:5px;
}
#gpx-link
/* styles for information-box-header */
.header-title
{
font-weight:bold;
margin-bottom:10px;
}
.header-content
{
font-weight:normal;
}
.result-link
{
color:#0000ff;
text-decoration:none;
cursor:pointer;
}
#gpx-link:hover
.result-link:hover
{
color:#ff0000;
}
/* style for information-box table (search results, driving directions) */
.results-table
{
border-spacing:0px;
width:100%;
}
.results-odd
{
background-color: #FAF3E9; //#ffffff;
background-color: #FFFDE3;
}
.results-even
{
background-color: #F2DE9C; //#ffffe0;
background-color: #FFF9BB;
}
.result-counter
{
text-align:right;
vertical-align: top;
width:30px;
vertical-align:top;
font-weight:bold;
padding-left:5px;
padding-right:5px;
padding-top:1px;
padding-bottom:1px;
padding:1px 5px 1px 5px;
}
.result-items
{
text-align:left;
vertical-align: middle;
width:100%;
padding-left:1px;
padding-right:1px;
padding-top:1px;
padding-bottom:1px;
padding:1px;
}
.result-direction
.result-directions
{
width:30px;
padding-left:1px;
padding-right:1px;
padding-top:1px;
padding-bottom:1px;
text-align:left;
vertical-align: middle;
padding:1px 5px 1px 5px;
}
.result-distance
{
text-align:right;
vertical-align: middle;
width:30px;
padding-left:1px;
padding-right:1px;
padding-top:1px;
padding-bottom:1px;
vertical-align: middle;
padding:1px 1px 1px 5px;
}
.result-item
{
@ -292,18 +268,135 @@ html, body, #map {
{
color:#ff0000
}
#legal-notice
.no-results
{
position:absolute;
right:0px;
bottom:0px;
padding:5px;
font-size:10px;
text-align:center;
margin:28px;
}
/* buttons */
.button
{
cursor:pointer;
padding:2px 10px 2px 10px;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
background-color:#EEEEEE;
border:1px solid #999999;
color:#333333;
text-decoration:none;
font-size:9px;
outline-style:none;
vertical-align:1px;
}
.button:hover
{
background-color:#F9F9F9;
color:#000000;
}
.button:active
{
background-color:#F4F4F4;
color:#FF0000;
}
/* iconic buttons */
.iconic-button
{
cursor:pointer;
width:16px;
height:16px;
background-repeat:no-repeat;
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: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");
visibility:hidden;
}
.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;
}
.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;
}
/* utility styles (defined above buttons, so that buttons retain cursor:pointer)*/
.quad
{
min-width:10px;
min-height:10px;
}
.not-selectable
{
cursor:default;
@ -322,49 +415,31 @@ html, body, #map {
user-select: text;
}
/* buttons */
.button
.checkbox-label
{
cursor:pointer;
padding:2px 10px 2px 10px;
border-radius:5px;
-moz-border-radius:5px;
background-color:#EEEEEE;
border:1px solid #999999;
color:#333333;
text-decoration:none;
font-size:11px;
outline-style:none;
}
.button:hover
{
background-color:#F9F9F9;
color:#000000;
}
.button:active
{
background-color:#F4F4F4;
color:#FF0000;
vertical-align:2px;
}
.delete-marker
.full
{
cursor:pointer;
position:absolute;
right:5px;
top:3px;
width:16px;
height:16px;
background-image:url("images/cancel.png");
visibility:hidden;
display:table;
width:100%;
}
.delete-marker:hover
.left
{
background-image:url("images/cancel_hover.png");
display:table-cell;
text-align:left;
vertical-align:middle;
}
.delete-marker:active
.right
{
background-image:url("images/cancel_active.png");
display:table-cell;
text-align:right;
vertical-align:middle;
}
.center
{
display:table-cell;
text-align:center;
vertical-align:middle;
}

108
WebContent/main.html
View File

@ -30,7 +30,7 @@ or see http://www.gnu.org/licenses/agpl.txt.
<meta name="author" content="Dennis Schieferdecker" />
<!-- favicon -->
<link rel="shortcut icon" href="images/osrm-favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="" type="image/x-icon" id="favicon"/>
<!-- stylesheets -->
<link rel="stylesheet" href="leaflet/leaflet.css" type="text/css"/>
@ -64,78 +64,90 @@ or see http://www.gnu.org/licenses/agpl.txt.
<script src="OSRM.Browser.js" type="text/javascript"></script>
<script src="OSRM.JSONP.js" type="text/javascript"></script>
<script src="OSRM.Localization.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>
<script src="OSRM.Utils.js" type="text/javascript"></script>
</head>
<!-- body -->
<body onload="OSRM.init();">
<body class="base-font not-selectable">
<!--map-->
<div id="map"></div>
<!-- show ui blob -->
<div id="blob-wrapper" class="gui-wrapper">
<div id="blob-input" class="gui-box">
<div class="main-toggle-in" onclick="OSRM.GUI.toggleMain()"></div>
<div id="blob-content" class="gui-box">
<div id="gui-toggle-in" class="iconic-button"></div>
</div>
</div>
<!-- show main gui -->
<div id="main-wrapper" class="gui-wrapper">
<div id="main-wrapper" class="gui-wrapper not-selectable">
<!-- input box -->
<div class="gui-box not-selectable" id="main-input">
<div class="main-toggle-out" onclick="OSRM.GUI.toggleMain()"></div>
<img id="osrm-logo" alt="OSRM Logo" src="images/osrm-logo.png" />
<div id="main-input" class="gui-box">
<!-- header -->
<div id="input-mask-header">
<div id="gui-toggle-out" class="iconic-button top-right-button"></div>
</div>
<!-- input mask -->
<div id="input-mask">
<!-- source/target input -->
<table class="full">
<tr>
<td id="gui-search-source-label">Start:</td>
<td><div style="position:relative;">
<input id="input-source-name" class="input-box" type="text" maxlength="200" value="" title="Startposition eingeben" onchange="OSRM.RoutingGUI.inputChanged(OSRM.C.SOURCE_LABEL);" />
<div id="delete-source-marker" class="delete-marker" onclick="OSRM.RoutingGUI.deleteMarker('source')"></div></div></td>
<td class="right"><a class="button not-selectable" id="gui-search-source" onclick="OSRM.RoutingGUI.showMarker('source')">Zeigen</a></td>
</tr>
<tr>
<td id="gui-search-target-label">Ende:</td>
<td><div style="position:relative;">
<input id="input-target-name" class="input-box" type="text" maxlength="200" value="" title="Zielposition eingeben" onchange="OSRM.RoutingGUI.inputChanged(OSRM.C.TARGET_LABEL);" />
<div id="delete-target-marker" class="delete-marker" onclick="OSRM.RoutingGUI.deleteMarker('target')"></div></div></td>
<td class="right"><a class="button not-selectable" id="gui-search-target" onclick="OSRM.RoutingGUI.showMarker('target');">Zeigen</a></td>
</tr>
</table>
<div class="full">
<div id="input-source" class="input-marker">
<div class="left"><span id="gui-search-source-label">Start:</span></div>
<div class="center input-box"><input id="gui-input-source" class="input-box" type="text" maxlength="200" value="" title="Startposition eingeben" /></div>
<div class="center"><div id="gui-delete-source" class="iconic-button delete-marker"></div></div>
<div class="right"><a class="button" id="gui-search-source">Zeigen</a></div>
</div>
<div id="input-target" class="input-marker">
<div class="left"><span id="gui-search-target-label">Ende:</span></div>
<div class="center input-box"><input id="gui-input-target" class="input-box" type="text" maxlength="200" value="" title="Zielposition eingeben" /></div>
<div class="center"><div id="gui-delete-target" class="iconic-button delete-marker"></div></div>
<div class="right"><a class="button" id="gui-search-target">Zeigen</a></div>
</div>
</div>
<div class="quad"></div>
<!-- action buttons -->
<div class="vquad"></div>
<table style="width:100%">
<tr>
<td> <a class="button not-selectable" id="gui-reset" onclick="OSRM.RoutingGUI.resetRouting();">Reset</a></td>
<td class="right"> <a class="button not-selectable" id="gui-reverse" onclick="OSRM.RoutingGUI.reverseRouting();">Umdrehen</a></td>
</tr>
</table>
<div class="full">
<div class="left"><a class="button" id="gui-reset">Reset</a></div>
<div class="right"><a class="button" id="gui-reverse">Umdrehen</a></div>
</div>
</div>
<div class="quad"></div>
<!-- options -->
<span class="main-options" id="options-toggle" onclick="OSRM.GUI.toggleOptions()">Kartenwerkzeuge</span>
<div class="main-options" id="options-box">
<span class="main-options-left-box">
<input type="checkbox" id="option-highlight-nonames" name="main-options" value="highlight-nonames" onclick="OSRM.Routing.getRoute();" /><span id="gui-option-highlight-nonames-label">Unbenannte Straßen hervorheben</span>
</span>
<span class="main-options-right-box">
<a class="button not-selectable" id="open-josm" onclick="OSRM.RoutingGUI.openJOSM();">JOSM</a>
<a class="button not-selectable" id="open-osmbugs" onclick="OSRM.RoutingGUI.openOSMBugs();">OSM Bugs</a>
</span>
<div id="input-mask-options">
<!-- option toggle -->
<span id="gui-options-toggle" class="small-font">Kartenwerkzeuge</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">Unbenannte Straßen hervorheben</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 class="gui-box not-selectable" id="main-output">
<div id="information-box-headline"></div>
<div id="main-output" class="gui-box">
<div id="information-box-header"></div>
<div id="information-box"></div>
<div id="legal-notice">GUI2 v0.1.1 120316 - OSRM hosting by <a href='http://algo2.iti.kit.edu/'>KIT</a> - Geocoder by <a href='http://www.osm.org/'>OSM</a></div>
<div id="legal-notice" class="small-font">GUI2 v0.1.3 120402 - OSRM hosting by <a href='http://algo2.iti.kit.edu/'>KIT</a> - Geocoder by <a href='http://www.osm.org/'>OSM</a></div>
</div>
</div>

157
WebContent/main.js
View File

@ -18,55 +18,72 @@ or see http://www.gnu.org/licenses/agpl.txt.
// OSRM initialization
// [initialization, image prefetching]
// will hold the Leaflet map object
OSRM.GLOBALS.map = null;
// onload initialization routine
OSRM.init = function() {
OSRM.prefetchImages();
OSRM.prefetchIcons();
OSRM.Localization.init();
OSRM.GUI.init();
OSRM.Map.init();
OSRM.Routing.init();
//OSRM.Printing.init();
OSRM.Routing.init();
// check if the URL contains some GET parameter, e.g. for showing a route
OSRM.checkURL();
OSRM.parseParameters();
};
// prefetch images
OSRM.GLOBALS.images = Array();
OSRM.GLOBALS.images = {};
OSRM.prefetchImages = function() {
var images = [ 'images/marker-source.png',
'images/marker-target.png',
'images/marker-via.png',
'images/marker-highlight.png',
'images/marker-source-drag.png',
'images/marker-target-drag.png',
'images/marker-via-drag.png',
'images/marker-highlight-drag.png',
'images/marker-drag.png',
'images/cancel.png',
'images/cancel_active.png',
'images/cancel_hover.png',
'images/restore.png',
'images/restore_active.png',
'images/restore_hover.png'
];
for(var i=0; i<images.length; i++) {
OSRM.G.images[i] = new Image();
OSRM.G.images[i].src = images[i];
var image_names = [ 'marker-source',
'marker-target',
'marker-via',
'marker-highlight',
'marker-source-drag',
'marker-target-drag',
'marker-via-drag',
'marker-highlight-drag',
'marker-drag',
'cancel',
'cancel_active',
'cancel_hover',
'restore',
'restore_active',
'restore_hover',
'printer',
'printer_active',
'printer_hover',
'printer_inactive',
'turn-left',
'turn-right',
'u-turn',
'continue',
'slight-left',
'slight-right',
'sharp-left',
'sharp-right',
'round-about',
'target',
'default'
];
for(var i=0; i<image_names.length; i++) {
OSRM.G.images[image_names[i]] = new Image();
OSRM.G.images[image_names[i]].src = 'images/'+image_names[i]+'.png';
}
OSRM.G.images["favicon"] = new Image();
OSRM.G.images["favicon"].src = 'images/osrm-favicon.ico';
};
// prefetch icons
OSRM.GLOBALS.icons = Array();
OSRM.GLOBALS.icons = {};
OSRM.prefetchIcons = function() {
var images = [ 'marker-source',
var image_names = [ 'marker-source',
'marker-target',
'marker-via',
'marker-highlight',
@ -77,13 +94,13 @@ OSRM.prefetchIcons = function() {
'marker-drag'
];
for(var i=0; i<images.length; i++) {
for(var i=0; i<image_names.length; i++) {
var icon = {
iconUrl: 'images/'+images[i]+'.png', iconSize: new L.Point(25, 41), iconAnchor: new L.Point(13, 41),
iconUrl: 'images/'+image_names[i]+'.png', iconSize: new L.Point(25, 41), iconAnchor: new L.Point(13, 41),
shadowUrl: L.ROOT_URL + 'images/marker-shadow.png', shadowSize: new L.Point(41, 41),
popupAnchor: new L.Point(0, -33)
};
OSRM.G.icons[images[i]] = new L.SwitchableIcon(icon);
OSRM.G.icons[image_names[i]] = new L.SwitchableIcon(icon);
}
// special values for drag marker
@ -91,8 +108,8 @@ OSRM.prefetchIcons = function() {
};
// parse URL GET parameters if any exist
OSRM.checkURL = function(){
//parse URL GET parameters
OSRM.parseParameters = function(){
var called_url = document.location.search.substr(1,document.location.search.length);
// reject messages that are clearly too long or too small
@ -100,11 +117,7 @@ OSRM.checkURL = function(){
return;
// storage for parameter values
var positions = [];
var zoom = null;
var center = null;
var destination = null;
var destination_name = null;
var params = {};
// parse input
var splitted_url = called_url.split('&');
@ -112,72 +125,92 @@ OSRM.checkURL = function(){
var name_val = splitted_url[i].split('=');
if(name_val.length!=2)
continue;
if(name_val[0] == 'loc') {
if(name_val[0] == 'hl') {
for(var i=0, size=OSRM.Localization.supported_languages.length; i<size; i++) {
if( OSRM.Localization.supported_languages[i].encoding == name_val[1]) {
OSRM.Localization.change(name_val[1]);
break;
}
}
}
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]) )
return;
positions.push ( new L.LatLng( coordinates[0], coordinates[1]) );
params.positions = params.positions || [];
params.positions.push ( new L.LatLng( coordinates[0], coordinates[1]) );
}
else if(name_val[0] == 'dest') {
var coordinates = unescape(name_val[1]).split(',');
if(coordinates.length!=2 || !OSRM.Utils.isLatitude(coordinates[0]) || !OSRM.Utils.isLongitude(coordinates[1]) )
return;
destination = new L.LatLng( coordinates[0], coordinates[1]);
params.destination = new L.LatLng( coordinates[0], coordinates[1]);
}
else if(name_val[0] == 'destname') {
destination_name = decodeURI(name_val[1]).replace(/<\/?[^>]+(>|$)/g ,""); // discard tags
params.destination_name = decodeURI(name_val[1]).replace(/<\/?[^>]+(>|$)/g ,""); // discard tags
}
else if(name_val[0] == 'z') {
zoom = name_val[1];
if( zoom<0 || zoom > 18)
var zoom_level = Number(name_val[1]);
if( zoom_level<0 || zoom_level > 18)
return;
params.zoom = zoom;
}
else if(name_val[0] == 'center') {
var coordinates = unescape(name_val[1]).split(',');
if(coordinates.length!=2 || !OSRM.Utils.isLatitude(coordinates[0]) || !OSRM.Utils.isLongitude(coordinates[1]) )
return;
center = new L.LatLng( coordinates[0], coordinates[1]);
params.center = new L.LatLng( coordinates[0], coordinates[1]);
}
}
// case 1: destination given
if( destination != undefined ) {
var index = OSRM.G.markers.setTarget( e.latlng );
if( destination_name == null )
OSRM.Geocoder.updateAddress( OSRM.C.TARGET_LABEL, OSRM.C.DO_FALLBACK_TO_LAT_LNG );
if( params.destination ) {
var index = OSRM.G.markers.setTarget( params.destination.latlng );
if( params.destination_name )
document.getElementById("gui-input-target").value = params.destination_name;
else
document.getElementById("input-target-name").value = destination_name;
OSRM.Geocoder.updateAddress( OSRM.C.TARGET_LABEL, OSRM.C.DO_FALLBACK_TO_LAT_LNG );
OSRM.G.markers.route[index].show();
OSRM.G.markers.route[index].centerView();
return;
}
// case 2: locations given
if( positions != []) {
if( params.positions ) {
// draw via points
if( positions.length > 0) {
OSRM.G.markers.setSource( positions[0] );
if( params.positions.length > 0 ) {
OSRM.G.markers.setSource( params.positions[0] );
OSRM.Geocoder.updateAddress( OSRM.C.SOURCE_LABEL, OSRM.C.DO_FALLBACK_TO_LAT_LNG );
}
if(positions.length > 1) {
OSRM.G.markers.setTarget( positions[positions.length-1] );
if( params.positions.length > 1 ) {
OSRM.G.markers.setTarget( params.positions[params.positions.length-1] );
OSRM.Geocoder.updateAddress( OSRM.C.TARGET_LABEL, OSRM.C.DO_FALLBACK_TO_LAT_LNG );
}
for(var i=1; i<positions.length-1;i++)
OSRM.G.markers.setVia( i-1, positions[i] );
for(var i=1; i<params.positions.length-1;i++)
OSRM.G.markers.setVia( i-1, params.positions[i] );
for(var i=0; i<OSRM.G.markers.route.length;i++)
OSRM.G.markers.route[i].show();
// center on route (support for old links) / move to given view (new behaviour)
if(zoom == null || center == null) {
var bounds = new L.LatLngBounds( positions );
if( params.zoom == null || params.center == null ) {
var bounds = new L.LatLngBounds( params.positions );
OSRM.G.map.fitBoundsUI( bounds );
} else {
OSRM.G.map.setView(center, zoom);
OSRM.G.map.setView(params.center, params.zoom);
}
// compute route
OSRM.Routing.getRoute();
return;
}
};
// default case: do nothing
};
// onload event
if(document.addEventListener) // FF, CH
document.addEventListener("DOMContentLoaded", OSRM.init, false);
else // old IE
document.onreadystatechange = function(){if(document.readyState == "interactive" || document.readyState == "complete") OSRM.init();};

105
WebContent/printing/OSRM.Printing.js Normal file
View File

@ -0,0 +1,105 @@
/*
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 printer
// [printing support]
OSRM.Printing = {
init: function() {
var icon = document.createElement('div');
icon.id = "gui-printer";
icon.className = "iconic-button top-right-button";
var spacer = document.createElement('div');
spacer.className = "quad top-right-button";
var input_mask_header = document.getElementById('input-mask-header');
input_mask_header.appendChild(spacer,input_mask_header.lastChild);
input_mask_header.appendChild(icon,input_mask_header.lastChild);
document.getElementById("gui-printer").onclick = OSRM.Printing.print;
},
windowLoaded: function(){
OSRM.printwindow.initialize();
OSRM.Printing.show( OSRM.G.response );
OSRM.printwindow.focus();
},
show: function(response) {
// create route description
var route_desc = "";
route_desc += '<table class="results-table">';
for(var i=0; i < response.route_instructions.length; i++){
//odd or even ?
var rowstyle='results-odd';
if(i%2==0) { rowstyle='results-even'; }
route_desc += '<tr class="'+rowstyle+'">';
route_desc += '<td class="result-directions">';
route_desc += '<img width="18px" src="../images/'+OSRM.RoutingDescription.getDirectionIcon(response.route_instructions[i][0])+'" alt="" />';
route_desc += "</td>";
route_desc += '<td class="result-items">';
route_desc += '<span class="result-item">';
route_desc += response.route_instructions[i][0];
if( i == 0 )
route_desc += ' ' + OSRM.loc( response.route_instructions[i][6] );
if( response.route_instructions[i][1] != "" ) {
route_desc += ' on ';
route_desc += '<b>' + response.route_instructions[i][1] + '</b>';
}
//route_desc += ' for ';
route_desc += '</span>';
route_desc += "</td>";
route_desc += '<td class="result-distance">';
if( i != response.route_instructions.length-1 )
route_desc += '<b>'+OSRM.Utils.metersToDistance(response.route_instructions[i][2])+'</b>';
route_desc += "</td>";
route_desc += "</tr>";
}
route_desc += '</table>';
headline = "";
headline += OSRM.loc("ROUTE_DESCRIPTION")+":<br/>";
headline += '<div style="float:left;width:40%">';
headline += "<span class='route-summary'>"
+ OSRM.loc("DISTANCE")+": " + OSRM.Utils.metersToDistance(response.route_summary.total_distance)
+ "<br/>"
+ OSRM.loc("DURATION")+": " + OSRM.Utils.secondsToTime(response.route_summary.total_time)
+ "</span>";
headline += '</div>';
var output = "";
output += route_desc;
OSRM.printwindow.document.getElementById('description-headline').innerHTML = headline;
OSRM.printwindow.document.getElementById('description').innerHTML = output;
},
// react to click
print: function() {
OSRM.printwindow = window.open("printing/printing.html","","width=400,height=300,left=100,top=100,dependent=yes,location=no,menubar=no,scrollbars=yes,status=no,toolbar=no,resizable=yes");
OSRM.printwindow.addEventListener("DOMContentLoaded", OSRM.Printing.windowLoaded, false);
}
};

105
WebContent/printing/printing.css Normal file
View File

@ -0,0 +1,105 @@
/*
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 styles for printing*/
/* printer button */
.printer-inactive
{
cursor:pointer;
width:16px;
height:16px;
background-image:url("../images/printer_inactive.png");
}
.printer
{
cursor:pointer;
width:16px;
height:16px;
background-image:url("../images/printer.png");
}
.printer:hover
{
background-image:url("../images/printer_hover.png");
}
.printer:active
{
background-image:url("../images/printer_active.png");
}
/* route summary */
.route-summary
{
font-size: 12px;
}
/* route description box */
#description
{
position:absolute;
bottom:15px;
top:60px;
width:380px;
font-size:12px;
margin:5px;
}
.results-table
{
border-spacing:0px;
}
.results-odd
{
background-color: #FAF3E9; //#ffffff;
}
.results-even
{
background-color: #F2DE9C; //#ffffe0;
}
.result-items
{
text-align:left;
vertical-align: middle;
width:100%;
padding-left:1px;
padding-right:1px;
padding-top:1px;
padding-bottom:1px;
}
.result-direction
{
width:30px;
padding-left:1px;
padding-right:1px;
padding-top:1px;
padding-bottom:1px;
}
.result-distance
{
text-align:right;
vertical-align: middle;
width:30px;
padding-left:1px;
padding-right:1px;
padding-top:1px;
padding-bottom:1px;
}
.result-item
{
cursor:pointer;
color:#000000
}

91
WebContent/printing/printing.html Normal file
View File

@ -0,0 +1,91 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
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.
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- head -->
<head>
<!-- metatags -->
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>OSRM Website</title>
<meta name="description" content="OSRM Website"/>
<meta name="author" content="Dennis Schieferdecker" />
<!-- favicon -->
<link rel="shortcut icon" href="../images/osrm-favicon.ico" type="image/x-icon" />
<!-- stylesheets -->
<link rel="stylesheet" href="../leaflet/leaflet.css" type="text/css"/>
<!--[if lte IE 8]><link rel="stylesheet" href="../leaflet/leaflet.ie.css" type="text/css"/><![endif]-->
<link rel="stylesheet" href="printing.css" type="text/css"/>
<!-- scripts -->
<script src="../leaflet/leaflet-src.js" type="text/javascript"></script>
<script>
function initialize() {
/* // setup map
var osmorgURL = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
osmorgOptions = {maxZoom: 18};
var osmorg = new L.TileLayer(osmorgURL, osmorgOptions);
var temp1 = new L.Map("map1", {
center: new L.LatLng(51.505, -0.09),
zoom: 13,
zoomAnimation: false, // false: removes animations and hiding of routes during zoom
fadeAnimation: false,
layers: [osmorg],
attributionControl: false,
zoomControl: false
});
var osmorgURL = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
osmorgOptions = {maxZoom: 18, attributionControl:false};
var osmorg = new L.TileLayer(osmorgURL, osmorgOptions);
var temp2 = new L.Map("map2", {
center: new L.LatLng(51.505, -0.09),
zoom: 13,
zoomAnimation: false, // false: removes animations and hiding of routes during zoom
fadeAnimation: false,
layers: [osmorg],
attributionControl: false,
zoomControl: false
}); */
}
function printsite() {
window.print();
}
</script>
</head>
<!-- body -->
<body>
<div style="position:absolute;right:5px;top:5px;" class="printer" onclick="printsite();"></div>
<!--maps-->
<!-- <div id="map1" style='width:100px;height:100px'></div>
<div id="map2" style='width:100px;height:100px'></div> -->
<!--description-->
<div id="description-headline"></div>
<div id="description"></div>
</body>
</html>

3
WebContent/routing/OSRM.Routing.js
View File

@ -71,6 +71,7 @@ showRoute: function(response) {
if(!response)
return;
OSRM.G.response = response;
OSRM.G.via_points = response.via_points.slice(0);
console.log(OSRM.G.via_points);
if(response.status == 207) {
@ -146,4 +147,4 @@ _snapRoute: function() {
OSRM.Geocoder.updateAddress(OSRM.C.TARGET_LABEL);
}
};
};

166
WebContent/routing/OSRM.RoutingDescription.js
View File

@ -30,16 +30,15 @@ onClickRouteDescription: function(geometry_index) {
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 + ',' + OSRM.G.map.getCenter().lng;
src += '&z='+ OSRM.G.map.getZoom() + '&center=' + OSRM.G.map.getCenter().lat.toFixed(6) + ',' + OSRM.G.map.getCenter().lng.toFixed(6);
OSRM.JSONP.call(OSRM.DEFAULTS.HOST_SHORTENER_URL+src, OSRM.RoutingDescription.showRouteLink, OSRM.RoutingDescription.showRouteLink_TimeOut, OSRM.DEFAULTS.JSONP_TIMEOUT, 'shortener');
document.getElementById('route-prelink').innerHTML = '['+OSRM.loc("GENERATE_LINK_TO_ROUTE")+']';
document.getElementById('route-link').innerHTML = '['+OSRM.loc("GENERATE_LINK_TO_ROUTE")+']';
},
showRouteLink: function(response){
document.getElementById('route-prelink').innerHTML = '[<a id="gpx-link" class = "text-selectable" href="' +response.ShortURL+ '">'+response.ShortURL+'</a>]';
// document.getElementById('route-prelink').innerHTML = '[<input class="text-selectable output-box" style="border:none" value="'+response.ShortURL+'" type="text" onfocus="this.select()" readonly="readonly"/>]';
document.getElementById('route-link').innerHTML = '[<a class="result-link text-selectable" href="' +response.ShortURL+ '">'+response.ShortURL+'</a>]';
},
showRouteLink_TimeOut: function(){
document.getElementById('route-prelink').innerHTML = '['+OSRM.loc("LINK_TO_ROUTE_TIMEOUT")+']';
document.getElementById('route-link').innerHTML = '['+OSRM.loc("LINK_TO_ROUTE_TIMEOUT")+']';
},
// handling of routing description
@ -47,17 +46,17 @@ show: function(response) {
// compute query string
var query_string = '?rebuild=1';
for(var i=0; i<OSRM.G.markers.route.length; i++)
query_string += '&loc=' + OSRM.G.markers.route[i].getLat() + ',' + OSRM.G.markers.route[i].getLng();
query_string += '&loc=' + OSRM.G.markers.route[i].getLat().toFixed(6) + ',' + OSRM.G.markers.route[i].getLng().toFixed(6);
// create link to the route
var route_link ='<span class="route-summary" id="route-prelink">[<a id="gpx-link" onclick="OSRM.RoutingDescription.onClickCreateShortcut(\'' + OSRM.DEFAULTS.WEBSITE_URL + query_string + '\')">'+OSRM.loc("GET_LINK_TO_ROUTE")+'</a>]</span>';
var route_link ='[<a class="result-link" onclick="OSRM.RoutingDescription.onClickCreateShortcut(\'' + OSRM.DEFAULTS.WEBSITE_URL + query_string + '\')">'+OSRM.loc("GET_LINK_TO_ROUTE")+'</a>]';
// create GPX link
var gpx_link = '<span class="route-summary">[<a id="gpx-link" onClick="document.location.href=\'' + OSRM.DEFAULTS.HOST_ROUTING_URL + query_string + '&output=gpx\';">'+OSRM.loc("GPX_FILE")+'</a>]</span>';
var gpx_link = '[<a class="result-link" onClick="document.location.href=\'' + OSRM.DEFAULTS.HOST_ROUTING_URL + query_string + '&output=gpx\';">'+OSRM.loc("GPX_FILE")+'</a>]';
// create route description
var route_desc = "";
route_desc += '<table class="results-table">';
route_desc += '<table class="results-table medium-font">';
for(var i=0; i < response.route_instructions.length; i++){
//odd or even ?
@ -67,20 +66,21 @@ show: function(response) {
route_desc += '<tr class="'+rowstyle+'">';
route_desc += '<td class="result-directions">';
route_desc += '<img width="18px" src="images/'+OSRM.RoutingDescription.getDirectionIcon(response.route_instructions[i][0])+'" alt="" />';
route_desc += '<img width="18px" src="'+OSRM.G.images[OSRM.RoutingDescription.getDirectionIcon(response.route_instructions[i][0])].src+'" alt="" />';
route_desc += "</td>";
route_desc += '<td class="result-items">';
route_desc += '<span class="result-item" onclick="OSRM.RoutingDescription.onClickRouteDescription('+response.route_instructions[i][3]+')">';
route_desc += response.route_instructions[i][0];
route_desc += '<div class="result-item" onclick="OSRM.RoutingDescription.onClickRouteDescription('+response.route_instructions[i][3]+')">';
// build route description
if( i == 0 )
route_desc += ' ' + OSRM.loc( response.route_instructions[i][6] );
if( response.route_instructions[i][1] != "" ) {
route_desc += ' on ';
route_desc += '<b>' + response.route_instructions[i][1] + '</b>';
}
//route_desc += ' for ';
route_desc += '</span>';
route_desc += OSRM.loc("DIRECTION_"+OSRM.RoutingDescription.mapDirectionId(response.route_instructions[i][0])).replace(/%s/, OSRM.loc(response.route_instructions[i][6]) );
else if( response.route_instructions[i][1] != "" )
route_desc += OSRM.loc("DIRECTION_"+OSRM.RoutingDescription.mapDirectionId(response.route_instructions[i][0])).replace(/\[(.*)\]/,"$1").replace(/%s/, response.route_instructions[i][1]);
else
route_desc += OSRM.loc("DIRECTION_"+OSRM.RoutingDescription.mapDirectionId(response.route_instructions[i][0])).replace(/\[(.*)\]/,"");
route_desc += '</div>';
route_desc += "</td>";
route_desc += '<td class="result-distance">';
@ -90,85 +90,93 @@ show: function(response) {
route_desc += "</tr>";
}
route_desc += '</table>';
headline = "";
headline += OSRM.loc("ROUTE_DESCRIPTION")+":<br>";
headline += '<div style="float:left;width:40%">';
headline += "<span class='route-summary'>"
+ OSRM.loc("DISTANCE")+": " + OSRM.Utils.metersToDistance(response.route_summary.total_distance)
+ "<br>"
+ OSRM.loc("DURATION")+": " + OSRM.Utils.secondsToTime(response.route_summary.total_time)
+ "</span>";
headline += '</div>';
headline += '<div style="float:left;text-align:right;width:60%;">'+route_link+'<br>'+gpx_link+'</div>';
route_desc += '</table>';
// create header
header =
'<div class="header-title">' + OSRM.loc("ROUTE_DESCRIPTION") + '</div>' +
'<div class="full">' +
'<div class="left">' +
'<div class="header-content">' + OSRM.loc("DISTANCE")+": " + OSRM.Utils.metersToDistance(response.route_summary.total_distance) + '</div>' +
'<div class="header-content">' + OSRM.loc("DURATION")+": " + OSRM.Utils.secondsToTime(response.route_summary.total_time) + '</div>' +
'</div>' +
'<div class="right">' +
'<div id="route-link" class="header-content">' + route_link + '</div>' +
'<div class="header-content">' + gpx_link + '</div>' +
'</div>' +
'</div>';
var output = "";
output += route_desc;
document.getElementById('information-box-headline').innerHTML = headline;
document.getElementById('information-box').innerHTML = output;
// update DOM
document.getElementById('information-box-header').innerHTML = header;
document.getElementById('information-box').innerHTML = route_desc;
},
// simple description
showSimple: function(response) {
headline = OSRM.loc("ROUTE_DESCRIPTION")+":<br>";
headline += "<span class='route-summary'>"
+ OSRM.loc("DISTANCE")+": " + OSRM.Utils.metersToDistance(response.route_summary.total_distance)
+ "<br>"
+ OSRM.loc("DURATION")+": " + OSRM.Utils.secondsToTime(response.route_summary.total_time)
+ "</span>";
headline += '<br><br>';
header =
'<div class="header-title">' + OSRM.loc("ROUTE_DESCRIPTION") + '</div>' +
'<div class="full">' +
'<div class="left">' +
'<div class="header-content">' + OSRM.loc("DISTANCE")+": " + OSRM.Utils.metersToDistance(response.route_summary.total_distance) + '</div>' +
'<div class="header-content">' + OSRM.loc("DURATION")+": " + OSRM.Utils.secondsToTime(response.route_summary.total_time) + '</div>' +
'</div>' +
'<div class="right">' +
'</div>' +
'</div>';
document.getElementById('information-box-headline').innerHTML = headline;
document.getElementById('information-box').innerHTML = "<br><p style='font-size:14px;font-weight:bold;text-align:center;'>"+OSRM.loc("YOUR_ROUTE_IS_BEING_COMPUTED")+".<p>";
// update DOM
document.getElementById('information-box-header').innerHTML = header;
document.getElementById('information-box').innerHTML = "<div class='no-results big-font'>"+OSRM.loc("YOUR_ROUTE_IS_BEING_COMPUTED")+"</div>";
},
// no description
showNA: function( display_text ) {
headline = OSRM.loc("ROUTE_DESCRIPTION")+":<br>";
headline += "<span class='route-summary'>"
+ OSRM.loc("DISTANCE")+": N/A"
+ "<br>"
+ OSRM.loc("DURATION")+": N/A"
+ "</span>";
headline += '<br><br>';
header =
'<div class="header-title">' + OSRM.loc("ROUTE_DESCRIPTION") + '</div>' +
'<div class="full">' +
'<div class="left">' +
'<div class="header-content">' + OSRM.loc("DISTANCE")+": N/A" + '</div>' +
'<div class="header-content">' + OSRM.loc("DURATION")+": N/A" + '</div>' +
'</div>' +
'<div class="right">' +
'</div>' +
'</div>';
document.getElementById('information-box-headline').innerHTML = headline;
document.getElementById('information-box').innerHTML = "<br><p style='font-size:14px;font-weight:bold;text-align:center;'>"+display_text+".<p>";
// update DOM
document.getElementById('information-box-header').innerHTML = header;
document.getElementById('information-box').innerHTML = "<div class='no-results big-font'>"+display_text+"</div>";
},
// map driving instructions to icons
// [TODO: language-safe implementation]
getDirectionIcon: function(name) {
//map driving instruction ids to internal ids
mapDirectionId: function(name) {
var directions = {
"Turn left":"turn-left.png",
"Turn right":"turn-right.png",
"U-Turn":"u-turn.png",
"Head":"continue.png",
"Continue":"continue.png",
"Turn slight left":"slight-left.png",
"Turn slight right":"slight-right.png",
"Turn sharp left":"sharp-left.png",
"Turn sharp right":"sharp-right.png",
"Enter roundabout and leave at first exit":"round-about.png",
"Enter roundabout and leave at second exit":"round-about.png",
"Enter roundabout and leave at third exit":"round-about.png",
"Enter roundabout and leave at fourth exit":"round-about.png",
"Enter roundabout and leave at fifth exit":"round-about.png",
"Enter roundabout and leave at sixth exit":"round-about.png",
"Enter roundabout and leave at seventh exit":"round-about.png",
"Enter roundabout and leave at eighth exit":"round-about.png",
"Enter roundabout and leave at nineth exit":"round-about.png",
"Enter roundabout and leave at tenth exit":"round-about.png",
"Enter roundabout and leave at one of the too many exit":"round-about.png",
"You have reached your destination":"target.png"
"Turn left":1,
"Turn right":2,
"U-Turn":3,
"Head":4,
"Continue":5,
"Turn slight left":6,
"Turn slight right":7,
"Turn sharp left":8,
"Turn sharp right":9,
"Enter roundabout and leave at first exit":10,
"Enter roundabout and leave at second exit":11,
"Enter roundabout and leave at third exit":12,
"Enter roundabout and leave at fourth exit":13,
"Enter roundabout and leave at fifth exit":14,
"Enter roundabout and leave at sixth exit":15,
"Enter roundabout and leave at seventh exit":16,
"Enter roundabout and leave at eighth exit":17,
"Enter roundabout and leave at nineth exit":18,
"Enter roundabout and leave at tenth exit":19,
"Enter roundabout and leave at one of the too many exit":20,
"You have reached your destination":21
};
if( directions[name] )
return directions[name];
else
return "default.png";
return 0;
}
};

29
WebContent/routing/OSRM.RoutingGUI.js
View File

@ -23,15 +23,15 @@ OSRM.RoutingGUI = {
// click: button "reset"
resetRouting: function() {
document.getElementById('input-source-name').value = "";
document.getElementById('input-target-name').value = "";
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();
document.getElementById('information-box').innerHTML = "";
document.getElementById('information-box-headline').innerHTML = "";
document.getElementById('information-box-header').innerHTML = "";
OSRM.JSONP.reset();
},
@ -39,26 +39,26 @@ resetRouting: function() {
// click: button "reverse"
reverseRouting: function() {
// invert input boxes
var tmp = document.getElementById("input-source-name").value;
document.getElementById("input-source-name").value = document.getElementById("input-target-name").value;
document.getElementById("input-target-name").value = tmp;
var tmp = document.getElementById("gui-input-source").value;
document.getElementById("gui-input-source").value = document.getElementById("gui-input-target").value;
document.getElementById("gui-input-target").value = tmp;
// invert route
OSRM.G.markers.route.reverse();
if(OSRM.G.markers.route.length == 1) {
if(OSRM.G.markers.route[0].label == OSRM.C.TARGET_LABEL) {
OSRM.G.markers.route[0].label = OSRM.C.SOURCE_LABEL;
OSRM.G.markers.route[0].marker.setIcon( new L.Icon('images/marker-source.png') );
OSRM.G.markers.route[0].marker.setIcon( OSRM.G.icons['marker-source'] );
} else if(OSRM.G.markers.route[0].label == OSRM.C.SOURCE_LABEL) {
OSRM.G.markers.route[0].label = OSRM.C.TARGET_LABEL;
OSRM.G.markers.route[0].marker.setIcon( new L.Icon('images/marker-target.png') );
OSRM.G.markers.route[0].marker.setIcon( OSRM.G.icons['marker-target'] );
}
} else if(OSRM.G.markers.route.length > 1){
OSRM.G.markers.route[0].label = OSRM.C.SOURCE_LABEL;
OSRM.G.markers.route[0].marker.setIcon( new L.Icon('images/marker-source.png') );
OSRM.G.markers.route[0].marker.setIcon( OSRM.G.icons['marker-source'] );
OSRM.G.markers.route[OSRM.G.markers.route.length-1].label = OSRM.C.TARGET_LABEL;
OSRM.G.markers.route[OSRM.G.markers.route.length-1].marker.setIcon( new L.Icon('images/marker-target.png') );
OSRM.G.markers.route[OSRM.G.markers.route.length-1].marker.setIcon( OSRM.G.icons['marker-target'] );
}
// recompute route
@ -67,7 +67,7 @@ reverseRouting: function() {
OSRM.G.markers.highlight.hide();
} else {
document.getElementById('information-box').innerHTML = "";
document.getElementById('information-box-headline').innerHTML = "";
document.getElementById('information-box-header').innerHTML = "";
}
},
@ -82,13 +82,12 @@ showMarker: function(marker_id) {
OSRM.G.markers.route[OSRM.G.markers.route.length-1].centerView();
},
// changed: any inputbox (is called when return is pressed [after] or focus is lost [before])
// changed: any inputbox (is called when enter is pressed [after] or focus is lost [before])
inputChanged: function(marker_id) {
if( marker_id == OSRM.C.SOURCE_LABEL)
OSRM.Geocoder.call(OSRM.C.SOURCE_LABEL, document.getElementById('input-source-name').value);
OSRM.Geocoder.call(OSRM.C.SOURCE_LABEL, document.getElementById('gui-input-source').value);
else if( marker_id == OSRM.C.TARGET_LABEL)
OSRM.Geocoder.call(OSRM.C.TARGET_LABEL, document.getElementById('input-target-name').value);
OSRM.Geocoder.call(OSRM.C.TARGET_LABEL, document.getElementById('gui-input-target').value);
},
// click: button "open JOSM"