/* Gibt an, um wie weit die Thumbnails beim Klick auf einen Pfeil gescrollt
   werden. Im Normalfall stimmt dies mit der Breite von #galerie-thumbnails überein. */
galleryThumbnailsScrollBy = 625;
/* Länge des Überblendeffektes in Sekunden */
galleryImageFadeDuration = 2.5;
/* Dauer des Scrolleffektes */
galleryImageScrollDuration = 1.5;
/* HTML-Code für weiter/zurück-Links */
galleryLinkNext = '<img src="../bilder/rechts.png" alt="vorwärts" name="vorwärts" />';
galleryLinkPrevious = '<img src="../bilder/links.png" alt="zurück" name="zurück" />';

galleryImages = [];
galleryDisplayed = 1;
galleryDescriptionPaths = [];


function gallerySetupImg(img)
{
	Event.observe(img, "mouseover", galleryImageMouseover);
	Event.observe(img, "mouseout", galleryImageMouseout);
}

galleryThumbIndex = 1;
function gallerySetupThumb(img)
{
	Event.observe(img, "mouseover", galleryThumbMouseover);
	Event.observe(img, "mouseout", galleryThumbMouseout);
	img.thumbID = galleryThumbIndex;
	if(galleryThumbIndex != galleryDisplayed)
		galleryThumbInactivate(img);
	galleryThumbIndex = galleryThumbIndex + 1;
}

function galleryImageMouseover(ev)
{
	el = Event.element(ev);
	el.src = el.src.replace("-inaktiv", "-aktiv");
}

function galleryImageMouseout(ev)
{
	el = Event.element(ev);
	if(galleryGetNumber(el.parentNode) != galleryDisplayed)
		el.src = el.src.replace("-aktiv", "-inaktiv");
}

function galleryThumbMouseover(ev) {
	if(this.thumbID != galleryDisplayed)
		galleryThumbActivate(this);
}

function galleryThumbMouseout(ev) {
	if(this.thumbID != galleryDisplayed)
		galleryThumbInactivate(this);
}

function galleryThumbActivate(thumb) {
	scopeID = "thumb"+thumb.thumbID;
	new Effect.Appear(thumb, {from: 0.3, to: 1, duration: 0.35, queue: {position:"end", scope: scopeID}});
}

function galleryThumbInactivate(thumb) {
	scopeID = "thumb"+thumb.thumbID;
	new Effect.Fade(thumb, {from: 1, to: 0.3, duration: 0.35, queue: {position:"end", scope: scopeID}});
}

function galleryLoad()
{
	$$("#galerie-navigation img").each(gallerySetupImg);
	$$("#galerie-thumbnails img").each(gallerySetupThumb);
	$$("#galerie-navigation a, #galerie-thumbnails a").each(gallerySetupLink);

	if($("galerie-navigation")) {
		linkprev = $("galerie-zurueck");
		linknext = $("galerie-vorwaerts");
	
		linkprev.href = "#";
		linknext.href = "#";
		
		Event.observe(linkprev, "click", galleryPrevious);
		Event.observe(linknext, "click", galleryNext);
	}
	
	if($("galerie-navigation") || $("galerie-thumbnails")) {
		startat = galleryGetNumber(document.location.hash);
		if(startat != null)
			galleryDisplay(startat, true);
	}
	
	if($("galerie-thumbnails-container")) {
		$("galerie-thumbnails-container").setStyle({overflowX: "hidden"});
		
		var gt_scroll_rechts = new Element('div', { 'id': 'galerie-thumbnails-scroll-rechts', 'class': 'galerie-thumbnails-scroll' }).update(galleryLinkNext);
		$("unten").appendChild(gt_scroll_rechts);
		var gt_scroll_links = new Element('div', { 'id': 'galerie-thumbnails-scroll-links', 'class': 'galerie-thumbnails-scroll' }).update(galleryLinkPrevious);
		$("unten").appendChild(gt_scroll_links);
		
		Event.observe(gt_scroll_rechts, "click", function() {
			galleryThumbnailSmoothScroll($("galerie-thumbnails-container").scrollLeft + galleryThumbnailsScrollBy);
		});
		
		Event.observe(gt_scroll_links, "click", function() {
			galleryThumbnailSmoothScroll($("galerie-thumbnails-container").scrollLeft - galleryThumbnailsScrollBy);
		});
	}
}

function galleryThumbnailEnsureVisible(thumb) {
	var thumb_x = thumb.positionedOffset()[0];
	var tnc = $("galerie-thumbnails-container");
	if(thumb_x < tnc.scrollLeft)
		galleryThumbnailSmoothScroll(thumb_x - 5);
	else if(thumb_x + thumb.getWidth() > tnc.scrollLeft + tnc.getWidth())
		galleryThumbnailSmoothScroll(thumb_x - tnc.getWidth() + thumb.getWidth() + 5);
}

function galleryThumbnailSmoothScroll(position) {
	var scrollMin = 0;
	var scrollMax = $("galerie-thumbnails").getWidth() - $("galerie-thumbnails-container").getWidth();
	
	if(position < scrollMin) position = scrollMin;
	if(position > scrollMax) position = scrollMax;
	
	return new Effect.Tween(
		'galerie-thumbnails-container',
		$("galerie-thumbnails-container").scrollLeft,
		position,
		{ duration: galleryImageScrollDuration },
		function(p){this.scrollTo(p, 0)}
	);
}

