var $j = jQuery.noConflict();

	var gMapConfig = new Object();
	gMapConfig.visible = true;
	gMapConfig.open = true;
	gMapConfig.alwaysOpen = true;
	gMapConfig.openTitle = "Snetterton & Brands Hatch - Event and hotel finder";
	gMapConfig.closeTitle = "<a href=\"javascript:toggleMap()\">Click here</a> to discover just how close new and exciting events can be.<br/>Simply use our interactive map to find events of Interest and our nearby hotels.";

	gMapConfig.lat = 52.150637;
	gMapConfig.lng = -0.706192;
	gMapConfig.zoom = 5;
	gMapConfig.zoomEvent = 13;	

	gMapConfig.controls = new Array({1:true,2:true,3:true,21:true,22:true,23:true,24:true,30:true});// Object();
	gMapConfig.data = Object();
	gMapConfig.data.markers = new Array();
	gMapConfig.data.items = new Array();

	var map;
	var clusterer;

    function gMapInitialize() {
		try
		{
			gMapLocalConfig();
		}
		catch (e)
		{
		}


		if (!gMapConfig.visible)
		{
			$j("#map-cover").css("display", "none");
			return;
		}

		if (gMapConfig.open)
		{
			$j("#map-cover").animate( { height:"500px" }, 500, "swing" );
			$j("#map-header-close").hide();
			$j("#map-header-open").show();
		}

		if (gMapConfig.alwaysOpen)
		{
			$j("#map-header-open-right").hide();
			$j("#map-header-open-icon").hide();
		}

		$j("#map-header-open-left").html(gMapConfig.openTitle);
		$j("#map-header-close").html(gMapConfig.closeTitle);


		$j("#map-opt-lhs").bind("click", function(e){
			if ($j("#map-options").css("left") == "0px")
			{
				$j("#map-options").animate( { left:"200px" }, { queue:false, duration:500 } );
				$j("#map-opt-lhs img").attr("src", "/images/gmap/btn_open.png");
			}
			else
			{
				$j("#map-options").animate( { left:"0px" }, { queue:false, duration:500 } );
				$j("#map-opt-lhs img").attr("src", "/images/gmap/btn_close.png");
			}
		});


		if (GBrowserIsCompatible()) {
			map = new GMap2(document.getElementById("map-area"));
			
			var center = new GLatLng(gMapConfig.lat, gMapConfig.lng);
			map.setCenter(center, gMapConfig.zoom);

			map.addControl(new GLargeMapControl3D());

			var mapTypeControl = new GMapTypeControl();
			var topRight = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(80,8));
			map.addControl(mapTypeControl, topRight);


			var styles_ = [];
			var i = 0;
			for (i = 1; i <= 5; ++i) {
			styles_.push({
			  'url': "/images/gmap/cluster.png",
			  'height': 55,
			  'width': 55,
			  'opt_textColor': "white"
			});
			}

			clusterer = new MarkerClusterer(map, null, {styles:styles_});
			updateControlIcons();

			
			GEvent.addListener(map, "moveend", function() {clusterer.resetViewport()});
			downloadMarkers();
		}		

    }


	function downloadMarkers()
	{		
		gMapConfig.data.items = [];
		$j.ajax({
			type: "GET",
			url: "/getHotels.php",
			dataType: "xml",		
			data: "gardens=1",
			success: function(xml) {
				//var indx = 0;
				gMapConfig.data.markers = new Array();

				$j(xml).find('hotel').each(function(){					
					var entity = new Object;
					entity.typeid = $j(this).find('typeid').text();

					entity.id = $j(this).find('id').text();
					entity.lat = $j(this).find('lat').text();
					entity.lng = $j(this).find('lng').text();					
					
					var point = new GLatLng(entity.lat,entity.lng);
					var mrk = createMarker(point, entity.typeid, false,  getBubbleContent(entity));
					mrk.entity = entity;						
					entity.marker = mrk;

					gMapConfig.data.items.push(entity);
				});

				
				refreshMarkers();
						

			},
			error: function (XMLHttpRequest, textStatus, errorThrown) {
			  // typically only one of textStatus or errorThrown 
			  // will have info
			  //this; // the options for this ajax request
			  alert(textStatus);
			}

		});
	}

	function refreshMarkers()
	{
		gMapConfig.data.markers = [];
		for (i=0; i<gMapConfig.data.items.length; i++ )
		{
			var entity = gMapConfig.data.items[i];
			if (gMapConfig.controls[entity.typeid]) {
				gMapConfig.data.markers.push(entity.marker);
			}
		}
		clusterer.clearMarkers();
		clusterer.addMarkers(gMapConfig.data.markers);		
	}


	function updateControlIcons()
	{
		try
		{			
			$j("#hotelControl1 img").attr("src", gMapConfig.controls[1]==true ? "/images/gmap/thumbs/hotels/1.png" : "/images/gmap/thumbs/hotels/1_off.png");
			$j("#hotelControl2 img").attr("src", gMapConfig.controls[2]==true ? "/images/gmap/thumbs/hotels/2.png" : "/images/gmap/thumbs/hotels/2_off.png");
			$j("#hotelControl3 img").attr("src", gMapConfig.controls[3]==true ? "/images/gmap/thumbs/hotels/3.png" : "/images/gmap/thumbs/hotels/3_off.png");
		}
		catch (ex)
		{
		}

		try
		{	
			$j("#eventControl1 img").attr("src", gMapConfig.controls[21]==true ? "/images/gmap/thumbs/events/1.png" : "/images/gmap/thumbs/events/1_off.png");
			$j("#eventControl2 img").attr("src", gMapConfig.controls[22]==true ? "/images/gmap/thumbs/events/2.png" : "/images/gmap/thumbs/events/2_off.png");
			$j("#eventControl3 img").attr("src", gMapConfig.controls[23]==true ? "/images/gmap/thumbs/events/3.png" : "/images/gmap/thumbs/events/3_off.png");
			$j("#eventControl4 img").attr("src", gMapConfig.controls[24]==true ? "/images/gmap/thumbs/events/4.png" : "/images/gmap/thumbs/events/4_off.png");
		}
		catch (ex)
		{
		}
	}


	// Creates a marker whose info window displays the letter corresponding
    // to the given index.
    function createMarker(point, type, drag, content) {
      // Create a lettered icon for this point using our icon class
      var letteredIcon = new GIcon();
	  letteredIcon.image = "/images/gmap/thumbs/" + type + ".png";

	  letteredIcon.iconSize = new GSize(49, 40);
	  letteredIcon.iconAnchor = new GPoint(24, 35);
	  letteredIcon.infoWindowAnchor = new GPoint(25, 2);

	  if (type > 10 && type <20)
	  {
		  letteredIcon.iconSize = new GSize(30, 45);
		  letteredIcon.iconAnchor = new GPoint(11, 36);
		  letteredIcon.infoWindowAnchor = new GPoint(11, 0);
	  }
	
	  if (type > 20 && type < 30)
	  {  
		  letteredIcon.iconSize = new GSize(22, 41);
		  letteredIcon.shadow = "/images/gmap/icon_map_shadow.png";
		  letteredIcon.shadowSize = new GSize(34, 41);
		  letteredIcon.iconAnchor = new GPoint(11, 40);
		  letteredIcon.infoWindowAnchor = new GPoint(22, 2);
	  }
	
	  if(type == 30)
	  {
		letteredIcon.iconSize = new GSize(24, 24);
	  }
	  
      // Set up our GMarkerOptions object
      markerOptions = { icon:letteredIcon, draggable:drag };
      var marker = new GMarker(point, markerOptions);


	  GEvent.addListener(marker, "infowindowopen", function() {	
			GDownloadUrl("/DO_bubble.php", function(data) {
				map.getInfoWindow().getContentContainers()[0].innerHTML = data;
			}, "category="+marker.entity.typeid+"&id="+marker.entity.id	);
	  });


      GEvent.addListener(marker, "click", function() {		
		marker.openInfoWindowHtml(content);
      });
      return marker;
    }

	function toggleMap()
	{
			if ($j("#map-cover").css("height") == "75px")
			{
				/*
				if (!map)
				{
					gMapInitialize();
				}
				*/

				$j("#map-cover").animate( { height:"500px" }, 500, "swing" );
				$j("#map-header-close").hide();
				$j("#map-header-open").show();
			}
			else
			{
				$j("#map-cover").animate( { height:"75px" }, 500, "swing", function() {$j("#map-header-close").show(); $j("#map-header-open").hide();} );				
			}
	}

	function toggleControl(indx)
	{
		gMapConfig.controls[indx] = !gMapConfig.controls[indx];
		updateControlIcons();
		refreshMarkers();
	}

	function toggleFilter()
	{
		if ($j("#map-options").attr("rel") == "open")
		{
			$j("#map-options").animate( { left:"706px" }, { queue:false, duration:500 } );
			$j("#map-options-header-icon img").attr("src", "/images/gmap/btn_open.png");
			$j("#map-options").attr("rel", "close");
		}
		else
		{
			$j("#map-options").animate( { left:"506px" }, { queue:false, duration:500 } );
			$j("#map-options-header-icon img").attr("src", "/images/gmap/btn_close.png");
			$j("#map-options").attr("rel", "open");
		}
	}


	function getBubbleContent(entity)
	{
		var res = "";

		res += "<div class=\"map-bubble\"><div class=\"map-bubble-icon\"><img class=\"thumb\" src=\"/images/gmap/thumbs/" + entity.typeid + ".png\"/></div>";
		res += "<div class=\"map-bubble-name\">" + "please wait, loading..." + "</div><div class=\"map-bubble-clear\"/>";
		res += "<div class=\"map-bubble-address\">";
		res += "</div></div>";			

		return res;
	}