var arr_scrll_pos = new Array(); //esto es para tener la posición de creación del scroll
var arr_scrollers = new Array(); //esto tiene los scrollers
var arr_times = new Array(); // esto tiene los timeout para poder detenerlos.



function prepara_carrusel_undanet(id_j_frame) {
	$ES('.carrusel_undanet',id_j_frame).each( function(scroller) {
		if( $(scroller.id + '_contenido') ) {


				var contenido = $(scroller.id + '_contenido'); // sin el var en IE falla
				//var retardo = 4000 + Math.floor(Math.random()*5000);  //hace que el retardo sea aleatorio 4-9seg
				var retardo = 2000 + Math.floor(Math.random()*3000);  //hace que el retardo sea aleatorio 4-9seg
				if( scroller.offsetWidth + scroller.getProperty('item_size').toInt() < contenido.offsetWidth ) {

						/* necesitamos el scroller porque el contenido es mas grande que el marco */
						var width_scroller = scroller.getStyle('width').toInt();
						var height_scroller = scroller.getStyle('height').toInt();
						obj_scroller = new jsScroller( contenido, width_scroller, height_scroller );
						arr_scrollers[scroller.id]=0;
						if($(scroller.id+"_left")) { $(scroller.id+"_left").href="javascript:mover_carrusel(1,'"+scroller.id+"',0);"; }
						if($(scroller.id+"_right")) { $(scroller.id+"_right").href="javascript:mover_carrusel(-1,'"+scroller.id+"',0);"; }
						$clear(arr_times[scroller.id]);
						arr_times[scroller.id] = (function(){
							 	mover_carrusel(-1,scroller.id,retardo)
							}).periodical(retardo);
				} else {
					$clear(arr_times[scroller.id]);
					if( $(scroller.id + '_barra') ) {
						/*esto lo necesitamos para que no ponga los botones si no es necesario*/
						var barra = $(scroller.id + '_barra');
						barra.setStyle('visibility','hidden');
					}
				}
		}
	} );
}


/**function mover_carrusel(direccion,id_capa_contenedora, retardo)
	Esta función mueve una capa contenido con un efecto de movimiento.
	:: direccion: es la dirección que llevará a capa:-1 a la derecha y 1 a la izquierda.
	:: id_capa_contenedora: es la referencia a la capa que contiene los items a mover. Es necesaria porque será la capa que se moverá posibilitará que se mueva el carrusel. Es necesaria además, porque posibilita saber la cantidad de veces que se puede mover.
	:: items_visibles: es un atributo que se incluye en el html. Es el número entero de items que se verán como máximo en pantalla. Es necesario porque con este número controlamos el límite superior.
	Un ejemplo será:
	<div id="capa_a_mover" class="carrusel_undanet" item_size="263" items_visibles="2">
		<div id="capa_a_mover_contenido" class="scroller_container">
			<table>
				<tr>
					 for($i=...;$i<...;$i++){
						<td>
							...contenido...
						</td>
					}
				</tr>
			</table>
		</div>
	</div>

	:: item_size: es la cantidad de movimiento que vamos a tomar.
	Es obligado incluir en la capa_a_mover el class "carrusel_undanet" y los atributos item_size e items_visibles
**/
function mover_carrusel(direccion,id_capa_contenedora,retardo,parar_recursividad) {
	var scroller = $(id_capa_contenedora);
	if(scroller) {
		var contenido = $(id_capa_contenedora+'_contenido');
		var item_size = scroller.getProperty('item_size').toInt();
		var items_visibles = scroller.getProperty('items_visibles').toInt();
		/*fx_scroll = contenido.effects({
					duration: 500 ,
					transition: Fx.Transitions.Back.easeOut
				});*/
        contenido.set('tween', {transition: Fx.Transitions.Back.easeOut});

		var dimension = contenido.getSize();
		var dimensionWidth = -(dimension.x - (items_visibles*item_size));
		var desplazamiento = arr_scrollers[id_capa_contenedora]+(direccion*item_size);
		if(desplazamiento<=0 && desplazamiento>=dimensionWidth) {



			contenido.tween('left', desplazamiento);
			arr_scrollers[id_capa_contenedora]=desplazamiento;
		} else if(retardo>0 && !parar_recursividad) { // iniciamos el rebote

			direccion *= -1;
			$clear(arr_times[id_capa_contenedora]);
			arr_times[id_capa_contenedora] = (function(){
							 	mover_carrusel(direccion,id_capa_contenedora,retardo)
							}).periodical(retardo);
			return mover_carrusel(direccion,id_capa_contenedora,retardo, true);
		}else{

		    if(direccion < 0){
		    	//pasamos al principio
		        contenido.tween('left', 0 );
		        arr_scrollers[id_capa_contenedora]=0;
		    }else{
		    	//pasamos al final
		        contenido.tween('left', -dimension.x + (item_size * items_visibles));
		        arr_scrollers[id_capa_contenedora]=-dimension.x + (item_size * items_visibles);
		    }
		}
	}
	if(retardo == 0) {
		$clear(arr_times[id_capa_contenedora]);
	}
}


