
function listen(evento, elem, func) {
	//document.getElementById('mensaje').innerHTML += "listen: "+evento+" - "+(elem.id || elem.tagName)+"<br/>";
	if (elem.addEventListener)  // W3C DOM
		elem.addEventListener(evento,func,false);
	else if (elem.attachEvent) { // IE DOM
		var r = elem.attachEvent("on"+evento, func);
		return r;
	}
}

function unlisten(evento, elem, func) {
	//document.getElementById('mensaje').innerHTML += "unlisten: "+evento+" - "+(elem.id || elem.tagName)+"<br/>";
	if (elem.removeEventListener) { // W3C DOM
		elem.removeEventListener(evento, func, false);
	} else if(elem.detachEvent) { // IE DOM
		elem.detachEvent('on'+evento, func);
	}
}

function transformarSelect(id) {
	var s = document.getElementById(id);
	var f = s.form;
	
	var selectBox = $c('div'); 
	selectBox.className = "selectBox";
	var selectGGG = $c('div');
	selectGGG.className = "selectggg";
	var selectioner = $c('div');
	selectioner.className = "selectioner";
	var selected = $c('div');
	selected.className = "selected";
	selected.id = id+"selected"
	var content = $c('div');
	content.className = "selectcontent";
	content.id = id+"content";
	content.style.display = "none";
	s.style.display = "none";

	var texto_opciones = "";
	for (i = 0; i < s.options.length; i++) {
		if (i == 0 || s.options[i].selected) selected.innerHTML = s.options[i].text;
		texto_opciones += "<div onClick=\"seleccionar('"+id+"','"+s.options[i].value+"','"+s.options[i].text+"')\">"+s.options[i].text+"</div>";
	}
	content.innerHTML = texto_opciones;
	
	selectGGG.appendChild(selectioner);
	selectGGG.appendChild(selected);
	selectBox.appendChild(selectGGG);
	selectBox.appendChild(content);		
	s.parentNode.insertBefore(selectBox, s);
	
	toggleSelectVar = id;
	listen('click',selectGGG, toggleSelect);
}

var toggleSelectVar;

function toggleSelect() {
	var o = document.getElementById(toggleSelectVar+"content");
	if (o.style.display == "") {
		o.style.display = "none";
	} else {
		o.style.display = "";
	}
}

function seleccionar(id,valor,texto) {
	toggleSelect();
	document.getElementById(id+"selected").innerHTML = texto;
	var s = document.getElementById(id);
	for (i = 0; i < s.options.length && s.options[i].value != valor; i++);
	s.options[i].selected = true;
}