/**
 * @author dtardia
 */
/**
 * Need MooTools framework core v:1.2
 * @author dtardia
 */
var loaded_thumbs = 0;
var selectedIndex = 0;
var oldSelectedIndex = selectedIndex;
var space = 5;
var container_cropper_name;
var desc_name;
var startX;
var images;
var ibig_c;

var setBar = function (container,ibig_container,desc_container,pimages){
	images = pimages;
	container_cropper_name = container;
	ibig_c = ibig_container;
	desc_name = desc_container;
	if ($(container_cropper_name)) {
		$(container_cropper_name).setStyle('float', 'left');
		$(container_cropper_name).setStyle('overflow', 'hidden');
		$(container_cropper_name).setStyle('position', 'relative');
		//$(container_cropper_name).setStyle('background-color', '#ffff00');
		if (images.length > 0) {
			if ($(ibig_container)) {
				$(ibig_container).setStyle('position', 'relative');
				$(ibig_container).setStyle('background', 'url(/images/loader.gif) no-repeat');
				$(ibig_container).setStyle('background-position', ($(ibig_container).getSize().x - 16) / 2 + 'px ' + ($(ibig_container).getSize().y - 16) / 2 + 'px');
				var ibig = new Element('img', {
					'id': 'image_big',
					//'src': images[selectedIndex].url,
					'styles': {
						'opacity': '0',
						'position': 'relative',
						'z-index': '100'
					}
				})
				var imgBigCheckRequest = new Request({url:images[selectedIndex].url,				
					method:'HEAD',
					onSuccess: function(txt) {
						this.img.setProperty('src',this.options.url);
						$(desc_name).setProperty('html','<p>'+images[selectedIndex].description+'</p>');
						this.img.tween('opacity', 1);
						$(ibig_container).setStyle('background-image', 'none');
					},
					onFailure: function() {
						//alert("onFailure");
					},
					onException: function(headerName, value){
						alert(headerName+", "+value)
					}
				});
				imgBigCheckRequest.img = ibig;
				imgBigCheckRequest.send();
				$(ibig_container).adopt(ibig);
			}
			var image_container = new Element('div', {
				'id': 'image_container',
				'styles': {
					'float': 'left',
					'position': 'absolute',
					'left': 0
				}
			});
			for (var img = 0; img < images.length; img++) {
				var newLinkBox = new Element('p', {
					'styles': {
						'padding': '0 ' + space + 'px 0 ' + space + 'px',
						'float': 'left'
					}
				});
				var newLinkImg = new Element('a', {
					'href': 'javascript:openImg(' + img + ')',
					'styles': {
						'display': 'block',
						'float': 'left'
					},
					'id': 'link_' + img
				});
				var imgPlace = new Element('p', {
					'styles': {
						'float': 'left',
						'display': 'block',
						'background-color': '#CCCCCC',
						'height': '106px',
						'width': '90px',
						'cursor': 'hand',
						'filter': 'chroma(color=#A57B94)'
					},
					'id': 'place_' + img
				
				});
				var newImg = new Element('img', {
					'styles': {
						'float': 'left',
						'display': 'none'
					},
					'id': 'thumb_' + img
				
				});
				newImg.index = img;
				newImg.addEvent('load',resizeBar);
				if (img == selectedIndex) {
					newImg.addClass('imgacceso');
					imgPlace.addClass('imgacceso');
				}
				else {
					newImg.addClass('imgspento');
					imgPlace.addClass('imgspento');
				}
				var imgCheckRequest = new Request({url: images[img].urlthumb, 
					method:'HEAD',
					onSuccess: function(txt) {						
						loaded_thumbs++;
						onImgLoad(this.img,this.options.url);
					},
					onFailure: function() {
						//alert("onFailure");
						resizeBar.delay(160);
					},
					onException: function(headerName, value){
						alert(headerName+", "+value)
					}

				});
				imgCheckRequest.img = newImg;
				imgCheckRequest.send();
				$(container_cropper_name).adopt(image_container.adopt(newLinkBox.adopt(newLinkImg.adopt(imgPlace, newImg))));
				
			}
		}
		checkArrow();
	}
}
var onImgLoad = function(caller,url_caller){			
	caller.setProperty('src',url_caller);
	caller.setStyle('display', 'block');
	hidePlace.delay(80,this,caller.index);
}
var hidePlace = function(i){
	var placeName = 'place_'+i;
	if ($('place_' + i)) {
		$('place_' + i).setStyle('display', 'none');
	}	
	resizeBar.delay(80);
}
var resizeBar = function(caller){
	var tmpWidth = 0;
	for(var img=0;img<images.length;img++){
		tmpWidth+=($('link_'+img).getSize().x!=0)?($('link_'+img).getSize().x+(2*space)):0;
	}
	$('image_container').setStyle('width',tmpWidth);
	startX = $('image_container').getPosition($(container_cropper_name)).x;//+21;
	
	//alert(startX)
}
var getBigName = function(small_name){
	var name = small_name.substring(0,small_name.lastIndexOf("."));
	var ext = small_name.substring(small_name.lastIndexOf("."),small_name.length);
	return name+"g"+ext;
}
var openImg = function(iImg,isSlideBig,dir){
	$(ibig_c).setStyle('background', 'url(/images/loader.gif) no-repeat');
	$(ibig_c).setStyle('background-position', ($(ibig_c).getSize().x - 16) / 2 + 'px ' + ($(ibig_c).getSize().y - 16) / 2 + 'px');				
	selectedIndex = iImg;	
	//
	//alert(startX)
	if (!isSlideBig) {
	//	$('image_container').tween('left', (startX +(space)) - ($('link_' + selectedIndex).getCoordinates($('image_container')).left + space))
		$('image_container').tween('left', (startX  - $('link_' + selectedIndex).getCoordinates($('image_container')).left) + space)
	}else{
		var maskSize = $(container_cropper_name).getSize().x;
		var container_pos = ($('image_container').getPosition($(container_cropper_name)).x-startX);
		var image_pos = $('link_' + selectedIndex).getCoordinates($('image_container')).left+((dir==1)?($('link_' + selectedIndex).getSize().x):(0));
		var diff = (image_pos-Math.abs(container_pos));
		if (diff>maskSize) {
			$('image_container').tween('left', startX - ($('link_' + selectedIndex).getCoordinates($('image_container')).left + (space)));
		}else if (diff < 0) {
			var pos = (startX - ($('link_' + selectedIndex).getCoordinates($('image_container')).left + space))+($(container_cropper_name).getSize().x - space -$('link_' + selectedIndex).getSize().x);
			pos = (pos>startX)?startX:pos;
			$('image_container').tween('left',pos );
		}
	}
	if ($('image_big')) {
		$('image_big').setStyle('opacity', 0);
		//$('image_big').setProperty('src', images[selectedIndex].url);
		var imgBigCheckRequest = new Request({
			url:images[selectedIndex].url, 
			method:'HEAD',
			onSuccess: function(txt) {
				this.img.setProperty('src',this.options.url);
				$(desc_name).setProperty('html','<p>'+images[selectedIndex].description+'</p>');
				this.img.tween('opacity', 1);
				$(ibig_c).setStyle('background-image', 'none');
			},
			onFailure: function() {
				//alert("onFailure");
			},
			onException: function(headerName, value){
				alert(headerName+", "+value)
			}
		});
		imgBigCheckRequest.setHeader('Content-Type','image/jpeg');
		imgBigCheckRequest.img = $('image_big');
		imgBigCheckRequest.send();
	}
	//
	$('thumb_' + oldSelectedIndex).removeClass('imgacceso');
	$('place_' + oldSelectedIndex).removeClass('imgacceso');	
	$('thumb_' + oldSelectedIndex).addClass('imgspento');
	$('place_' + oldSelectedIndex).addClass('imgspento');
	checkArrow();
	oldSelectedIndex = selectedIndex;
	$('thumb_' + oldSelectedIndex).removeClass('imgspento');
	$('place_' + oldSelectedIndex).removeClass('imgspento');
	$('thumb_' + selectedIndex).addClass('imgacceso');
	$('place_' + selectedIndex).addClass('imgacceso');
}
var selPrev = function(isSlideBig){
	selectedIndex = (selectedIndex==0)?0:(--selectedIndex);
	openImg(selectedIndex,isSlideBig,-1);
}
var selNext = function(isSlideBig){
	selectedIndex = (selectedIndex==images.length-1)?images.length-1:(++selectedIndex);
	openImg(selectedIndex,isSlideBig,1);
}
var checkArrow = function(){
	if(selectedIndex==0){
		if($('bigPrev'))$('bigPrev').setStyle('visibility','hidden');
		if($('smallPrev'))$('smallPrev').setStyle('visibility','hidden');
	}else{
		if($('bigPrev'))$('bigPrev').setStyle('visibility','visible');
		if($('smallPrev'))$('smallPrev').setStyle('visibility','visible');
	}
	if(selectedIndex==images.length-1){
		if($('bigNext'))$('bigNext').setStyle('visibility','hidden');
		if($('smallNext'))$('smallNext').setStyle('visibility','hidden');
	}else{
		if($('bigNext'))$('bigNext').setStyle('visibility','visible');
		if($('smallNext'))$('smallNext').setStyle('visibility','visible');
	}
}