$(document).ready(function()
{
	var mapCenter = new GLatLng(43.34914998377388, 6.069946226562495);
	var map = new GMap2(document.getElementById("search-map"));
	map.setCenter(mapCenter, 9);
    map.addControl(new GLargeMapControl());

	var iconOptions = {
			width : 32,
			height : 32,
			primaryColor : "#EDED18FF",
			cornerColor : "#FF8A00FF",
			strokeColor : "#FF0000FF"
	};
	var markerIcon = MapIconMaker.createMarkerIcon(iconOptions);

	var clusterIconOptions = {
			width : 40,
			height : 40,
			primaryColor : "#EDED18FF",
			cornerColor : "#FF8A00FF",
			strokeColor : "#FF0000FF"
	};
	var clusterIcon = MapIconMaker.createMarkerIcon(clusterIconOptions);
	var loader = $('<div style="position: absolute; left: 450px; top : 150px;"><img src="/design/varatuwa/images/ajax-loader.gif" /></div>');
	$("#search-map").append(loader);

	$.get("/accomodation/list/format/xml", {}, function(data)
	{
		var markers = new Array();

		$(data).find('item').each(function() {

			var item = $(this);
			var coord = $(this).children('coordinates');

			if (coord.length > 0)
			{
				var point = new GLatLng(
						parseFloat(coord.children("lat").text()),
						parseFloat(coord.children("lng").text())
				);

				var marker = new GMarker(point, {icon: markerIcon});

				GEvent.addListener(marker, "click", function() {
					showMarkerInfoWindow(marker, item);
				});

				markers.push(marker);
			}
		});

		fitMap(map, markers);

		var mcOptions = {};
		var styles = [{
          url: clusterIcon.image,
          height: 40,
          width: 40,
          opt_anchor: [5, 0],
          opt_textColor: '#000000'
        }];

		var markerCluster = new MarkerClusterer(map, markers, {
			styles: styles
		});

		loader.hide();
	});


	function fitMap( map, markers ) {
		var bounds = new GLatLngBounds();

		for (var i = 0 ; i < markers.length; i++)
		{
			bounds.extend(markers[i].getLatLng());
		}

		map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
	}

	function showMarkerInfoWindow(marker, item)
	{
		var iw = $('<div></div>');
		var iw_picture = $('<div class="iw_picture"></div>');
		iw_picture.append('<a href="'+ item.children('link').text() +'"><img width="150" src="'+ item.children('picture').text() +'" /></a></p>');

		var iw_infos = $('<div class="iw_infos"></div>');
		iw_infos.append('<p class="type">'+ item.children('type').text() +' / '+ item.children('beds_count').text() +' pers. - '+ item.children('city').text() +' ('+ item.children('postal_code').text() +')</p>');
		iw_infos.append('<p class="description">'+ item.children('description').text() +'</p>');
		iw_infos.append('<p class="link"><a href="'+ item.children('link').text() +'">Découvrir ce bien</a></p>');

		iw.append(iw_picture).append(iw_infos);

		marker.openInfoWindowHtml('<div class="iw_infowindow ui-helper-clearfix">'+iw.html()+'</div>');
	}

	// Testing
	$('#test-btn').click(function(e) {
		$('#test-input').val(
				map.getBounds()
		);
	});

});