var MenuPerros = Class.create();

MenuPerros.prototype = {

	initialize: function() {	
		this.updateSelectorList();
	},
	
	updateSelectorList: function() {	
		if (!document.getElementsByClassName){ return; }
		var selectores = document.getElementsByClassName('selectorPerroIzqda');
		
		// loop through all selectors
		for (var i=0; i<selectores.length; i++){
			var selector = selectores[i];
			selector.num = i;
			selector.setStyle({backgroundColor: '#ACACAC'});
			selector.onmouseover = function() { 
						var queue = Effect.Queues.get('myscope' + this.num);
						queue.each(function(effect) { effect.cancel(); });
						new Effect.Morph(this, { style: 'background:#CC0000;', duration: 0.1, queue: { position: 'end', scope: 'myscope' + this.num } });
						new Effect.Move(this, { x: 10, y: 0, mode: 'absolute', duration: 0.3, queue: { position: 'end', scope: 'myscope' + this.num } });
			}
			selector.onmouseout = function() { 
						var queue = Effect.Queues.get('myscope' + this.num);
						queue.each(function(effect) { effect.cancel(); });
						new Effect.Morph(this, { style: 'background:#ACACAC;', duration: 0.2, queue: { position: 'end', scope: 'myscope' + this.num } });
						new Effect.Move(this, { x: 0, y: 0, mode: 'absolute', duration: 0.3, queue: { position: 'end', scope: 'myscope' + this.num } });
			}
			selector.onclick = function() { 
						location.href=this.getElementsBySelector('a').first().href;
						var queue = Effect.Queues.get('myscope' + this.num);
						queue.each(function(effect) { effect.cancel(); });
						new Effect.Morph(this, { style: 'background:#ACACAC;', duration: 0.2, queue: { position: 'end', scope: 'myscope' + this.num } });
						new Effect.Move(this, { x: 0, y: 0, mode: 'absolute', duration: 0.3, queue: { position: 'end', scope: 'myscope' + this.num } });
			}
		}
	}
}
	
function initMenuPerros() { myMenuPerros = new MenuPerros(); }
Event.observe(window, 'load', initMenuPerros, false);