var map;
var markers = new Array();

//Lets create functions to launch our map with it's markers.
var createMap = function (options) {
	map = new google.maps.Map(document.getElementById('map-canvas'),options);
}

var sendAjaxReq = function (options) {
	$.ajax(options.url, {
		success: function(response) {
		$(".placeholder")(response).slideDown();
		checkHeight();
		
		$("#close").click(function(){
			$('.missionaries').height($(window).height() - 253);
			$(".placeholder").slideUp();
			$(".placeholder .family-icon").css("margin-top", "15");
			
		});
		}
   	}); 
}

var markerClick = function(options) {
	return function () {
		var marker = markers[options.markerIndex];

		for (var i = 0; i < markers.length; i++) {markers[i].setIcon("images/map/marker.png");
		};
		marker.setIcon("images/map/marker-active.png");

		map.setZoom(6);
		map.setCenter(marker.getPosition());

		//Run Ajax Update
		setTimeout(function() {sendAjaxReq({url:options.url})},100);
	}
}

var createMarker = function(options,markerIndex) {
	var marker = new google.maps.Marker({
		position: new google.maps.LatLng(options.lat,options.lon),
		map: map,
		title: options.title,
		icon: options.icon
	});

	//Add Marker Clicked Listener
	google.maps.event.addListener(marker, 'click', markerClick({
		markerIndex: markerIndex,
		url: options.title
	}));

	//Add Missionary profile clicked listener:
	$(".marker:eq("+markerIndex+")").click(markerClick({
			markerIndex: markerIndex,
			url: options.title
	}));

	return marker;
}

var createMarkers = function(markerOptions) {
	for (var i = 0; i < markerOptions.options.length - 1; i++) {
		markers[i] = createMarker(markerOptions.options[i],i);
	};
}

function initialize() {
	//First, create the map:
	createMap({
		zoom: 3,
    	center: new google.maps.LatLng(31.6333333, -8)
	});

	//Now, lets set up all of our markers.
	createMarkers({
		options:[