var newWidth = 0;
var zCount = 1000;
var footerOffset = 48;
var bodyPadding = 84;
var easing = 'easeInOutExpo';
var standardColor = "#efecea";
var nextColor = standardColor;
var colors = new Array();
colors = {
	"about.php" : "rgb(131,198,159)",
	"approach.php" : "rgb(145,187,217)",
	"clients.php" : "rgb(248,180,118)",
	"beliefs.php" : "rgb(255,244,202)"
}

var url = window.location.href;
var urlarray = url.split('#');
var url = urlarray[0] + '#';
urlarray[1] ? tab = urlarray[1] : tab = false;

if (Modernizr.touch){
	easing = 'linear';
}

$(document).ready(function() {
	setFooterAnimation();
	setPageLayout();
});

function setFooterAnimation() {
	if (!$.browser.mobile) {
		$('body').css('padding-bottom', bodyPadding);
		footer = $('body>footer');
		$('body>footer img.arrow,body>footer h5').click(
				function() {
					if (footer.hasClass('open')) {
						footer.removeClass('open').stop().animate( {
							bottom : (footerOffset - footer.height())
						}, 500);
						$('body').stop().animate( {
							'padding-bottom' : bodyPadding
						}, 500);
					} else {
						footer.addClass('open').stop().animate( {
							bottom : 0
						}, 500);
						$('body').stop().animate(
								{
									'padding-bottom' : (bodyPadding + (footer
											.height() - footerOffset))
								}, 500);
					}
				})
	}else{
		footer = $('body>footer');
		footer.css('position','static');
		easing = 'linear';
	}
}

function fadeInItem(item) {
	item.fadeTo(0, 0.001);
	$.preLoadImages( [ item.find('img:first').attr('src') ], function() {
		item.fadeTo(1000, 1, easing);
	});
	item.find('img:first').load(function() {
		item.fadeTo(1000, 1, easing);
	});
	if (item.length > 0) {
		setTimeout(function() {
			fadeInItem(item.next());
		}, 33);
	} else {
		setTimeout(function() {
			forceFadeInItem($('#items .item:first'));
		}, 66);
	}
	if (item.find('img:first').length < 1) {
		item.fadeTo(1000, 1, easing);
	}
}

function forceFadeInItem(item) {
	item.fadeTo(1000, 1, easing);
	if (item.length > 0) {
		setTimeout(function() {
			forceFadeInItem(item.next());
		}, 33);
	}
}

function setPageLayout() {

	var exactJob = "";

	if(tab){
	
		var urlvs = tab.split("/");
		
		if(urlvs[0]=="jobs"){
		
			exactJob = urlvs[1];
			eraseCookie("vac");
			
			if(exactJob){
				setTimeout(function(){
					$("#vacature #"+exactJob+" .jc").slideDown(1000, easing);
					$("#vacature #"+exactJob+" .arr").addClass("act");
				},2000);
			}
		
		}
	
	}

	$("#items").randomize(".project");

	$('#items').show().masonry( {
		itemSelector : '.item',
		isAnimated : true,
		animationOptions : {
			duration : 450,
			easing : easing,
			queue : false
		},
		columnWidth : 30,
		gutterwidth : 30
	});

	$('.item').fadeTo(0, 0.001);

	$('body>footer').css('bottom', 0 - footer.height()).show().animate( {
		bottom : (footerOffset - footer.height())
	}, 1000);

	$('body>nav').css( {
		'top' : 0 - $(this).height(),
		'width' : '100%',
		'display' : 'block'
	}).show().animate( {
		top : 0
	}, 1000, function() {
		
		if(!readCookie("vac")){
		
			$("#vacature").slideDown(1000, easing);
			$("#jobopen").animate({top:"-50px"}, 1000, easing);
			$("#vacature .job .jc").each(function(){
	
				/*$(this).show();
				$(this).css("min-height",$(this).height());
				$(this).hide();*/
	
			});
		
		}
		
		fadeInItem($('#items .item:first'));
		
	});

	setProjectContainers();
	
	$("#jobclose").click(function(){
	
		$("#vacature").slideUp(1000, easing);
		createCookie("vac",true);
		window.location.href = url;
		$("#jobopen").animate({top:0}, 1000, easing);
	
	});
	
	$("#jobopen").click(function(){
	
		$("#vacature .jc").hide();
		$("#vacature .arr").removeClass("act");
		$("#vacature").slideDown(1000, easing);
		createCookie("vac",true);
		window.location.href = url + "jobs";
		$("#jobopen").animate({top:"-50px"}, 1000, easing);
	
	});
	
	
	
	$("#vacature .job h4").click(function(){
	
		var titl = $(this);
		titl.parent(".job").find(".jc").slideDown(1000, easing);
		titl.parent(".job").find(".arr").addClass("act");
		setTimeout(function(){
			titl.parent(".job").siblings().find(".jc").slideUp(1000, easing);
			titl.parent(".job").siblings().find(".arr").removeClass("act");
		},100);
		
		window.location.href = url + "jobs/" + titl.parent(".job").attr("id");
	
	});
	
	$("#vacature .job .arr").click(function(){
	
		var titl = $(this);
		titl.parent(".job").find(".jc").slideUp(1000, easing);
		titl.parent(".job").find(".arr").removeClass("act");
		window.location.href = url + "jobs";
	
	});

}

