added new gui buttons for opening/closing,

route button now works,
more precise error message when geocoder does not find a result,
added maximum input length for text boxes
This commit is contained in:
DennisSchiefer 2012-03-14 17:42:14 +01:00
parent 0ee469c4e0
commit 22dda2b285
12 changed files with 49 additions and 12 deletions

View File

@ -40,7 +40,7 @@ OSRM.loc = OSRM.Localization.translate;
OSRM.Localization["de"] = {
//gui
"GUI_START": "Start",
"GUI_END": "Ende",
"GUI_END": "Ziel",
"GUI_RESET": "Reset",
"GUI_SEARCH": "Suchen",
"GUI_ROUTE": "Route",
@ -54,6 +54,8 @@ OSRM.Localization["de"] = {
"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": "Generiere Link",
@ -85,6 +87,8 @@ OSRM.Localization["en"] = {
"SEARCH_RESULTS": "Search Results",
"TIMED_OUT": "Timed Out",
"NO_RESULTS_FOUND": "No results found",
"NO_RESULTS_FOUND_SOURCE": "No results found for start",
"NO_RESULTS_FOUND_TARGET": "No results found for end",
//routing
"ROUTE_DESCRIPTION": "Route Description",
"GET_LINK": "Generate Link",

View File

@ -78,7 +78,7 @@ function showGeocoderResults_Target(response) { showGeocoderResults(OSRM.TARGET_
function showGeocoderResults(marker_id, response) {
if(response){
if(response.length == 0) {
showGeocoderResults_Empty();
showGeocoderResults_Empty(marker_id);
return;
}
@ -108,9 +108,14 @@ function showGeocoderResults(marker_id, response) {
onclickGeocoderResult(marker_id, response[0].lat, response[0].lon);
}
}
function showGeocoderResults_Empty() {
function showGeocoderResults_Empty(marker_id) {
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("NO_RESULTS_FOUND")+".<p>";
if(marker_id == OSRM.SOURCE_MARKER_LABEL)
document.getElementById('information-box').innerHTML = "<br><p style='font-size:14px;font-weight:bold;text-align:center;'>"+OSRM.loc("NO_RESULTS_FOUND_SOURCE")+".<p>";
else if(marker_id == OSRM.TARGET_MARKER_LABEL)
document.getElementById('information-box').innerHTML = "<br><p style='font-size:14px;font-weight:bold;text-align:center;'>"+OSRM.loc("NO_RESULTS_FOUND_TARGET")+".<p>";
else
document.getElementById('information-box').innerHTML = "<br><p style='font-size:14px;font-weight:bold;text-align:center;'>"+OSRM.loc("NO_RESULTS_FOUND")+".<p>";
}
function showGeocoderResults_Timeout() {
document.getElementById('information-box-headline').innerHTML = OSRM.loc("SEARCH_RESULTS")+":";

Binary file not shown.

Before

Width:  |  Height:  |  Size: 429 B

After

Width:  |  Height:  |  Size: 402 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 447 B

After

Width:  |  Height:  |  Size: 484 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 440 B

After

Width:  |  Height:  |  Size: 483 B

BIN
WebContent/images/gui.pdf Normal file

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 477 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 480 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 488 B

View File

@ -109,7 +109,7 @@ html, body, #map {
padding:0px;
}
.main-toggle
.main-toggle-out
{
cursor:pointer;
position:absolute;
@ -119,14 +119,32 @@ html, body, #map {
height:16px;
background-image:url("images/cancel.png");
}
.main-toggle:hover
.main-toggle-out:hover
{
background-image:url("images/cancel_hover.png");
}
.main-toggle:active
.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
{

View File

@ -68,7 +68,7 @@ or see http://www.gnu.org/licenses/agpl.txt.
<!-- show ui blob -->
<div id="blob-wrapper" class="gui-wrapper">
<div id="blob-input" class="gui-box">
<div class="main-toggle" onclick="OSRM.GUI.toggleMain()"></div>
<div class="main-toggle-in" onclick="OSRM.GUI.toggleMain()"></div>
</div>
</div>
@ -77,21 +77,21 @@ or see http://www.gnu.org/licenses/agpl.txt.
<!-- input box -->
<div class="gui-box not-selectable" id="main-input">
<div class="main-toggle" onclick="OSRM.GUI.toggleMain()"></div>
<div class="main-toggle-out" onclick="OSRM.GUI.toggleMain()"></div>
<img id="osrm-logo" alt="OSRM Logo" src="images/osrm-logo.png" />
<!-- source/target input -->
<table class="full">
<tr>
<td id="gui-search-source-label">Start:</td>
<td><input id="input-source-name" class="input-box" type="text" value="" title="Startposition eingeben" onkeypress="if(event.keyCode==13) {callGeocoder(OSRM.SOURCE_MARKER_LABEL, document.getElementById('input-source-name').value);}" /></td>
<td><input id="input-source-name" class="input-box" type="text" maxlength="200" value="" title="Startposition eingeben" onkeypress="if(event.keyCode==13) {callGeocoder(OSRM.SOURCE_MARKER_LABEL, document.getElementById('input-source-name').value);}" /></td>
<!-- <td class="right"><a class="button not-selectable" id="gui-here-target" onclick="">i</a></td> -->
<td class="right"><a class="button not-selectable" id="gui-search-source" onclick="callGeocoder(OSRM.SOURCE_MARKER_LABEL, document.getElementById('input-source-name').value);">Suchen</a></td>
</tr>
<tr>
<td id="gui-search-target-label">Ende:</td>
<td><input id="input-target-name" class="input-box" type="text" value="" title="Zielposition eingeben" onkeypress="if(event.keyCode==13) {callGeocoder(OSRM.TARGET_MARKER_LABEL, document.getElementById('input-target-name').value);}" /></td>
<td><input id="input-target-name" class="input-box" type="text" maxlength="200" value="" title="Zielposition eingeben" onkeypress="if(event.keyCode==13) {callGeocoder(OSRM.TARGET_MARKER_LABEL, document.getElementById('input-target-name').value);}" /></td>
<!-- <td class="right"><a class="button not-selectable" id="gui-here-target" onclick="">i</a></td> -->
<td class="right"><a class="button not-selectable" id="gui-search-target" onclick="callGeocoder(OSRM.TARGET_MARKER_LABEL, document.getElementById('input-target-name').value);">Suchen</a></td>
</tr>

View File

@ -408,7 +408,17 @@ function getDirectionIcon(name) {
// click: button "route"
function startRouting() {
getRoute(OSRM.FULL_DESCRIPTION);
my_route.hideRoute();
my_markers.removeAll();
my_markers.highlight.hide();
document.getElementById('information-box').innerHTML = "";
document.getElementById('information-box-headline').innerHTML = "";
callGeocoder(OSRM.SOURCE_MARKER_LABEL, document.getElementById('input-source-name').value);
callGeocoder(OSRM.TARGET_MARKER_LABEL, document.getElementById('input-target-name').value);
//getRoute(OSRM.FULL_DESCRIPTION);
//TODO: center map on route
}
// click: button "reset"