function gallery_changeImage(nFile, cat) {
	var newFile = 'images/galerie/' + cat + '/' + nFile + '.jpg';
	
	var newImg = $('<img>');
	newImg.css('display', 'none');
	newImg.attr('class', 'image');
	newImg.attr('src', newFile);
	newImg.attr('alt', nFile);
	newImg.data('diashow', $('#image img.image').data('diashow'));
	newImg.click(function() {
		gallery_diashow(cat);
	});
	
	
	$('#image img.load').fadeIn(250);
	newImg.load(function() {
		$('#image img.load').fadeOut(250);
		
		$('#image > img.image').fadeOut(250, function() {
			$(this).replaceWith(newImg);
			
			newImg.fadeIn(750);
		});
	});
}

function gallery_nextImage(cat) {
	var curTitle = $('#image > img.image').attr('alt');
	var title = $('#carousel > li > a[title="' + curTitle + '"]')
		.parent()
		.next('li')
		.find('a')
		.attr('title');
	
	// last image, start with the first
	if(title == undefined) {
		title = $('#carousel > li > a:first').attr('title');
	}
	
	gallery_changeImage(title, cat);
}


function gallery_diashow(cat) {
	if($('#image > img.image').data('diashow') == null) {
		$('#image > img.play').fadeIn(500, function() {
			$(this).fadeOut(500);
		});
		
		$('#image > img.image').data('diashow', setInterval(function(){
			gallery_nextImage(cat);
		}, 8000));
	} else {
		clearInterval($('#image > img.image').data('diashow'));
		$('#image > img.image').data('diashow', null);
		
		$('#image > img.pause').fadeIn(500, function() {
			$(this).fadeOut(500);
		});
	}
}

function genGallery(cat) {
	// jCarousel
    var carousel = $('#carousel').jcarousel({
        scroll: 3,
        auto: 5,
        animation: 'slow',
        wrap: 'last',
		initCallback: function(carousel) {
		    carousel.buttonNext.bind('click', function() {
		        carousel.startAuto(0);
		    });
		    carousel.buttonPrev.bind('click', function() {
		        carousel.startAuto(0);
		    });
			
		    carousel.clip.hover(function() {
		        carousel.stopAuto();
		    }, function() {
		        carousel.startAuto();
		    });
		}
    });
	
	// show image on click
	$('#carousel > li > a').click(function() {
		gallery_changeImage($(this).attr('title'), cat);
		
		return false;
	});
	
	// diashow
	$('#image > img.image').data('diashow', null);
	$('#image > img.image').click(function(){
		gallery_diashow(cat);
	});
}