function setProjectContainers() {

	$('.project').each(function() {
		var project = $(this);
		project.attr('oldbg', $(this).css('background-image'))
		project.attr('oldwidth', $(this).width())
		project.attr('oldheight', $(this).height())
		project.find('img.small,div.more').click(function() {
			if (project.hasClass('active') != true) {
				openProjectBox(project);
				project.siblings('.project.active').each(function() {
					closeProjectBox($(this));
				});
				project.siblings('.page.active').each(function() {
					closePageBox($(this));
				});
			}
		});
		if (tab == $(this).attr('id')) {
			if (project.hasClass('active') != true) {
				openProjectBox(project);
				project.siblings('.project.active').each(function() {
					closeProjectBox($(this));
				});
				project.siblings('.page.active').each(function() {
					closePageBox($(this));
				});
			}
		}
		project.find('.more:first').css( {
			'bottom' : (0 - $(this).height()),
			'width' : $(this).width() - 20
		});
		
		if (Modernizr.touch){
		
				project.find('img.small').stop().fadeTo(0, 1);
				project.find('.more:first').stop().css({
					bottom : 0
				});
		
		}else{
		
		project.find('img.small').fadeTo(0, 0.001);
		project.hover(function() {
			if (!$(this).hasClass('active')) {
				$(this).find('img.small').stop().fadeTo(200, 1);
				$(this).find('.more:first').stop().animate( {
					bottom : 0
				}, 400);
			}
		}, function() {
			if (!$(this).hasClass('active')) {
				$(this).find('img.small').stop().fadeTo(500, 0.001);
				$(this).find('.more:first').stop().animate( {
					bottom : (0 - $(this).height())
				}, 400);
			}

		});
		
		}
		
		
		
	});

	$('.page').each(function() {
		var page = $(this);
		page.attr('oldwidth', $(this).width());
		page.attr('oldheight', $(this).height());
		page.attr('url', $(this).find('a:first').attr('href'));
		page.find('a:first').removeAttr('href').css('cursor', 'pointer');
		page.click(function() {
			if ($(this).hasClass('active') != true) {
				openPageBox($(this));
				$(this).siblings('.project.active').each(function() {
					closeProjectBox($(this));
				});
				$(this).siblings('.page.active').each(function() {
					closePageBox($(this));
				});
			}
		});
		if (tab == $(this).attr('url').replace('.php', '')) {
			if ($(this).hasClass('active') != true) {
				openPageBox($(this));
				$(this).siblings('.project.active').each(function() {
					closeProjectBox($(this));
				});
				$(this).siblings('.page.active').each(function() {
					closePageBox($(this));
				});
			}
		}
	});

}

function openPageBox(box) {
	var nextColor = colors[box.attr('url')];
	setTimeout(function() {
		$('#items').masonry('reload');
		$('html,body').animate( {
			scrollTop : (box.offset().top +1)
		}, 200);
		$('#items').animate( {
			'scrollLeft' : 0
		}, 200);
	}, 200)
	setTimeout(
			function() {
				$('html,body').animate( {
					scrollTop : (box.offset().top +1)
				}, 200);
				$('#items').animate( {
					'scrollLeft' : 0
				}, 200);
				box
						.find('h3')
						.fadeTo(
								100,
								0,
								function() {
									$(this).hide();
									box.css('z-index', zCount);
									zCount++;
									$('body>footer').css('z-index', zCount);
									zCount++;
									box
											.append('<div class="temploader" style="width: ' + box
													.attr('oldwidth') + 'px"><img src="images/loader.gif" style="position: absolute; left: 20px; top: 20px;" /></div>');

									$('body,.page').animate( {
										"background-color" : nextColor
									});

									box.animate( {
										width : 450,
										height : 50
									}, 201, function() {
										box.find('.temploader').animate( {
											width : 450
										}, 451)
										showPage(box);
									})
								});
				box.addClass('active');
			}, 1000)
}

