function BotonesClass(elementos) {

//Clase para gestionar botones relacionados en un menú
//y añadir efectos acorde a los eventos que se produzcan
//en este caso, al colocar el ratón sobre el botón y salir de él

var elementos = jQuery(elementos);//atributo que contiene un objeto con todos los botones

var gestorBotones = this;//para la closure
gestorBotones.botones = [];//atributo que almacenará en un array las instancias de botón

//método que recorre los elementos del menú y crea las instancias
this.creaBotones = function()
{
	elementos.each(function(indice,elemento)
	{
		var tmpObjElemento = jQuery(elemento);
		gestorBotones.botones[indice] = new Boton(tmpObjElemento);
	});
}

this.borraBotones = function() 
{
	jQuery.each(gestorBotones.botones, function(i)
	{
		gestorBotones.botones[i].resetearBoton();
		gestorBotones.botones[i] = "";
	});
}


this.creaBotones();

//clase Boton para crear instancias para cada botón que va a ser animado
function Boton(elemento) {
	
	var objetoBoton = this;
	
	objetoBoton.elemento = elemento;//atributo que contiene el objeto jQuery del boton
	
	var indice = elementos.index(this.elemento);
	
	var posicionElemento = indice * 136;
	
	var imagenSup = '';
	var imagenInf = '';
	
	var botonOriginal = jQuery('div',objetoBoton.elemento);
	
	function crearClones() {
		
		imagenSup = botonOriginal.clone();//sprite superior
		imagenSup.css({'position':'absolute','z-index':2,height:0,'left':posicionElemento,'bottom':1,'border':'1px solid #17aefb','border-left':'0px solid','background':'#0d96e0 url(/img_maquetacion/fondos/fondo_tab_selected.jpg) 0 0 repeat-x'});//estilos del sprite superior
		
		imagenInf = botonOriginal.clone();//sprite inferior
		imagenInf.css({'position':'absolute','z-index':1,'left':posicionElemento,'bottom':1});//estilos del sprite inferior
		
		botonOriginal.css('visibility','hidden');//ocultamos a la vista el contenido del boton original
		objetoBoton.elemento.append(imagenInf);
		objetoBoton.elemento.append(imagenSup);
	}
	
	this.resetearBoton = function() 
	{
		botonOriginal.css('visibility','visible')
		
		jQuery('div',objetoBoton.elemento).not(botonOriginal).remove();
	}
	
	function animarBotonIn()
	{
		crearClones();
		
		imagenInf.animate({
							bottom: [40,"swing"],
							height: [0,"swing"]
						}, 150,function(){
							imagenInf.css({
							'height': 0,
							'bottom': 20,
							'left':posicionElemento+68,
							'width': 0,
							'fontSize':0.5
						});
					});
		
		imagenSup.animate({
						height: [50,"swing"]
					},150,function(){
					imagenSup.animate({
						height: [40,"swing"]
					},50);
					});

	}
	
	function animarBotonOut()
	{
		//la siguiente condición evita efectos indeseados si el usario entra y sale del botón demasiado rápido
		//si el ratón sale del botón mientras se está realizando la animación de entrada,
		//la animación de salida no se realiza
		if (imagenSup.is(':animated')) 
		{
			objetoBoton.resetearBoton();
		}
		else
		{
		imagenSup.text('');

	    imagenSup.animate({
						height: [0,"swing"],
						fontSize: ["0em","swing"],
						border:[0]
					},100).hide();
		
		imagenInf.animate({
						width: 135,
						bottom: [0,"swing"],
						height: [40,"swing"],
						fontSize: ["1em","swing"],
						left:posicionElemento
					}, 300,function(){
						objetoBoton.resetearBoton();
					});
		//si hay cufon, hay que 'refrescarlo'
		Cufon.refresh();
		}
		
	}
	
	this.activarBoton = function()
	{
		if (objetoBoton.elemento.hasClass('ui-state-active'))
		{
			objetoBoton.elemento.unbind('mouseenter');
			objetoBoton.elemento.unbind('mouseleave');
		}
		else 
		{
			objetoBoton.elemento.mouseenter(animarBotonIn);
			objetoBoton.elemento.mouseleave(animarBotonOut);
		}
	}
	
	//cada vez que se cree el boton, comprobamos si hay que activarlo o no
	this.activarBoton();
	

}//boton
				

				
				
			 			
}//clase