(function( $ ) {
	
	$.fn.customDropDown = function(settings) {
		
		settings = $.extend({}, $.fn.customDropDown.defaults, settings);
		
		//add styles
		var $container = $("<div></div>").addClass(settings.wrapperClass);
		var $visible_select = $('<div class="visible_select"><div class="select_left"></div><div class="select_center"><span class="select_content"></span><div class="select_icon"></div></div><div class="select_right"></div></div>');
		var $visible_dropdown = $('<div class="visible_dropdown"></div>');
		var $clearer = $("<div></div>").addClass(settings.clearerClass);
		$(this).wrap($container);
		$container = $(this).parent();
		$container.append($visible_select);
		$container.append($visible_dropdown);
		$container.append($clearer);
		
		//set up controls
		var $hidden_dropdown = $(this);
		//$visible_select = $container.find(".visible_select");
		//$visible_dropdown = $container.find(".visible_dropdown");
		
		$visible_dropdown.css("display", "none");
		$(this).css("display", "none");
		
		//populate unordered list per source dropdown
		$visible_dropdown.empty();
		var list = document.createElement("ul");
		for(var i=0;i<$(this).children().size();i++) {
			var item = document.createElement("li");
			var itemLink = document.createElement("a");
			$(itemLink).attr("href", "#");
			if(i > 0){ 
				$(itemLink).html($(this).children().eq(i).html());
				item.appendChild(itemLink);
				list.appendChild(item);
			} else {
				if (!settings.hideFirstOption) {
					$(itemLink).html($(this).children().eq(i).html());
					item.appendChild(itemLink);
					list.appendChild(item);		
				}
			}
		}
		$visible_dropdown.append(list);
		
		//set initial value
		$container.find(".select_content").html($(this).find("option:selected").text());
		if(settings.width!="auto") {
			var centerwidth = settings.width - 27;
			$container.find(".select_center").css("width", centerwidth);
		}

		//on click, show/hide dropdown
		$visible_select.click(function(e) {
			e.preventDefault();
			if(!$hidden_dropdown.is(":disabled")) {
				if($visible_dropdown.css("display") == "none") {
					$visible_dropdown.css("display", "block");
	
					var newWidth = $(this).find(".select_left").width()+$(this).find(".select_center").width()+$(this).find(".select_right").width();
					$visible_dropdown.css("left",$(this).position().left);
					$visible_dropdown.css("top", $(this).position().top+$(this).height()+"px");
					$visible_dropdown.css("min-width", newWidth+"px");					
					
					$(this).addClass("selected");
					$(document).bind('click',onClickOutside);
					
				} else {
					$visible_dropdown.css("display", "none");
					$(this).removeClass("selected");
					$(document).unbind('click',onClickOutside);
				}
			}
		});
		
		//on click dropdown item, select on visible component & hidden form element
		$visible_dropdown.find("ul li a").click(function(e) {
			e.preventDefault();
			var text = $(this).text();
			$options = $hidden_dropdown.find("option").filter(function() {
				return this.text == text;
			});
			$options.attr("selected", "selected");
			$visible_select.find(".select_content").html($hidden_dropdown.find("option:selected").html());
			$visible_dropdown.css("display", "none");
			$visible_select.removeClass("selected");
			$(document).unbind('click',onClickOutside);
			$hidden_dropdown.change();
		});
		
		//hide dropdown when clicking away
		function onClickOutside(e) {
			if (!$visible_select.hasClass("selected"))
				return true;
			//Removed by Adrian on May/14/11
			// e.preventDefault();
			var $clicked = $(e.target);
			//ensure that the drop-down isn't being clicked
			if ($clicked !== $container && !jQuery.contains($container.get(0),$clicked.get(0)) ) {
				$hidden_dropdown.blur();
				
				$visible_dropdown.css("display", "none");
				$visible_select.removeClass("selected");
				$(document).unbind('click',onClickOutside);
			}
		}
		
		return $(this);
			
	};
	
	$.fn.removeCustomDropDown = function() {
		if ($(this).next(".visible_select").length == 1) {
			$(this).unwrap();
			$(this).next().remove(); // visible_select
			$(this).next().remove(); // visible_dropdown
			$(this).next().remove(); // clearer
		}
	};
	
	$.fn.updateVal = function(val) {
		$(this).val(val);
		$select_content = $(this).parent().find(".select_content");
		$select_content.html($(this).find("option:selected").text());
		//not triggering change event
		//$hidden_dropdown.change();
		return $(this);
	};
	
	$.fn.customDropDown.defaults = {
			wrapperClass : "custom_dropdown_extralight",
			clearerClass : "clearer",
			width : "auto",
			hideFirstOption : false
	};
	
	})( jQuery );
