/* --------------------------------------------------------------------------
 Input.select workaround
 ----------------------------------------------------------------------------*/
var niceselect = document.getElementsByTagName('form');
var labels = new Array();
var selects = new Array();
var selectText = "please select";
var agt = navigator.userAgent.toLowerCase();
this.ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
var isMac = new RegExp('(^|)' + 'Apple' + '(|$)');

//Theme Variables - edit these to match your theme
/*var selectWidth = 108;
var selectHeight = 300;*/
var selectRightSideWidth = 20;
var selectAreaHeight = 20;
var selectAreaOptionsOverlap = 2;
var imagesPath = "/gfx/";

//other
var optionsIsVisible = false; 
var insideDropDown = false;
var insideOptions = false;

//Initialization function - if you have any other 'onload' functions, add them here
function init(){
    if (!document.getElementById) {
        return false;
    }
    getElements();
    replaceSelects();
}

//getting all the required elements
function getElements(){
    var re = new RegExp('(^| )' + 'niceselect' + '( |$)');
    for (var nf = 0; nf < document.getElementsByTagName('form').length; nf++) {
        if (re.test(niceselect[nf].className)) {
        
            for (var nfs = 0; nfs < document.forms[nf].getElementsByTagName('select').length; nfs++) {
                selects.push(document.forms[nf].getElementsByTagName('select')[nfs]);
                
            }
             
        }
    }
}


function replaceSelects(){
    for (var q = 0; q < selects.length; q++) {
        //create and build div structure
        var selectArea = 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" + q;
        //get width and height
        var vParameter = selects[q].className.split("-");
        var selectWidth = parseInt(vParameter[1]);
        var selectHeight = parseInt(vParameter[3]);
        
        button.href = "javascript:showOptions(" + q + ")";
        button.onkeydown = selectEvent;
        button.className = selects[q].className + "_selectButton"; //class used to check for mouseover
        selectArea.className = selects[q].className + "_selectArea";
        selectArea.id = "sarea" + q;
        right.className = selects[q].className + "_right";
        center.className = selects[q].className + "_center";
        center.style.width = (selectWidth - 10) + 'px';
        selectArea.style.width = selectWidth + selectRightSideWidth + 'px';
        button.style.width = selectWidth + selectRightSideWidth + 'px';
        button.style.marginLeft = -selectWidth + 'px';
        right.appendChild(button);
        center.appendChild(text);
        selectArea.appendChild(right);
        selectArea.appendChild(center);
        //hide the select field
        selects[q].style.display = 'none';
        //insert select div
        selects[q].parentNode.insertBefore(selectArea, selects[q]);
        //build & place options div
        var optionsDiv = document.createElement('div');
        optionsDiv.style.width = selectWidth + 20 + 'px';
        //set height
        var totalHeight = selects[q].options.length * 18;
        if (selectHeight < totalHeight) {
            optionsDiv.style.height = selectHeight + 'px';
        }
        optionsDiv.style.overflow = 'visible';
        optionsDiv.className = selects[q].className + "_optionsDivInvisible";
        optionsDiv.id = "optionsDiv" + q;
        optionsDiv.style.left = findPosX(selectArea) + 'px';
        optionsDiv.style.top = findPosY(selectArea) + selectAreaHeight - selectAreaOptionsOverlap + 'px';
        //get select's options and add to options div
        for (var w = 0; w < selects[q].options.length; w++) {
            var optionHolder = document.createElement('p');
            var optionLink = document.createElement('a');
            var optionTxt = document.createTextNode(selects[q].options[w].text);
            optionLink.href = "javascript:showOptions(" + q + "); selectMe('" + selects[q].id + "'," + w + "," + q + ");";
            optionLink.appendChild(optionTxt);
            optionHolder.appendChild(optionLink);
            optionsDiv.appendChild(optionHolder);
            //check for pre-selected items
            if (selects[q].options[w].selected) {
                selectMe(selects[q].id, w, q, true);
                
            }
        }
        
        //insert options div
        document.getElementsByTagName("body")[0].appendChild(optionsDiv);
        
    }
}

function getStyle(node, style) {
  if(style) {
    var camelStyle = toCamelCase(style);
    if(node.style[camelStyle]) return node.style[camelStyle];
    if(document.defaultView) return document.defaultView.getComputedStyle(node, "").getPropertyValue(style);
    if(node.currentStyle) return node.currentStyle[camelStyle];
  } else {
    if(document.defaultView) return document.defaultView.getComputedStyle(node, "");
    if(node.currentStyle) return node.currentStyle;
    return node.style;
  }
  function toCamelCase(s) {
    if(s == "float") return "cssFloat";
    for(exp = /-([a-z])/; exp.test(s); s = s.replace(exp, RegExp.$1.toUpperCase()));
    return s;
  }
}

function showOptions(q){
  optionList = document.getElementById("optionsDiv" + q);
	selectButton = document.getElementById("sarea" + q);
  if(!optionsIsVisible) {
    optionList.className = optionList.className.replace(/_optionsDivInvisible/,"_optionsDivVisible");
    optionsIsVisible = true;
		selectButton.onmouseover = function() { insideDropDown = true; };
    selectButton.onmouseout = function() { insideDropDown = false; };
		optionList.onmouseover = function() { insideOptions = true; };
    optionList.onmouseout = function() { insideOptions = false; };
    document.onmousedown = function() {
			if(!insideDropDown && !insideOptions) showOptions(q);
	  };
  } else {
    optionList.className = optionList.className.replace(/_optionsDivVisible/,"_optionsDivInvisible");
    optionsIsVisible = false;
    optionList.onmouseout = "";
    document.onmousedown = "";
		selectButton.onmouseover = "";
    selectButton.onmouseout = "";
		optionList.onmouseover = "";
    optionList.onmouseout = "";
  }
}

function selectMe(selectFieldId, linkNo, selectNo, init){
	 //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";
            if (!init) {
            	x = document.getElementById(selectFieldId).onchange;
            	if (typeof x == 'function') {
	          		x();
            	}
            }
        }
        else {
            selectField.options[k].selected = "";
        }
       
    }
    //show selected option
    textVar = document.getElementById("mySelectText" + selectNo);
    var newText = document.createTextNode(selectField.options[linkNo].text);
    textVar.replaceChild(newText, textVar.childNodes[0]);
    
    
}

function selectEvent(e){
    if (!e) 
        var e = window.event;
    var thecode = e.keyCode;
    switch (thecode) {
        case 40: //down
            var fieldId = this.parentNode.parentNode.id.replace(/sarea/g, "");
            var linkNo = 0;
            for (var q = 0; q < selects[fieldId].options.length; q++) {
                if (selects[fieldId].options[q].selected) {
                    linkNo = q;
                }
            }
            ++linkNo;
            if (linkNo >= selects[fieldId].options.length) {
                linkNo = 0;
            }
            selectMe(selects[fieldId].id, linkNo, fieldId);
            break;
        case 38: //up
            var fieldId = this.parentNode.parentNode.id.replace(/sarea/g, "");
            var linkNo = 0;
            for (var q = 0; q < selects[fieldId].options.length; q++) {
                if (selects[fieldId].options[q].selected) {
                    linkNo = q;
                }
            }
            --linkNo;
            if (linkNo < 0) {
                linkNo = selects[fieldId].options.length - 1;
            }
            selectMe(selects[fieldId].id, linkNo, fieldId);
            break;
        default:
            break;
    }
}




//Useful functions
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;
}

window.onload = init;
/* --------------------------------------------------------------------------
 
 ----------------------------------------------------------------------------*/