/* Author: 
	BE Design
*/

var t_ease = "easeInOutExpo";
var t_dur = 800;
var pro_open = false;
var total_pro;
var current_pro;
var last_pro;
var dir = "left";
var scrolling = false;
var moving = false;


function init(){
	addProjects();
	resizeStuff();
	setHovers();
	
	var spt2 = $('span.mailtome2');
	var at = / at /;
	var dot = / dot /g;
	var addr = $(spt2).text().replace(at,"@").replace(dot,".");
	$(spt2).after('<a href="mailto:'+addr+'" title="Send an email">'+ addr +'</a>')
	.hover(function(){window.status="Send a letter!";}, function(){window.status="";});
	$(spt2).remove();
	
	$('nav').fadeIn(1000);
	
	$("#thumb-holder .thumb").each(function(index, value){
		
		if(index == 9){
			$(value).delay(100 * index).fadeIn(1000, function() {$('footer').fadeIn();});
		}else{
			$(value).delay(100 * index).fadeIn(1000);
		}
	});
	
	$("#contact-btn").click(function() {
	  $("html").animate({ scrollTop: $(document).height() - $(window).height() }, 1000, "easeInOutQuad");
	  $("body").animate({ scrollTop: $(document).height() - $(window).height() }, 1000, "easeInOutQuad");
	  return false;
	});
	
	$("#work-btn").click(function() {
	  $("html").animate({ scrollTop: 0 }, 1000, "easeInOutQuad");
	   $("body").animate({ scrollTop: 0 }, 1000, "easeInOutQuad");
	  return false;
	});


	$(".thumb .info").css("bottom", - $(this).height());
	$(".thumb").hover(function(){thumbOver(this);}, function(){thumbOut(this);});
	
	if($(window).width() > 600){
		$(".thumb .info").css({bottom: - $(this).height()});
		$(".thumb .image").css({opacity: 1});
	}else{
		$(".thumb .info").css({bottom: 0});
		$(".thumb .image").css({opacity: 1});
	}
	
	
	
	
	$("#next-btn a").hover(function (){$(this).stop(true, true).animate({backgroundColor: "#09a5fe", color: "#f2f2f0"});}, function (){$(this).stop(true, true).animate({backgroundColor: "#f2f2f0", color: "#09a5fe"});});
	$("#last-btn a").hover(function (){$(this).stop(true, true).animate({backgroundColor: "#09a5fe", color: "#f2f2f0"});}, function (){$(this).stop(true, true).animate({backgroundColor: "#f2f2f0", color: "#09a5fe"});});
	
	$(".thumb").click(
		function(){
			if(!moving){
				
				var thumb = this;
				if(current_pro != $(thumb).attr("rel")){
					moving = true;
					//console.log()
					if($( 'body' ).scrollTop() > 0 || $( 'html' ).scrollTop() > 0){
						scrolling = true;				
						$( 'body' ).animate( { scrollTop: 0 }, 1000);
						$( 'html' ).animate( { scrollTop: 0 }, 1000, function(){scrolling = false; thumbClick(thumb);});
					}else{
						thumbClick(thumb);
					}
				}
			}
		});
}



function addProjects(){
	total_pro = $(projects.project).length;
	$(projects.project).each(function(index, value){
	
		$("#projects").append('<div id="project-'+index+'" class="project"><div class="visit"></div><div class="images"></div><div class="info"><div id="project-'+index+'-btns" class="project-btns"></div><div class="inner"><div class="content"><h2>'+value.title+'</h2><div class="details"></div></div></div></div></div>');
		if(value.url){
			$("#project-"+index+" .visit").append('<a href="http://'+value.url+'" target="blank">Visit</a>');
		}
		
		addImages(value.images.image, index);
		addDetails(value.details, index);
	});
}

function addImages(images, id){
	$(images).each(function(index, value){
		$("#project-"+id+" .images").append('<div class="image" id="project-'+id+'-image-'+index+'" rel="'+index+'"><a href="javascript:void(0);" onclick="imageClicked();"><img  src="images/project-images/'+value+'" /></a></div>');
		$("#project-"+id+"-btns").append('<a id="project-'+id+'-btn-'+index+'" class="project-btn" href="javascript:void(0);" onclick="selectProjectImage('+index+')">&bull;</a>');
		
	});
}

