
window.addEvent('domready', iniciarEventos);

function iniciarEventos(){
	var instanciaClaseEfecto = new Efecto();
}


var Efecto = new Class();
Efecto.prototype = {
	linkEfecto: {
		'selector': 'a.efecto',
		'tipoEfecto': {
			'efecto1': 'efecto-1', // 'tipo de efecto': 'clase css'
			'efecto2': 'efecto-2', // 'tipo de efecto': 'clase css'
			'efecto3': 'efecto-3', // 'tipo de efecto': 'clase css'
			'efecto4': 'efecto-4', // 'tipo de efecto': 'clase css'
			'efecto5': 'efecto-5' // 'tipo de efecto': 'clase css'
			
		}
	},
	
	initialize: function(){
		this.linkEfectos = $$(this.linkEfecto.selector);
		this.efecto1(); // Efecto de transicion de una propiedad CSS: Fx.Tween el.tween('propiedad', 'valor al que cambiara');				
		this.efecto2(); // Efecto de transicion de una propiedad CSS: Fx.Tween el.tween('propiedad', 'valor al que cambiara');		
		this.efecto3(); // Efecto de transicion de una propiedad CSS: Fx.Tween el.tween('propiedad', 'valor al que cambiara');	
		this.efecto4(); // Efecto de transicion de una propiedad CSS: Fx.Tween el.tween('propiedad', 'valor al que cambiara');	
		this.efecto5(); // Efecto de transicion de una propiedad CSS: Fx.Tween el.tween('propiedad', 'valor al que cambiara');	
	},
	
	efecto1: function(){
		this.linkEfectos.each(function(el){
			if(el.hasClass(this.linkEfecto.tipoEfecto.efecto1)){
				el.set('tween', {duration: 180});
				el.addEvent('mouseover', function(){
					el.tween('background-position', '0 0px');
				})		
				el.addEvent('mouseout', function(){
					el.tween('background-position', '-111 0px');
				})
			}
		}.bind(this))
	},
	efecto2: function(){
		this.linkEfectos.each(function(el){
			if(el.hasClass(this.linkEfecto.tipoEfecto.efecto2)){
				el.set('tween', {duration: 180});
				el.addEvent('mouseover', function(){
					el.tween('background-position', '0 0px');
				})		
				el.addEvent('mouseout', function(){
					el.tween('background-position', '-111 0px');
				})
			}
		}.bind(this))
	},
	efecto3: function(){
		this.linkEfectos.each(function(el){
			if(el.hasClass(this.linkEfecto.tipoEfecto.efecto3)){
				el.set('tween', {duration: 180});
				el.addEvent('mouseover', function(){
					el.tween('background-position', '0 0px');
				})		
				el.addEvent('mouseout', function(){
					el.tween('background-position', '-111 0px');
				})
			}
		}.bind(this))
	},
	efecto4: function(){
		this.linkEfectos.each(function(el){
			if(el.hasClass(this.linkEfecto.tipoEfecto.efecto4)){
				el.set('tween', {duration: 180});
				el.addEvent('mouseover', function(){
					el.tween('background-position', '0 0px');
				})		
				el.addEvent('mouseout', function(){
					el.tween('background-position', '-111 0px');
				})
			}
		}.bind(this))
	},
	efecto5: function(){
		this.linkEfectos.each(function(el){
			if(el.hasClass(this.linkEfecto.tipoEfecto.efecto5)){
				el.set('tween', {duration: 180});
				el.addEvent('mouseover', function(){
					el.tween('background-position', '0 0px');
				})		
				el.addEvent('mouseout', function(){
					el.tween('background-position', '-111 0px');
				})
			}
		}.bind(this))
	}
}
