//global
var data_xml;
var thumb_counter = 0;
var currentThumb = 0;
var t; //for the timer
var change_selected_timer = 3500; //how many milliseconds between changing selected communities

jQuery(document).ready(function() {
	instantiate_thumbnails();
	get_mainImages();
	instantiate_selectedThumbnail();
	Cufon.replace('.cufon');	
	t=setTimeout("timed_change_selected_thumb()",change_selected_timer); //start the rotation of selected communities
	listen_filterCommunitiesByMap();
	
	// Disable autoscrolling if the user clicks the prev or next button.
					    jQuery(".pg_previous a, .pg_next a").bind('click', function() {
					        clearTimeout(t);
					    });
					
					
					    // Pause autoscrolling if the user moves with the cursor over the clip.
					    jQuery(".rotator_thumbs li, .main_images li").hover(function() {
					        clearTimeout(t);
					    }, function() {
					        t=setTimeout("timed_change_selected_thumb()",change_selected_timer);
					    });
					    jQuery(".map_container").hover(function() {
					        clearTimeout(t);
					    }, function() {
					        //nothing from the map_container
					    });
});//eo.ready

function create_thumbnails(thumbHTML){
	
	jQuery("ul.rotator_thumbs").append(thumbHTML);
	
	if (thumb_counter > 5){
		instantiate_slider();
	}
	
}


function get_xml_data(){
	if (!data_xml){
		data_xml = $.ajax({
			url: '/divosta/assets/xml/di_vosta.xml',
			async: false,
			cache: true,
			dataType : "text xml"
			
		});
	}
	return data_xml;
}
function get_mainImages(){
	//get AND create
	var html = "";
	var data_feed = get_xml_data();
	jQuery(data_feed.responseXML).find("feature").each(function() {
		var featureID = jQuery(this).attr("featureID");
		var bubbleCTAURL = jQuery(this).attr("bubbleCTAURL");
		var thumbnailURl = jQuery(this).attr("thumbnailURl");
		var thumbnailText = jQuery(this).attr("thumbnailText");
		var largeImageURL = jQuery(this).attr("largeImageURL");
		var bubbleHeaderText = jQuery(this).attr("bubbleHeaderText");
		var caption_body = $(this).text();
		var bubbleCTAURL = jQuery(this).attr("bubbleCTAURL");
		var bubbleCTAText = jQuery(this).attr("bubbleCTAText");
		
		html += '<li rel="'+featureID+'">';
		html +=	'<h2 class="name_of_community"><a href="'+bubbleCTAURL+'">'+thumbnailText+'</a></h2>';
		html +=	'<a class="main_image" href="'+bubbleCTAURL+'"><img class="reflect rheight33 ropacity30" src="'+largeImageURL+'" alt="'+thumbnailText+'" /></a>';
		html +=	'<div class="main_caption">';
		html += '<p class="cufon caption_title">'+bubbleHeaderText+'</p>';
		html +=	'<p class="caption_body">'+caption_body+'</p>';
		html +=	'<a class="caption_cta" href="'+bubbleCTAURL+'">'+bubbleCTAText+'</a>';
		html +=	'</div><!--main_caption-->';
		html +=	'</li>';
		
	});
	jQuery(".main_images").empty().append(html);
}
function get_thumbnailHtml(data_feed){
	var html = "";
	
	$(data_feed.responseXML).find('feature').each(function(i) {
		var featureID = jQuery(this).attr("featureID");
		var bubbleCTAURL = jQuery(this).attr("bubbleCTAURL");
		var thumbnailURl = jQuery(this).attr("thumbnailURl");
		var thumbnailText = jQuery(this).attr("thumbnailText");
		html += '<li rel="'+featureID+'" id="'+i+'"><a href="'+bubbleCTAURL+'" class=""><img class="thumbnail_image  iradius4" src="'+thumbnailURl+'" /><span>'+thumbnailText+'</span></a></li>';
		thumb_counter++;
		
	});
	
	return html;
}

function instantiate_selectedThumbnail(){
	
	var selected_rel = "";
	jQuery(".rotator_thumbs li").each( function(){
		if (jQuery(this).attr("id") == currentThumb){
			//jQuery(this).addClass("selected");
			selected_rel = jQuery(this).attr("rel");
		} else {
			//jQuery(this).removeClass("selected");
		}
	});
	
	jQuery(".main_images li").each(function(){
		if (jQuery(this).attr("rel") == selected_rel){
			jQuery(this).hide().css("left", "0px").fadeIn("1500");
		} else {
			jQuery(this).fadeOut("500");
		}
	});
	
	
}

