var Calendar = function(idCajaTexto, idEnlace, imgSrc) {
	var selectAnyo;
	var selectMes;
	var divDias;
	var calendario;
	var casilla;
	var lang_dias;
	var lang_meses;
	var dias_meses = [31,28,31,30,31,30,31,31,30,31,30,31];
	var caja_texto;
 	
 	function Calendar() {
 		/*lenguaje*/
			lang_dias = ["L","M","Mi","J","V","S","D"];
			lang_meses = ["Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre"];
		/*fin lenguaje*/
		
 		/*contenedor calendario*/
 			calendario = new Element("div");
 			calendario.setStyle("display","none");
 			calendario.setStyle("position","absolute");
 			calendario.setStyle("background-color","white");
 			calendario.setStyle("border","1px solid black");
 			calendario.setStyle("padding","2px 0 2px 2px");
 		/*fin contenedor calendario*/

 		/*select mes*/
 		 	selectMes = new Element("select");
 		 	selectMes.setStyle("width","90px");
 		 	selectMes.setStyle("font-size","12px");
			calendario.append(selectMes);
			for(var i=0;i<12;i++)
				selectMes.add(lang_meses[i], i);
		/*fin select mes*/
			
		/*select año*/
 			selectAnyo = new Element("select");
 			selectAnyo.setStyle("font-size","12px");
 			calendario.append(selectAnyo);
 		/*fin select año*/
			
		/*contenedor dias*/
			divDias = new Element("div");
 			divDias.setStyle("margin", "0");
 			divDias.setStyle("padding", "0");
 			divDias.setStyle("fontFamily", "arial");
 			divDias.setStyle("fontSize", "12px");
 			divDias.setStyle("position", "relative");
 			calendario.append(divDias);
		/*fin contenedor dias*/
 		
 		/*casilla*/
 			casilla = new Element("a");
 			casilla.setHref("#");
 			casilla.setStyle("text-decoration","none");
 			casilla.setStyle("display","block");
 			casilla.setStyle("width","20px");
 			casilla.setStyle("padding-top","3px");
 			casilla.setStyle("height","17px");
 			casilla.setStyle("text-align","center");
 			casilla.setStyle("color","white");
 			casilla.setStyle("font-weight","bold");
 			casilla.setStyle("position","absolute");
  		/*fin casilla*/
 		
 		selectMes.addEvent("change", insertarDias);
 	 	selectAnyo.addEvent("change", insertarDias);

 		insertarAnyos();
 		
 		if($(window).isPageLoaded())
			$(document.body).append(calendario);
		else {
    		$(window).addEvent("load", function(){
    			$(document.body).append(calendario);
    		});
		}
 		caja_texto = $(idCajaTexto);
 		
 		/*enlace calendario*/
 			var enlace = $(idEnlace);
 			enlace.addEvent("click", function(){
				if(calendario.getStyle("display")=="none"){
	 				calendario.setStyle("display", "block");
	 				insertarDias();
	 				calendario.setStyle("left", enlace.getLengthFromLeft()+"px");
	 				calendario.setStyle("top", enlace.getLengthFromTop()+enlace.getHeight()+"px");
				}
				else
					calendario.setStyle("display", "none");
				
				return false;
			});
 			var imgEnlace = new Element("img");
 			imgEnlace.setSrc(imgSrc);
 			imgEnlace.addEvent("load", function(){
 				imgEnlace.setStyle("width", imgEnlace.element.width+"px");
 				imgEnlace.setStyle("height", imgEnlace.element.height+"px");
 			});
 			enlace.append(imgEnlace);
 		/*fin enlace calendario*/
 	}Calendar();
 	
 	function calcularDiaSemana(dia,mes,year){
 		var modulo_anyo_regular=[0,3,3,6,1,4,6,2,5,0,3,5];
 		var modulo_anyo_bisiesto=[0,3,4,0,2,5,0,3,6,1,4,6];
 		var calc1 = (year-1)%7;
 		var calc2 = ((year-1)/4  -  (3*(year-1)/100 + 1) / 4)%7;
 		var calc3 = dia%7;
 		if(year%4==0)
 			var modulo = modulo_anyo_bisiesto[mes];
 		else
 			var modulo = modulo_anyo_regular[mes];
 		/*devuelve del 0(domingo) hasta el 6(sabado)*/
 		calculo_dia = Math.round((calc1+calc2+modulo+calc3))%7;
 		
 		/*ahora haremos que el lunes sea 0 y domingo 6*/
 		if(calculo_dia==0)
 			calculo_dia=6;
 		else
 			calculo_dia -= 1;
 		return calculo_dia;
 	}
 	
 	function quitarCasillas(){
 		while(divDias.getFirstChild()){
 			divDias.getFirstChild().remove();
 		}
 	}
 	
 	function addCasillasNombreDia(){
 		for(var i=0;i<=6;i++){
 			var nuevaCasilla = casilla.clone();
 			nuevaCasilla.setStyle("top", "2px");
 			nuevaCasilla.setStyle("left", (i*22)+"px");
 			nuevaCasilla.setStyle("background-color", "black");
 			nuevaCasilla.addText(lang_dias[i]);
 			divDias.append(nuevaCasilla);
 			nuevaCasilla.setHref("");
 			nuevaCasilla.addEvent("click", function(){return false;});
 		}
 	}
 	
 	function getDiasMes(){
 		var dias_mes = dias_meses[selectMes.getValue()];
 		//año bisiesto
 		if(selectAnyo.getValue()%4==0 && selectMes.getValue()==1)
 			dias_mes++;
 		return dias_mes;
 	}
 	
 	function copiarFecha(){
 		if($this.getFirstChild()){
 			var mes = parseInt(selectMes.getValue())+1;
 			if(mes<10)
 				mes = "0"+mes;
			caja_texto.setValue($this.getText()+"/"+mes+"/"+selectAnyo.getValue());
			calendario.setStyle("display", "none");
			caja_texto.focus();
		}
		return false;
	}
 	
 	function insertarDias(){
 		quitarCasillas();
 		addCasillasNombreDia();
 		
 		var dia_primer_lunes = calcularDiaSemana(1,selectMes.getValue(),selectAnyo.getValue());
 		var dias_mes = getDiasMes();

 		var top=24;
 		var left = 0;
 		for(var i=0;i<dias_mes+dia_primer_lunes;i++){
 			var nuevaCasilla = casilla.clone();
 			nuevaCasilla.setStyle("background-color", "#808080");
 			if(i%7==0 && i>0 && i<dias_mes+dia_primer_lunes){
 				top += 22;
 				left = 0;
 			}
 			nuevaCasilla.setStyle("top", top+"px");
 			nuevaCasilla.setStyle("left", left+"px");
 			left += 22;
 			if(i>=dia_primer_lunes){
 				nuevaCasilla.addEvent("mouseover", function(){
 					$this.setStyle("background-color", "#cc0001");
 	 			});
 				nuevaCasilla.addEvent("mouseout", function(){
 					$this.setStyle("background-color", "#808080");
 	 			});
 				nuevaCasilla.addText(i-dia_primer_lunes+1);
 				nuevaCasilla.addEvent("click", copiarFecha);
 			}
 			else{
 				nuevaCasilla.setHref("");
 	 			nuevaCasilla.addEvent("click", function(){return false;});
 			}
 			divDias.append(nuevaCasilla);
 		}
 		
 		top += 20;
 		divDias.setStyle("height", top+"px");
 		divDias.setStyle("width", 7*22+"px");
 	}
 	
 	function insertarAnyos(){
 		var fecha = new Date();
 		var c;
 		for(c=fecha.getFullYear()-100;c <= fecha.getFullYear();c++)
 				selectAnyo.add(c, c);
 		selectAnyo.setSelected(c-fecha.getFullYear()+99);
 	}
};

