function selectReplacement(obj) {
	var wrapper = new Element('div');
	wrapper.addClassName('selectReplacement');
	wrapper.addClassName('unselectable');
	var ol = new Element('ol', {'style':'display:none'});
	$(obj).removeClassName('replace');
	$w($(obj).className).each(function(el){
		wrapper.addClassName(el);
		ol.addClassName(el);
	});
	$(obj).hide();
	// search for the selected option
	var opts = obj.options;
	for (var i=0; i<opts.length; i++) {
	  var selectedOpt;
	  if (opts[i].selected) {
	    selectedOpt = i;
	    break;
	  } else {
	    selectedOpt = 0;
	  }
	}
	  	  
	var etiqueta = new Element('span');
	var divEtiqueta = new Element('div');
	divEtiqueta.addClassName('etiqueta');
	etiqueta.addClassName('unselectable');
	etiqueta.update(opts[selectedOpt].text);
	divEtiqueta.appendChild(etiqueta);
	wrapper.appendChild(divEtiqueta);
	
	for (var i=0; i<opts.length; i++) {
		var li = new Element('li');
		ol.appendChild(li);
		li.update(opts[i].text);
		li.selIndex = opts[i].index;
		li.observe('mouseup', function(event) {event.stop(); selectItem(event.element(), true);	});
		li.observe('click', function(event){event.stop()}); //anular el click del wrapper
		li.observe('mousedown', function(event){event.stop()}); //anular el mousedown del wrapper
		if (i == selectedOpt) {
			li.addClassName('selected');
			li.parentNode.selectedLi = li;
		}
	
		li.observe('mouseover', function(event) {
			var li = event.element();
			if (li.parentNode.hoverLi)
				li.parentNode.hoverLi.removeClassName('hover');
			if (li.parentNode.selectedLi)
				li.parentNode.selectedLi.removeClassName('selected');
				
			li.addClassName('hover');
			li.parentNode.hoverLi = li;
		});
	}
	
	//eventos de ratón
	ol.observe('mousedown', function(event){event.stop();});
	wrapper.observe('mousedown', function(event){event.stop(); dropdownSelect(wrapper);});
	
	wrapper.observe('click', function(event){event.stop();});
	if (navigator.appName == 'Microsoft Internet Explorer') {
		wrapper.observe('dblclick', function(event){event.stop(); dropdownSelect(wrapper);});
	}
	
	obj.updateReplacement = function() { 
		var li = ol.select('li').find(function(el){
			return el.selIndex == obj.selectedIndex;
		});
		if (li) selectItem(li, false);
	};
		
	obj.observe('change', function() {obj.updateReplacement();});
	
	ol._active = false;
	ol._positioned = false;
	ol.labelObj = etiqueta;
	ol.selectObj = obj;
	wrapper.listObj = ol;

	// add the input and the ol
	wrapper.appendChild(ol);
	obj.parentNode.appendChild(wrapper);
}

function selectItem(li, trigger) {
	var ol = li.parentNode;
	if (ol.selectedLi) {
		ol.selectedLi.removeClassName('selected');
		ol.selectedLi = null;
	}
	if (ol.hoverLi) {
		ol.hoverLi.removeClassName('hover');
		ol.hoverLi = null;
	}
			
	ol.selectObj.selectedIndex = li.selIndex;
	ol.labelObj.update(li.innerHTML);
	li.addClassName('selected');
	ol.selectedLi = li;
	if (trigger && typeof ol.selectObj.onchange == 'function')
		ol.selectObj.onchange();

	hideAllSelect();
}

function dropdownSelect(obj)
{
	//forzar el final de todos los efectos de cierre
	if (Scriptaculous)
		Effect.Queues.get('selectclose').each(function(effect){
			effect.loop(9999999999999);});
	
	var ol = obj.listObj;
	
	if (ol._active)
	{
		hideAllSelect();	
	}
	else
	{	
		hideAllSelect();
		
		//Recalcular el tamaño, según el tamaño del div contenedor
		if (!ol._positioned)
		{
			var olDimensions = ol.getDimensions(), resizeW = false, resizeH = false;
			if (olDimensions['width'] < obj.getWidth()) {
				olDimensions['width'] = obj.getWidth();
				resizeW = true;
			}
			if (olDimensions['height'] > 240) {
				olDimensions['width'] += 17;
				olDimensions['height'] = 240;					
				resizeW = true; resizeH = true;
			}
			if (resizeH) {
				ol.setStyle({'width': olDimensions['width'] + 'px', 'height': olDimensions['height'] + 'px'});			
			}
			else if (resizeW) {
				ol.setStyle({'width': olDimensions['width'] + 'px'});
			}
			ol._positioned = true;
		}
			
		/*
		if (Scriptaculous)
			new Effect.BlindDown(ol, {
				duration:0.16,
				queue:{scope:'selectopen',position:'end'}
			});
		else
		*/			
			ol.show();
			ol._active = true;
		
		document.observe('mousedown', hideAllSelect);
		document.observe('blur', hideAllSelect);
	}
}
function hideAllSelect()
{
	/*
	//forzar el final de todos los efectos de apertura
	if (Scriptaculous)
		Effect.Queues.get('selectopen').each(function(effect){
			effect.loop(9999999999999);});
	*/
		
	$$('div.selectReplacement').each(function(div){ //El selector doble $$('div.selectReplacement ol') no funciona bien en Opera
		div.select('ol').each(function(ol){
			if (ol._active) {				
				if (Scriptaculous)
					new Effect.Fade(ol, {
						duration:0.1,
						queue:{scope:'selectclose',position:'end'},
						afterFinish:function(effect){
							effect.element.setOpacity(1); //IE
							ol._active = false;
						}
					});
				else {
					ol.hide();
					ol._active = false;
				}
			}
		});
	});
	document.stopObserving('click');
	document.stopObserving('blur');
}

function replaceSelects()
{
	//No reemplazar selects en IE6, se comporta bastante mal
	//http://www.thefutureoftheweb.com/blog/detect-ie6-in-javascript
	//var IE6 = false /*@cc_on || @_jscript_version < 5.7 @*/;
	//if (IE6) return;

	$$('select.replace').each(function(el){
		selectReplacement(el);
	});
	
	//evitar selección de texto con el ratón
	$$('.unselectable').each(function(el){
		el.onselectstart = function(){return false;}; //IE
		//el.onmousedown = function(){return false;}; //Opera
		el.ondragstart = function(){return false;};
		el.setStyle({'cursor':'default', '-moz-user-select':'none', '-khtml-user-select':'none', 'user-select':'no'}); //Firefox
	});
}