/***********************************************************************

Author:     Arno Hoogma
URL:        http://www.4rn0.nl

***********************************************************************/


if (typeof window.jQuery != 'undefined')
{
	
	document.documentElement.className += ' js';
	
	$(function()
	{
		
		initNews();
		initPortfolio();
		
		var preload = new Image();
		preload.src = 'assets/layout/bg.details.png';
		
		
	});	

	/**
	 * News
	 **/
	
	function initNews()
	{
		
		$('div#news').css('minHeight', $('div#about').outerHeight() + 45).hide();
		$('div#news').append('<a href="" class="exit"></a>');
		$('div#news ul, div#news a.exit').hide();
		
		$('div#latest p, div#latest img').click(function() {
			$('div#latest a').trigger('click');
		});
		
		$('div#latest a').click(function() {
			
			$('html').addClass('news');
			
			$('div#news').show();
			$('div#news ul, div#news a.exit').fadeIn(300);
			$('div#latest, div#projects').hide();
			
			return false;
			
		});

		$('div#container > h1 a, div#news a.exit').click(function() {
			
			if ($('html').is('.news')) {
				
				$('html').removeClass('news');
			
				$('div#news, div#news ul, div#news a.exit').hide();
				$('div#latest, div#projects').fadeIn(300);
				
			}
		
			return false;
			
		});
				
	}
	
	/**
	 * Portfolio
	 **/
	
	function initPortfolio()
	{
		
		$('div#projects').css('minHeight', $('div#about').outerHeight() + 45);
		$('div#projects ul:first').before('<div id="project-details"><img src="" alt="" /><div></div><a id="prev">vorige</a><a id="next">volgende</a><a class="exit">sluiten</a></div>');
		
		$('div#projects > ul > li:has(ul)').addClass('active').click(function() {
			
			$('div#projects .current').removeClass('current');	
			$(this).find('ul li:first a').addClass('current');
			$(this).addClass('current');
			
			$('div#project-details > img').attr('src', $(this).find('ul li:first a').attr('href') );
			$('div#project-details > img').attr('alt', $(this).find('ul li:first a').text() );
			$('div#project-details div').html('<h3>' + $(this).find('h3').text() + '</h3>');
			
			if ($(this).find('div').size()) {
				$('div#project-details div').append($(this).find('div').html());
			}			
			
			$('html, body').animate({ scrollTop: 225 }, 700);	
			$('div#project-details').fadeIn(300);
			
		});
		
		initNavigation();
		
	}
	
	function initNavigation()
	{
		
		$('div#projects a#prev, div#projects a#next').click(function() {
			
			if ($(this).attr('id') == 'next') {
				
				// next image
				var target = $('div#projects ul a.current').parent().next().find('a');
				// first image in next li
				target = $(target).size() ? target : $('div#projects ul a.current').parents('div#projects > ul > li').next().find('li a');
				// first image in next ul. .first li
				target = $(target).size() ? target : $('div#projects ul a.current').parents('div#projects > ul').next().find('li:first li:first a');
				// first image in first ul, first li
				target = $(target).size() ? target : $('div#projects > ul:first ul li:first a');	
				
			}
			
			if ($(this).attr('id') == 'prev') {
				
				// previous image
				var target = $('div#projects ul a.current').parent().prev().find('a');
				// last image in previous li
				target = $(target).size() ? target : $('div#projects ul a.current').parents('div#projects > ul > li').prev().find('li:last a');
				// last image in previous ul, last li
				target = $(target).size() ? target : $('div#projects ul a.current').parents('div#projects > ul').prev().find('li:last a');
				// last image in last ul, last li
				target = $(target).size() ? target : $('div#projects > ul:last li:last a');	
				
			}
			
			$('div#projects .current').removeClass('current');
			
			$(target).parents('div#projects > ul > li').addClass('current');
			$(target).addClass('current');
			
			$('div#project-details > img').fadeTo(200, 0.1, function() {
				
				var preload = new Image();
				
				preload.onload = function() {

					$('div#project-details > img').attr('src', this.src).fadeTo(200, 1);
					$('div#project-details > img').attr('alt', $(target).text() );
					$('div#project-details div').html('<h3>' + $(target).parents('div#projects > ul > li').find('h3').text() + '</h3>');

					if ($(target).parents('div#projects > ul > li').find('div').size()) {
						$('div#project-details div').append($(target).parents('div#projects > ul > li').find('div').html());
					}
					
					this.onload = null;

				};

				preload.src = $(target).attr('href');
				
			});
						
			return false;
			
		});		
		
		$('div#projects a.exit').click(function() {

			$('div#projects .current').removeClass('current');			
			$('div#projects > ul').hide();
			
			$('div#project-details > img').attr('src', 'assets/layout/bg.blank.gif');
			$('div#projects > ul > li, div#projects ul a').removeClass('current');

			$('div#project-details').fadeOut(300, function() {
				$('div#projects > ul').fadeIn(300);
			});
			
		});
		
	}
		
}