function closePageBox(box) {

	$('.temploader').fadeOut('fast', function() {
		$(this).remove();
	});
	box.find('.pagecontent').hide();
	box.removeClass('active');
	box.css( {
		width : box.attr('oldwidth'),
		height : box.attr('oldheight')
	});
	box.find('h3').show().fadeTo(0, 1);

}

function openProjectBox(box) {
	var nextColor = standardColor;
	setTimeout(function() {
		$('#items').masonry('reload');
		$('html,body').animate( {
			scrollTop : (box.offset().top +1)
		}, 200);
		$('#items').animate( {
			'scrollLeft' : 0
		}, 200);
	}, 200)
	setTimeout(
			function() {
				$('html,body').animate( {
					scrollTop : (box.offset().top +1)
				}, 200);
				$('#items').animate( {
					'scrollLeft' : 0
				}, 200);
				box
						.css('background-image', 'none')
						.find('img.small')
						.fadeTo(
								100,
								0,
								function() {
									$(this).hide();
									box.css('z-index', zCount);
									zCount++;
									$('body>footer').css('z-index', zCount);
									zCount++;
									box
											.append('<div class="temploader" style="width: ' + box
													.attr('oldwidth') + 'px"><img src="images/loader.gif"/></div>');

									$('body,.page,.project').animate( {
										"background-color" : nextColor
									});

									box.animate( {
										width : 930,
										height : 50
									}, 201, function() {
										box.find('.temploader').animate( {
											width : 930
										}, 451)
										showProject(box);
									})
								});
				box.addClass('active');
			}, 1000)
}

function closeProjectBox(box) {

	$('.temploader').fadeOut('fast', function() {
		$(this).remove();
	});
	box.find('.projectdetail').slideUp('fast', function() {
		$(this).remove();
	});
	box.removeClass('active');
	box.addClass('noborder');
	box.animate( {
		width : box.attr('oldwidth'),
		height : box.attr('oldheight')
	}, 200, function() {
		box.css('background-image', box.attr('oldbg'));
		box.removeClass('noborder');
	});
	box.find('img.small').show().fadeTo(0, 0.001);

	box.find('.more:first').css( {
		'bottom' : (0 - $(this).height())
	});

}

function showPage(box) {
	if (box.find('.pagecontent').length <= 0) {
		var link = box.attr('url');
		window.location.href = url + (link.replace('.php', ''));
		var request = $.get(link);
		// $.trackPageview(request);
		_gaq.push( [ '_trackPageview', '/' + link ]);
		request.success(function(data) {
			box.find('.temploader').remove();
			box.append('<div class="pagecontent">' + data + '</div>');
			box.find('.pagecontent').hide().slideDown('fast', function() {
				$('#items').masonry('reload', function() {
					setTimeout(function() {
						$('html,body').animate( {
							scrollTop : (box.offset().top +1)
						}, 200);
						$('#items').animate( {
							'scrollLeft' : 0
						}, 200);
					}, 452);
				});
			});
			box.css('height', 'auto');
		});
		request.error(function() {
			alert("error");
		});
	} else {
		var link = box.attr('url');
		window.location.href = url + (link.replace('.php', ''));
		box.find('.temploader').remove();
		box.find('.pagecontent').slideDown('fast', function() {
			$('#items').masonry('reload', function() {
				setTimeout(function() {
					$('html,body').animate( {
						scrollTop : (box.offset().top +1)
					}, 200);
					$('#items').animate( {
						'scrollLeft' : 0
					}, 200);
				}, 452);
			});
		});
		box.css('height', 'auto');
	}
}