function addDetails(details, id){
	if($(details.detail).length > 1){
		$(details.detail).each(function(index, value){
			$("#project-"+id+" .details").append(value);
			if(index < $(details.detail).length - 1){
				$("#project-"+id+" .details").append('<span> / </span>');
			}
		});
	}else{
		$("#project-"+id+" .details").append(details.detail);
	}
}

$(window).resize(function() {
  resizeStuff();
});


function resizeStuff(){
	var target_thumb_width;
	var targ_project_height;
	
	if(dir == "left"){
		$("#project-"+current_pro).stop(false, true).css({left: $(window).width() / 2 - 735 / 2});
		$("#project-"+last_pro).stop(true, true).css({left: -735});
	}else{
		$("#project-"+current_pro).stop(false, true).css({left: $(window).width() / 2 - 735 / 2});
		$("#project-"+last_pro).stop(true, true).css({left: $(window).width()});
	}
		
	if($(window).width() > 1500){
		target_thumb_width = Math.floor(($(window).width() - 10 * 4) / 3);
	}else if($(window).width() > 1000){
		target_thumb_width = Math.floor(($(window).width() - 10 * 4) / 3);
	}else if($(window).width() > 740){
		var p_scale = Math.floor(($(window).width() - 10 * 3)) / 735;
		targ_project_height = 368 * p_scale;
		$('#project-holder').height( 500);
		$('.project .images').height( targ_project_height + 50);
		target_thumb_width = Math.floor(($(window).width() - 10 * 3) / 2);
		$(".thumb .info").css({bottom: - $(this).height()});
		$(".thumb .image").css({opacity: 1});
	}else{
		target_thumb_width = Math.floor(($(window).width() - 10 * 3) / 2);
		//target_thumb_width = Math.floor(($(window).width() - 10 * 2));
		$(".thumb .info").css({bottom: 'auto'});
		$(".thumb .image").css({opacity: 1});
		var p_scale = Math.floor(($(window).width() - 10 * 2)) / 735;
		targ_project_height = 368 * p_scale;
		
		if(dir == "left"){
			$("#project-"+current_pro).stop(false, true).css({left: 0});
			$("#project-"+last_pro).stop(true, true).css({left: -$(window).width()});
		}else{
			$("#project-"+current_pro).stop(false, true).css({left: 0});
			$("#project-"+last_pro).stop(true, true).css({left: $(window).width()});
		}
		
		
		$('#project-holder').height( targ_project_height + 50);
		$('.project .images').height( targ_project_height + 50);
		
	//	console.log($('.project .images .image').height());
		
		
	}
	
	if($(window).width() < 735 + 40){
		//$('.project .image').css('width', $(window).width() - 40);
	}
	
	$(".thumb").css("width", target_thumb_width);
	
	
}





function thumbOver(thumb){
	if($(window).width() > 740){
		if(!scrolling){
			$(".info", thumb).stop(true, true).animate({bottom: 0}, t_dur, t_ease);
			$(".image", thumb).stop(true, true).animate({opacity: .4}, t_dur, "easeInOutQuad");
		}
	}
}

function thumbOut(thumb){
	if($(window).width() > 740){
		if(!scrolling){
			$(".info", thumb).animate({bottom: - $(".info", thumb).height()}, t_dur, t_ease);
			$(".image", thumb).animate({opacity: 1}, t_dur, "easeInOutQuad");
		}
	}
}

function thumbClick(thumb){		
	
	if(current_pro > $(thumb).attr("rel")){
		dir = "right";
	}else{
		dir = "left";
	}
	
	if(!pro_open){
		openProjects($(thumb).attr("rel"));
	}else{
		last_pro = current_pro;
		openProjects($(thumb).attr("rel"));
	}
}


function openProjects(project){
	current_pro = project;
	pro_open = true;
		$("#project-holder").slideDown(t_dur, "easeInOutQuad", positionProject);
		//resizeStuff();

	
}

function closeProjects(){
	pro_open = false;
	$("#project-holder").slideUp(t_dur, "easeInOutQuad");
}



function nextProject(){
	if(!moving){
		moving = true;
		dir = "left";
		last_pro = current_pro;
		current_pro++;
		if(current_pro == total_pro){
			current_pro = 0;
		}
		positionProject();
	}
}

