﻿var galleryImages = [];
var galleryWidth = 0;
var imgSetCount = 4;
var imgSets = -1;
var currentImgSet = -1;
var imgWidth = 126;
var imgSpacing = 30;
var imgBorder = 1;
var currentStartIndex = 0;
var lockMovement = false;

function addImage(thumbSrc, largeSrc, description) {
	var imgObj = {thumb:thumbSrc, large:largeSrc, descr:description}
	galleryImages.push(imgObj);
}

function drawGallery(gId) {
	var galleryElement = document.getElementById(gId);

	galleryWidth = imgSetCount*(imgWidth+(2*imgBorder)) + (imgSetCount-1)*imgSpacing;
	imgSets = Math.ceil(galleryImages.length / imgSetCount);

	var htmlStr = [];
	htmlStr.push('<div class="galleryPane" style="width:'+galleryWidth+'px"><table cellspacing="0" cellpadding="0" border="0"><tr>');
	for(var i = 0; i < galleryImages.length; i++) {
		if(i > 0) htmlStr.push('<td></td>');
		htmlStr.push('<td align="center" valign="middle" width="'+(imgWidth+2*imgBorder)+'"><a href="'+galleryImages[i].large+'" rel="lightbox[0]"><img src="'+galleryImages[i].thumb+'" border="0" class="galleryImg"></a></td>');
	}
	htmlStr.push('</tr><tr>');
	for(var i = 0; i < galleryImages.length; i++) {
		if(i > 0) htmlStr.push('<td width="'+imgSpacing+'"><img src="/images/spacer.gif" width="'+imgSpacing+'" height="1" /></td>');
		htmlStr.push('<td width="'+imgWidth+'"><img src="/images/spacer.gif" width="'+imgWidth+'" height="1" /></td>');
	}
	htmlStr.push('</tr></table></div>');

	htmlStr.push('<table cellspacing="0" cellpadding="0" border="0" width="'+galleryWidth+'"><tr>');
	htmlStr.push('<td><span class="switchImgLink" onclick="flipImages(\''+gId+'\',\'prev\')" id="'+gId+'Prev">letzte Bilder</span></td>');
	htmlStr.push('<td align="center" id="'+gId+'Info" class="imgInfo"></td>');
	htmlStr.push('<td align="right"><span class="switchImgLink" onclick="flipImages(\''+gId+'\',\'next\')" id="'+gId+'Next">n&auml;chste Bilder</span></td>');
	htmlStr.push('</tr></table>');
	galleryElement.innerHTML = htmlStr.join("");
	// write the info
	currentImgSet = 0;
	writeSetInfo(gId);
	
	// update lightbox
	// if(myLightbox != null) myLightbox.updateImageList();
}

function writeSetInfo(gId) {
	var galleryInfo = document.getElementById(gId+'Info');
	
	var firstImg = (currentImgSet * imgSetCount) + 1;
	var lastImg = Math.min(firstImg + imgSetCount - 1, galleryImages.length);
	
	if(firstImg == lastImg) galleryInfo.innerHTML = 'Bild ' + lastImg + ' / ' + galleryImages.length;
	else galleryInfo.innerHTML = 'Bilder ' + firstImg + ' - ' + lastImg + ' / ' + galleryImages.length;
	
	// do we need to hide the links?
	$(gId+'Prev').style.visibility = (firstImg == 1) ? 'hidden' : 'visible';
	$(gId+'Next').style.visibility = (lastImg == galleryImages.length) ? 'hidden' : 'visible';
}

function flipImages(gId, direction) {
	if(lockMovement) return;

	var galleryTable = document.getElementById(gId).childNodes[0].childNodes[0];
	var galleryTablePos = parseFloat(galleryTable.style.left || 0);
	var galleryTableWidth = galleryTable.offsetWidth;

	if(direction == 'prev' && galleryTablePos < 0) {
		// move right
		lockMovement = true;
		new Effect.Move (galleryTable, {x: Math.min(galleryWidth+imgSpacing,-galleryTablePos), y: 0, mode: 'relative', afterFinish: doneMoving});
		currentImgSet--;
	}
	else if(direction == 'next' && (galleryTablePos+galleryTableWidth) > galleryWidth) {
		// move left
		lockMovement = true;
		new Effect.Move (galleryTable, {x: -galleryWidth-imgSpacing, y: 0, mode: 'relative', afterFinish: doneMoving});
		currentImgSet++;
	}
	writeSetInfo(gId);
}

function doneMoving() {
	lockMovement = false;
}