function imprimir_capa(id_capa) {
		var ventana = window.open("", "", "");
		var contenido = "<html><link rel='stylesheet' type='text/css' href='admin/css/estilos.css'><link rel='stylesheet' type='text/css' href='admin/css/estilos_impresion.css'><body onload='window.print();window.close();'>" + document.getElementById(id_capa).innerHTML + "</body></html>";
		ventana.document.open();
		ventana.document.write(contenido);
		ventana.document.close();
}

function prepara_tablas_redimensionables(id_contenedor) {
	$ES('.separador_int',id_contenedor).each( function(separador_int) {
		var separador_ext = separador_int.getParent();
	  var celda = separador_ext.getParent();
	  var enlace = celda.getFirst();

	  var ancho_celda = celda.getCoordinates().width.toInt();
	  var ancho_enlace = enlace.getCoordinates().width.toInt();
	  separador_ext.setStyle('left',ancho_enlace);
		separador_int.setOpacity(0.3);
		separador_int.setStyle('left', ancho_celda - ancho_enlace - 19 );

		separador_int.makeDraggable({
			container: separador_ext,
			onStart: function(separador_int){
				separador_int.setOpacity(1);
			},
			onDrag: function(separador_int){
				var separador_ext = separador_int.getParent();
				var ancho_celda_old = separador_int.getParent().getParent().getCoordinates().width.toInt();
				var ancho_celda_new = separador_int.getStyle('left').toInt() + 19 + separador_ext.getStyle('left').toInt();
				$('anch_' + separador_int.id).setStyle('width', ancho_celda_new );
			},
			onComplete: function(separador_int){
				var separador_ext = separador_int.getParent();
			  var celda = separador_ext.getParent();
			  var enlace = celda.getFirst();
			  var ancho_celda = celda.getCoordinates().width.toInt();
			  var ancho_enlace = enlace.getCoordinates().width.toInt();
				separador_int.setStyle('left', ancho_celda - ancho_enlace - 19 );
				separador_int.setOpacity(0.3);
				ir_a('',http_app_path + '/intranet/vista/guardar_ancho_sesion?nombre_campo=anch_' + separador_int.id +'&ancho_campo='+ ancho_celda);
			}
		});
	});
}

/** function prepara_separador_izq_der()
	* Función que automatiza el control de redimensionado en la plantilla izq_der
*/
function prepara_color_picker() {

	var r = new MooRainbow('color_picker', {
		'imgPath': http_app_path + '/comun/moorainbow/images/' ,
		'onChange': function(color) {
			$('d_titulo').value = color.hex;
		}
	});

}

