/*
* Custom Selects
* 
*/
(function($) {
$.fn.selectbox = function(params) {
    
    var obj = $(this[0]);
    
    //Default options
    var options = {
    };
    
    //initialize
    for (var i in params)
    {
        options[i] = params[i];
    }
    
    var _onchange = options["onchange"];

    // first locate all of the select tags on the page and hide them


//now, for each select box, run this function

$(this).each(function(){
    
    $(this).css("display","none");
    
    var curSel = $(this);
    // get the CSS width from the original select box
    var gddWidth = $(curSel).outerWidth();
    var gddWidthL = gddWidth;
    var gddWidth2 = gddWidthL - 21;
    var gddWidth3 = gddWidthL - 16;
    // build the new div structure
    var gddTop = '<div style="width:' + gddWidthL + 'px" class="selectCustom selectCustomContainer" tabindex="0">';
    //get the default selected option
    var whatSelected = $(curSel).children('option:selected').text();
    //write the default
    var gddFirst = '<div class="first"><div class="selectCustomText selectCustom" style="width:'+ gddWidth2 +  'px;"><span class="selectCustom gselected">'+ whatSelected +'</span></div><span class="arrowImg"></span><div class="clears"></div></div><ul class="selectCustom">';
    // create a new array of div options from the original's options
    var addItems = new Array(); 

    var itemWidth = gddWidthL;
    if($(curSel).children('option').length > 10) {
        $(curSel).next('div.selectCustom').find("ul").css({"overflow-y": "scroll", "height": "220px"});
        itemWidth = itemWidth - 20;
    } 
    $(curSel).children('option').each( function() {           
        var text = $(this).text();  
        var selVal = $(this).attr('value'); 
        var before =  '<li style="width:' + itemWidth + 'px;"><a href="#" rel="' + selVal + '" tabindex="0"  style="width:' + gddWidth3 + 'px;">';
        var after = '</a></li>';           
        addItems.push(before + text + after);
    });
    //hide the default from the list of options 
    var removeFirst = addItems.shift();
    // create the end of the div selectbox and close everything off
    var gddBottom ='</ul></div>'
    //write everything after each selectbox
    var GDD = gddTop + gddFirst + addItems.join('') + gddBottom;
    $(curSel).after(GDD);
    //this var selects the div select box directly after each of the origials
    var nGDD = $(curSel).next('div.selectCustom');
    
    $(nGDD).find('li:first').addClass("first");
    
    $(nGDD).find('li:last').addClass('last');
    //handle the on click functions - push results back to old text box
    $(nGDD).click( function(e) {
         $('div.selectCustom').removeClass("focus");
        $(nGDD).addClass("focus");   
         var myTarA = $(e.target).attr('rel');
         var myTarT = $(e.target).text();
         var myTar = $(e.target);
         //if closed, then open
         if( $(nGDD).find('li').css('display') == 'none')
            {
                    //this next line closes any other selectboxes that might be open
                    $('div.selectCustom').find('ul').css('display','none');
                    $('div.selectCustom').find('li').css('display','none');
                    $(nGDD).find('ul').css('display','block');
                    if($(curSel).children('option').length > 10) {
                       $(nGDD).find('ul').addClass("overflowScrolled");
                    }
                    $(nGDD).find('li').css('display','block');
                    
                    //if user clicks off of the div select box, then shut the whole thing down
                    $(document.window || 'body').click( function(f) {
                            var myTar2 = $(f.target);
                            if (myTar2 !== nGDD) {
                                $(nGDD).find('ul').css('display','none');
                                $(nGDD).find('li').css('display','none');
                            }
                    });
                            return false;
            }
            else
            {      
                    if (myTarA == null){
                                $(nGDD).find('ul').css('display','none');
                                $(nGDD).find('li').css('display','none');
                                return false;
                            }
                            else {
                                //set the value of the old select box
                                $(curSel).val(myTarA);
                                _onchange();
                                //set the text of the new one
                                 $(nGDD).find('span.gselected').text(myTarT);
                                 $(nGDD).find('ul').css('display','none');
                                 $(nGDD).find('li').css('display','none');
                                 return false;
                            }
            }
    //handle the tab index functions
     }).focus( function(e) {        
         
         $(nGDD).addClass("focus");      

         $(nGDD).find('li:first').addClass('currentDD');
         $(nGDD).find('li:last').addClass('lastDD');
         function checkKey(e){
            //on keypress handle functions
            function moveDown() {
                var current = $(nGDD).find('.currentDD:first');
                var next = $(nGDD).find('.currentDD').next();
                if ($(current).is('.lastDD')){
                return false;
                } else {
                    $(next).addClass('currentDD');
                    $(current).removeClass('currentDD');
                }
            }
            function moveUp() {
                var current = $(nGDD).find('.currentDD:first');
                var prev = $(nGDD).find('.currentDD').prev();
                if ($(current).is('.first')){
                return false;
                } else {
                    $(prev).addClass('currentDD');
                    $(current).removeClass('currentDD');
                }
            }
            var curText = $(nGDD).find('.currentDD:first').text();
            var curVal = $(nGDD).find('.currentDD:first a').attr('rel');
           switch (e.keyCode) {
                case 40:
                    $(curSel).val(curVal);
                    $(nGDD).find('span.gselected').text(curText);
                    moveDown();
                    return false;
                    break;
                case 38:
                    $(curSel).val(curVal);
                    $(nGDD).find('span.gselected').text(curText);
                    moveUp();
                    return false;
                    break;
                case 13:
                    $(nGDD).find('ul').css('display','none');
                    $(nGDD).find('li').css('display','none');
                    }     
        }
        $(document).keydown(checkKey);    
    }).blur( function() {
            $(nGDD).removeClass("focus"); 
            $(document).unbind('keydown');
    });
});

    
    
};
})(jQuery);