var ZoomViewer = function(imageID, srcZoom){
	var viewer;
	var image;
	var zoomImage;
	var imagesLoad = 0;
	
	function VisorZoom(){
		image = $(imageID);
		image.setStyle("position", "relative"); //amb aixo aconseguim que si la imatge te marge o padding calculi be el layerX i layerY

		zoomImage = new Element("img");
		zoomImage.addEvent("load", setZoomFunctions);
		zoomImage.setSrc(srcZoom);
		zoomImage.setStyle("position", "relative");
		
		viewer = new Element("div");;
		viewer.setStyle("overflow", "hidden");
		viewer.setStyle("position", "absolute");
		viewer.setStyle("border", "1px solid black");
		viewer.setStyle("width", "220px");
		viewer.setStyle("height", "220px");
		viewer.setStyle("display", "none");
		viewer.append(zoomImage);
		$(window).addEvent("load", function(){
			$(document.body).append(viewer);
		});
	}VisorZoom();

	function setZoomFunctions(){
		var imageWidth = image.getStyleSheet("width").toInt() || image.getWidth();
		var imageHeight = image.getStyleSheet("height").toInt() || image.getHeight();

		var zoomImageWidth = imageWidth+200;
		var zoomImageHeight = imageHeight*zoomImageWidth/imageWidth;
		
		zoomImage.setStyle("width", zoomImageWidth+"px");
		zoomImage.setStyle("height", zoomImageHeight+"px");

		var viewerWidth = viewer.getStyle("width").toInt();
		var viewerHeight = viewer.getStyle("height").toInt();

		image.addEvent("mousemove", function(){			
			var proportionalityY = zoomImageHeight / imageHeight;
			var proportionalityX = zoomImageWidth / imageWidth;

			var y = viewerHeight/2 - Math.round($event.getLayerY()*proportionalityY);
			if(y>0) y = 0;
			else if(y<viewerHeight-zoomImageHeight) y = viewerHeight-zoomImageHeight; 
			zoomImage.setStyle("top", y+"px");
			var x = viewerWidth/2 - Math.round($event.getLayerX()*proportionalityX);
			if(x>0) x= 0;
			else if(x<viewerWidth-zoomImageWidth) x = viewerWidth-zoomImageWidth;
			zoomImage.setStyle("left", x+"px");
		});
		
		viewer.setStyle("left", image.getLengthFromLeft()+imageWidth+10+"px");
		viewer.setStyle("top", image.getLengthFromTop()+"px");
		
		image.addEvent("mouseover", function(){viewer.setStyle("display", "block");});
		image.addEvent("mouseout", function(){viewer.setStyle("display", "none");});
	}
};

