$(document).ready(function(){
	
	var	xml_path='http://www.dawsoncreekeventscentre.com/xml/gallery.xml';

	$.ajax({url:xml_path,dataType:"xml",success:function(xml){
	
		var html_controls='<ul id="gallery_controls" >';
		
		var html_gallery='';
		
		$("item",xml).each(function(i){
		
			html_gallery+='<div class="gallery_item'+(i==0?" displayed":"")+'" >';
			
			switch ($(this).find("type").text()){
	
				case "1" :
				html_gallery+='<a class="main_link" href="'+$(this).find("link").text()+'" title="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" >';
				html_gallery+='<img src="'+$(this).find("image").text()+'" alt="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" title="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" />';
				html_gallery+='</a>';
				break;
				
				case '2':
				html_gallery+='<img src="'+$(this).find("image").text()+'" alt="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" title="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" />';
				html_gallery+='<a href="'+$(this).find("link").text()+'" title="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" class="enter_here" ><span>Enter Here</span></a>';
				html_gallery+='<div class="stripe" ></div>';
				break;
	
				case '3':
				html_gallery+='<img src="'+$(this).find("image").text()+'" alt="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" title="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" />';
				html_gallery+='<a href="'+$(this).find("event_info_link").text()+'" title="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" class="event_info" ><span>Event Information</span></a>';
				html_gallery+='<a href="'+$(this).find("tickets_link").text()+'" title="'+$(this).find("artist").text()+'@'+$(this).find("date").text()+'" class="purchase_tickets" ><span>Purchase Tickets</span></a>';
				html_gallery+='<div class="stripe" ></div>';
	
				break;
				
			}
			
			html_gallery+='</div>';			
			
			html_controls+='<li '+(i==0?"class='selected'":"")+'>';
			html_controls+='<span class="artist" '+(i==0?"style='left:30px'":"")+'>'+$(this).find("artist").text()+'</span>';
			html_controls+='<span class="date" '+(i==0?"style='left:30px'":"")+'>'+$(this).find('date').text()+'</span>';
			html_controls+='<span class="control_arrows" '+(i==0?"style='display:block'":"")+'></span>';
			html_controls+='</li>';
			
		})
		
		html_controls+='</ul>';
		
		$("#gallery_container").html(html_gallery+html_controls);
		
		init_gallery();
		
		html_controls=null;
		
		html_gallery=null;
		
	
	}});

});

    var current_item=0;
    
    var max_displayed_items=6;
    
    var item_height=50;
    
    var total_items;
    
    var interval_length=15*1000;
    
    var timer_length=5*1000;
    
    var interval;
    
    var timer;
    
    function init_gallery(){
    	
    	
		$(".gallery_item .enter_here,.gallery_item .event_info,.gallery_item .purchase_tickets").hover(
			function(){
				
				stop_gallery_interval();
				
				$(this).find("span").animate({"left":"15"},250,"swing");
			
			},
			function(){
				
				$(this).find("span").animate({"left":"0"},250,"swing");
				
				timer=setTimeout(start_gallery_interval,timer_length);
			
			}
		);
			
		$("#gallery_controls li").click(
			function(e){
				
				e.preventDefault();
				
				if(!$(this).hasClass("selected")){
					
					select_gallery_item($(this).index("#gallery_controls li"));
					
					stop_gallery_interval();
					
					timer=setTimeout(start_gallery_interval,timer_length);
				}
			
			}).hover(
			
				function(){
					
					$(this).addClass("hover");
					
					$(this).find(".control_arrows").fadeIn(300);
								
					$(this).find(".artist").animate({"left":"30","paddingRight":"0"},250,"swing");
								
					$(this).find(".date").animate({"left":"30","paddingRight":"0"},250,"swing");
			
				},
				function(){
					
					$(this).removeClass("hover");
					
					$(this).find(".control_arrows").fadeOut(200);
								
					$(this).find(".artist").animate({"left":"15","paddingRight":"15"},250,"swing");
								
					$(this).find(".date").animate({"left":"15","paddingRight":"15"},250,"swing");
			
				}
				
			);
			
		total_items=$(".gallery_item").size();
		
		interval=setInterval(select_next,interval_length);
    }
    
	
function stop_gallery_interval(){

	clearInterval(interval);
	
}
	
function start_gallery_interval(){
		
	interval=setInterval(select_next,interval_length);
	
}

function select_next(){

	if(total_items>(current_item+1)) select_gallery_item(current_item+1); else select_gallery_item(0);
	
}
	
function select_gallery_item(i){
	
	clearTimeout(timer);
		
	deselect_gallery_item(current_item);
		        
	current_item=i;

	$("#gallery_controls li:eq("+i+")").addClass("selected");
				
	$("#gallery_controls li:eq("+i+")").find(".control_arrows").fadeIn(300);
				
	$("#gallery_controls li:eq("+i+")").find(".artist").animate({"left":"30"},200,"swing");
				
	$("#gallery_controls li:eq("+i+")").find(".date").animate({"left":"30"},200,"swing");
				
	$(".gallery_item:eq("+i+")").fadeIn(200,function(){$(this).addClass("displayed");});
	
	var current_start=(i+1)!=total_items?(i+2)-max_displayed_items:(i+1)-max_displayed_items;
	
	var current_start=current_start>0?current_start:0;
	
	var top=-current_start*item_height;
	
	$("#gallery_controls").animate({"top":top},200);
		
}
	
function deselect_gallery_item(i){

	$("#gallery_controls li:eq("+i+")").removeClass("selected");
				
	$("#gallery_controls li:eq("+i+")").find(".control_arrows").fadeOut(300);
				
	$("#gallery_controls li:eq("+i+")").find(".artist").animate({"left":"15"},200,"swing");
		
	$("#gallery_controls li:eq("+i+")").find(".date").animate({"left":"15"},200,"swing");
				
	$(".gallery_item:eq("+i+")").fadeOut(200,function(){$(this).removeClass("displayed");});
		
}

pic1= new Image(1,48);
pic1.src="images/gallery_control_bg_hover.jpg"; 
pic2= new Image(8,48);
pic2.src="images/gallery_control_bg.jpg"; 
