var projects = [];

jQuery(function( $ ){
	//TAB SWITCH FIX
	$('#nameInput').focus(function () {
		$('a.panel').removeClass('selected');
		$('#t4').addClass('selected');
		
		$('#top').scrollTo('#contact', 400, {axis:'x'});
	});
	
	org_top_height = $('#top').height();
	resizePanel(org_top_height);

	//RESIZE OF WINDOW
	$(window).resize(function () {
		resizePanel(org_top_height);
	});

	//CONTACT FORM AJAX
	setupContactForm();

	//GENERAL NAVIGATION
	setupNavigation();

	//save and remove all src values for preloading
	//removeImageSrc();
	
	//GALLERY NAVIGATION
	setupGallery('#galleryScrollMask','.project');

	//GET WIDTH OF WINDOW ON STARTUP
	resizePanel();
});

function removeImageSrc() {
	for (var i=0; i<$('.project').length; i++) {
		var project_id = $(".project")[i]["id"];
		var images = $("#"+project_id+" img");
		
		var attributes = [];
		
		for (var c=0; c<images.length; c++) {
			attributes.push(images[c]["title"]);
		}
		
		projects.push(attributes);
		
		$("#"+project_id+" img").attr("src","images/ajax-loader-project.gif");
	}	
}

function resizePanel(org_top_height) {
	width = $(window).width();
	height = $(window).height();
	mask_width = width * $('.content').length;
	top_height = org_top_height;
	nav_height = $('#middle').height()+$('#lines').height()+$('#bottom').height();
	
	if (height < top_height+nav_height) {
		new_top_height = height-nav_height;
		$('#top').css({height: new_top_height});
	}

	$('#top, .content').css({width: width});
	$('#mask').css({width: mask_width});
	$('#top').scrollTo($('a.selected').attr('href'), 0);
}

function setupGallery(mask,item) {
	var items = $(mask).children();
	var mask_w = items.size()*$(item).width();
	$(mask).css('width',mask_w);
	
	loadDescOfProject(0,items);
	loadImageOfProject(0,0);
	setupGalleryPagination(0,0);
	
	$('#galleryScroll').serialScroll({
		items:'.project',
		axis:'x',
		prev:'a#galleryControlLeft',
		next:'a#galleryControlRight',
		start:0,
		lazy: true,
		duration:250,
		force:true,	
		stop:true,
		lock:true,
		cycle:true,
		easing:'easeOutQuart',
		onBefore:function( e, elem, $pane, $items, pos ){			
			e.preventDefault();

			//preload active project image
			var activeProjectImage = $('#galleryScrollMask div:eq('+pos+') img.active');
			var p = $(activeProjectImage).parent().children();
			var p_i = p.index(activeProjectImage);
			
			loadDescOfProject(pos,$items);
			loadImageOfProject(pos,p_i);
			setupGalleryPagination(pos,p_i);
		},
	});
}

function loadDescOfProject(project_i,items) {
	if (project_i == 0) {
		$('#project'+items.length+'Desc').fadeOut('fast', function() { 
			$('#project'+1+'Desc').fadeIn('fast');
		});
	} else if (project_i == (items.length-1)) {
		$('#project'+1+'Desc').fadeOut('fast', function() { 
			$('#project'+items.length+'Desc').fadeIn('fast');
		});
		$('#project'+project_i+'Desc').fadeOut('fast', function() { 
			$('#project'+items.length+'Desc').fadeIn('fast');
		});
	} else {
		$('#project'+project_i+'Desc').fadeOut('fast', function() { 
			$('#project'+(project_i+1)+'Desc').fadeIn('fast');
		});
	}
}