var AutomaticInfoVisor = function(boxID, titleID, textID, linkID, firstImageID, seconds){
	var info;
	var title, text, link, image;
	var box;
	var images;
	
	function construct(){
		info = [];
		images = [];
		seconds = seconds*1000;
		box = $(boxID);
		title = $(titleID);
		text = $(textID);
		link = $(linkID);
	}construct();
	
	/*PUBLIC METHODS*/
	
	this.add = function(infoItem){
		if(images.length>0){
			var img = new Element("img");
			img.setAlt("Cargando");
			img.addEvent("load", function(){
				img.setAlt("");
			});
			img.setSrc(infoItem["image-src"]);
			img.setStyle("display", "none");
			link.append(img);
			
			images.push(img);
			info.push(infoItem);
		}
		else {
			images.push($(firstImageID));
			info.push(infoItem);
		}
	};
	
	this.start = function(){
		var cont = 0;
		
		var timer = setInterval(function() {
			cont++;
			if(cont == images.length)
				cont = 0;
			
			box.fadeOut(0.01, function(){
				title.removeAllChilds();
				title.addText(info[cont]["title"]);
				text.removeAllChilds();
				text.setHTML(info[cont]["text"]);
				if(isEmpty(info[cont]["link"]))
					link.setHref("#");
				else
					link.setHref(info[cont]["link"]);
				
				if(cont == 0)
					images[images.length-1].setStyle("display","none");
				else
					images[cont-1].setStyle("display","none");
				images[cont].setStyle("display","block");
				box.fadeIn(0.01,1);
			});
		}, seconds);
	};
};