function resizeContainer(){
	$('.container').css('overflow', 'hidden').css('height', $(window).height()).css('width', $(window).width());
}

function startInterval(mseconds) {
	if(mseconds == 0) {
		clearInterval(startInterval.obj);
	} else {
		startInterval.obj = setInterval(randomSwitch, mseconds);
	}
}

/**
 * Switch background images, switchTag is id of the background image to bring to front.
 * Image must allready be full size
 * @param switchTag
 */
function switchBackground(switchTag) {
	var $switchImg = $('#'+switchTag);
	if($switchImg.css('z-index') == '-2') {
		return; //already this background
	}
	if(!$switchImg.length)  {
		return; //image not found
	}
	
	//remove opacity and position above, then increase opacity
	$switchImg.css('opacity','0').delay(60).css('z-index','-1');
	
	//animate
	$switchImg.addClass('speed').animate({opacity:1}, 400, 'linear',function(){
		//position normal all -2 z-index
		$('.bgimg').each(function(){
			if($(this).css('z-index') == '-2') {
				$(this).css('z-index', '-3');
			}
		});
		//set our image to normal
		$switchImg.removeClass('speed').delay(100).css('z-index','-2');
	});
}

var prevRand = null;
function randomSwitch() {
	var count = $('.bgimg').length;
	var i = 0; 
	var rand = Math.round(Math.random()*(count ? count-1 : 0));
	if(prevRand == rand) {
		rand = Math.round(Math.random()*(count ? count-1 : 0));
		if(prevRand == rand) {
			rand = Math.round(Math.random()*(count ? count-1 : 0));
			if(prevRand == rand) {
				rand = Math.round(Math.random()*(count ? count-1 : 0));
			}
		}
	}
	prevRand = rand;
	var tag = $('.bgimg:nth-child('+(rand+1)+')').attr('id');
	switchBackground(tag);
}

function closeStripe($stripe, showSections) {
	if(parseInt($stripe.css('width')) == 0) {
		//nothing to close
		return false;
	}
	$stripe.find(".content").fadeOut(600);
	$stripe.find('.tabs').fadeOut(200);
	$stripe.delay(600).animate({width: "0"}, 400);
	
	//show sections
	if(showSections) {
		$(".sticky").show().delay(800).animate({opacity: "1"}, 800, function(){	
			$(this).css('filter', '');
			//after sections switch background
			//also load the appropriate section image
			var currentSectionTag = $('.secondary a.selected').attr('id');
			/*
			if(currentSectionTag) {
				switchBackground('sec_' + currentSectionTag.substring("portfolio_".length));
			} else {
				//switch to first image in line
				switchBackground($('.bgimg:first').attr('id'));
			}
			*/
			
		});
	}
	return true;
}

function animateSectionOver(el) {
	var $el = (el.target) ? $(el.target) : $(el);
	$el.stop().animate({
		fontSize: "55px",
		lineHeight: "60px"
	}, {queue:false, duration:400});
}

function animateSectionOut(el) {
	var $el = (el.target) ? $(el.target) : $(el);
	$el.stop().animate({
		fontSize: "30px",
		lineHeight: "35px"
	}, {queue:false, duration:400});
}

$(document).ready( function() {				
	
	
	////////////////////////////
	//all articles are already on the page
	//build tabs
	$(".stripe").tabs();
	
	//open up an article upon click
	$(".primary .stripe-link").click(
			function (e) {
				e.preventDefault();
				$(".primary li").removeClass('selected');
				$(this).parent().addClass('selected');
				
				var closedDelay = false;
				$('.stripe').each(function(){
					closedDelay = closedDelay || closeStripe($(this), false);
				});
				
				//calculate height
				var id = $(this).attr('id').substring('navi_'.length);
				var $stripe = $('#article_container_' + id);
				if(!$stripe.length) {}
				
				//stop random - important before animation start
				startInterval(0);
				
				//hide all content inside stripe
				$stripe.find('.content').hide();
				
				//get content to display
				var $article = $stripe.find('artice_'+id);
				if($article.length == 0) {
					//if no content with the same id
					//select first article from container
					$article = $stripe.find('.content-wrapper').first();
				}
				
				$article.find('.content').show();
				var margin = $stripe.height()/2;
				$stripe.css({'margin-top' : -margin});
				$stripe.css({'height' : $stripe.height() + 'px' });
				
				$article.find('.content').hide();
				
				$(".sticky").animate({opacity: "0"}, 300, function () {
						$(this).hide();
						$stripe.delay(closedDelay ? 800 : 0).animate({width: "100%"}, 400, function () {
								$stripe.find(".tabs").fadeIn(200);
								$article.find(".content").fadeIn(1300, function(){
									$stripe.find('.content').show();//show all, let tabs do its dirty magic
								});
								//try to switch background
								switchBackground('nav_'+id);
						});		
				});
				
			}	
	);
	
	$(".close").click(
		function (e) {
			e.preventDefault();
			closeStripe($(this).parents('.stripe'), true);
		});


	$(".thumbnails li a").hover(
		function () {
			$(this).animate({
				borderTopColor: 'rgba(255, 255, 255, 1)', borderLeftColor: 'rgba(255, 255, 255, 1)', borderRightColor: 'rgba(255, 255, 255, 1)', borderBottomColor: 'rgba(255, 255, 255, 1)'
			}, 100 );
		}, 
		function () {
			$(this).animate({
				borderTopColor: '#59b4de', borderLeftColor: '#59b4de', borderRightColor: '#59b4de', borderBottomColor: '#59b4de'
			}, 100 );
		}
	);
	
	$(".secondary a").unbind('hover');
	$(".secondary").delegate('a:not(.selected)','mouseover',animateSectionOver);
	$(".secondary").delegate('a:not(.selected)','mouseout',animateSectionOut);
	//$(".secondary a").mouseout(animateSectionOut);


});
		
