// create a global request object to be used
var receiveReq = getXmlHttpRequestObject();

//Gets the browser specific XmlHttpRequest Object. This is boiler plate code used in every Ajax application
function getXmlHttpRequestObject() {	
	if (window.XMLHttpRequest) {		
		return new XMLHttpRequest();	
	} else if(window.ActiveXObject) {		
		return new ActiveXObject("Microsoft.XMLHTTP");	
	} else {		
		document.getElementById('status_div').innerHTML = 'Status: Cound not create XmlHttpRequest Object.' +		
			'Consider upgrading your browser.';	
	}
}

// Gets the current locations from the REST service on the server and writes out the HTML that contains links for the map
function getLocationsAndMap() {	
	if (receiveReq.readyState == 4 || receiveReq.readyState == 0) 
	{	
		// 	getD2DSites.html is a REST service that returns the list of locations as JSON
		receiveReq.open("GET", 'getD2DSites.html', true);		
		receiveReq.onreadystatechange = getLocationsAndMapCallback; 		
		receiveReq.send(null);	
	}			
} 
function getLocationsAndMapCallback() {	
	if (receiveReq.readyState == 4) {		
		// deserialize the JSON response. This creates an array of location objects. 
		// Use your browser to make a request to ./getD2DSites.html to see what the JSON looks like.
		var response = eval("(" + receiveReq.responseText + ")");		

		// generate HTML listing the locations and update the page DOM so the user will see the HTML
		var locations_div = document.getElementById('locations_div');		
		locations_div.innerHTML = '<p>Received ' + response.locations.location.length + ' results.</p>';
		for(i=0;i < response.locations.location.length; i++) {
			var city = response.locations.location[i].city;
			var loc = response.locations.location[i].location;
			// the anchor href is meaningless since we abort the navigation by returning false from onclick
			var anchor = '<a href="irrelevant" onclick="javascript:showAddress(\''+response.locations.location[i].address+'\'); return false">';
			var addr = 	response.locations.location[i].address;
			locations_div.innerHTML += '<p>' + anchor + loc + '</a><br/>' + addr + '</p>';
		}		
	}
}

// Google API specific code for recentering the map on an address, taken from the Google code library.
// The Google Maps documentation contains a lot of code samples to get you going fast!
var gmarkers = [];
var html = [];
      var htmls = [];
      var to_htmls = [];
      var from_htmls = [];
	   var to_htmls1 = [];
      var from_htmls1 = [];
      var i=0;
	  
function fnValidateFrom() {
	alert(document.thisFrom.saddr.value);
	if(document.thisFrom.saddr.value==""){
		alert("Please fill Start Address.");
		document.thisFrom.saddr.focus(); 
		
	}
	else{
	setDirections(document.thisFrom.saddr.value, document.thisFrom.daddr.value, document.thisFrom.locale.value);
	
	}
}

function fnValidateTo() {
	alert(document.thisTo.daddr.value);
	if(document.thisTo.daddr.value==""){
		alert("Please fill End Address.");
		document.thisTo.daddr.focus(); 
		
	}
	else{
	setDirections(document.thisTo.daddr.value, document.thisTo.saddr.value, document.thisTo.locale.value);
	
	}
}
function createMarker(point,name,html,view) {
        var marker = new GMarker(point);

        // The info window version with the "to here" form open
        to_htmls[i] = html + '</a><br><br>Directions: <b>To here</b> - <a href="javascript:fromhere(' + i + ')">From here</a>' +
           '<br>Start address:<form onsubmit="setDirections(this.saddr.value, this.daddr.value, this.locale.value); return false" method="get" target="_blank">' +
           '<input type="text" SIZE=40 MAXLENGTH=48 name="saddr" id="saddr" value="" /><br>' +
           '<INPUT value="Get Directions" TYPE="SUBMIT">' +
           '<input type="hidden" name="locale" value="en"><input type="hidden" name="daddr" value="' + point.lat() + ',' + point.lng() +
                  // "(" + name + ")" +
           '"/>';
        // The info window version with the "to here" form open
        from_htmls[i] = html + '</a><br><br>Directions: <a href="javascript:tohere(' + i + ')">To here</a> - <b>From here</b>' +
           '<br>End address:<form onsubmit="setDirections(this.daddr.value, this.saddr.value, this.locale.value); return false" method="get"" target="_blank">' +
           '<input type="text" SIZE=40 MAXLENGTH=48 name="daddr" id="daddr" value="" /><br>' +
           '<INPUT value="Get Directions" TYPE="SUBMIT">' +
           '<input type="hidden" name="locale" value="en"><input type="hidden" name="saddr" value="' + point.lat() + ',' + point.lng() +
                  // "(" + name + ")" +
           '"/>';
        // The inactive version of the direction info
        html = html + '</a><br><br>Directions: <a href="javascript:tohere('+i+')">To here</a> - <a href="javascript:fromhere('+i+')">From here</a>';
		
		//to show the popup automatically
		
       
		//end of show the popup
		
        GEvent.addListener(marker, "click", function() {
         var tab1 = new GInfoWindowTab("Location", html);
		 var tab2 = new GInfoWindowTab("More Info", '<div id="detailmap">Additional information coming soon</div>');
		 var infoTabs = [tab1,tab2];
		 marker.openInfoWindowTabsHtml(infoTabs);
        });
        gmarkers[i] = marker;
        htmls[i] = html;
        i++;
        return marker;
		
      }
	
	
      // functions that open the directions forms
      function tohere(i) {
		 var tab1 = new GInfoWindowTab("Location", to_htmls[i]);
		 var tab2 = new GInfoWindowTab("More Info", '<div id="detailmap">Additional information coming soon</div>');
		 var infoTabs = [tab1,tab2];
        gmarkers[i].openInfoWindowTabsHtml(infoTabs);
      }
      function fromhere(i) {
		   var tab1 = new GInfoWindowTab("Location", from_htmls[i]);
		 var tab2 = new GInfoWindowTab("More Info", '<div id="detailmap">Additional information coming soon</div>');
		 var infoTabs = [tab1,tab2];
        gmarkers[i].openInfoWindowTabsHtml(infoTabs);
      }
	  
	  function tohere1(i) {
		 
		 var tab3 = new GInfoWindowTab("Location", to_htmls1[i]);
		 var tab4 = new GInfoWindowTab("More Info", '<div id="detailmap">Additional information coming soon</div>');
		 var infoTabs1 = [tab3,tab4];
      
	   gmarkers[i].openInfoWindowTabsHtml(infoTabs1);
      }
      function fromhere1(i) {
		   var tab3 = new GInfoWindowTab("Location", from_htmls1[i]);
		 var tab4 = new GInfoWindowTab("More Info", '<div id="detailmap">Additional information coming soon</div>');
		 var infoTabs1 = [tab3,tab4];
        gmarkers[i].openInfoWindowTabsHtml(infoTabs1);
      }
	  
