function init(){

	$('diaporama-navleft').addEvent('click', function() { slide('left'); });
	$('diaporama-navright').addEvent('click', function() { slide('right'); });
	
	$('diaporama-thumbs').getElements('img').each(function(img){
		addHoverDiapoThumbs(img);
	});
}

function loadPage(page){
	var req = new Request.HTML({
		method: 'get',
		url: $('diaporama-ajaxurl').value,
		data: {
			'tx_ggkbarbu_pi1[ajax]' : '1',
			'tx_ggkbarbu_pi1[action]' : 'getThumbs',
			'tx_ggkbarbu_pi1[page]' : page
		},
		onComplete: function(responseTree, responseElements, responseHTML, responseJavaScript){
			var newWidth = parseInt($('diaporama-thumbs').getStyle('width'))+parseInt($('diaporama-thumbswrap').getStyle('width'));
			$('diaporama-thumbs').setStyle('width', newWidth);
			var newId = 'diaporama-thumbs-page'+page;
			var pagediv = new Element('div', {id: 'diaporama-thumbs-page'+page});
			pagediv.setStyle('float','left');
			pagediv.inject($('diaporama-thumbs'));
			$(newId).innerHTML = responseHTML;
		}
	}).send();
}

function addHoverDiapoThumbs(img){
	
		var hoverDiapoImg = new Element('div', {class: 'hoverDiapoImg'});
		hoverDiapoImg.setStyles({
			position: 'absolute',
			opacity: '0',
			textAlign: 'center',
			zIndex: '0',
			width: '168px',
			padding: '10px',
			color: '#000000',
			fontWeight: 'bold'
		});
		hoverDiapoImg.innerHTML=img.getProperty('alt');
		hoverDiapoImg.inject(img, 'before');
	
		img.addEvents({
			mouseenter: function(){	
				new Fx.Morph(this, {duration: 200}).start({
					'opacity': 0.4
				});
				hoverDiapoImg.setStyle('top', (this.getPosition().y+40)+'px');
				hoverDiapoImg.setStyle('left', this.getPosition().x+'px');
				new Fx.Morph(hoverDiapoImg, {duration: 200}).start({
					'opacity': 1
				});
			},
			mouseleave: function(){
				new Fx.Morph(this, {duration: 200}).start({
					'opacity': 1
				});
				new Fx.Morph(hoverDiapoImg, {duration: 200}).start({
					'opacity': 0
				});
			}
		});
}

function slide(direction){

	var width = $('diaporama-thumbswrap').getStyle('width');
	var margin = $('diaporama-thumbswrap').getStyle('margin');
	var curpage = parseInt($('diaporama-curpage').value);
	var newpage = direction=='left' ? curpage-1 : curpage+1;
	
	var boxwidth = parseInt(width.substr(0,width.length-2))+2*parseInt(margin.substr(0,margin.length-2));
	var newmargin = newpage*(-1)*boxwidth;
	
	var leftStop = curpage <= 0 && direction == 'left';
	var rightStop = curpage >= parseInt($('diaporama-maxpage').value) && direction == 'right';
	
	if(!rightStop && !leftStop){
		var d = direction == 'left' ? -1 : 1;
		$('diaporama-thumbs').tween('margin-left', newmargin);
		$('diaporama-curpage').value = newpage;
	}
	
	if(newpage < parseInt($('diaporama-maxpage').value) && direction == 'right' && $('diaporama-full').value==0){
		loadPage(newpage+1);
	}else{
		$('diaporama-full').value = 1;
	}
}

window.addEvent('load', function() { init(); });