/** function prepara_separador_izq_der()
	* Función que automatiza el control de redimensionado en la plantilla izq_der
*/
function prepara_separador_izq_der() {
	if($('barra_resizable')) {
		$('barra_resizable').setStyle('background-color','#a3a2a2');
		$('barra_resizable').setStyle('left',$('cuadro_izq_ext').getCoordinates().width.toInt() - 2);
		$('barra_resizable').makeDraggable({
			container: 'contenedor_principal',
			onStart: function(barra_resizable){
				$('barra_resizable').setStyle('background-color','#ededed');
			},
			onDrag: function(barra_resizable){
				var ancho_contenedor = $('contenedor_principal').getCoordinates().width.toInt();
				var posicion_barra = barra_resizable.getStyle('left').toInt() + 2;
				var porcentaje_izq = ((posicion_barra * 100)/ancho_contenedor).toInt();
				if( porcentaje_izq == 0 ) porcentaje_izq = 1;
				var porcentaje_der = 100 - porcentaje_izq;
				$('cuadro_izq_ext').setStyle('width', porcentaje_izq+'%' );
				$('cuadro_der_ext').setStyle('width', porcentaje_der+'%' );
			},
			onComplete: function(barra_resizable){
				barra_resizable.setStyle('left',$('cuadro_izq_ext').getCoordinates().width.toInt() - 2);
				ir_a('',http_app_path + '/intranet/vista/guardar_ancho_sesion?nombre_campo=cuadro_izq_ext&ancho_campo='+ $('cuadro_izq_ext').getStyle('width').toInt());
				ir_a('',http_app_path + '/intranet/vista/guardar_ancho_sesion?nombre_campo=cuadro_der_ext&ancho_campo='+ $('cuadro_der_ext').getStyle('width').toInt());
				$('barra_resizable').setStyle('background-color','#a3a2a2');
			}
		});
		window.addEvent('resize',function() {
			$('barra_resizable').setStyle('left',$('cuadro_izq_ext').getCoordinates().width.toInt() - 2);
		});
	}
}




/** function protect_inputs_on_enter(id_contenedor)
	* [id_contenedor]		Id de la capa que necesitamos proteger.
	*
	*	Esta función protege todos los elementos <input> ante la
	*	pulsación de la tecla enter. De modo que cuando se pulsa
	*	la tecla enter se cancelará dicha pulsación. Ademas permite
	*	configurar un comportamiento adicional que se disparará
	*	al detectar la tecla enter.
	*	El uso consiste en dar a aquellos input que lo requieran
	*	el className on_enter_XXXXXXX donde XXXXXXX seria el id
	*	de el link que pretendemos simular su click al pulsar enter
	*	en la caja de texto. Si unicamente queremos cancelar la
	*	pulsacion enter el className seria on_enter_cancel
**/
function protect_inputs_on_enter(id_contenedor) {
	if(id_contenedor=='') { id_contenedor = document.body; }
	$(id_contenedor).getElements('input').each(function( campo ){
		var className = campo.className;
		if(className.contains('on_enter_')) {
			var arr1 = className.split('on_enter_');
			var arr2 = arr1[1].split(' ');
			var accion = arr2[0];
			campo.onkeypress = ( function(e){
				var event = new Event(e)
				if(event.key=='enter') {
					if(accion!='cancel' && $(accion)){
						var href_accion = $(accion).getProperty('href');
						if(href_accion.contains('javascript:')) {
							eval(href_accion);
						} else {
							window.location.href = href_accion;
						}
					}
					return false;
				}
				return true;
			} );
		}
	});
}

function tooltips_undanet(id_contenedor){
	$ES('.tooltips_undanet',id_contenedor).each( function(toolTip) {
  	var titulo_completo = toolTip.getProperty('title');
  	var dual = titulo_completo.split('::');
		if (dual.length > 1){
			toolTip.store('tip:title', dual[0].trim());
  		toolTip.store('tip:text', dual[1].trim());
		}
		toolTip.addEvent('click', function(){ $(document.body).getLast().fade('out'); });
	});

	var tip = new Tips('.tooltips_undanet',{
          showDelay: 100,
          hideDelay: 100
      });
  tip.addEvent('onShow', function(tip){
    tip.fade('in');
  });
  tip.addEvent('onHide', function(tip){
    tip.fade('out');
  });
  $(document.body).getLast().setStyle('z-index',100);
}