function instantiate_slider(){
	$(".rotator_wrapper").prettyGallery({
			itemsPerPage : 5,
			animationSpeed : 'slow', /* fast/normal/slow */
			navigation : 'top',  /* top/bottom/both */
			of_label: ' ', /* The content in the page "1 of 2" */
			previous_title_label: '', /* The title of the previous link */
			next_title_label: '', /* The title of the next link */
			previous_label: '', /* The content of the previous link */
			next_label: '' /* The content of the next link */
		});

}

function instantiate_thumbnails(){
	var data_feed = get_xml_data();
	
	var thumbsHtml = get_thumbnailHtml(data_feed);
	create_thumbnails(thumbsHtml);
}

function listen_filterCommunitiesByMap(){
	jQuery(".map_container a").bind("click", function(){
		clearTimeout(t);//stop the movement for good.
		//highlight the correct link
		jQuery(".map_container a").removeClass("selected");
		jQuery(this).addClass("selected");
		
		//empty the rotator
		$(".rotator_wrapper").unbind("prettyGallery");
		jQuery("ul.pg_paging li a").hide();
		jQuery(".rotator_thumbs").empty();
		jQuery(".main_images li").each(function(){jQuery(this).fadeOut("500");});
		
		//find out which one was click and load those properties
		var clickedId = jQuery(this).attr("rel");
		var featureIDArray = new Array();
		var data_feed = get_xml_data();
		if (clickedId != "ALL"){
			$(data_feed.responseXML).find('mapIcon').each(function(i) {
				if(jQuery(this).attr("ID") == clickedId){
					jQuery(this).find("featureID").each(function(n){
						featureIDArray[n] = jQuery(this).text();
					});
				}
			});
		} else { //clickedID is ALL
			$(data_feed.responseXML).find('feature').each(function(y) {
						featureIDArray[y] = jQuery(this).attr("featureID");
			});
		}
			//re-adjust the count of the available communities
			thumb_counter = featureIDArray.length;
			currentThumb = 0;
			
			//now we look them up
			var html2 = "";
			for (x = 0; x < thumb_counter; x++){
				$(data_feed.responseXML).find('feature[featureID="'+featureIDArray[x]+'"]').each(function(){
					var featureID = jQuery(this).attr("featureID");
					var bubbleCTAURL = jQuery(this).attr("bubbleCTAURL");
					//var thumbnailURl = "http://www.divosta.com" + jQuery(this).attr("thumbnailURl");

					var thumbnailURl = jQuery(this).attr("thumbnailURl");
					var thumbnailText = jQuery(this).attr("thumbnailText");
					html2 += '<li rel="'+featureID+'" id="'+x+'"><a href="'+bubbleCTAURL+'" class=""><img class="thumbnail_image  iradius4" src="'+thumbnailURl+'" /><span>'+thumbnailText+'</span></a></li>';
				});
			}
			//then we shove them into the ul
			//if its more than 4 we need to full remove all traces of the slider from the DOM
			if (thumb_counter > 4){
				var newHTMLForGallery = '<div class="rotator_wrapper">';
				newHTMLForGallery += '<ul class="rotator_thumbs"></ul>';
				newHTMLForGallery += '</div><!--rotator_wrapper-->';		
				jQuery(".rotator_container").empty().append(newHTMLForGallery);
				jQuery(".rotator_thumbs").append(html2);
				instantiate_slider();
			} else {
			jQuery(".rotator_thumbs").append(html2);
			}
			instantiate_selectedThumbnail(); //set up the first one as selected.
			t=setTimeout("timed_change_selected_thumb()",change_selected_timer); //start the changer up
			return false;
	});

}

function timed_change_selected_thumb(){
	
	if((currentThumb+1) == thumb_counter ){
		currentThumb = 0;
	} else {
		currentThumb++;
	}
	if (currentThumb == 5){
		//jQuery(".pg_next a").click();
	}
	if (currentThumb == 0){
		//jQuery(".pg_previous a").click();
	}
	instantiate_selectedThumbnail();
	t=setTimeout("timed_change_selected_thumb()",change_selected_timer);
}