(function($) {
	var imgList = [];
	$.extend({
		preload: function(imgArr, option) {
			var setting = $.extend({
				init: function(loaded, total) {},
				loaded: function(img, loaded, total) {},
				loaded_all: function(loaded, total) {}
			}, option);
			var total = imgArr.length;
			var loaded = 0;
			
			setting.init(0, total);
			for(var i in imgArr) {
				imgList.push($("<img />")
					.attr("src", imgArr[i])
					.load(function() {
						loaded++;
						setting.loaded(this, loaded, total);
						if(loaded == total) {
							setting.loaded_all(loaded, total);
						}
					})
				);
			}
			
		}
	});
})(jQuery);


$(function(){
	
	var pattern = /url\(|\)|"|'/g;
	var preloader = new Image();
	
	$.preload([
        $("#slideshow div:first-child").css('background-image').replace(pattern,"")
    ], {
        init: function(loaded, total) {
        },
        loaded: function(img, loaded, total) {
            $('#container').css('background-image', 'none');
			$('#slider').fadeIn(800);
        },
        loaded_all: function(loaded, total) {
        }
    });
	
	// slidemode
	$('#container').hover(function(){
		$('.slidemode').fadeIn('500');
	}, function(){
		$('.slidemode').fadeOut('500');
	});		
		
	// open menu
	$('#toggle-menu').click(function(){
		
		$('#menu').fadeIn(500);
	});
	
	// delay mouseout
	$('#menu').hover(function(){
			
		clearTimeout($('#menu').data('timeoutId'));	
				
	}, function(){
		
		timeoutId = setTimeout(function(){ $('#menu').fadeOut(500);}, 360);
		$('#menu').data('timeoutId', timeoutId);
		
	});
	
	// choose category
	$('#category a').click(function(){
		$('#category a, #imprint').removeClass('current');
		$(this).addClass('current');
		
		var choosenCategory = $(this).attr('rel');
		$('#album').show(0);
		$('#album .album-container, #page-imprint').hide(0);
		$('#'+choosenCategory).fadeIn(500);
	});
	
	// imprint
	$('#imprint').click(function(){
		$('#category a').removeClass('current');
		$(this).addClass('current');
		
		$('#album').hide(0);
		$('#page-imprint').fadeIn(500);
	});	
	
	// set hover
	$('#album li').hover(function(){
		$(this).toggleClass('hover');
	});
	
	// set current
	$('#album li').click(function(){
		$('#album li').removeClass('current');
		$(this).addClass('current');
		$('#menu').fadeOut(500);
	});
	
	// sldeshow
	$("#slideshow").cycle({
		fx: 'fade',
		speed: 800,
		next: '.next',
		prev: '.prev',
		timeout: 0,
		nowrap: 1,
		after:  function(curr,next,opts) {
			
			bgColor = $('li.current input[name=color]').val();
			
			$('body').animate({backgroundColor: bgColor}, 1250);
						
			$(this).attr('class', 'in-view');
			$('#album-info').text($(this).attr('rel'));
			
			//check if last image in album
			if(opts.currSlide == (opts.slideCount-1)){
				
				$('#slider .next').one('click.cycle', function(){
					// last album in category?
					if(!$('#album li.current').next().length){
						// go to first
						$('#album li.current').parent().children('li:first-child').trigger('click');
					} else {
						// go to next
						$('#album li.current').next().trigger('click');
					}
				});				
			}
			if(opts.currSlide == 0){
				$('#slider .prev').hide(0);
				$('#slider .prev').addClass('zeroslide');
				
			} else if(opts.currSlide == 1) {
				if($('#slider .prev').hasClass('zeroslide')) {
					$('#slider .prev').show(0).children().hide(0);
					$('#slider .prev').removeClass('zeroslide');
				}
			}
			
		},
		before:  function(curr,next,opts) {
			$('#slideshow div').removeAttr('class');			
		}		

	});
	
	
	// slider albums
    jQuery('ul.slideable').jcarousel({
        vertical: true,
        scroll: 4
    });
	
	//control by keys
	$(document).bind('keyup', function(e) {
    if (e.keyCode == 37)
        $('#slider .prev').trigger('click.cycle');
     else if (e.keyCode == 39)
        $('#slider .next').trigger('click.cycle');
	});

	// slider navigation
	$('#slider .prev, #slider .next').hover(function(){
		currentNav = '.'+ $(this).attr('class');
		$(currentNav +' img').fadeIn(100);
	},function(){
		$(currentNav +' img').fadeOut(100);
	});
	
	// load images from album
	$('#album li').click(function() {
		
		var album_directory = 'categories/'+$(this).attr('rel')+'/';
				
		$('#slideshow div.in-view').fadeOut(400, function(){
			$('#slideshow').html('');
			
			bgColor = $('li.current input[name=color]').val();
			
			$('li.current').children('input[name!=color]').each(function(){
				var image_url = $(this).val();
				var image_title = $(this).attr('rel');
								
				$('#slideshow').append('<div style="background: url('+album_directory+image_url+'); display: none;" rel="'+ image_title +'"></div>');

				if($(this).next().length == 0){
					
					$('#slideshow div:first').fadeIn(400, function(){						
						
						$("#slideshow").cycle('destroy');
						
						$("#slideshow").cycle({
							fx: 'fade',
							speed: 800,
							next: '.next',
							prev: '.prev',
							timeout: 0,
							nowrap: 1,
							after:  function(curr,next,opts) {
								
								//console.log('Slide '+opts.currSlide+ ' of '+(opts.slideCount-1));
								
								$(this).attr('class', 'in-view');
								$('#album-info').text($(this).attr('rel'));
								
								//check if last image in album
								if(opts.currSlide == (opts.slideCount-1)){
									
									$('#slider .next').one('click.cycle', function(){
										// last album in category?
										if(!$('#album li.current').next().length){
											// go to first
											$('#album li.current').parent().children('li:first-child').trigger('click');
										} else {
											// go to next
											$('#album li.current').next().trigger('click');
										}
									});				
								}
								
								if(opts.currSlide == 0){
									$('#slider .prev').hide(0);
									$('#slider .prev').addClass('zeroslide');
									
								} else if(opts.currSlide == 1) {
									if($('#slider .prev').hasClass('zeroslide')) {
										$('#slider .prev').show(0).children().hide(0);
										$('#slider .prev').removeClass('zeroslide');
									}
								}
																
							},
							before:  function() {
								$('body').animate({backgroundColor: bgColor}, 1250);
								$('#slideshow div').removeAttr('class');								
							}		
	
						});
						
					});	
								
				}
				
			});
			
		});
		
		
	});		
	
});