Unnamed

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
   <head>
      <title></title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <style type="text/css">

.allmap
{
position:relative;
width: 400px;
height: 400px;
}
.map
{
position: relative;
width: 100%;
height: 100%;
}
.alertdiv 
{
 position: absolute;
 top: 0px;
 right: 0px;
 width: 200px;
 visibility:hidden;
 z-index:2;
 
}
div.alerttitle 
{
 position: relative;
 top: 0px;
 left: 0px;
 width: 200px;
 height:18px;
 background-color: #DCDD39;
 display:block;
 border-top:#666666 2px solid;
 border-right:#666666 2px solid;
 border-left:#666666 2px solid;
}
.alertclose
{
 position:absolute;
 text-align:center;
 right:1px;
 top:1px;
 font-family:Verdana;
 font-size:7pt;
 border:solid 1px #666666;
 padding:0px opx 1px 1px;
 background-color: #FEFF5B;
 filter:alpha(opacity=100);
 opacity:1.0;
 cursor:pointer;
 height:13px;
 display:block;
}


div.alerttext 
{
 position: absolute;
 top: 18px;
 left: 0px;
 width:190px;
 padding:1px 5px 4px 5px;
 background-color: #FEFF5B;
 background-image: url(FMC.png);
 filter:alpha(opacity=85);
 opacity:.85;
 font-size:10pt; 
 border-bottom:#666666 2px solid;
 border-right:#666666 2px solid;
 border-left:#666666 2px solid;
 overflow:auto;
}
#shim
{
 border:none;
 position:absolute;
 z-index:1;
 overflow:hidden;
 top: 200px;
 left: 350px;
 width: 400px;
 display:none;
}	  
	  </style>
	  <script src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=5"></script>

      <script>
         var map = null;

         function GetMap()
	{
            map = new VEMap('myMap');
            map.LoadMap(new VELatLong(47.8125,-122.3735),17,'h',false);

}
         function GetDirections()
{
if (map!=null) {
map.Dispose();
}         
            map = new VEMap('myMap');
            
            map.GetRoute('6th and Bell St, Edmonds, WA',
                     document.location.address.value,
                     null,
                     null,
                     onGotRoute);
map.LoadMap();         
}

         function onGotRoute(route)
         {
           var routeinfo="Route info:\n\n";
            routeinfo+="Total distance: ";
            routeinfo+=   route.Itinerary.Distance+" ";
            routeinfo+=   route.Itinerary.DistanceUnit+"\n";
            
            var steps="";
            var len = route.Itinerary.Segments.length;
               for(var i = 0; i < len ;i++)
               {
                  steps+="<b>"+(i+1)+")&nbsp;</b>";
				    steps+=route.Itinerary.Segments[i].Instruction+" -- (";
                  steps+=route.Itinerary.Segments[i].Distance+") ";
                  steps+=route.Itinerary.DistanceUnit+"<br />";
               }
            routeinfo+="<b>Steps:</b><br />"+steps+"<br />"+"<p align=\"center\"><a href=\"#\" onClick=\"print(); return false;\">Print Directions</a></p>"

        DoAlert(routeinfo);   
         }
		 function DoAlert(text) //this is used for all UI notifications, including the new alerts that contain UI elements.
{
	var d=document.getElementById("alertdiv");
	d.style.visibility="visible";
	document.getElementById("alerttext").innerHTML = text;
    
    addShim(d,'alertshim');
}
function addShim(el,id) //creates the required 3D shim for an element. Used espcially with the DoAlert() function
{
    var shim = document.getElementById('alertshim');
    if (!shim) 
        shim = document.createElement("iframe"); 
    shim.id = id;         
    shim.frameBorder = "0"; 
    shim.style.position = "absolute";
    shim.style.zIndex = "1";
    shim.style.top  = el.offsetTop + "px";
    shim.style.left = el.offsetLeft + "px";
    shim.style.width  = el.offsetWidth + "px";
    var h = parseInt(document.getElementById("alerttitle").offsetHeight) +
	        parseInt(document.getElementById("alerttext").offsetHeight);
    if (h > 0)
	    shim.style.height = h + "px";
	else
	    shim.style.height = parseInt(document.getElementById("alerttitle").style.height) +
	                        parseInt(document.getElementById("alerttext").style.height) + "px";


    el.shimElement = shim; 
    el.parentNode.insertBefore(shim, el);
}
function HideAlert() //hides the custom Alert box
{
    document.getElementById('alertdiv').style.visibility='hidden';
    var myShim = document.getElementById("alertshim");            
    if (myShim!=null) myShim.parentNode.removeChild(myShim);            
    myShim = null;
}
      </script>
   </head>
<body onLoad="GetMap();">
   <div id='allmap' class='allmap'>
      <div id='myMap' class='map'></div>
	  		<div id='alertdiv' class='alertdiv'>
			<div id='alerttitle' class='alerttitle'>
				<div id='alertclose' class='alertclose' onclick="HideAlert();">&nbsp;<b>X</b>&nbsp;</div>
			</div>
			<div id='alerttext' class='alerttext'>
</div>
		</div>
		</div>
	  
	  

<table>
<tr><td>
<form name="location">
Enter Starting Address:<input name ="address" type="text" size="30"><br>
<input name="submit" size="30" 
type="button" value="Get Directions to Taste of Edmonds" onClick="GetDirections()" />
</form>
</td>
</tr></table>
</body>

</html>