function galleryPrevious() {
	if(galleryDisplayed > 1)
		galleryDisplay(galleryDisplayed-1);
}

function galleryNext() {
	if(galleryDisplayed < galleryImages.length)
		galleryDisplay(galleryDisplayed+1);
}

function gallerySetupLink(link)
{
	id = galleryGetNumber(link);
	if (id != null) {
		link.href = "#bild" + id;

		Event.observe(link, "click", galleryLinkClick);
	}
}

function galleryGetNumber(link) {
	if(link.href != null)
		subject = link.href;
	else
		subject = link;

	match = subject.match(/[\?#]bild(\d+)$/);
	if (match != null) {
		return parseInt(match[1]);
	} else {
		return null;
	}
}

function galleryDisplay(id, noanim) {
	if(galleryDisplayed == id)
		return;
	
	var ga_alt = $("galerie-grossansicht");
	ga_alt.id = "galerie-grossansicht-alt";
	
	ga_alt.absolutize();
	
	var ga_neu = document.createElement("img");
	ga_neu.id = "galerie-grossansicht";
	$("inhalt-haupt").appendChild(ga_neu);
	
	if(!noanim) {
		$("galerie-grossansicht").hide();
		Effect.Queues.get("galerie-grossansicht").each(function(effect) { effect.cancel() });
	}
	
	Event.observe("galerie-grossansicht", "load", galleryImageLoaded);
	
	galleryDisplayedOld = galleryDisplayed;
	galleryDisplayed = id;
	
	$("galerie-grossansicht").src = galleryImages[galleryDisplayed-1];

	if($("galerie-thumbnails"))
	{
		galleryThumbInactivate($$("#galerie-thumbnails img")[galleryDisplayedOld-1]);
		var nt = $$("#galerie-thumbnails img")[galleryDisplayed-1];
		galleryThumbActivate(nt);
		galleryThumbnailEnsureVisible(nt);
	}
	
	/*if($("galerie-navigation"))
	{
		$$("#galerie-navigation img")[galleryDisplayedOld].src = $$("#galerie-navigation img")[galleryDisplayedOld].src.replace("-aktiv", "-inaktiv");
		$$("#galerie-navigation img")[galleryDisplayed].src = $$("#galerie-navigation img")[galleryDisplayed].src.replace("-inaktiv", "-aktiv");
	}*/
	
	if(galleryDescriptionPaths.length > 0)
		galleryUpdateDescription();
}

function galleryUpdateDescription() {
	desc_available = $$(".galerie-beschreibung");
	lastactive = null;
	desc_available.each(function(desc){
		if(desc.style.display != "none")
			lastactive = desc;
	});
	
	for(i = 0; i < galleryDescriptionPaths.length; i++) {
		if(galleryImages[galleryDisplayed-1].indexOf(galleryDescriptionPaths[i]+"/") == 0)
		{
			if(desc_available[i] != lastactive)
			{
				if(lastactive != null)
					new Effect.Fade(lastactive, { duration: 0.25, queue: {position:"end", scope: "description"} });
				new Effect.Appear(desc_available[i], { duration: 0.25, queue: {position:"end", scope: "description"} });
			}
			
			return;
		}
	}
	
	if(lastactive != null)
		new Effect.Fade(lastactive, { duration: 0.25, queue: {position:"end", scope: "description"} });
	
}

function galleryLinkClick(ev)
{
	id = galleryGetNumber(this);
	if (id != null)
		galleryDisplay(id);
}

function galleryImageLoaded(ev)
{
	Event.stopObserving("galerie-grossansicht", "load");
	
	$("galerie-grossansicht-alt").fade({duration: galleryImageFadeDuration, afterFinish: galleryDestroyOldImage});
	
	if (navigator.userAgent.indexOf('Safari')!=-1) {
		var newImg = new Image();
		newImg.src = this.src;
		this.width = newImg.width;
		this.height = newImg.height;
	}
	
	//$("galerie-grossansicht").setStyle({marginTop: ((450-this.height)/2) + "px"});
	$("galerie-grossansicht").appear({
		from: 0,
		to: 1,
		duration: galleryImageFadeDuration,
		queue: {position: "end", scope: "galerie-grossansicht"}
	});
}

function galleryDestroyOldImage()
{
	$("galerie-grossansicht-alt").remove();
}

// http://www.garyharan.com/index.php/2007/11/26/how-to-unobtrusively-scroll-a-div-with-prototype-scriptaculous/
Element.addMethods({
  scrollTo: function(element, left, top){
	var element = $(element);
	if (arguments.length == 1){
	  var pos = element.cumulativeOffset();
	  window.scrollTo(pos[0], pos[1]);
	} else {
	  element.scrollLeft = left;
	  element.scrollTop  = top;
	}
	return element;
  }
});

resolveURL = document.location.href.replace(/\?bild(\d+)/, "#bild$1");
if(resolveURL != document.location.href)
	document.location.href = resolveURL;

Event.observe(window, "load", galleryLoad);