function resaltar(id_elemento) {
	var elemento = $(id_elemento);
	if(elemento) {
		var color1 = elemento.getStyle('background-color');
		var color2 = elemento.getStyle('color').toString();
		var arr = color2.split('');
		for(var i=1;i<=6;i++) {
			if(arr[i]=='f') {				arr[i]='e';
				} else if(arr[i]=='e'){		arr[i]='f';
				} else if(arr[i]=='d'){		arr[i]='f';
				} else if(arr[i]=='c'){		arr[i]='e';
				} else if(arr[i]=='b'){		arr[i]='d';
				} else if(arr[i]=='a'){		arr[i]='c';
				} else if(arr[i]=='9'){		arr[i]='b';
				} else if(arr[i]=='8'){		arr[i]='a';
				} else {					arr[i]=arr[i].toInt()+2;
			}
		}
		color2 = arr[0] + arr[1] + arr[2] + arr[3] + arr[4] + arr[5] + arr[6];
		elemento.setStyle('background-color',color1);
		elemento.highlight( color2);
	}
}

function prepara_panel_activo(id_contenedor) {
	$ES('.panel_activo_undanet',id_contenedor).each( function(panel) {
		var id_panel_int = panel.id + '_int';
		var cod_inner_html = '<div id="'+id_panel_int+'" class="panel_activo_undanet_int">'+panel.innerHTML+'</div>';
		panel.innerHTML=cod_inner_html;
		panel.removeEvent('mouseenter');
		panel.removeEvent('mouseleave');
		panel.addEvents({
			mouseenter: function(){
				//alert('mouseenter');
				panel.getFirst().morph({
					'duration': 10,
					'opacity': 1
				});
			},
			mouseleave: function(){
				//alert('mouseleave');
				panel.getFirst().morph({
					'duration': 10,
					'opacity': ( Browser.Engine.trident ? 0.00000000001 : 0 )
				});

			}
		});
		panel.getFirst().setOpacity( ( Browser.Engine.trident ? 0.00000000001 : 0 ) );
	} );
}

/** function desactivar_segundo_estado(id_contenedor, class_name)
 * desactiva todos los enlaces ('a') que se encuentren en la capa contenedora
	para el class_name especificado. De modo que cada reemplaza en el className
	del anchor el class_name+'_seleccionado' por el class_name a secas.
	*	[id_contenedor] id de la capa en la que se van a buscar los links
	*	[class_name] class_name comun a los botones que simboliza su estado desactivado
				El estado activado debe llamarse igual mas el sufijo '_seleccionado'.
**/
function desactivar_segundo_estado(id_contenedor, class_name) {
	// si no nos indican la capa en la que aplicar la funcion, tomamos '' y asi se aplicara a todo el body
	if( ! id_contenedor )	{ id_contenedor=''; }

	var class_name_seleccionado = class_name + '_seleccionado';
	$ES('a',id_contenedor).each( function(enlace) {
		if(enlace.hasClass(class_name_seleccionado)) {
			enlace.addClass(class_name);
			enlace.removeClass(class_name_seleccionado);
		}
	} );
}

/** function sactivar_segundo_estado(id_contenedor, id_elemento, class_name)
 * activa el enlace ('a') indicado y desactiva el resto de enlaces que se encuentren
 	en la capa contenedora para el class_name especificado.
	*	[id_contenedor] id de la capa en la que se van a buscar los links
	*	[id_elemento] id del boton que queremos marcar como seleccionado
	*	[class_name] class_name comun a los botones que simboliza su estado desactivado
				El estado activado debe llamarse igual mas el sufijo '_seleccionado'.
**/
function activar_segundo_estado(id_contenedor, id_elemento, class_name ) {
	desactivar_segundo_estado(id_contenedor, class_name);
	var class_name_seleccionado = class_name + '_seleccionado';
	$(id_elemento).addClass(class_name_seleccionado);
	$(id_elemento).removeClass(class_name);
	if($(id_elemento+'_rel')) {
		$(id_elemento+'_rel').addClass(class_name_seleccionado);
		$(id_elemento+'_rel').removeClass(class_name);
	}
}

