/**
 * Initialize the galleria gallery.
 */

function initialize_galleria(thumbnail, prev, next)
{
	var _overlay_added = false;
	
	// activate the gallery (so it downgrades nicely if javascript is disabled)
	$('.gallery_inactive').addClass('gallery').removeClass('gallery_inactive');
	// add the prev/next links to the thumbnail navigation
	$('.gallery ul').after('<a href="#" class="navi_left" onclick="$.galleria.prev(); return false;"></a>');
	$('.gallery ul').before('<a href="#" class="navi_right" onclick="$.galleria.next(); return false;"></a>');
	// init galleria
	$('.gallery ul').galleria({
		insert: '#bild',
		history: false,
		clickNext: false,
		onImage: function(image, caption, thumb) {
			// fade out all inactive thumbnails and fade in the current one
			var _li = thumb.parents('li');
			_li.siblings().children('img.selected').fadeTo(500, 0.3);
			thumb.fadeTo('fast',1).addClass('selected');
			// we do not need the caption
			caption.remove();
			// add the overlay if not yet done so
			if (!_overlay_added) {
				var _container = $('.galleria_container');
				_container.append($(document.createElement('a')).attr({'class':'galleria_prev_overlay','href':'#'}).click(function(e) { $.galleria.prev(); e.preventDefault(); }));
				_container.append($(document.createElement('a')).attr({'class':'galleria_next_overlay','href':'#'}).click(function(e) { $.galleria.next(); e.preventDefault(); }));
				_overlay_added = true;
			}
			// because the overlay links do not behave properly above the image in IE, we remove the image and show the picture as background of the wrapper
			var _wrapper = $('.galleria_wrapper');
			_wrapper.css({'height':image.height(),'width':image.width(),'background-image':'url('+ image.attr('src') +')'});
			_wrapper.css('display','none').fadeIn(800);
			image.remove();
		},
		onThumb: function(thumb) {
			// fade in/out the thumbnails
			var _li = thumb.parents('li');
			var _fadeTo = _li.is('.active') ? '1' : '0.3';
			// the default is to show the original image as thumbnail, this can be overridden here
			if (thumbnail) {
				thumb.attr('src', thumbnail);
			}
			thumb.css({ height: '11px', width: '7px', marginTop: '2px', marginLeft: 0 });
			thumb.css({ display: 'none', opacity: _fadeTo }).fadeIn(1500);
		},
		onNext: function(wrap) {
			// if we wrap (i.e. after the last image) and we have a next link, we redirect
			if (next && wrap) {
				document.location.href = next;
			}
			return wrap; // because we do not want to wrap we cancel galleria.next()
		},
		onPrev: function(wrap) {
			if (prev && wrap) {
				document.location.href = prev;
			}
			return wrap;
		}
	});
}

