(function($, undefined){

	$.fn.dropdown = function(options) {
		var settings = {}

		return $(this).each(function(){
			var $input  = $(this);
			var $select = $('<div class="select"/>');
			var $value  = $('<span class="value"/>');
			var $list   = $('<ul class="list"/>');
			var $arrow  = $('<span class="arrow"/>');
			var options = $input.find('option'),
					options_len = options.length;

			$select.append($value)
						 .append($list)
						 .append($arrow)
						 .width($input.width() + $arrow.width());

			$input.before($select)
						.hide();

			$list.width($select.width());

			for (var i = 0; i < options_len; i++) {
				createOption($(options[i]));
			}

			$arrow.bind('click', function(){
				if ($list.css('visibility') == 'hidden') {
					$list.show().css('visibility', 'visible');

					$closer = $('<div id="document_clicker"></div>');

					$closer.css('position', 'fixed')
								 .css('top', '0')
								 .css('left', '0')
								 .css('right', '0')
								 .css('bottom', '0')
								 .css('opacity', '0')
								 .css('z-index', '4000');

					$(document.body).append($closer);

					$closer.bind('click', function(){
						$list.hide().css('visibility', 'hidden');

						$(this).remove();
					});
				} else {
					$list.hide().css('visibility', 'hidden');

					$('.document_clicker').remove();
				}
			});

			function createOption($option) {
				var $option_new = $('<li class="option"/>');

				/*
				$option_new.bind('mouseover', function(){
										 $(this).addClass('hover');
									 })
									 .bind('mouseout', function(){
										 $(this).removeClass('hover');
									 })
									 .bind('click', function(){
										 $select.find('.selected')
														.removeClass('selected');

										 $(this).addClass('selected');
										 $input.find('option:selected').removeAttr('selected');
										 $option.attr('selected', 'true');
										 $list.hide().css('visibility', 'hidden');
										$option.change();

										 $('.document_clicker').remove();

										 $select.find('.value').text($(this).text());
									 });
				*/

				$option_new.bind('click', function(){
					$select.find('.selected')
								   .removeClass('selected');

					$(this).addClass('selected');
					$input.find('option:selected').removeAttr('selected');
					$option.attr('selected', 'true');
					$list.hide().css('visibility', 'hidden');
				   $option.change();

					$('.document_clicker').remove();

					$select.find('.value').text($(this).text());
				});

				if ($option.attr('selected')) {
					$option_new.addClass('selected');
					$value.text($option.text());
				}

				$option_new.attr('value', $option.val())
						   .html( '<a href="javascript:;">'+ $option.text() +'</a>' );

				$list.append($option_new);
			}
		});
	}

})(jQuery)
