added buttons to delete source and target

WebContent/OSRM.Markers.js

@@ -174,6 +174,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";
 },
 removeVias: function() {
 	// assert correct route array s - v - t
@@ -187,6 +189,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";
 	return 0;	
 },
 setTarget: function(position) {
@@ -195,6 +198,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";
 	return this.route.length-1;
 },
 setVia: function(id, position) {
@@ -214,13 +218,15 @@ removeMarker: function(id) {
 		this.removeVias();
 		document.getElementById('input-source-name').value = "";
 		document.getElementById('information-box').innerHTML = "";
-		document.getElementById('information-box-headline').innerHTML = "";		
+		document.getElementById('information-box-headline').innerHTML = "";
+		document.getElementById('delete-source-marker').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('information-box').innerHTML = "";
-		document.getElementById('information-box-headline').innerHTML = "";		
+		document.getElementById('information-box-headline').innerHTML = "";
+		document.getElementById('delete-target-marker').style.visibility = "hidden";
 	}
 	
 	this.route[id].hide();

WebContent/main.css

@@ -346,4 +346,25 @@ html, body, #map {
 {
 	background-color:#F4F4F4;
 	color:#FF0000;
+}
+
+
+.delete-marker
+{
+	cursor:pointer;
+	position:absolute;
+	right:5px;
+	top:3px;
+	width:16px;
+	height:16px;
+	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");
 }

WebContent/main.html

@@ -94,13 +94,17 @@ or see http://www.gnu.org/licenses/agpl.txt.
     <table class="full">
     <tr>
     <td id="gui-search-source-label">Start:</td>
-    <td><input id="input-source-name" class="input-box" type="text" maxlength="200" value="" title="Startposition eingeben" onchange="OSRM.RoutingGUI.inputChanged(OSRM.C.SOURCE_LABEL);" /></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><input id="input-target-name" class="input-box" type="text" maxlength="200" value="" title="Zielposition eingeben" onchange="OSRM.RoutingGUI.inputChanged(OSRM.C.TARGET_LABEL);" /></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>

WebContent/routing/OSRM.RoutingGUI.js

@@ -109,6 +109,21 @@ openJOSM: function() {
 openOSMBugs: function() {
 	var position = OSRM.G.map.getCenterUI();
 	window.open( "http://osmbugs.org/?lat="+position.lat.toFixed(6)+"&lon="+position.lng.toFixed(6)+"&zoom="+OSRM.G.map.getZoom() );
+},
+
+//click: button "delete marker"
+deleteMarker: function(marker_id) {
+	var id = null;
+	if(marker_id == 'source' && OSRM.G.markers.hasSource() )
+		id = 0;
+	else if(marker_id == 'target' && OSRM.G.markers.hasTarget() )
+		id = OSRM.G.markers.route.length-1;
+	if( id == null)
+		return;
+	
+	OSRM.G.markers.removeMarker( id );
+	OSRM.Routing.getRoute();
+	OSRM.G.markers.highlight.hide();	
 }
 
 };