//<![CDATA[

    // ************** CODE LICENSE **********************************
    // This code was put together by Kaiesh Vohra for myVenue.in 
    // from several sources (mentioned below). If you wish to use
    // this code in whole, or part, the parts that are not
    // Copyright by Google require this license block to be 
    // preserved. Removal or modification of this notice is a
    // violation of the license.
    //
    // This Javascript is based in part on code provided by the
    // Blackpool Community Church Javascript Team
    // http://www.commchurch.freeserve.co.uk/   
    // http://econym.googlepages.com/index.htm
    //
    //           and
    //
    // Esa of: http://koti.mbnet.fi/ojalesa/exam/index.html
    // **************************************************************


    if (GBrowserIsCompatible()) {
      var side_bar_html = "<h2>Right now, the map is showing you where <otxt>my</otxt>Venue.in lives!</h2><br/>";
      var gmarkers = [];
      var htmls = [];
      var refCodes = [];
      var i = 0;


      // A function to create the marker and set up the event window
      function createMarker(point,name,html) {
        var marker = new GMarker(point);
        // === store the name so that the tooltip function can use it ===
        marker.tooltip = '<div class="tooltip">'+name+'</div>';
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        gmarkers[i] = marker;
        htmls[i] = html;
        side_bar_html += '<b>Option '+(i+1)+'.</b> <u><a href="javascript:myclick(' + i + ')" onmouseover="mymouseover('+i+')" onmouseout="mymouseout()">' + name + '</a></u><br/>';
        i++;
        map.addOverlay(marker);

        //  ======  The new marker "mouseover" and "mouseout" listeners  ======
        GEvent.addListener(marker,"mouseover", function() {
          showTooltip(marker);
        });        
        GEvent.addListener(marker,"mouseout", function() {
		tooltip.style.visibility="hidden"
        });        
      }

      // A function to create the marker and set up the event window
      function forceCreateMarker(point,name,popURL, forceIndex, refCode) {
        var marker = new GMarker(point);
        // === store the name so that the tooltip function can use it ===
        marker.tooltip = '<div class="tooltip">'+name+'</div>';
        GEvent.addListener(marker, "click", function() {
         popHotelProfile(popURL); 
	 //marker.openInfoWindowHtml(html);
	  //document.getElementById("bub"+refCode).src = document.getElementById("btn"+refCode).src;
        });
        gmarkers[forceIndex] = marker;
        htmls[forceIndex] = popURL;
        refCodes[forceIndex] = refCode;
        map.addOverlay(marker);

        //  ======  The new marker "mouseover" and "mouseout" listeners  ======
        GEvent.addListener(marker,"mouseover", function() {
          showTooltip(marker);
        });        
        GEvent.addListener(marker,"mouseout", function() {
		tooltip.style.visibility="hidden"
        });        
      }

      // ====== This function displays the tooltip ======
      // it can be called from an icon mousover or a side_bar mouseover
      function showTooltip(marker) {
      	tooltip.innerHTML = marker.tooltip;
	var point=map.getCurrentMapType().getProjection().fromLatLngToPixel(map.getBounds().getSouthWest(),map.getZoom());
	var offset=map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(),map.getZoom());
	var anchor=marker.getIcon().iconAnchor;
	var width=marker.getIcon().iconSize.width;
	var pos = new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(offset.x - point.x - anchor.x + width,- offset.y + point.y +anchor.y)); 
	pos.apply(tooltip);
	tooltip.style.visibility="visible";
      }


      // ======= This function creates a series of pre-defined markers on a map =====
      // it can be invoked at any time, and it will cleanse the map and populate it with contents specified within the array
      // Read the data from example.xml
	function drawMarkers(lats, lngs, lbls, htmls, zoomLevel){
		  clearMaps();
		  for (var i = 0; i < lats.length; i++) {
		    // obtain the attribues of each marker
		    var lat = lats[i];
		    var lng = lngs[i];
		    var point = new GLatLng(lat,lng);
		    var html = htmls[i];
		    var label = lbls[i];
		    // create the marker
		    var marker = createMarker(point,label,html);
		  }
		  // put the assembled side_bar_html contents into the side_bar div
		  document.getElementById("side_bar").innerHTML = side_bar_html;
		  //jump to the first marker
		  map.panTo(new GLatLng(lats[0],lngs[0]));
		  map.setZoom(zoomLevel);
	}

	function makeMarker(lats, lngs, lbls, htmls, zoomLevel){
		  //clearMaps();
		  for (var i = 0; i < lats.length; i++) {
		    // obtain the attribues of each marker
		    var lat = lats[i];
		    var lng = lngs[i];
		    var point = new GLatLng(lat,lng);
		    var html = htmls[i];
		    var label = lbls[i];
		    // create the marker
		    var marker = createMarker(point,label,html);
		  }
		  // put the assembled side_bar_html contents into the side_bar div
		  	//document.getElementById("side_bar").innerHTML = side_bar_html;
		  //jump to the first marker
		  map.panTo(new GLatLng(lats[0],lngs[0]));
		  map.setZoom(zoomLevel);
	}

	function forceMakeMarker(lats, lngs, lbls, htmls, zoomLevel, forceIndex, refCode){
		  //clearMaps();
		  for (var i = 0; i < lats.length; i++) {
		    // obtain the attribues of each marker
		    var lat = lats[i];
		    var lng = lngs[i];
		    var point = new GLatLng(lat,lng);
		    var html = htmls[i];
		    var label = lbls[i];
		    // create the marker
		    var marker = forceCreateMarker(point,label,html, forceIndex, refCode);
		  }
		  // put the assembled side_bar_html contents into the side_bar div
		  	//document.getElementById("side_bar").innerHTML = side_bar_html;
		  //jump to the first marker
		  map.panTo(new GLatLng(lats[0],lngs[0]));
		  map.setZoom(zoomLevel);
	}
      // =================


      // ===== This function is invoked when the mouse goes over an entry in the side_bar =====
      // It launches the tooltip on the icon      
      function mymouseover(i) {
        showTooltip(gmarkers[i])
      }
      // ===== This function is invoked when the mouse leaves an entry in the side_bar =====
      // It hides the tooltip      
      function mymouseout() {
	tooltip.style.visibility="hidden";
      }

      // This function picks up the side_bar click and opens the corresponding info window
      function myclick(i) {
        popHotelProfile(htmls[i]);
        //gmarkers[i].openInfoWindowHtml(htmls[i]);
	//document.getElementById("bub"+refCodes[i]).src = document.getElementById("btn"+refCodes[i]).src;
      }

	// Clear button function

	function clearMaps(){
		map.clearOverlays();
		document.getElementById("side_bar").innerHTML = "-";
		gmarkers = null;
		htmls = null;
		gmarkers = [];
		htmls = [];
		side_bar_html = "<h2>These are the options we've found given the <otxt>address</otxt> you provided.</h2><b>You can click the option text to jump to that marker!</b><br/><br/>";
		i = 0;
	}


	//////////// Geocoding

	var geo = new GClientGeocoder();
	var lat = [];
	var lng = [];
	var bounds = new GLatLngBounds();
	var Accu = [];

	var status=[];
	status[G_GEO_SUCCESS]            = "<h2>We've found options! <otxt>Which one is you?</otxt></h2><b>Step 1:</b> Enter the address into the address box, and click 'Find!'<br/><br/><h3><b>Step 2:</b> Click the option/marker that represents your venue so that the bubble pops up, or search again to find a better marker</h3><br/><b>Step 3:</b> Click the confirmation button in the bubble to identify the marker with your location!";
	status[G_GEO_MISSING_ADDRESS]    = "<h2>Follow the wizard. <otxt>It's that simple.</otxt></h2><h3><b>Step 1:</b> <font color=red>Woops! The address bar was empty!</font> Enter the address into the address box, and click 'Find!'</h3><b>Step 2:</b> Click the option/marker that represents your venue so that the bubble pops up, or search again to find a better marker<br/><br/><b>Step 3:</b> Click the confirmation button in the bubble to identify the marker with your location!";
	status[G_GEO_UNKNOWN_ADDRESS]    = "<h2>Follow the wizard. <otxt>It's that simple.</otxt></h2><h3><b>Step 1:</b> <font color=red>Uh oh! The address you entered could not be found!</font> Enter a different address into the address box, and click 'Find!'</h3><b>Step 2:</b> Click the option/marker that represents your venue so that the bubble pops up, or search again to find a better marker<br/><br/><b>Step 3:</b> Click the confirmation button in the bubble to identify the marker with your location!";
	status[G_GEO_UNAVAILABLE_ADDRESS]= "<h2>Follow the wizard. <otxt>It's that simple.</otxt></h2><h3><b>Step 1:</b> <font color=red>Uh oh! The address you entered is unavailable!</font> Enter a different address into the address box, and click 'Find!'</h3><b>Step 2:</b> Click the option/marker that represents your venue so that the bubble pops up, or search again to find a better marker<br/><br/><b>Step 3:</b> Click the confirmation button in the bubble to identify the marker with your location!";
	status[G_GEO_BAD_KEY]            = "<h2>Follow the wizard. <otxt>It's that simple.</otxt></h2><font color=red><b>Oh no!</b> Bad Key - please contact myVenue.in and report this error.</font>";
	status[G_GEO_TOO_MANY_QUERIES]   = "<h2>Follow the wizard. <otxt>It's that simple.</otxt></h2><font color=red><b>Oh no!</b> Too Many Queries - please try again in a few hours.</font>";
	status[G_GEO_SERVER_ERROR]       = "<h2>Follow the wizard. <otxt>It's that simple.</otxt></h2><font color=red><b>Oh no!</b> Server Error - please contact myVenue.in and report this error.</font>";

	//Enter button function

	function showAddress() 
	{
		lat.length=0;

		var search = document.getElementById("search").value;
		geo.getLocations(search, function (result)
		{ 
			// show status code
			document.getElementById("searchStatus").innerHTML = status[result.Status.code];

			if (result.Status.code == G_GEO_SUCCESS) 
			{
				// Loop through the results, placing markers
				for (var i=0; i<result.Placemark.length; i++) 
				{
					lat[i]=result.Placemark[i].Point.coordinates[1];
					lng[i]=result.Placemark[i].Point.coordinates[0];
					Accu[i] = "";
					if(result.Placemark[i].AddressDetails)
					{
						Accu[i]=result.Placemark[i].AddressDetails.Accuracy;
					}

					var point=new GLatLng(lat[i],lng[i]);
					var coords="<small> ("+lat[i]+", "+lng[i]+")</small>";
					var label = result.Placemark[i].address;
					var html = "<table width=200 border=0><tr><td><b>"+label+" "+lat[i]+" "+lng[i]+"</b><br/>Does this marker represent the property? Click the marker that best does, enter the building ID, and then click the confirm button!<br/><br/><b>Building ID<form method='post' action='googMap.php'><input type='hidden' name='action' id='action' value='newID'><input type=text name='blid' id='blid' length='3'><input type=hidden name='lbl' id='lbl' value='"+label+"'><input type='hidden' name='lat' id='lat' value='"+lat[i]+"'><input type=hidden name='lng' id='lng' value='"+lng[i]+"'><br/><input type=submit value='Confirm this is the venue!'></form></td></tr></table>";

				        // create the marker
				        var marker = createMarker(point,label,html);

				}


				// put the assembled side_bar_html contents into the side_bar div
			       document.getElementById("side_bar").innerHTML = side_bar_html;

				//// center to first result
				map.setZoom(3*result.Placemark[0].address.split(",").length);
				map.panTo(new GLatLng(lat[0],lng[0]));

				//simulate the first click
				myclick(0);

			}
		}
		);
	};

	var map;
	var tooltip;
	function makeMap(){
      		// create the map
      		map = new GMap2(document.getElementById("map"));
      		map.addControl(new GLargeMapControl());
      		map.addControl(new GMapTypeControl());
      		map.setCenter(new GLatLng(12.971606, 77.594376), 5);

		      // ====== set up marker mouseover tooltip div ======
      		tooltip = document.createElement("div");
      		document.getElementById("map").appendChild(tooltip);
      		tooltip.style.visibility="hidden";
	}


      // Read the data from example.xml
     /* 
     var request = GXmlHttp.create();
      request.open("GET", "example.xml", true);
      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          var xmlDoc = GXml.parse(request.responseText);
          // obtain the array of markers and loop through it
          var markers = xmlDoc.documentElement.getElementsByTagName("marker");
          
          for (var i = 0; i < markers.length; i++) {
            // obtain the attribues of each marker
            var lat = parseFloat(markers[i].getAttribute("lat"));
            var lng = parseFloat(markers[i].getAttribute("lng"));
            var point = new GLatLng(lat,lng);
            var html = markers[i].getAttribute("html");
            var label = markers[i].getAttribute("label");
            // create the marker
            var marker = createMarker(point,label,html);
          }
          // put the assembled side_bar_html contents into the side_bar div
          document.getElementById("side_bar").innerHTML = side_bar_html;
        }
      }
      request.send(null);
      */
    }

    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }

    //]]>