function showProject(box) {
	if (box.find('.projectdetail').length <= 0) {
		var id = box.attr('id');
		window.location.href = url + id;
		var request = $.get(id + ".html", {
			p : id
		});
		_gaq.push( [ '_trackPageview', '/' + id + '.html' ]);
		// $.trackPageview(request);
		request.success(function(data) {
			box.find('.temploader').remove();
			box.append('<div class="projectdetail">' + data + '</div>');

			box.find('.textual>strong>a').attr('target', '_blank');

			var arrow = '';

			if (box.is($('#items .project:first'))) {
			} else {
				arrow += '<img src="images/previous.png" class="prev" />';
			}

			arrow += '<img src="images/close.png" class="close" />';

			if (box.is($('#items .project:last'))) {
			} else {
				arrow += '<img src="images/next.png" class="next" />';
			}

			box.find('.textual').append(
					'<div class="arrows">' + arrow + '</div>');

			box.find('.close').click(function() {
				closeProjectBox(box);
				$('html,body').animate( {
					scrollTop : 0
				}, 500, function() {
					window.location.href = url;
				});
				setTimeout(function() {
					$('#items').masonry('reload');
				}, 300);
			});

			box.find('.next').click(function() {
				var nextBox = box.next('.project');
				openProjectBox(nextBox);
				nextBox.siblings('.project.active').each(function() {
					closeProjectBox($(this));
				});
				nextBox.siblings('.page.active').each(function() {
					closePageBox($(this));
				});
			});

			box.find('.prev').click(function() {
				var nextBox = box.prev('.project');
				openProjectBox(nextBox);
				nextBox.siblings('.project.active').each(function() {
					closeProjectBox($(this));
				});
				nextBox.siblings('.page.active').each(function() {
					closePageBox($(this));
				});
			});

			box.find('.projectdetail').hide().slideDown('fast', function() {
				$('#items').masonry('reload', function() {
					setTimeout(function() {
						$('html,body').animate( {
							scrollTop : (box.offset().top +1)
						}, 200);
						$('#items').animate( {
							'scrollLeft' : 0
						}, 200);
						setListener(box);
					}, 452);
				});
			});
			box.css('height', 'auto');
		});
		request.error(function() {
			alert("error");
		});
	} else {
		box.find('.temploader').remove();
		box.find('.projectdetail').slideDown('fast', function() {
			$('#items').masonry('reload', function() {
				setTimeout(function() {
					$('html,body').animate( {
						scrollTop : (box.offset().top +1)
					}, 200);
					$('#items').animate( {
						'scrollLeft' : 0
					}, 200);
					setListener(box);
				}, 452);
			});
		});
		box.css('height', 'auto');
	}
}

function setListener(box) {

	var text = box.find('.textual:first');
	var parentOffSet = parseInt(box.css('top'));
	var parentHeight = box.find('.visual:first').height()
	var textHeight = text.height();

	$(window).scroll(function() {

		var newTop = ($(window).scrollTop() - (parentOffSet + 189 + 26));
		
		if (!Modernizr.touch){

		if (newTop < 0) {
			text.css( {
				position : 'relative',
				top : 0,
				bottom : 'auto',
				left : 0,
				marginLeft : 0
			});
		} else if ((textHeight + newTop) > parentHeight) {
			text.css( {
				position : 'absolute',
				top : 'auto',
				bottom : 30,
				left : '50%',
				marginLeft : 255
			});
		} else {
			text.css( {
				position : 'fixed',
				top : 25,
				bottom : 'auto',
				left : '50%',
				marginLeft : 255
			});
		}
		
		}

	});
	
	if (Modernizr.touch){
	}else{

	var scroller = $('#mcs_container');
	var windowHeight = $(window).height();
	var titleHeight = box.find('.textual h2').height();
	var originalHeight = scroller.find('.content').height();
	var originalId = box.attr('id');
	var newId = originalId+'_scroll';
	scroller.addClass('mcs_container').attr('id',newId).attr('originalH', originalHeight);
	scroller = box.find('.mcs_container:first');
	var calculation = windowHeight - (originalHeight + titleHeight + 150)
	var elements = $('.dragger_container, .scrollUpBtn, .scrollDownBtn');
	
	if (calculation < 0) {
		scroller.height(originalHeight + calculation);
	} else {
		scroller.height(originalHeight);
	}
	
	
	scroller.mCustomScrollbar("vertical",0,'linear',1,"fixed","no","no",3);
	
	
	if (calculation < 0) {
		elements.show();
	} else {
		elements.hide();
	}
	
	
	$(window).resize(function() {

		windowHeight = $(window).height();
		calculation = windowHeight - (originalHeight + titleHeight + 150);

		if (calculation < 0) {
			scroller.height(originalHeight + calculation);
			elements.show();
		} else {
			scroller.height(originalHeight);
			elements.hide();
		}

	});
	}

}

function getUrlVars() {
	var vars = [], hash;
	var hashes = window.location.href.slice(
			window.location.href.indexOf('?') + 1).split('&');
	for ( var i = 0; i < hashes.length; i++) {
		hash = hashes[i].split('=');
		vars.push(hash[0]);
		vars[hash[0]] = hash[1];
	}
	return vars;
}

(function($) {

$.fn.randomize = function(childElem) {
  return this.each(function() {
      var $this = $(this);
      var elems = $this.children(childElem);

      elems.sort(function() { return (Math.round(Math.random())-0.5); });  

      $this.remove(childElem);  

      for(var i=0; i < elems.length; i++)
        $this.append(elems[i]);      

  });    
}
})(jQuery);



function createCookie(name,value,days) {
	if (days) {
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}

function eraseCookie(name) {
	createCookie(name,"",-1);
}