function loadImageOfProject(project_i,img_i) {
	var image = '#galleryScrollMask div:eq('+project_i+') img:eq('+img_i+')';
	var project = '#galleryScrollMask div:eq('+project_i+')';

	$(project+'>img').removeClass('active');
	$(image).addClass('active');

	//check if image is already loaded
	$('#galleryLoader').fadeIn('fast');
	
	$(image).attr('src',$(image).attr('title'));
	$(image).preload({
	    placeholder:'images/ajax-loader-project.gif',
	    notFound:'images/notfound.jpg',
		onComplete: function () {
			$('#galleryLoader').fadeOut('fast');
			$(project).scrollTo($(image), 400, {axis:'y'});
		},
		onFinish: function() {
		}
	});
	
	//Google Analytics
	_gaq.push(['_trackPageview', '/work'+'/project'+project_i+'/img'+img_i]);
}

function setupGalleryPagination(project_i,img_i) {
	var numOfItems = $('#galleryScrollMask > div:eq('+project_i+') > img').length;
	
	$("#galleryPagination > li").remove();
	
	if (numOfItems > 1) {
		for (var i=0; i<numOfItems;i++) {
			if (i == 0  && i == img_i) {
				$("#galleryPagination").append('<li class="first"><a class="pagination activePage">'+(i+1)+'</a></li>')
			} else if (i == 0) {
				$("#galleryPagination").append('<li class="first"><a class="pagination">'+(i+1)+'</a></li>')
			} else if ((i+1) == numOfItems && i == img_i) {
				$("#galleryPagination").append('<li class="last"><a class="pagination activePage">'+(i+1)+'</a></li>')
			} else if ((i+1) == numOfItems) {
				$("#galleryPagination").append('<li class="last"><a class="pagination">'+(i+1)+'</a></li>')
			} else if (i == img_i) {
				$("#galleryPagination").append('<li><a class="pagination activePage">'+(i+1)+'</a></li>')
			} else {
				$("#galleryPagination").append('<li><a class="pagination">'+(i+1)+'</a></li>')
			}
		}

		$('a.pagination').click(function () {
			var to_img_i = $(this).html()-1;
			
			$('a.pagination').removeClass('activePage');
			$(this).addClass('activePage');
				
			loadImageOfProject(project_i,to_img_i);
			
			return false;
		});	
	}
}

function setupNavigation() {
	$.localScroll.defaults.axis = 'x';

	$.localScroll.hash({
		target: '#top',
		queue:true,
		duration:500,
		onBefore:function( e, anchor, $target ){
			$('a.panel').removeClass('selected');
			$("a.panel[href='#"+$(anchor).attr("id")+"']").addClass('selected');
		}
	});

	$.localScroll({
		target: '#top',
		queue:true,
		duration:500,
		hash:true,
		onBefore:function( e, anchor, $target ){
			$('a.panel').removeClass('selected');
			//$('#t1').attr('style','border: 1px solid red; position:relative')
			$("a.panel[href='#"+$(anchor).attr("id")+"']").addClass('selected');
			
			//Google Analytics
			_gaq.push(['_trackPageview', '/'+$(anchor).attr("id")]);
		}
	});
}

function setupContactForm() {
	$('#submitContact').click(function () {
		var name = $('input[name=name]');
		var send = $('input[name=s]');
		var email = $('input[name=email]');
		var message = $('textarea[name=message]');
		var data = 'name=' + name.val() + '&send=' + send.val() + '&email=' + email.val() + '&message='  + encodeURIComponent(message.val());
		
		$('.loading_icon').show();
		
		$.ajax({
			url: "contact.php",
			type: "GET",
			data: data,
			success: function (reqMessage) {
				if (reqMessage==1) {
					$('.loading_icon').fadeOut('slow');
					$('.errorField').fadeOut('slow');
					$('.form').fadeOut('slow');
					$('.done').fadeIn('slow');
				} else if (reqMessage==2) {
					$('.error').show();
					$('.loading_icon').fadeOut('slow');
				} else {
					$('.loading_icon').fadeOut('slow');
					$('.errorField').html(reqMessage);
					$('.errorField').fadeIn('slow');
				}
			}
		});
		
		return false;
	});
}

jQuery.easing.easeOutQuart = function (x, t, b, c, d) {
	return -c * ((t=t/d-1)*t*t*t - 1) + b;
};