/** function dispara_evento(id_elemento, name_evento)
 * Evaluea el evento de ese elemento como código js.
	Es útil para forzar a que se ejecute un evento aunque no halla
	sucedido realmente. Incluso podemos inventar un evento propio y también
	lo evalua (aunque no cumpliría los standares web).
	*	[id_elemento] id del elemento que tiene el evento a ejecutar.
	*	[name_evento] nombre del evento.
**/
function dispara_evento(id_elemento, name_evento) {
	sentencia = $(id_elemento).get(name_evento);
	if($defined(sentencia)) {
		sentencia = sentencia.toString().replace(/"this"/g, "$('"+id_elemento+"')");
		if(Browser.Engine.trident){
			sentencia = sentencia.toString().replace('function', "");
			sentencia = sentencia.toString().replace('anonymous()', "");
		}
		eval( sentencia );
	}
}

/** function prepara_scroll(id_contenedor)
 * si queremos hacer un scroll con o sin barra los requisitos son:
		1) El scroll estara formado por dos capas:
			a) La capa contenedora que tiene un ancho y alto concreto y position:relative o absolute (como queramos)
					Ademas tendra overflow:hidden
					La capa contededora debe tener el className 'scroller_undanet' y el id que queramos (por ejemplo 'myid').
			b) La capa que tiene el contenido que tendra un ancho fijo y el alto dependera de su contenido
					Su position debe ser absolute.
					La capa de contenido debe tener el className 'Scroller-Container' y el id debe ser el de la contenedora
					con '_contenido' (por ejemplo 'myid_contenido').
		2) Si ademas queremos que tenga barra de scroll tendremos una capa con el id de la capa contenedora del scroll
					seguido de '_barra' (por ejemplo 'myid_barra').
					esta capa tendra los botones de subir y bajar (si no se quieren poner no son obligatorios) y la capa
					que determina el carril de scroll, dentro de esta capa de carril estara la capa que determina la pieza que
					podremos mover por el carril para desplazar el scroll. Siguiendo el ejemplo tendriamos:
						<div id="myid_barra">
							<a href="javascript:;" class="Scrollbar-Up"></a>
							<div class="Scrollbar-Track">
								<a href="javascript:;" class="Scrollbar-Handle"></a>
							</div>
							<a href="javascript:;" class="Scrollbar-Down"></a>
						</div>
					como se puede ver es obligatorio que los className de los componentes que forman la barra de scroll sean
					los del ejemplo ('Scrollbar-Up', 'Scrollbar-Track', 'Scrollbar-Handle', 'Scrollbar-Down') aun así
					podemos incluir otros estilos css para darle el aspecto visual deseado.
**/
/*function prepara_scroll(id_contenedor) {
	$ES('.Scrollbar',id_contenedor).each( function(scroller) {
		var scr = new ScrollBar(scroller.id);
	} );
}*/
function prepara_scroll(id_j_frame) {
	$ES('.scroller_undanet',id_j_frame).each( function(scroller) {
		if( $(scroller.id + '_contenido') ) {
				var contenido = $(scroller.id + '_contenido'); // sin el var en IE falla
				if( scroller.offsetHeight + 5 < contenido.offsetHeight ) {
						/* necesitamos el scroller porque el contenido es mas grande que el marco */
						var width_scroller = scroller.getStyle('width').toInt();
						var height_scroller = scroller.getStyle('height').toInt();
						var obj_scroller = new jsScroller( contenido, width_scroller, height_scroller );
					//	arr_scrollers[scroller.id] = obj_scroller;
						arr_scrll_pos[scroller.id]=0;
						if( $(scroller.id + '_barra') ) {
								var barra = $(scroller.id + '_barra');
								barra.setStyle('visibility','visible');
								barra.setStyle('display','block');
								var obj_scrollbar = new jsScrollbar(barra, obj_scroller);
								$ES('.origen',scroller).each( function(enlace_origen) {
									var enlace_destino = $(enlace_origen.id + '_destino');
									if(enlace_destino){
										enlace_origen.addEvent('click',function() {
											var y = enlace_destino.getCoordinates().top - contenido.getCoordinates().top;
											obj_scrollbar.scrollTo( 0, y );
										} );
									}
								} );
						}
				} else if( $(scroller.id + '_barra') ) {
						var barra = $(scroller.id + '_barra');
						barra.setStyle('visibility','hidden');
						barra.setStyle('display','none');
						$ES('.origen',scroller).each( function(enlace_origen) {
							enlace_origen.setStyle('cursor','default');
						} );
				}
		}
	} );
}

