$(document).ready(function () {

	/**
	 * Deze file zorgt voor de foto "album" effect op de voorpagina. 
 	 **/
 	 
 	var Browser = {
		Version: function() {
			var version = 999; 
			if (navigator.appVersion.indexOf("MSIE") != -1)
				version = parseFloat(navigator.appVersion.split("MSIE")[1]);
			return version;
		}
	}
 	 
 	var autoRotateTimer;
	
	var autoRotate = function() {
		var activeElement = $('div.photo-buttons li.active');
		var nextEelement = (activeElement.next().size() == 1 ? activeElement.next() : $('div.photo-buttons li:first'));
		nextEelement.find('a').click();
	}
	
	var autoRotatorInit = function() {
		clearInterval(autoRotateTimer);
		autoRotateTimer = setInterval(autoRotate, 10000);
	}
 
	var shuffle = function(o){ //v1.0
		for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
		return o;
	};
				 
	var fetchPhotos = function (photoId, actionId) {
		
		//$('#debug').append('fetchPhotos <br/>');
		var scrollArea = $('div.scrollableArea');
		var photoScroller = $('#photo-scroller');
		
		//scrollArea.hide().html('');
		scrollArea.html('');
		var fader;
		if (Browser.Version() < 9) fader = scrollArea; //inner
		else fader = photoScroller; //outer
		fader.hide();
		
		var url;
		
		if (actionId == undefined) {
			url = '/sliders/both.json';
		} else {
			url = '/sliders/action/' + actionId + '.json';
		}
		
		$.getJSON(url, function(data) {
						
			//shuffle(data[0]);
			//shuffle(data[1]);
			if (data == null) return;
			
			var list = [];
			var i = 0, j = 0;
			var html = '';
			
			for (k = 0; k < 21; k=k+3) {
			
				
				if (data[0][i] == undefined) return;
				if (data[1][j] == undefined) return;
				if (data[0][i]['Recipe'] == undefined) return;
				if (data[1][j]['Tip'] == undefined) return;		
				
				html += '<a href="/recept/' + data[0][i]['Recipe']['id'] + '-' + data[0][i]['Recipe']['slug'] + '" title="' + data[0][i]['Recipe']['title'] + '" rel="recipe"><img width="210" height="100" src="/upload/images/recipe/thumb/small/' + data[0][i]['Recipe']['small_img_file'] + '" /></a>';
				i++;
				if (i >= data[0].length) i = 0;
				html += '<a href="/recept/' + data[0][i]['Recipe']['id'] + '-' + data[0][i]['Recipe']['slug'] + '" title="' + data[0][i]['Recipe']['title'] + '" rel="recipe"><img width="210" height="100" src="/upload/images/recipe/thumb/small/' + data[0][i]['Recipe']['small_img_file'] + '" /></a>';
				i++;
				html += '<a href="/tips-and-tricks/' + data[1][j]['Tip']['id'] + '-' + data[1][j]['Tip']['slug'] + '" title="' + data[1][j]['Tip']['title'] + '" rel="tip"><img width="210" height="100" src="/upload/images/tip/thumb/small/' + data[1][j]['Tip']['small_img_file'] + '" /></a>';
				j++;
				
				if (i >= data[0].length) i = 0;
				if (j >= data[1].length) j = 0;
			}
			
			scrollArea.append(html);
			
			$('div.scrollableArea').find('img').error(function() {
				$(this).attr('src', '/img/nophoto.png');
			})
					
			// Breedte scroller opnieuw berekenen
			//$("div#photo-scroller").smoothDivScroll("recalculateScrollableArea");
		
			// Hover over photos attachen
			attachPhotoHover();
		
			// Scroller infaden
			
			//scrollArea
			fader.dequeue().css('opacity', 1);
			
			fader.fadeIn(3000,function () {
				// Ok klaar, nu foto klik buttons weer actief maken
				photoButtonsDiv.removeAttr('rel');
			});
		});
		
		$('div.photo-text').hide();
		
		var photoButtonsDiv = $('div.photo-buttons');
		
		if (Browser.Version() < 9) {
			$('div.photo-text[photo=' + photoId + ']').dequeue().show();
		} else {
			$('div.photo-text[photo=' + photoId + ']').dequeue().css('opacity', 1).fadeIn('slow',function () {
				
			});
		}
	}
	
	var zIndex = 500;
	
	$('div.photo-buttons a').live('click', function (ev) {

		autoRotatorInit();
		var photoButtonsDiv = $('div.photo-buttons');
		var activePhotoElm = $('div.action-photos img[rel=top]')
		var activePhotoId = activePhotoElm.attr('photo');
		
		// Geklikte foto 
		var clickPhotoId = $(this).attr('photo');
		var clickPhotoNr = $(this).attr('photoNr');
		var actionId = $(this).attr('actionId');
		
		if(!isIos())
		{
			// Flash tonen bij niet Ios
			showFlashItem(clickPhotoNr);
		}
		
		photoButtonsDiv.attr('rel','active');
	
		// Eerst alle actieve li inactief maken
		$('div.photo-buttons ul li').removeAttr('class');
	
		var liElm = $(this).parent();
	
		liElm.attr('class','active');
		var totalPhotos = $('div.action-photos img').length;

		// Slider photos ophalen
		fetchPhotos(clickPhotoId, actionId);

		// Actieve top foto hiden
		activePhotoElm.dequeue();
		activePhotoElm.fadeOut(500,function () {
			$(this).css({'z-index':zIndex--,'position':'absolute'}).fadeIn(1200).removeAttr('rel');
		});

		// Foto op de top zetten
		$('div.action-photos img[photo=' + clickPhotoId + ']').css('z-index',800).attr('rel','top');
		
		autoRotatorInit();
		
		// Standaard actie blokkeren
		ev.preventDefault();
	});
	
	/* De auto rotate timer */
	
	
	$('div.front > .text').hover(function() {
		clearInterval(autoRotateTimer);
	}, autoRotatorInit);
	
	
	$('div#photo-scroller').live('mouseenter', function() { clearInterval(autoRotateTimer); } );
	$('div#photo-scroller').live('mouseleave', autoRotatorInit )
	
	autoRotatorInit();
	fetchPhotos(1, $('div.photo-buttons ul li:first-child a').attr('actionid'));
	
	$('div.photo-buttons ul li:first-child').addClass('active');
	//$('div.photo-buttons ul li:first-child a').click();
	
});