  //<![CDATA[

if (GBrowserIsCompatible()) {
      var left_sidebar = "";
	  var right_sidebar = "";
      var gmarkers = [];
      var htmls = [];
      var i = 0;
	
	
	
	// Customer Icons
	  var iconBlue = new GIcon(); 
		iconBlue.image = '../thesource/icons/blue.png';
		iconBlue.iconSize = new GSize(22, 22);
		iconBlue.iconAnchor = new GPoint(0, 20);
		iconBlue.infoWindowAnchor = new GPoint(15, 1);

	  var iconPurple = new GIcon(); 
		iconPurple.image = '../thesource/icons/purple.png';
		iconPurple.iconSize = new GSize(25, 25);
		iconPurple.iconAnchor = new GPoint(10, 25);
		iconPurple.infoWindowAnchor = new GPoint(15, 1);
		
	  var iconOrange = new GIcon(); 
		iconOrange.image = '../thesource/icons/orange.png';
		iconOrange.iconSize = new GSize(22, 22);
		iconOrange.iconAnchor = new GPoint(0, 20);
		iconOrange.infoWindowAnchor = new GPoint(15, 1);
		
	  var iconGreen = new GIcon(); 
		iconGreen.image = '../thesource/icons/green.png';
		iconGreen.iconSize = new GSize(25, 25);
		iconGreen.iconAnchor = new GPoint(10, 25);
		iconGreen.infoWindowAnchor = new GPoint(15, 1);
		
	  var iconGrey = new GIcon(); 
		iconGrey.image = '../thesource/icons/grey.png';
		iconGrey.iconSize = new GSize(25, 25);
		iconGrey.iconAnchor = new GPoint(0, 20);
		iconGrey.infoWindowAnchor = new GPoint(15, 1);

	  var customIcons = [];
		customIcons[1] = iconPurple;
		customIcons[2] = iconGreen;
		customIcons[3] = iconBlue;
		customIcons[4] = iconOrange;
		customIcons[5] = iconGrey;
		customIcons[6] = iconGrey;

	
	
	
	
	
	function traffic(){
		var trafficInfo;
		if (document.getElementById('traffic').checked==true) { 
			 if (document.getElementById('incidents').checked==true){
				var trafficOptions = {incidents:true};
			 } else {
				var trafficOptions = {incidents:false};
			 }
        	trafficInfo = new GTrafficOverlay(trafficOptions);
 			map.addOverlay(trafficInfo);

   		} else {
			map.removeOverlay(trafficInfo);
					request.send(null);

		}

	};
	
	// Function to clear all overlays
	function removeAll(){
		//clear any info windows that may be open
            map.getInfoWindow().hide();
        // reset the side_bar
            right_sidebar="";
		// clear overlays
			map.clearOverlays();
	}
		
	
		
	// Create Individual Markers and their associated html
      function createMarker(point,category,subcategory,altcategory,html,name,address,phone,website,notes) {
        var marker = new GMarker(point,customIcons[category]);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        gmarkers[i] = marker;
		gmarkers.push(marker);
		marker.category=category;
		marker.subcategory=subcategory;
		marker.altcategory=altcategory;
        htmls[i] = html;
        right_sidebar += '<div class="selectedObjects">'
		+'<a href="javascript:myclick(' + i + ')">' + name + '<\/a><br \/>'
		+'<a2>' + website + '<\/a2><br \/>'
		+'<a3>' + address + '<\/a3><\/div>'
        i++;
        return marker;
      }
	  
	  
	// Create Featured Markers and their associated html
	   function createFeaturedMarker(point,category,subcategory,html,name,address,phone,website,notes) {
        var marker = new GMarker(point,customIcons[category]);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        gmarkers[i] = marker;
		gmarkers.push(marker);
		marker.category=category;
		marker.subcategory=subcategory;
        htmls[i] = html;
        left_sidebar += '<div class="featuredObjects"><div class="featuredObjects_Info"><a href="javascript:myclick(' + i + ')"><span style=\"text-decoration:none; font-size:12px; color:#000\">' + name + '<\/span><\/a><br \/>'
		+'<a href= \"http:\/\/' + website + '\" target = \"_blank\">' + website + '<\/a><br \/>'
		+'<a3>' + address + '<\/a3><br \/>'
		+'<a4>' + phone + '<\/a4><\/div><div class="featuredObjects_Summary">' + notes + '<\/div><\/div>';
        i++;
        return marker;
      }




    // function the click on icon
      function myclick(i) {
        gmarkers[i].openInfoWindowHtml(htmls[i]);
      }


      function updateMap(id,subcategory,dining) {
		  // hide the marker
		if (document.getElementById(id).checked==false) { 
			for (var i=0;i<gmarkers.length;i++) {
         		if (gmarkers[i].subcategory==subcategory || gmarkers[i].altcategory==subcategory || gmarkers[i].category==dining )  {
            	map.removeOverlay(gmarkers[i]);
				}
			}
   		} else {
		// show the marker again
		loadData (subcategory,dining);
			
			}
	  }		
	  




// Load data when requested from Checkboxes
      function loadData(category,dining) {
        var url="data.php?c="+category+"&d="+dining;
        var request = GXmlHttp.create();
        request.open("GET", url, true);
        request.onreadystatechange = function() {
          if (request.readyState == 4) {
            var xmlDoc = request.responseXML;
            var markers = xmlDoc.documentElement.getElementsByTagName("marker");
            
            // hide the info window
            map.getInfoWindow().hide();
          
            for (var i = 0; i < markers.length; i++) {
				var name = markers[i].getAttribute("business_name");
				var address = markers[i].getAttribute("address");
				var category = markers[i].getAttribute("category");
				var subcategory = markers[i].getAttribute("subcategory");
				var altcategory = markers[i].getAttribute("altcategory");				
				var firsthour = markers[i].getAttribute("firsthour");
				if (firsthour>0){
				var firsthour = "First Hour: $" + firsthour;
				}
				var allday = markers[i].getAttribute("allday");
				if (allday>0){
					var allday = "All Day: $" + allday;
				}
				var monthly = markers[i].getAttribute("monthly");
				if (monthly>0){
					var monthly = "Monthly: $" + monthly;
				}	
				var notes = markers[i].getAttribute("notes");
				var website = markers[i].getAttribute("website");
				var phone = markers[i].getAttribute("phone");
				var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
										parseFloat(markers[i].getAttribute("lng")));
				
				var html = 
					"<div class= 'infoTitle'>" + name + "</div>"
					+"<div class= 'infoAddress'>" + address +"</div>"
					+"<div class= 'infoPhone'>" + phone +"</br></div>" 
					+"<hr />"
					+"<div class= 'infoRates'>" + firsthour + "</div>"
					+"<div class= 'infoRates'>" + allday + "</div>"
					+"<div class= 'infoRates'>" + monthly + "</div>"
					+"<div class= 'infoNotes'>" + notes + "</div>";
	
				  var label = markers[i].getAttribute("category");
			   // call the function to create the marker
				  var marker = createMarker(point,category,subcategory,altcategory,html,name,address,phone,website,notes);
				  map.addOverlay(marker);
            }
            // add the sidebar html contents into the div
            document.getElementById("right_sidebar").innerHTML = right_sidebar;
          }
		  
		}
		request.send(null);
	  }
		
		
		
		
		
		
	// Load featured category items
      function FeaturedCategory(category) {
        var url="data_featured.php?q="+category;
        var request = GXmlHttp.create();
        request.open("GET", url, true);
        request.onreadystatechange = function() {
          if (request.readyState == 4) {
            var xmlDoc = request.responseXML;
            var markers = xmlDoc.documentElement.getElementsByTagName("marker");

		//clear any info windows that may be open
            map.getInfoWindow().hide();
        // reset the side_bar
            left_sidebar="";
		// clear overlays
			map.clearOverlays();
			
            for (var i = 0; i < markers.length; i++) {
				var name = markers[i].getAttribute("business_name");
				var address = markers[i].getAttribute("address");
				var notes = markers[i].getAttribute("feature");
				var website = markers[i].getAttribute("website");
				var phone = markers[i].getAttribute("phone");
				var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
										parseFloat(markers[i].getAttribute("lng")));
				var html = 
					"<div class= 'infoTitle'>" + name + "</div>"
					+"<div class= 'infoAddress'>" + address +"</div>"
					+"<div class= 'infoPhone'>" + phone +"</br></div>" 
					+"<hr />"
					+"<div class= 'infoNotes'>" + notes + "</div>";
	
				var label = markers[i].getAttribute("category");
			   // call the function to create the marker
				 
				 
				 
				var marker = createFeaturedMarker(point,0,0,html,name,address,phone,website,notes);
				 map.addOverlay(marker);
            }
			//add featured category logo
			var boundaries = new GLatLngBounds(new GLatLng(44.98108610146745, -93.27953696250916), new GLatLng(44.98352968700102, -93.2758891582489));
			var image = new GGroundOverlay("logos/twins.png", boundaries);

			map.addOverlay(image);
            // load data into the sidebars
            document.getElementById("left_sidebar").innerHTML = left_sidebar;
          }
		}
		request.send(null);
	  }




// create the map
  var map = new GMap2(document.getElementById("map"));
  map.addControl(new GLargeMapControl());
  map.addControl(new GMapTypeControl());
  map.setCenter(new GLatLng( 44.9816667, -93.2783333), 14);
	  
   
 // load featured category at start up
 FeaturedCategory(107);
    }

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