/**
 * 
 * Author : vasile.orza
 * 
 * <select>
 *  <option> ...
 * <select>
 * 
 * $("select).selectbox()
 * 
 */
(function($) {
  $.fn.selectbox = function() {

    return this.each(function() {
      var $select = $(this);
      if ($select.is(":not(select)")) {
        return;
      }

      // hide select input & remove previously added jQuery 'select boxes'
      $select.next(".selectbox").remove().end()
                           .hide();
      
      // Fixed safari problem for select box - pradeep jain.

      var w = parseInt($select.css("width"));
      
      var browserString = navigator.appVersion;    
      var isSafari = browserString.indexOf("Safari") == -1 ? false : true;
      var isMac = navigator.platform.indexOf("Mac") == -1 ? false : true;
      var isChrome = browserString.indexOf("Chrome") == -1 ? false : true;
      
      if(isSafari && !isMac && !isChrome){
    	w = parseInt($select.css("width"))+25;
      }
      //////
      
      
      // generate component
      var $wrapper = $("<div>").insertAfter($select)
                               .css("float", $select.css("float"))
                               .css("width", w+"px")
                               .css("margin-top", "" + $select.css("margin-top"))
                               .css("margin-right", $select.css("margin-right"))
                               .css("margin-bottom", $select.css("margin-bottom"))
                               .css("margin-left", $select.css("margin-left"))
                               .attr("name", $select.attr("name"))
                               .addClass("selectbox")
                               .addClass(this.className)
                               .append(
                                   $("<div>").addClass("icon")
                               )
                               .append(
                                   $("<input>").attr("type", "text")
                                               .attr("readonly", "readonly")
                               )
                               .append(
                                   $("<ul>").css("min-width", w+"px")
                               )
                               .delegate(":text", "focus", function(e) {
                                   $(this).parent().addClass("focus");
                               })
                               .delegate(":text,.icon", "click", function(e) {
                                 $wrapper.find(":text").focus().end()
                                         .find("ul").toggle();
                               })
                               .delegate(":text", "keydown", function(e) {
                                 // UP key
                                 if (e.keyCode == 38) {
                                   $(this).next("ul").show()
                                                     .find(".selected").prev().trigger("selectOption");
                                 }
                                 // DOWN key
                                 if (e.keyCode == 40) {
                                   $(this).next("ul").show()
                                                     .find(".selected").next().trigger("selectOption");
                                 }
                                 // ENTER key
                                 if (e.keyCode == 13) {
                                   $(this).blur().focus();
                                 }
                                 // ESC key
                                 if (e.keyCode == 27) {
                                   $(this).next("ul").hide();
                                 }
                              })
                              .delegate("ul", "mouseenter", function() {
                                $(this).addClass("mouse-over");
                              })
                              .delegate("ul", "mouseleave", function() {
                                $(this).removeClass("mouse-over");
                              })
                              .delegate("li", "click", function(e) {
                                $(this).trigger("selectOption")
                                       .parent("ul").hide()
                                                    .prev(":text").blur();
                              })
                              .delegate("li", "selectOption", function(e) {
                                // display list row as 'selected'
                                $(this).addClass("selected")
                                       .siblings().removeClass("selected");
                              })
                              .delegate(":text", "blur", function() {
                                if ($wrapper.find("ul:visible").is(".mouse-over")) {
                                  return;
                                }
                                // hide option list
                                $wrapper.removeClass("focus")
                                        .find("ul").hide();

                                // update selected value
                                var newIndex = $wrapper.find(".selected").index();
                                var oldIndex = $select.find(":selected").index();

                                var $option = $select.children().eq(newIndex);
                                $wrapper.find(":text").val($option.text())
                                                      .removeClass("errorInput");

                                if (oldIndex != newIndex) {
                                  $select.val($option.val()).trigger("change");
                                }
                              });

      // fill-in list of options
      var $optionList = $wrapper.find("ul");
      $select.find("option").each(function() {
                              $("<li>").html(this.text)
                                       .wrapInner("<span>") 
                                       .appendTo($optionList);
                            });

      // initialize default value
      var selectedIndex = $select.find(":selected").index();
      $wrapper.find("ul li").eq(selectedIndex).click();
    });
  };
})(jQuery)