function lastProject(){
	if(!moving){
		moving = true;
		dir = "right";
		last_pro = current_pro;
		current_pro--;
		if(current_pro == -1){
			current_pro = total_pro - 1;
		}
		positionProject();
	}
}

function positionProject(){
	
	stopShow();
	
	var targ_left = start_left = end_left = 0;
	
	$("#project-"+current_pro+" .images .image").css('display', 'none');
	$("#project-"+current_pro+"-image-0").fadeIn();
	
	if($(window).width() > 740){
		if(dir == "left"){
			targ_left = $(window).width() / 2 - 735 / 2;
			start_left = $(window).width();
			end_left = -735;		
		}else{
			targ_left = $(window).width() / 2 - 735 / 2;
			start_left = -$(window).width();
			end_left = $(window).width();
		}
	}else{
		if(dir == "left"){
			targ_left = 0;
			start_left = $(window).width();
			end_left = - $(window).width();	
		}else{
			targ_left = 0;
			start_left = -$(window).width();
			end_left = $(window).width();
		}
	}
	
	
	
	$(".project-btn").animate({color: '#09a5fe'});
	$("#project-"+current_pro+"-btn-0").animate({color: '#555'});
	$("#project-"+current_pro).stop(false, true).css({left: start_left}).animate({left: targ_left}, 800, t_ease, function(){
		moving = false;
		
		startShow();
	});
	
	$("#project-"+last_pro).stop(true, true).animate({left: end_left}, 800, t_ease);
	
	positionOthers();
	
}

function positionOthers(){
	
	var t_cloud = ($(window).width() - 3000) * (current_pro / total_pro);
	$("#clouds").animate({backgroundPosition: t_cloud+" 0"}, 800, t_ease);
}

var current_image = 0;
var last_image = 1;
var image_show/*  = setInterval("nextImage()", 3000) */;


function stopShow(){
	clearInterval(image_show);
}

function startShow(){
	stopShow();
	current_image = 0;
	last_image = 1;
	total_images = $("#project-"+current_pro+" .images .image").length;
	image_show = setInterval("nextImage()", 4000);
	
}

function nextImage(){
	if(last_image != current_image){
	last_image = current_image;
	current_image++;
	if(current_image == total_images){
		current_image = 0;
	}
	
	fadeImages();
	}
}

function selectProjectImage(index){
	if(current_image != index){
	stopShow();
	last_image = current_image;
	current_image = index;
	
	fadeImages();
	}
}


function fadeImages(){
	$("#project-"+current_pro+"-image-"+current_image).fadeIn(1000);
	$("#project-"+current_pro+"-image-"+last_image).fadeOut(1000);
	
	
	$("#project-"+current_pro+"-btn-"+current_image).animate({color: '#555'}, 1000);
	$("#project-"+current_pro+"-btn-"+last_image).animate({color: '#09a5fe'}, 1000);
	
	//$("#project-"+current_pro+"-btn-"+current_image).addClass('active');
	//$("#project-"+current_pro+"-btn-"+last_image).removeClass('active');
}

function imageClicked(){
	stopShow();
	nextImage();
}


function setHovers(){
	$('#logo a').hover(function(){$(this).stop(true, true).animate({color: '#09a5fe'}, 500);}, function(){$(this).animate({color: '#f2f2f0'}, 500);});
	$('nav a').hover(function(){$(this).stop(true, true).animate({color: '#555'}, 500);}, function(){$(this).animate({color: '#09a5fe'}, 500);});
	$('.thumb h2 a').hover(function(){$(this).stop(true, true).animate({color: '#555'}, 500);}, function(){$(this).animate({color: '#09a5fe'}, 500);});
	$('.thumb .view-btn a').hover(function(){$(this).stop(true, true).animate({color: '#09a5fe', backgroundColor: '#fff'}, 500);}, function(){$(this).animate({color: '#f2f2f0', backgroundColor: '#09a5fe'}, 500);});
	$('.visit a').hover(function(){$(this).stop(true, true).animate({color: '#09a5fe', backgroundColor: '#fff'}, 500);}, function(){$(this).animate({color: '#f2f2f0', backgroundColor: '#09a5fe'}, 500);});
}