var easeInOutQuad = function (x, t, b, c, d) {
	if ((t/=d/2) < 1) return c/2*t*t + b;
	return -c/2 * ((--t)*(t-2) - 1) + b;
};

var easeInOutQuint = function (x, t, b, c, d) {
	if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
	return c/2*((t-=2)*t*t*t*t + 2) + b;
};

var easeInOutExpo = function (x, t, b, c, d) {
	if (t==0) return b;
	if (t==d) return b+c;
	if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
	return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
}

var easeInOutElastic = function (x, t, b, c, d) {
	var s=1.70158;var p=0;var a=c;
	if (t==0) return b;  if ((t/=d/2)==2) return b+c;  if (!p) p=d*(.3*1.5);
	if (a < Math.abs(c)) { a=c; var s=p/4; }
	else var s = p/(2*Math.PI) * Math.asin (c/a);
	if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
	return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
};

var easeInOutQuart = function (x, t, b, c, d) {
	if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
	return -c/2 * ((t-=2)*t*t*t - 2) + b;
};

var PageScroll = {
	viewport: null,
	itemsHolder: null,
	items: null,
	itemCount: null,
	currentItem: null,
	windowWidth: 0,
	windowHeight: 0,
	viewportMinHeight: 0,
	imageRatio: -1,
	init: function(){
		// Cache element lookups
		viewport = $("#scroll_viewport");
		itemsHolder = $("#scroll_viewport .itemsholder");
		items = $("#scroll_viewport .itemsholder .itemholder");
		itemCount = items.length;

		// Set min height
		viewportMinHeight = 0;//$(".navigation").offset().top + $(".navigation").outerHeight() + items.find(".iteminfo").outerHeight() + (items.find(".itemholder").height() - (items.find(".iteminfo").offset().top+items.find(".iteminfo").outerHeight())+20);

		// Init navigation
		$(".navigation a:first").addClass("active");
		$.each($(".navigation a"),function(i, item){
			$(item).bind("click", function(e){
				e.preventDefault();
				$(".navigation a").removeClass("active");
				$(item).addClass("active");
				PageScroll.scrollToItem($($(e.target).attr("href")), true);
				setTimeout(function(){
					PageScroll.updateColors();
				}, 150);
			});
		});
		
		// Init element sizes
		currentItem = items.first();
		this.setRatio();
		this.windowResize();

		// Bind events
		$(window).bind("resize", this.windowResize);
	},
	setRatio: function(){
		if(PageScroll.imageRatio == -1){
			// Set image ratio
			firstImage = $("#scroll_viewport .itemsholder .itemholder img:first");
			// Check if image is loaded
			if(firstImage.width() != 0 && firstImage.height() != 0) {
				// Calculate the ratio
				PageScroll.imageRatio = firstImage.width()/firstImage.height();
				itemsHolder.find(".itemholder img").css({"minHeight": "0px", "minWidth": "0px"})
			}else{
				setTimeout(function(){PageScroll.windowResize();}, 100);
			}
		}
	},
	windowResize: function(e){
		// Window dimensions
		windowWidth = $(window).width();
		windowHeight = Math.max($(window).height(), viewportMinHeight);

		// Initial image width same as window width
		imageWidth = windowWidth;
		imageHeight = windowHeight;

		if(PageScroll.imageRatio != -1){
			// Calculate the image proportions
			if((windowWidth/PageScroll.imageRatio) > windowHeight){
				imageWidth = windowWidth;
				imageHeight = Math.round(windowWidth/PageScroll.imageRatio);
			}else{
				imageWidth = Math.round(windowHeight*PageScroll.imageRatio);
				imageHeight = windowHeight;
			}
		}else{
			PageScroll.setRatio();
			return;
		}

		// Init element sizes
		viewport.css("height", windowHeight+"px");
		viewport.css("width", windowWidth+"px");
		itemsHolder.css({"height": (windowHeight*itemCount) + "px", "width": windowWidth + "px"});
		items.css({"height": windowHeight + "px", "width": windowWidth + "px"});
		wOffset = ((windowWidth - imageWidth) < 0) ? ((windowWidth - imageWidth) / 2) : 0;
		hOffset = ((windowHeight - imageHeight) < 0) ? ((windowHeight - imageHeight) / 2) : 0;
		itemsHolder.find(".itemholder img").css({"height": imageHeight + "px", "width": imageWidth + "px", marginLeft: wOffset,marginTop:hOffset});
		PageScroll.scrollToItem(currentItem, false);
		PageScroll.updateColors();
	},
	scrollToItem: function(item, animate){
		currentItem = item;
		var itemTop = item.position().top;
		itemsHolder.stop();
		if(animate){
			itemsHolder.animate({"top": -1 * itemTop}, 800, easeInOutExpo);
		}else{
			itemsHolder.css("top", -1 * itemTop);
		}
	},
	updateColors: function(tColor, hColor){
		var $activeItem = $(".navigation a.active");
		var tColor = "ffffff";
		var hColor = "32F000";
		var colors = $activeItem.attr("class").match(/\[([a-f0-9,]*)\]/i);
		if(colors != null){
			var colorArr = colors[1].split(",");
			var tColor = colorArr[0];
			var hColor = colorArr[1];
			var bgColor = colorArr[2];
		}
		$(".drawer h1").css("color", "#"+tColor);
		$(".navigation a").each(function(i, item){
			var $item = $(item);
			if(bgColor != ""){
				$item.css("background-color", "#"+bgColor);
			}else{
				$item.css("background-color", "transparent");
			}
			if($item.is(".active")){
				$item.css("color", "#"+hColor);
			}else{
				$item.css("color", "#"+tColor);
			}
		});
	}
}

$(function(){
	PageScroll.init();
})