var supersize = 0;
function resizeGallery(){
	if(supersize == 0){
		$('div#image_cont img').supersize({over:0});
	} else {
		$('div#image_cont img').supersize();
		$('div.galleria_wrapper').mousescroll({scroll_Y:1,smooth:10,mouseY:0});
	}
}
function initGallery() {
	
	var mouseX = $(window).width();
	var mouseY = $(window).height();
	var load = 0;
	
	//show Loader
	$('#loading').css({display: "block"});
	
	$('#image_cont').unbind().bind('click', function(e) {
		mouseX = e.pageX; 
		mouseY = e.pageY;
		if($('ul.thumb_container').length != 0) {
			$('#loading').css({display: "block"});
			$.galleria.next();
		}
	});
	$('#toggle').unbind().bind('click', function(e) {
		mouseX = e.pageX; 
		mouseY = e.pageY;
		if(supersize == 1){
			$('div#image_cont img').supersize({over:0});
			$(this).removeClass('small');
			$(this).addClass('big');
			supersize = 0;
		} else {
			$('div#image_cont img').supersize();
			$('div.galleria_wrapper').mousescroll({scroll_Y:1,smooth:10,mouseY:mouseY});
			$(this).removeClass('big');
			$(this).addClass('small');
			supersize = 1;
		}
	});
	
	$('#left').unbind().bind('click', function(e) {
		mouseX = e.pageX; 
		mouseY = e.pageY;
		if($('ul.thumb_container').length != 0) {
			//show Loader
			$('#loading').css({display: "block"});
			$.galleria.prev();
		}
	});
	
	$('#right').unbind().bind('click', function(e) {
		mouseX = e.pageX; 
		mouseY = e.pageY;
		if($('ul.thumb_container').length != 0) {
			//show Loader
			$('#loading').css({display: "block"});
			$.galleria.next();
		}
	});
	
	$('div#image_cont').html('').fadeIn(0);
	$('#logo_main').fadeOut(500);
	if(parseInt($('#side').css('margin-left')) < 0) {
		$('#side').css('margin-left',($('#side').width())*(-1)).animate({marginLeft:0},500);
	}
	$('.img_nav').fadeIn(500);
	$('div#thumbs').mousescroll({scroll_X:1,smooth:6});
	$('ul.thumb_container').galleria({
		history   : false, // activates the history object for bookmarking, back-button etc.
		clickNext : false, // helper for making the image clickable
		insert    : '#image_cont', // the containing selector for our main image
		onImage   : function(image,caption,thumb) { // let's add some image effects for demonstration purposes
			// fade in the image & caption
			image.css('display','none');
			
			//hide Loader
			$('#loading').css({display: "none"});
			
			if(supersize == 1){
				image.supersize();
				$('div.galleria_wrapper').mousescroll({scroll_Y:1,smooth:10,mouseY:mouseY});
			} else {
				image.supersize({over:0});
				//colorize the background
				//var to_color = $('ul.thumb_container img[rel='+image.attr('src')+']').attr('rev');
				//$('#main').animate({ backgroundColor: to_color }, 1500);
			}
			
			//GET Image attributes
			var alt = $('ul.thumb_container img[rel='+image.attr('src')+']').attr('alt');
			var altArray = alt.split('###');
			var Model = (altArray[0] == '') ? 'by Peter Grillmair' : altArray[0];
			
			$('#img_header').stop().html(Model).jTypeWriter({duration:1});
			$('#img_title').stop().html(altArray[1]).jTypeWriter({duration:1});
			
			//$('#img_model').html(Model);
			//$('#img_title').html(altArray[1]);
			//$('#main').animate({ backgroundColor: to_color }, 1500);
			
			$('#ausgabe').html(mouseY);
			$.timer(200,function(){
				//fade in Image
				image.fadeIn(1000);
			});
			

			// fetch the thumbnail container
			var _li = thumb.parents('li');
			
			// fade out inactive thumbnail
			_li.siblings().children('img.selected').fadeTo(500,0.5);
			
			// fade in active thumbnail
			thumb.fadeTo('fast',1).addClass('selected');
		},
		onThumb : function(thumb) { // thumbnail effects goes here
			
			// fetch the thumbnail container
			var _li = thumb.parents('li');
			
			//fetch the position of thumb
			var pos = _li.parent().children().index(_li);
			
			//load first image
			if(load == 0 && pos == 0){
				load = 1;
				thumb.trigger('click');
			}
			
			// if thumbnail is active, fade all the way.
			var _fadeTo = _li.is('.active') ? '1' : '0.5';
			
			// fade in the thumbnail when finnished loading
			thumb.css({opacity:_fadeTo});
			
		}
	});
}