/** function prepara_efecto_alargado(id_contenedor)
	Establece un efecto de carga que estira las capas con className 'alargado'
**/
function prepara_efecto_alargado(id_contenedor) {
	$ES('.alargado',id_contenedor).each(function(barra){
		var w = barra.getStyle('width').toInt();
		var fx = barra.effects({
			duration: 1000,
			transition: Fx.Transitions.Back.easeOut
		});
		fx.start({
			'opacity': [0, 1],
			'width': [0, w]
		})
	});
}

/** function prepara_calendario(id_contenedor)
	Establece el calendario js para aquellos input con un id que lo identifique y el className 'calendario_undanet'
	Si queremos que solo permita seleccionar fechas pasadas o solo fechas futuras fijaremos la propiedad direction="-1"
	o direction="1" respectivamente.
**/
function prepara_calendario(id_contenedor) {
	$ES('.calendario_undanet',id_contenedor).each( function(calendario) {
		var id_calendario = calendario.id.toString();

		Calendar.setup( {
			inputField : id_calendario,
			ifFormat : '%d/%m/%Y',
			align:'bR',
			step: 1,
			firstDay: 1
		} );

	} );
}

/** function prepara_textarea(id_contenedor)
			siempre que haya un textarea en un formulario con
			el class='editor_undanet_myid' donde 'myid' sea el id del textarea
			automaticamente lo transforma en un editor visual
**/
function prepara_textarea(id_contenedor) {
	$ES('textarea','').each( function(tipo_textarea) {
	    
		if(tipo_textarea.hasClass('editor_undanet_'+tipo_textarea.id)) {

			tinyMCE.init({
                mode : "textareas",
                theme : "advanced",
                language : "es",
                plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",
                theme_advanced_buttons1 : "bold,italic,underline,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,forecolor,backcolor",
                theme_advanced_buttons2 : "",
                theme_advanced_buttons1_add: "separator,pastetext,pasteword,separator,link,media,code",
                theme_advanced_toolbar_location : "top",
                theme_advanced_toolbar_align : "left",
                theme_advanced_resizing : true,
                apply_source_formatting : false,
                width : tipo_textarea.getStyle('width').toInt(),
                height : tipo_textarea.getStyle('height').toInt(),
                editor_selector : 'editor_undanet_'+tipo_textarea.id
            });
		}
	} );
}

/** function asignar_resultado(variables, valores, delimitador)
		asigna los valores recibidos a las variables indicadas, para poder pasar
		n valores a n variables utilizamos un delimitador ( por defecto '|' )
**/
function asignar_resultado(variables, valores, delimitador) {
	if( ! delimitador ) delimitador = '|';
	arr_variables = variables.split(delimitador);
	arr_valores   = valores.split(delimitador);
	for(i=0 ; i<arr_variables.length ; ++i) {
		if($(arr_variables[i])) {
			$(arr_variables[i]).set('value', arr_valores[i] );
			dispara_evento(arr_variables[i], 'onchange');
		}
	}
}

/** function asignar_desde_popup(variables, valores, delimitador)
		utiliza la funcion asignar_resultado pero para asignarlos
		desde un popup a la ventana padre. Además cierra el popup.
**/
function asignar_desde_popup(variables, valores, delimitador) {
	if(window.opener) { // si aun esta abierta la ventana padre le pedimos que ejecute
		if( ! delimitador ) delimitador = '|';
		// la sentencia que asignara los resultados de busqueda.
		window.opener.setTimeout('asignar_resultado("'+variables+'","'+valores+'","'+delimitador+'");',1);
		window.close(); // cerramos el popup
	} else {
		show_error('No se encontró la ventana principal.');
	}
}

