var selectText = "See country sites";
var globalClassName = "";


// redefinit la fonction getElementsByClassName si n'existe pas sous IE
if (!document.getElementsByClassName){
    document.getElementsByClassName = function(cl)
    {
        var retnode = [];
        var myclass = new RegExp('\\b'+cl+'\\b');
        var elem = this.getElementsByTagName('*');
        for (var i = 0; i < elem.length; i++)
        {
	        var classes = elem[i].className;
	        if (myclass.test(classes)) 
		        retnode.push(elem[i]);
        }
        return retnode;
    }
}

/**
 *  Habillage des selects
 *
 */
function replaceSelects(className) {
	//get all the select fields on the page
    selects = document.getElementsByClassName(className);
    globalClassName = className;
	
	//cycle trough the select fields
    for(var i=0; i < selects.length; i++) {
		
		//create and build div structure
		var selectArea = document.createElement('div');
		var displayOption = document.createElement('div');
		var left = document.createElement('div');
		var right = document.createElement('div');
		var center = document.createElement('div');
		var button = document.createElement('a');
		var text = document.createTextNode(selectText);
		// center.id = "mySelectText"+i;
		left.id = "mySelectText"+i;
		button.href="javascript:showOptions("+i+")";
		selectArea.className = "selectArea";
		left.className = "left";
		right.className = "right";
		center.className = "center";
		right.appendChild(button);
		// center.appendChild(text);
		left.appendChild(text);
		displayOption.id = className + "_displayOption";
		selectArea.appendChild(left);
		//selectArea.appendChild(center);
		selectArea.appendChild(right);		
		selectArea.appendChild(displayOption);
		
		//hide the select field
        selects[i].style.display='none'; 
		
		//insert select div
		selects[i].parentNode.insertBefore(selectArea, selects[i]);
		
		//build & place options div
		var optionsDiv = document.createElement('div');
		optionsDiv.className = "optionsDivInvisible";
		optionsDiv.id = "optionsDiv"+i;
		optionsDiv.style.left = findPosX(selectArea) + 'px';
		optionsDiv.style.top = findPosY(selectArea) + 19 + 'px';
		
		//get select's options and add to options div
		for(var j=0; j < selects[i].options.length; j++) {
			var optionHolder = document.createElement('p');
			var optionInput = document.createElement('input');
			var optionLink = document.createElement('a');
			
			// create link for select text
			var optionTxt = document.createTextNode(selects[i].options[j].text);
			optionLink.href = "javascript:showOptions("+i+"); selectMe('"+selects[i].id+"',"+j+","+i+");";
			
			// create the value associate with the text
			optionInput.id = selects[i].id + "_" + j + "_" + i;
			optionInput.attributes.setNamedItem(document.createAttribute("type"));
			optionInput.attributes.getNamedItem("type").nodeValue = 'hidden';
            optionInput.attributes.setNamedItem(document.createAttribute("value"));
            optionInput.attributes.getNamedItem("value").nodeValue = selects[i].options[j].value;
           
			// attache nod with parent node
			optionLink.appendChild(optionTxt);
			optionHolder.appendChild(optionLink);
			optionHolder.appendChild(optionInput);
			optionsDiv.appendChild(optionHolder);
		}
		
		//insert options div
		document.getElementsByTagName("body")[0].appendChild(optionsDiv);
	}
}

function showOptions(g) {
		elem = document.getElementById("optionsDiv"+g);
		if(elem.className=="optionsDivInvisible") {elem.className = "optionsDivVisible";}
		else if(elem.className=="optionsDivVisible") {elem.className = "optionsDivInvisible";}
}

function selectMe(selectFieldId,linkNo,selectNo) {
	//feed selected option to the actual select field
	selectField = document.getElementById(selectFieldId);
	for(var k = 0; k < selectField.options.length; k++) {
		if(k==linkNo) {
			selectField.options[k].selected = "selected";
			displayLinkCommentCountry(selectFieldId, linkNo, selectNo)
		}
		else {
			selectField.options[k].selected = "";
		}
	}
	//show selected option
	textVar = document.getElementById("mySelectText"+selectNo);
	var option = selectField.options[linkNo].text;
	var newText = document.createTextNode(option);
	textVar.replaceChild(newText, textVar.childNodes[0]);
}

function displayLinkCommentCountry(selectFieldId, linkNo, selectNo, exist, commentTextElement) {
    // recupère la balise div qui va servir à mon affichage
    var divDisplayOption = document.getElementById(globalClassName + "_displayOption");
    
    // supprime le contenu précedent de mon div
    var taille = divDisplayOption.childNodes.length;
    var j = taille - 1;
    for(var i = 0; i < taille; i++)
    {
        var noeud = divDisplayOption.childNodes[j];
        divDisplayOption.removeChild(noeud);
        j--;
    }

    // recupère ma valeur associé à mon texte
    var selectValue = document.getElementById(selectFieldId + "_" + linkNo + "_" + selectNo);
    
    // extrait ce qui m'interesse
    var tab = selectValue.value.split("|");
    var id = tab[0];
    var comment = tab[1];
    var url = tab[2];
    
    // s'occupe d'ajouter le bouton pour le lien dans mon div
    if(url != null && url.length > 0){
        var linkElement = document.createElement("a");
        linkElement.href = url;
        linkElement.className = "goButton";
        divDisplayOption.appendChild(linkElement);
    }
              
    // s'occupe d'ajouter le commentaire dans mon div
    if(comment != null && comment.length > 0){
        var className = "";
        if(comment == "Comming soon"){
            className = "comingSoon";
        }
        else if (comment == "New"){
            className = "new";
        }

        var pElement = document.createElement("p");
        pElement.className = className;
        divDisplayOption.appendChild(pElement);
    }

       
}

function findPosY(obj) {
	var posTop = 0;
	while (obj.offsetParent) {
		posTop += obj.offsetTop;
		obj = obj.offsetParent;
	}
	return posTop;
}
function findPosX(obj) {
	var posLeft = 0;
	while (obj.offsetParent) {
		posLeft += obj.offsetLeft;
		obj = obj.offsetParent;
	}
	return posLeft;
}