//Scroll Contents by Mousemovement
$.fn.mousescroll = function(options) {
	var defaults = {
		scroll_X: 	0,
		scroll_Y: 	0,
		smooth:		6,
		mouseX:		0,
		mouseY:		0
	};
	var options = $.extend(defaults, options);
	
	var mouseX = options.mouseX;
	var mouseY = options.mouseY;
	var container = $(this);
	var object = $(this).find(':first') ;
	var inner_width = object.outerWidth();
	var inner_height = object.outerHeight();
	var deltaX = 0;
	var deltaY = 0;
	
	var timeout;
	var moving = 1;
	
	//set margin
	if(mouseY != 0){
		object.css('margin-top', '-' + Math.round((inner_height - container.height())/(container.height()/mouseY)) + 'px');
	}
	
	$('#ausgabe').html(Math.round((inner_height - container.height())/(container.height()/mouseY)));
	
	moveContent();
	
	$(this).mousemove(function(e){
		mouseX = e.pageX; 
		mouseY = e.pageY;
		if(moving == 0){
			moving = 1;
			moveContent();
		}
	}); 

	function moveContent() {
		inner_width = object.outerWidth();
		inner_height = object.outerHeight();
		timeout = setTimeout ( moveContent , 50);
		moving = 1;
		
		cssObject = {};

		if(options.scroll_Y == 1){
			marginY_to = 	Math.round((inner_height - container.height())/(container.height()/mouseY));
			marginY_from =	parseInt(object.css('margin-top'))*(-1);
			if(!isInt(marginY_from)){
				marginY_from = 0;
			}
			marginY = Math.round(marginY_from + ((marginY_to - marginY_from)/options.smooth));
			cssObject.marginTop = '-' + marginY + 'px';
			object.css(cssObject);
			deltaY = marginY_from - marginY;
		}
		if(options.scroll_X == 1){
			marginX_to = 	Math.round((inner_width - container.width())/(container.width()/mouseX));
			marginX_from =	parseInt(object.css('margin-left'))*(-1);
			if(!isInt(marginX_from)){
				marginX_from = 0;
			}
			marginX = Math.round(marginX_from + ((marginX_to - marginX_from)/options.smooth));
			cssObject.marginLeft = '-' + marginX + 'px';
			object.css(cssObject);
			deltaX = marginX_from - marginX;
		} 
		//$('#ausgabe').html('mouseY:'+mouseY+' deltaX:'+deltaY+' marginX:'+marginX+' inner_width:'+inner_width+' timeout:'+timeout);
		if(deltaX == 0 && deltaY == 0){
			clearTimeout (timeout);
			moving = 0;
		}
	}
	
	//checks if value is integer
    function isInt(n){
        var reInt = new RegExp(/^-?\d+$/);
        if (!reInt.test(n)) {
            return false;
        }
        return true;
    } 
};

//Adjust image size
$.fn.supersize = function(options) {
	var defaults = {
		over: 		1
	};
	var options = $.extend(defaults, options);

	//Gather browser and current image size
	var imagewidth = $(this).width();
	var imageheight = $(this).height();
	var browserwidth = $(this).parent().width();
	var browserheight = $(this).parent().height();
	var ratio = imageheight/imagewidth;

	//Resize image to proper ratio
	if (options.over == 0){
		$('#image_cont').removeClass('supersize');
		$('#image_cont').addClass('imgsize');
		$('#image_cont').css('width',(browserheight / ratio)+160);
		$('#image_cont').css('margin-left',(((browserheight / ratio)+160)/2)*(-1) - 30);
		$('#img_before').remove();
		$('#img_after').remove();
		var before = $(document.createElement('div')).attr('id', 'img_before');
		var after = $(document.createElement('div')).attr('id', 'img_after');
		var img = $(document.createElement('img')).attr('src', 'img/logo_up.png');
		$(after).append(img);
		$(this).before(before);
		$(this).after(after);
		$('#side-top').animate({height: '10'},400);
		var browserwidth = $('#image_cont').find('.galleria_wrapper').width();
		var browserheight = $('#image_cont').find('.galleria_wrapper').height();
		$(this).height(browserheight);
		$(this).width(browserheight / ratio);
		$(this).children().height(browserheight);
		$(this).children().width(browserheight / ratio);
	} else {
		$('#image_cont').removeAttr('style');
		$('#image_cont').removeClass('imgsize');
		$('#image_cont').addClass('supersize');
		$('#img_before').remove();
		$('#img_after').remove();
		//$('#image_cont').css('width','100%');
		var browserwidth = $('#image_cont').find('.galleria_wrapper').width();
		var browserheight = $('#image_cont').find('.galleria_wrapper').height();
		$(this).width(browserwidth);
		$(this).height(browserwidth * ratio);
		$(this).children().width(browserwidth);
		$(this).children().height(browserwidth * ratio);
		$('#side-top').animate({height: '43'},400);
	}
	
	//center
	$(this).css('margin-top', (browserheight - $(this).height())/2);
	//alert($(this).width());
	//$(this).css('margin-left', parseInt(browserwidth/2) - parseInt($(this).width()/2));
	return false;
};