// JavaScript Document

// Initialize variables for page
var tooltips = [];
var titles = [];
var images = [];
var thumbs = [];
var descriptions = [];
var section = '';
var toolTip = null;
var home_titles = [];
var home_images = [];
var home_descriptions = [];

var char = 0;
var caption = "";
var standby;

function showCaption(obj) {
	caption = obj.attr('alt');
	if(caption)
	type();
}

function hideCaption(obj) {
	caption = "";
	char = 0;
	$('.paging_text').html("");
}


function type() {
	$('.paging_text').html(caption.substr(0, char++));
	if(char < caption.length+1)
		setTimeout("type()", 12);
	else {
		char = 0;
		caption = "";
	}
}

function parse_xml() {

	$.ajax({
		type: "GET",
		url: "xml/" + section + ".xml",
		dataType: "xml",
		success: function(xml) {
			$(xml).find('item').each(function(){
				var tip = $(this).find('tooltip').text();
				var title = $(this).find('title').text();
				var image = $(this).find('image').text();
				var thumb = $(this).find('thumb').text();
				var desc = $(this).find('desc').text();
				tooltips.push(tip);
				titles.push(title);
				images.push(image);
				thumbs.push(thumb);
				descriptions.push(desc);
			});
			
			build_gallery(tooltips, titles, images, thumbs, descriptions);
			
		}
	});
	
};

function build_gallery(tips, title, image, thumb, desc) {
	
	for (i = 0; i < tips.length; i++) {		
		//add each tooltip to the body for proper scope
		$('ul.gallerylist').append('<li><a href="images/'+section+'/'+image[i]+'" title="'+title[i]+'" rel="shadowbox[3d]" onclick="Shadowbox.open(this); return false;"><span class="gallery_hover"><p><strong>'+title[i]+'</strong></p><p>'+desc[i]+'</p></span></a></li>');
    }
	
	$('ul.gallerylist li').each(function(i) {
	
		$(this).hide();
		$(this).css({'background-image' : 'url(images/'+section+'/'+thumb[i]+')'});
	
	});
	
	$('ul.gallerylist li').showdelay();
	
	$('ul.gallerylist li span p').hide();
	
	$("ul.gallerylist li").hover(function() {
		
		var x_width = $(this).width();
		var y_height = $(this).height();
		
		$(this).find("span").stop().animate({
			width: x_width, //Animate the width of ths <span> based on the x_width variable
			height: y_height,
			opacity: "0.9"
		}, 250, function(){ 
			$(this).find("p").fadeIn(400);
		});
	} , function() { //On hover out...
		$(this).find("p").fadeOut(400, function(){
			$(this).parent("span").stop().animate({
				width: "0", 
				height: "0",
				opacity: "0"
			}, 250)
		})
	});


};

function sendMail(){
	var path = 'mailto:leo@'
	path += 'leosworkshop.'
	path += 'com'
	location.href = path;
}

function parse_home_xml() {

	$.ajax({
		type: "GET",
		url: "xml/" + section + ".xml",
		dataType: "xml",
		success: function(xml) {
			$(xml).find('item').each(function(){
				var title = $(this).find('title').text();
				var image = $(this).find('image').text();
				var desc = $(this).find('desc').text();
				home_titles.push(title);
				home_images.push(image);
				home_descriptions.push(desc);
			});
			
			build_home_gallery(home_titles, home_images, home_descriptions);
			
		}
	});
	
};

function build_home_gallery(home_titles, home_images, home_descriptions){
	
	for (i = 0; i < home_titles.length; i++) {		
		//add each tooltip to the body for proper scope
		var counter = i + 1;
		
		$('.image_reel').append('<img src="images/home/'+home_images[i]+'" alt="'+home_descriptions[i]+'" />');
		
		$('.paging .paging_spacer').append('<a href="#" rel="'+counter+'" alt="'+home_descriptions[i]+'">'+counter+'</a>');
		
    }
	
	$('.image_reel img').each(function(i) {
	
		$(this).hide();
	
	});
	
	$('.image_reel img').showdelay();
	
	//home gallery setup
	$(".paging").show();
	$(".paging a:first").addClass("active");
	
	//Get size of the image, how many images there are, then determin the size of the image reel.
	var imageWidth = $(".window").width();
	var imageSum = $(".image_reel img").size();
	var imageReelWidth = imageWidth * imageSum;
	
	//Adjust the image reel to its new size
	$(".image_reel").css({'width' : imageReelWidth});
	
	$active_text = $('.paging a.active');
	showCaption($active_text);
	
	//Paging  and Slider Function
	rotate = function(){
		
		var triggerID = $active.attr("rel") - 1; //Get number of times to slide
		var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide
	
		$(".paging a").removeClass('active'); //Remove all active class
		$active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)
	
		//Slider Animation
		$(".image_reel").animate({
			left: -image_reelPosition
		}, 750 );
		
		$active_text = $('.paging a.active');
			showCaption($active_text);
	
	}; 
	
	//Rotation  and Timing Event
	rotateSwitch = function(){
		play = setInterval(function(){ //Set timer - this will repeat itself every 7 seconds
			$active = $('.paging a.active').next(); //Move to the next paging
			
			if ( $active.length === 0) { //If paging reaches the end...
				$active = $('.paging a:first'); //go back to first
			}
			
			
			rotate(); //Trigger the paging and slider function
		}, 8000); //Timer speed in milliseconds (7 seconds)
	};
	
	rotateSwitch(); //Run function on launch
	
	//On Hover
	$(".image_reel a").hover(function() {
		clearInterval(play); //Stop the rotation
	}, function() {
		rotateSwitch(); //Resume rotation timer
	});	
	
	//On Click
	$(".paging a").click(function() {
		$active = $(this); //Activate the clicked paging
		//Reset Timer
		clearInterval(play); //Stop the rotation
		rotate(); //Trigger rotation immediately
		rotateSwitch(); // Resume rotation timer
		return false; //Prevent browser jump to link anchor
	});
	
}


$(document).ready(function() {
						   
	//setup navigation
	$(".header_spacer ul li").prepend("<span></span>"); //Throws an empty span tag in the li

	$(".header_spacer ul li").hover(function() {	//On hover...
		var x_width = $(this).width();//Get the width of li - defined in the css
		$(this).find("span").stop().animate({
			width: x_width //Animate the width of ths <span> based on the x_width variable
		}, 250);
	} , function() { //On hover out...
		$(this).find("span").stop().animate({
			width: "0"  //Move the <span> back to its original state (0px)
		}, 250);
	});
	
	//showdelay method - can be linked and chained directly to DOM elements
	$.fn.showdelay = function(){
		var delay = 0;
			return this.each(function(){
			$(this).delay(delay).fadeIn(1000);
			delay += 200;
		});
	};
	
	//gallery code
	section = $("body").attr("id");
	
	if(section == 'web'){
		parse_xml();
	};
	
	if(section == 'flash'){
		section = 'flash';
		parse_xml();
	};
	
	if(section == 'modeling'){
		section = '3d';
		parse_xml();
	};
	
	if(section == 'home'){
		section = 'home';
		parse_home_xml();
	};
	
	
	//gallery code end
	
	
	//send email
	$('.header_info a').click(function() {
		sendMail();
	});
	
	$('#contact_left a').click(function() {
		sendMail();
	});
	
	$('.form_preloader').hide();
 	$("#contact_form").submit(function(){
	 
	    $('.form_preloader').show();
	 
    });
	

});