var Stage = Class.create();

var timeout;
var containerEnd;
var containerFirst;
var locked;

Stage.prototype = {
	settings: {
		'lastPositionInt': 0,
		'duration': 0.6
	},
	initialize: function () {
			$$(".contenedor-foto").each(function (element) {
				element.style.display = 'none';
				element.identify();
				containerEnd = element;
			});
			containerFirst					 = $$(".contenedor-foto")[0];
//			IcontainerFirst					 = $$("#itemsImages li")[0];
			containerFirst.style.display = '';
			//alert(containerFirst.identify());
			$$("#itemsImages li a").each(function (elementID) {
				elementID.observe('click', function (event) {
					event.stop();
					Stage.prototype.moveImages(elementID);
				});
			});
	
			
			locked 							 = false;		
			lastTimeout = setInterval("Stage.prototype.slideToNext()", 6000);
	},
	slideToNext: function() {
		if(!locked)
		{
			locked = true;
			currentElement = this.returnCurrentElemnt();
			if(containerEnd == currentElement)
			{
				new Effect.Fade(currentElement, {
					duration: this.settings['duration']});
					
				new Effect.Appear(containerFirst, {
						duration: this.settings['duration'],
						afterFinish: function () {
							locked = false;
						}
					});
					idItem 			= parseInt(containerFirst.identify().replace(/anonymous_element_/g, ''))-1;
					IcontainerFirst	= $$("#itemsImages li a")[idItem];
					IcontainerFirst.className = 'selected';
			//		alert(IcontainerFirst.lang);
					//ejecuto el ajax para cambiar info.
					//SimpleAJAXCall(ApplicationUrl+'geo.controller/changeInfoHome/'+IcontainerFirst.lang+'.html', ElementStateChanged, 'GET', 'infoImagesHome');
					idItem1 			= parseInt(currentElement.identify().replace(/anonymous_element_/g, ''))-1;
					IcontainerFirst1	= $$("#itemsImages li a")[idItem1];
					IcontainerFirst1.className = '';
					
			}
			else
			{
				nextElement = currentElement.next();

				new Effect.Fade(currentElement, {
					duration: this.settings['duration']});
					
				new Effect.Appear(nextElement, {
					duration: this.settings['duration'],
					afterFinish: function () {
						locked = false;
					}
				});
				idItem 			= parseInt(nextElement.identify().replace(/anonymous_element_/g, ''))-1;
				IcontainerFirst	= $$("#itemsImages li a")[idItem];
				IcontainerFirst.className = 'selected';
				//SimpleAJAXCall(ApplicationUrl+'geo.controller/changeInfoHome/'+IcontainerFirst.lang+'.html', ElementStateChanged, 'GET', 'infoImagesHome');
				idItem1 			= parseInt(currentElement.identify().replace(/anonymous_element_/g, ''))-1;
				IcontainerFirst1	= $$("#itemsImages li a")[idItem1];
				IcontainerFirst1.className = '';
			}
		}
	},
	slideToPrevious: function() {
		if(!locked)
		{		
			locked = true;	
			currentElement = this.returnCurrentElemnt();	
			if(currentElement == containerFirst)
			{
				new Effect.Fade(containerFirst, {
					duration: this.settings['duration']});
				new Effect.Appear(containerEnd, {
					duration: this.settings['duration'],
					afterFinish: function () {
						locked = false;
					}
				});
			}
			else
			{
				nextElement = currentElement.previous();
				new Effect.Fade(currentElement, {
					duration: this.settings['duration']});
				new Effect.Appear(nextElement, {
					duration: this.settings['duration'],
					afterFinish: function () {
						locked = false;
					}
				});			
			}
		}
	},
	returnCurrentElemnt: function () {
		var currrent,currrentNone = 0
		$$(".contenedor-foto").each(function (element) {
			if(element.style.display == '')
			{
					currrent = element;
					currrentNone = 1;
			}
		});
		if(currrentNone == 0)
		{
			$$(".contenedor-foto").each(function (element) {
				element.style.display = '';
			});
			return containerFirst;
		}
		else	
			return currrent;
	},	
	getCurrentPositionInt: function () {
		var left = containerEnd.getStyle('left');
		return parseInt(left.replace(/px/g, ''))
	},
	moveImages: function (itemsID) {
		var ImageID 	= parseInt(itemsID.innerHTML)-1;
		containerSecond	= $$(".contenedor-foto")[ImageID];
		$$(".contenedor-foto").each(function (element) {
			element.style.display = 'none';
		});
		$$("#itemsImages li a").each(function (element) {
			element.className = '';
		});
		locked = true;
		new Effect.Appear(containerSecond, {
			duration: this.settings['duration'],
			afterFinish: function () {
				locked = false;
			}
		});
		IcontainerD	= $$("#itemsImages li a")[ImageID];
		IcontainerD.className = 'selected';
		//SimpleAJAXCall(ApplicationUrl+'geo.controller/changeInfoHome/'+IcontainerD.lang+'.html', ElementStateChanged, 'GET', 'infoImagesHome');
	}
}
document.observe('dom:loaded', function () { 
	new Stage(); 
});