reworked loading of images and icons (-> easier to add new ones),

adapted routing description to use new description ids,
fixed bug with localization dropdown and FF3,
added localization for "(found X results)"
This commit is contained in:
DennisSchiefer 2012-04-13 17:47:53 +01:00
parent 61073ebc9d
commit 73aeab3a57
9 changed files with 115 additions and 156 deletions

View File

@ -105,13 +105,14 @@ _showResults: function(response, parameters) {
document.getElementById('information-box-header').innerHTML =
"<div class='header-title'>"+OSRM.loc("SEARCH_RESULTS")+"</div>" +
"<div class='header-content'>("+OSRM.loc("FOUND_X_RESULTS").replace(/%i/,response.length)+")</div>";
"<div class='header-content'>(found "+response.length+" results)"+"</div>";
document.getElementById('information-box').innerHTML = html;
},
_showResults_Empty: function(parameters) {
document.getElementById('information-box-header').innerHTML =
"<div class='header-title'>"+OSRM.loc("SEARCH_RESULTS")+"</div>" +
"<div class='header-content'>(found 0 results)"+"</div>";
"<div class='header-content'>("+OSRM.loc("FOUND_X_RESULTS").replace(/%i/,0)+")</div>";
if(parameters.marker_id == OSRM.C.SOURCE_LABEL)
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)
@ -122,7 +123,7 @@ _showResults_Empty: function(parameters) {
_showResults_Timeout: function() {
document.getElementById('information-box-header').innerHTML =
"<div class='header-title'>"+OSRM.loc("SEARCH_RESULTS")+"</div>" +
"<div class='header-content'>(found 0 results)"+"</div>";
"<div class='header-content'>("+OSRM.loc("FOUND_X_RESULTS").replace(/%i/,0)+")</div>";
document.getElementById('information-box').innerHTML = "<div class='no-results big-font'>"+OSRM.loc("TIMED_OUT")+"</div>";
},

View File

@ -19,7 +19,8 @@ or see http://www.gnu.org/licenses/agpl.txt.
// [has to be loaded directly after OSRM.base]
OSRM.DEFAULTS = {
HOST_ROUTING_URL: 'http://router.project-osrm.org/viaroute',
//HOST_ROUTING_URL: 'http://router.project-osrm.org/viaroute',
HOST_ROUTING_URL: 'http://141.3.24.68:5000/viaroute',
HOST_SHORTENER_URL: 'http://map.project-osrm.org/shorten/',
HOST_GEOCODER_URL: 'http://nominatim.openstreetmap.org/search',
HOST_REVERSE_GEOCODER_URL: 'http://nominatim.openstreetmap.org/reverse',

View File

@ -35,6 +35,7 @@ OSRM.Localization["de"] = {
"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",
"FOUND_X_RESULTS": "%i Ergebnisse gefunden",
"TIMED_OUT": "Zeitüberschreitung",
"NO_RESULTS_FOUND": "Keine Ergebnisse gefunden",
"NO_RESULTS_FOUND_SOURCE": "Keine Ergebnisse gefunden für Start",
@ -60,27 +61,26 @@ OSRM.Localization["de"] = {
"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_1":"Geradeaus weiterfahren[ auf <b>%s</b>]",
"DIRECTION_2":"Leicht rechts abbiegen[ auf <b>%s</b>]",
"DIRECTION_3":"Rechts abbiegen[ auf <b>%s</b>]",
"DIRECTION_4":"Scharf rechts abbiegen[ auf <b>%s</b>]",
"DIRECTION_5":"Wenden[ auf <b>%s</b>]",
"DIRECTION_6":"Leicht links abbiegen[ auf <b>%s</b>]",
"DIRECTION_7":"Leicht rechts abbiegen[ auf <b>%s</b>]",
"DIRECTION_7":"Links 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"
"DIRECTION_10":"Fahren Sie Richtung <b>%s</b>",
"DIRECTION_11-1":"In den Kreisverkehr einfahren und bei erster Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11-2":"In den Kreisverkehr einfahren und bei zweiter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11-3":"In den Kreisverkehr einfahren und bei dritter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11-4":"In den Kreisverkehr einfahren und bei vierter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11-5":"In den Kreisverkehr einfahren und bei fünfter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11-6":"In den Kreisverkehr einfahren und bei sechster Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11-7":"In den Kreisverkehr einfahren und bei siebter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11-8":"In den Kreisverkehr einfahren und bei achter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11-9":"In den Kreisverkehr einfahren und bei neunter Möglichkeit[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_11-x":"In den Kreisverkehr einfahren und bei einer der vielen Möglichkeiten[ in Richtung <b>%s</b>] verlassen",
"DIRECTION_15":"Sie haben Ihr Ziel erreicht"
};
// set GUI language on load

View File

@ -35,6 +35,7 @@ OSRM.Localization["en"] = {
"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": "Search Results",
"FOUND_X_RESULTS": "found %i results",
"TIMED_OUT": "Timed Out",
"NO_RESULTS_FOUND": "No results found",
"NO_RESULTS_FOUND_SOURCE": "No results found for start",
@ -60,27 +61,26 @@ OSRM.Localization["en"] = {
"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_1":"Continue[ on <b>%s</b>]",
"DIRECTION_2":"Turn slight right[ on <b>%s</b>]",
"DIRECTION_3":"Turn right[ on <b>%s</b>]",
"DIRECTION_4":"Turn sharp right[ on <b>%s</b>]",
"DIRECTION_5":"U-Turn[ on <b>%s</b>]",
"DIRECTION_6":"Turn slight left[ on <b>%s</b>]",
"DIRECTION_7":"Turn slight right[ on <b>%s</b>]",
"DIRECTION_7":"Turn left[ 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"
"DIRECTION_10":"Head <b>%s</b>",
"DIRECTION_11-1":"Enter roundabout and leave at first exit[ on <b>%s</b>]",
"DIRECTION_11-2":"Enter roundabout and leave at second exit[ on <b>%s</b>]",
"DIRECTION_11-3":"Enter roundabout and leave at third exit[ on <b>%s</b>]",
"DIRECTION_11-4":"Enter roundabout and leave at fourth exit[ on <b>%s</b>]",
"DIRECTION_11-5":"Enter roundabout and leave at fifth exit[ on <b>%s</b>]",
"DIRECTION_11-6":"Enter roundabout and leave at sixth exit[ on <b>%s</b>]",
"DIRECTION_11-7":"Enter roundabout and leave at seventh exit[ on <b>%s</b>]",
"DIRECTION_11-8":"Enter roundabout and leave at eighth exit[ on <b>%s</b>]",
"DIRECTION_11-9":"Enter roundabout and leave at nineth exit[ on <b>%s</b>]",
"DIRECTION_11-x":"Enter roundabout and leave at one of the too many exits[ on <b>%s</b>]",
"DIRECTION_15":"You have reached your destination"
};
//set GUI language on load

View File

@ -30,7 +30,7 @@ init: function() {
// create dropdown menu
var select = document.createElement('select');
select.id = "gui-language-toggle";
//select.className = "top-left-button";
select.className = "top-left-button";
select.onchange = function() { OSRM.Localization.change(this.value); };
// fill dropdown menu

View File

@ -128,9 +128,9 @@ html, body {
/* styles for main-input input-mask-header */
#gui-language-toggle
{
position:absolute;
border: 0px;
text-decoration:none;
position: relative;
opacity: 0;
filter: alpha(opacity=0);
z-index: 5;

View File

@ -38,73 +38,72 @@ OSRM.init = function() {
// prefetch images
OSRM.GLOBALS.images = {};
OSRM.prefetchImages = function() {
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'
var image_list = [ {id:'marker-shadow', url:L.ROOT_URL + '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'},
{id:'marker-highlight', url:'images/marker-highlight.png'},
{id:'marker-source-drag', url:'images/marker-source-drag.png'},
{id:'marker-target-drag', url:'images/marker-target-drag.png'},
{id:'marker-via-drag', url:'images/marker-via-drag.png'},
{id:'marker-highlight-drag', url:'images/marker-highlight-drag.png'},
{id:'marker-drag', url:'images/marker-drag.png'},
{id:'cancel', url:'images/cancel.png'},
{id:'cancel_active', url:'images/cancel_active.png'},
{id:'cancel_hover', url:'images/cancel_hover.png'},
{id:'restore', url:'images/restore.png'},
{id:'restore_active', url:'images/restore_active.png'},
{id:'restore_hover', url:'images/restore_hover.png'},
{id:'printer', url:'images/printer.png'},
{id:'printer_active', url:'images/printer_active.png'},
{id:'printer_hover', url:'images/printer_hover.png'},
{id:'printer_inactive', url:'images/printer_inactive.png'},
{id:'direction_0', url:'images/default.png'},
{id:'direction_1', url:'images/continue.png'},
{id:'direction_2', url:'images/slight-right.png'},
{id:'direction_3', url:'images/turn-right.png'},
{id:'direction_4', url:'images/sharp-right.png'},
{id:'direction_5', url:'images/u-turn.png'},
{id:'direction_6', url:'images/slight-left.png'},
{id:'direction_7', url:'images/turn-left.png'},
{id:'direction_8', url:'images/sharp-left.png'},
{id:'direction_11', url:'images/round-about.png'},
{id:'direction_15', url:'images/target.png'},
{id:'favicon', url:'images/osrm-favicon.ico'},
];
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';
for(var i=0; i<image_list.length; i++) {
OSRM.G.images[image_list[i].id] = new Image();
OSRM.G.images[image_list[i].id].src = image_list[i].url;
}
OSRM.G.images["favicon"] = new Image();
OSRM.G.images["favicon"].src = 'images/osrm-favicon.ico';
};
// prefetch icons
OSRM.GLOBALS.icons = {};
OSRM.prefetchIcons = function() {
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'
var icon_list = [ {id:'marker-source', image_id:'marker-source'},
{id:'marker-target', image_id:'marker-target'},
{id:'marker-via', image_id:'marker-via'},
{id:'marker-highlight', image_id:'marker-highlight'},
{id:'marker-source-drag', image_id:'marker-source-drag'},
{id:'marker-target-drag', image_id:'marker-target-drag'},
{id:'marker-via-drag', image_id:'marker-via-drag'},
{id:'marker-highlight-drag', image_id:'marker-highlight-drag'}
//{id:'marker-drag', image_id:'marker-drag'} // special treatment because of size
];
for(var i=0; i<image_names.length; i++) {
for(var i=0; i<icon_list.length; i++) {
var icon = {
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),
iconUrl: OSRM.G.images[icon_list[i].image_id].src, iconSize: new L.Point(25, 41), iconAnchor: new L.Point(13, 41),
shadowUrl: OSRM.G.images["marker-shadow"].src, shadowSize: new L.Point(41, 41),
popupAnchor: new L.Point(0, -33)
};
OSRM.G.icons[image_names[i]] = new L.SwitchableIcon(icon);
OSRM.G.icons[icon_list[i].id] = new L.SwitchableIcon(icon);
}
// special values for drag marker
OSRM.G.icons['marker-drag'] = new L.SwitchableIcon( {iconUrl: 'images/marker-drag.png', iconSize: new L.Point(18, 18) } );
OSRM.G.icons['marker-drag'] = new L.SwitchableIcon( {iconUrl: OSRM.G.images["marker-drag"].src, iconSize: new L.Point(18, 18) } );
};

View File

@ -73,7 +73,6 @@ showRoute: function(response) {
OSRM.G.response = response;
OSRM.G.via_points = response.via_points.slice(0);
console.log(OSRM.G.via_points);
if(response.status == 207) {
OSRM.RoutingGeometry.showNA();
OSRM.RoutingNoNames.showNA();

View File

@ -66,7 +66,7 @@ show: function(response) {
route_desc += '<tr class="'+rowstyle+'">';
route_desc += '<td class="result-directions">';
route_desc += '<img width="18px" src="'+OSRM.G.images[OSRM.RoutingDescription.getDirectionIcon(response.route_instructions[i][0])].src+'" alt="" />';
route_desc += '<img width="18px" src="'+OSRM.RoutingDescription.getDrivingInstructionIcon(response.route_instructions[i][0])+'" alt="" />';
route_desc += "</td>";
route_desc += '<td class="result-items">';
@ -74,11 +74,11 @@ show: function(response) {
// build route description
if( i == 0 )
route_desc += OSRM.loc("DIRECTION_"+OSRM.RoutingDescription.getDirectionId(response.route_instructions[i][0])).replace(/%s/, OSRM.loc(response.route_instructions[i][6]) );
route_desc += OSRM.loc(OSRM.RoutingDescription.getDrivingInstruction(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.getDirectionId(response.route_instructions[i][0])).replace(/\[(.*)\]/,"$1").replace(/%s/, response.route_instructions[i][1]);
route_desc += OSRM.loc(OSRM.RoutingDescription.getDrivingInstruction(response.route_instructions[i][0])).replace(/\[(.*)\]/,"$1").replace(/%s/, response.route_instructions[i][1]);
else
route_desc += OSRM.loc("DIRECTION_"+OSRM.RoutingDescription.getDirectionId(response.route_instructions[i][0])).replace(/\[(.*)\]/,"");
route_desc += OSRM.loc(OSRM.RoutingDescription.getDrivingInstruction(response.route_instructions[i][0])).replace(/\[(.*)\]/,"");
route_desc += '</div>';
route_desc += "</td>";
@ -147,69 +147,28 @@ showNA: function( display_text ) {
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) {
var directions = {
"Turn left":"turn-left",
"Turn right":"turn-right",
"U-Turn":"u-turn",
"Head":"continue",
"Continue":"continue",
"Turn slight left":"slight-left",
"Turn slight right":"slight-right",
"Turn sharp left":"sharp-left",
"Turn sharp right":"sharp-right",
"Enter roundabout and leave at first exit":"round-about",
"Enter roundabout and leave at second exit":"round-about",
"Enter roundabout and leave at third exit":"round-about",
"Enter roundabout and leave at fourth exit":"round-about",
"Enter roundabout and leave at fifth exit":"round-about",
"Enter roundabout and leave at sixth exit":"round-about",
"Enter roundabout and leave at seventh exit":"round-about",
"Enter roundabout and leave at eighth exit":"round-about",
"Enter roundabout and leave at nineth exit":"round-about",
"Enter roundabout and leave at tenth exit":"round-about",
"Enter roundabout and leave at one of the too many exit":"round-about",
"You have reached your destination":"target"
};
// retrieve driving instruction icon from instruction id
getDrivingInstructionIcon: function(server_instruction_id) {
var local_icon_id = "direction_";
server_instruction_id = server_instruction_id.replace(/^11-\d{1,}$/,"11"); // dumb check, if there is a roundabout (all have the same icon)
local_icon_id += server_instruction_id;
if( directions[name] )
return directions[name];
if( OSRM.G.images[local_icon_id] )
return OSRM.G.images[local_icon_id].src;
else
return "default";
return OSRM.G.images["direction_0"].src;
},
//map driving instructions to ids
getDirectionId: function(name) {
var directions = {
"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
};
// retrieve driving instructions from instruction ids
getDrivingInstruction: function(server_instruction_id) {
var local_instruction_id = "DIRECTION_";
server_instruction_id = server_instruction_id.replace(/^11-\d{2,}$/,"11-x"); // dumb check, if there are 10+ exits on a roundabout (say the same for exit 10+)
local_instruction_id += server_instruction_id;
if( directions[name] )
return directions[name];
else
return 0;
var description = OSRM.loc( local_instruction_id );
if( description == local_instruction_id)
return OSRM.loc("DIRECTION_0");
return description;
}
};