function showAddress(lat,long,address,other) {  

document.getElementById('map_canvas').style.display="none";
	document.getElementById('map_view').style.display="block";
	//var icon = new GIcon();

//icon.image = "/gmap/pointer-chf.png";
//icon.shadow = "/gmap/shadow.png";
//icon.iconSize = new GSize(65, 62);
//icon.shadowSize = new GSize(92, 62);
//icon.iconAnchor = new GPoint(37, 59);
//icon.infoWindowAnchor = new GPoint(31, 8);

	map = new GMap2(document.getElementById("map_view"));
	var geocoder = new GClientGeocoder();
	geocoder.getLatLng(address,    
		function(point) {      
		  var point = new GLatLng(lat,long);       
		    map.setCenter(point, 13); 
			var mapControl = new GMapTypeControl();
			map.addControl(mapControl);
			map.addControl(new GLargeMapControl());
			view=1;
		    var marker = createMarker(point,address,other,view)
            map.addOverlay(marker);
			 if(view==1){
			// The info window version with the "to here" form open
        to_htmls1[i] = other + '</a><br><br>Directions: <b>To here</b> - <a href="javascript:fromhere1(' + i + ')">From here</a>' +
           '<br>Start address:<form onsubmit="setDirections(this.saddr.value, this.daddr.value, this.locale.value); return false" method="get" target="_blank">' +
           '<input type="text" SIZE=40 MAXLENGTH=48 name="saddr" id="saddr" value="" /><br>' +
           '<INPUT value="Get Directions" TYPE="SUBMIT">' +
           '<input type="hidden" name="locale" value="en"><input type="hidden" name="daddr" value="' + point.lat() + ',' + point.lng() +
                  // "(" + name + ")" +
           '"/>';
        // The info window version with the "to here" form open
        from_htmls1[i] = other + '</a><br><br>Directions: <a href="javascript:tohere1(' + i + ')">To here</a> - <b>From here</b>' +
           '<br>End address:<form onsubmit="setDirections(this.daddr.value, this.saddr.value, this.locale.value); return false" method="get"" target="_blank">' +
           '<input type="text" SIZE=40 MAXLENGTH=48 name="daddr" id="daddr" value="" /><br>' +
           '<INPUT value="Get Directions" TYPE="SUBMIT">' +
           '<input type="hidden" name="locale" value="en"><input type="hidden" name="saddr" value="' + point.lat() + ',' + point.lng() +
                  // "(" + name + ")" +
           '"/>';	
				
        // The inactive version of the direction info
         htmls = other + '</a><br><br>Directions: <a href="javascript:tohere1('+i+')">To here</a> - <a href="javascript:fromhere1('+i+')">From here</a>';
		
		 var tab3 = new GInfoWindowTab("Location", htmls);
		 var tab4 = new GInfoWindowTab("More Info", '<div id="detailmap">Additional information coming soon</div>');
		 var infoTabs1 = [tab3,tab4];
		 marker.openInfoWindowTabsHtml(infoTabs1);
		 gmarkers[i] = marker;
		}
   			
	    }  
    );
}